body {
	font-family: 'Noto Sans KR', sans-serif;
	font-weight: 400;
	line-height: 1.6;
}
u {
	text-decoration-thickness : 1px;
	text-underline-position: under; 
	text-decoration-color: blue;
}

footer {word-break: keep-all;}

/* h1, h2, h3, h4, h5, h6,  */
.ff-gm {font-family: 'GmarketSans', 'NotoSansKR', sans-serif; font-weight: 700;}


h2, h3 {
	color: #006cb7;
}

table {	font-size: 1rem !important;}
table tr th, table tr td {vertical-align: middle !important;}
.table tbody { font-weight: 400;}
.table-main {table-layout: fixed;}
.cut  {
		display: inline-block;
  		width: 90%;
  		text-overflow: ellipsis;
  		white-space: nowrap; 
  		overflow: hidden;
  		vertical-align: -5px;
  		} 


/* .table>:not(caption)>*>* {	padding: 1rem;} */

.table-bordered tr th:first-child,.table-bordered tr td:first-child {border-left-width:0;}
.table-bordered tr th:last-child,.table-bordered tr td:last-child {border-right-width:0;} 

/* 견학신청 조회내역  */
.table th div div:not(:first-child),.table td div div:not(:first-child) {text-align: center;}

caption {
	position:absolute; left:-10000px;
	font-size: 1px;
	color: rgba(255, 255, 255, 0);
}

section {
	padding: 1rem 0;
	overflow: hidden;
}

 
 section:last-child {padding-bottom:5rem !important;}   
 
a, .pointer {
	cursor: pointer;
	text-underline-position: under;
}

.underline-spread {
	text-underline-position: under;
}

.media-br br {
	display: none;
}

.links:hover {
    cursor: pointer;
}

/*.links>div:hover,*/ .links>tr:hover {
    background-color: #f6f9fc;
}
 .btn-lg {font-size: 1.2rem;}

.btn-info {
    color: #fff !important;
    background-color: #2972fa !important;
    border-color: #2972fa !important;
}

.btn-info:hover {
    color: #fff !important;
    background-color: #065af7 !important;
    border-color: #0555eb !important;
}
.btn-secondary {background:#00C9A7;}
.btn-secondary:hover {background:#008E76;}

/* 헤더 & 푸터 로고 및 심볼 */
.symgo img { width: 250px; }
footer .navbar-brand img {  width: 75px; }

#navbar-pconly .dropdown-menu {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

#navbar-pconly .nav-item {
	border-bottom: 3px solid white;
}

#navbar-pconly .nav-item:hover {
	border-bottom: 3px solid #1977cc;
}

#navbar-pconly .dropdown-menu a:hover {
	text-decoration: underline;
	text-decoration-color: #1977cc;
}

.nav-link-header {
	font-size: 1.05rem;
	font-weight: 700;
}

.nav-tabs .nav-link {
    font-size: 1rem;
}

.dropdown-hover:hover>.dropdown-menu {
	display: inline-block;
}

.dropdown-hover>.dropdown-toggle:active {
	/*Without this, clicking will make it sticky*/
	pointer-events: none;
}

/* Header 서브메뉴 padding 수정 */
.dropdown-menu .list-group-item {
	padding-right: 0.5rem;
	padding-left: 1rem;
}

.dropdown-menu .list-group-item.indent {
	text-indent: 0.4rem;
}

#intro {
	/* margin-bottom: -9rem; */
	margin-bottom: -42vh;
	background: url("../../images/background/main_bg.jpg") center top;
	height: 50vh;
	background-size: cover;
	color: white;
}

#intro .container-fluid {
	background-color: rgba(0, 0, 0, 0.3);
	height: 45vh;
}

#intro .mask {
	background-color: rgba(0, 0, 0, 0.6);
}

.tit-zone .btn {
	font-size: 1rem;
	font-weight: bold;
}

.main-cybercenter .content {
	padding: 30px;
	background: #1977cc;
	border-radius: 4px;
	color: #fff;
}

.main-cybercenter .content h3 {
	font-weight: 700;
	font-size: 34px;
	/* margin-bottom: 30px; */
}

.main-cybercenter .icon-boxes .icon-box {
	text-align: center;
	box-sizing: border-box;
	border: 3px solid white;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0px 2px 10px rgb(0 0 0/ 20%);
	padding: 40px 30px;
	width: 100%;
	transition: all .4s;
}

.main-cybercenter .icon-boxes .icon-box:hover {
	border: 3px solid cyan;
}

.main-cybercenter .icon-boxes .icon-box i {
	font-size: 40px;
	color: #1977cc;
	margin-bottom: 30px;
}

.main-cybercenter .icon-boxes .icon-box h5 {
	color: #1977cc;
}

.main-cybercenter .content .more-btn {
	display: inline-block;
	background: rgba(255, 255, 255, 0.2);
	padding: 6px 30px 8px 30px;
	color: #fff;
	border-radius: 50px;
	transition: all ease-in-out 0.4s;
}

.water-analysis .icon-boxes h3 {
	font-size: 28px;
	font-weight: 700;
	color: #2c4964;
	margin-bottom: 15px;
}

.water-analysis .icon-box {
	margin-top: 40px;
}

.water-analysis .icon-box .icon {
	float: left;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border: 2px solid #8dc2f1;
	border-radius: 50px;
	transition: 0.5s;
}

.water-analysis .icon-box .icon i {
	color: #1977cc;
	font-size: 32px;
}

.water-analysis .icon-box .title {
	margin-left: 85px;
	font-weight: 700;
	margin-bottom: 5px;
	font-size: 18px;
}

.water-analysis .icon-boxes h4 {
	font-size: 18px;
	color: #4b7dab;
	margin-bottom: 15px;
}

.water-analysis .icon-box .title a {
	color: #343a40;
	transition: 0.3s;
}

.water-analysis .icon-box .description {
	margin-left: 85px;
	line-height: 140%;
	font-size: 14px;
}

.sidenav {
	border-top: 3px solid green;
}

.sidenav-item .card-body {
	border-radius: 4px;
	background: #1977cc;
	color: #fff;
}

.sidenav-item .card-body .more-btn {
	display: inline-block;
	background: rgba(0, 0, 0, 0.2);
	padding: 6px 30px 8px 30px;
	color: #fff;
	border-radius: 50px;
	border: 1px solid #f1f1f1;
	transition: all ease-in-out 0.4s;
}

.sidenav-link>span {
	font-size: 1rem;
	font-weight: 700;
}

.sidenav-collapse .sidenav-link {
	font-size: 0.95rem;
	height: 2.5rem;
}

.sidenav-level {
	list-style: none;
}

.sidenav-level > .sidenav-item > .sidenav-link > i {
	font-size : 0.5rem;
}

.btn-more {
	background-color: #1977cc;
	color: white;
}

.section-bg {
	background-color: #f1f7fd;
}

#newest-notice .card-header {
	background-color: #1977cc;
}

#notice {
	overflow: hidden;
}

#notice .nav-tabs {
	border: 0;
}

#notice .flex-column {
	flex-direction: column !important;
}

#notice .nav-link {
	border: 0;
	padding: 18px 15px 18px 0;
	transition: 0.3s;
	color: #2c4964;
	border-radius: 0;
	border-right: 3px solid #ebf1f6;
	font-weight: 600;
	font-size: 18px;
}

#notice .nav-link.active {
	color: #1977cc;
	border-color: #1977cc;
	background-color: #f1f7fd;
}

#notice .nav-link:hover {
	color: #1977cc;
	background-color: #f1f7fd;
}

#notice .tab-pane.active {
	-webkit-animation: fadeIn 0.5s ease-out;
	animation: fadeIn 0.5s ease-out;
}

#notice .details h3 {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 20px;
	color: #2c4964;
}

#notice .details p {
    color: #777777;
}

#header-title-banner {
	background-color: #1977cc;
	/* opacity: 0.8; */
	/* background-image:  radial-gradient(#1977cc 1.5px, transparent 1.5px), radial-gradient(#1977cc 1.5px, #e5e5f7 1.5px); */
	/* background-image: url('https://mdbootstrap.com/img/Photos/Others/images/76.jpg'); */
	/* background-size: 60px 60px; */
	/* background-position: 0 0,30px 30px; */
}

#history .nav .nav-item a {
	font-size: 20px;
}

#waterPollutionTabs .nav-item .nav-link {
	font-size: 1rem !important;
}

#massboard {
	display: block;
}

#massboard .tab {
	display: flex;
	justify-content: space-between;
	overflow: hidden;
	border: solid #ccc;
	border-width: 5px 1px 0 1px;
	border-top-color: dodgerblue;
	/*   border-bottom-color:#fff; */
	border-radius: 6px 6px 0 0;
	background-color: #f1f1f1;
}

#massboard .tab button {
	flex-grow: 1;
	background-color: inherit;
	border: none;
	outline: none;
	cursor: pointer;
	padding: 14px 16px;
	transition: 0.3s;
	font-size: 17px;
}

#massboard .tab button:hover {
	background-color: #ddd;
}

#massboard .tab button.active {
	background-color: #fff;
	text-decoration: underline;
	text-underline-position: under;
	text-decoration-color: red;
}

#massboard .tabcontent {
	display: block;
	padding: 6px 12px;
	border: 1px solid #ccc;
	border-top: none;
}

/* 바로가기 아이콘 */
.icon-wrap {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-content: center;
	align-items: center;
	margin: 0 auto 1rem auto;
	width: 70px;
	height: 70px;
	background: #f1f1f1;
	border: 3px solid #ddd;
	border-radius: 35px;
	transition: all .7s;
}

.icon-wrap>i {
	display: contents;
}

.icon-box:hover .icon-wrap {
	background: #fff;
	border-color: cyan;
}

/* 바로가기 아이콘 수정 */
.box-u-icon {
	width: 150px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
    align-items: center;
	}
.box-u-icon:hover {cursor: pointer;}
.box-u-icon:hover .u-icon-info {
    border-width: 5px;    
    background-color: darkblue;
}
/* .box-u-icon:hover h3 {color:#2972fa;}  */
.u-icon {
	display: inline-flex;
    width: 5rem;
    height: 5rem;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.u-icon-block >span>img {margin-top: 0; transition: all .3s;}
.u-icon-block:hover >span>img {margin-top: -0.5rem;}
/* .u-icon-block:hover h3 {color: dodgerblue;} */

.u-icon-info {
    color: dodgerblue;
    background-color: dodgerblue;
    border:solid #fff;
    border-width:2px;
    transition: all .3s;
}
/* .u-icon-block:hover .u-icon-info{
    border: 4px solid blue;
    border-color:navy;
    box-shadow: 0 0 10px blue;
} */


.test-flow,.water-flow  {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	align-content: center;
}

.test-flow div {justify-content: space-between;}
.water-flow div {justify-content: space-around;}

.test-flow .arrow-d,.water-flow  .arrow-d  {
	display: none !important;
}

/* 메인페이지 바로가기 아이콘 버튼 */
.cyber-icon {width: 10rem; cursor: pointer;}
.cyber-icon span {box-sizing: border-box; display:inline-block; width: 106px; height:106px;border: 5px solid rgba(255,0,0,0); border-radius:50%; transition: all .5s;}
.cyber-icon:hover span {border-color: rgba(0,0,255,0.7);}


.btnStyle-icon {text-align: center;}
.btnStyle-icon > span {display:inline-block; box-sizing:border-box; width: 210px; padding: 10px; border-radius:30px;border: 6px solid #eee;background:#fff; cursor:pointer; transition: all .7s;}
.btnStyle-icon > span:hover {border-color:#0087d8;}
.btnStyle-icon > span img {width: 30px; float: left;}
.btnStyle-icon > span span {float: right;line-height: 182%; padding-right: 7px} 

/* ######################################################################################## */
/* Height  */
.height-3 {
	height: 3px !important;
}

/* Opacity */
.opacity-7 {
	opacity: 7;
}

/* Font-Size  */
.rem-1 {
	font-size: 1rem;
}

/* letter-spacing */
.ls-n1 {
	letter-spacing: -1px;
}

.ls-n15 {
	letter-spacing: -1.5px;
}

/* Shadow  */
.shadow-box-top {
	box-shadow: 0 -2px 5px #999
}

.shadow-text-down {
	text-shadow: 1px 1px 0 #333;
}

.shadow-text-wide {
	text-shadow: 1px 1px 0 #333, 2px 2px 1px #555, 3px 3px 3px #777, -1px -1px 0 #333, -2px -2px 3px #555;
}

/* ########################################################################################### */
/* ###################################  Background     ####################################### */
.gradient-bg-A {
	background-image: linear-gradient(405deg, transparent 0%, transparent 17%, rgba(87, 146, 234, 0.6) 17%, rgba(87, 146, 234, 0.6)
		59%, transparent 59%, transparent 64%, rgba(34, 81, 222, 0.6) 64%, rgba(34, 81, 222, 0.6) 100%),
		linear-gradient(315deg, transparent 0%, transparent 2%, rgb(87, 146, 234) 2%, rgb(87, 146, 234) 46%, rgb(114, 178, 239) 46%,
		rgb(114, 178, 239) 54%, transparent 54%, transparent 63%, rgb(7, 48, 216) 63%, rgb(7, 48, 216) 100%),
		linear-gradient(360deg, rgb(18, 131, 14), rgb(18, 131, 14));
}

.gradient-bg-B {
	background-image: linear-gradient(405deg, rgb(210, 210, 210), rgb(0, 0, 0)), linear-gradient(67.5deg, rgba(78, 215, 231, 0.5) 0%,
		rgba(78, 215, 231, 0.5) 3%, rgba(80, 186, 233, 0.5) 3%, rgba(80, 186, 233, 0.5) 17%, rgba(82, 157, 236, 0.5) 17%,
		rgba(82, 157, 236, 0.5) 21%, rgba(84, 127, 238, 0.5) 21%, rgba(84, 127, 238, 0.5) 42%, rgba(86, 98, 241, 0.5) 42%,
		rgba(86, 98, 241, 0.5) 74%, rgba(88, 69, 243, 0.5) 74%, rgba(88, 69, 243, 0.5) 100%), linear-gradient(315deg, rgb(78, 215, 231)
		0%, rgb(78, 215, 231) 3%, rgb(80, 186, 233) 3%, rgb(80, 186, 233) 17%, rgb(82, 157, 236) 17%, rgb(82, 157, 236) 21%,
		rgb(84, 127, 238) 21%, rgb(84, 127, 238) 42%, rgb(86, 98, 241) 42%, rgb(86, 98, 241) 74%, rgb(88, 69, 243) 74%, rgb(88, 69, 243)
		100%) !important;
	background-blend-mode: overlay, overlay, normal !important;
}

.gradient-bg-C {
	background-image: radial-gradient(circle at 67% 83%, rgba(7,172,255, 0.15) 0%, rgba(7,172,255, 0.15) 1%,transparent 1%, 
	transparent 5%,transparent 5%, transparent 100%),radial-gradient(circle at 24% 80%, rgba(7,172,255, 0.15) 0%, rgba(7,172,255, 0.15) 27%,
	transparent 27%, transparent 63%,transparent 63%, transparent 100%),radial-gradient(circle at 23% 5%, rgba(7,172,255, 0.15) 0%, 
	rgba(7,172,255, 0.15) 26%,transparent 26%, transparent 82%,transparent 82%, transparent 100%),radial-gradient(circle at 21% 11%, 
	rgba(7,172,255, 0.15) 0%, rgba(7,172,255, 0.15) 35%,transparent 35%, transparent 45%,transparent 45%, transparent 100%),
	radial-gradient(circle at 10% 11%, rgba(7,172,255, 0.15) 0%, rgba(7,172,255, 0.15) 21%,transparent 21%, transparent 81%,transparent 81%, 
	transparent 100%),radial-gradient(circle at 19% 61%, rgba(7,172,255, 0.15) 0%, rgba(7,172,255, 0.15) 20%,transparent 20%, 
	transparent 61%,transparent 61%, transparent 100%),radial-gradient(circle at 13% 77%, rgba(7,172,255, 0.15) 0%, rgba(7,172,255, 0.15) 63%,
	transparent 63%, transparent 72%,transparent 72%, transparent 100%),radial-gradient(circle at 30% 93%, rgba(7,172,255, 0.15) 0%, 
	rgba(7,172,255, 0.15) 33%,transparent 33%, transparent 82%,transparent 82%, transparent 100%),linear-gradient(368deg, rgb(22,55,207),rgb(7,122,215));}

.gradient-bg-D { background-image: linear-gradient(180deg, rgb(92, 92, 92),rgba(18,81,137, 0.46)),linear-gradient(22.5deg, rgb(30, 105, 176) 0%, rgb(30, 105, 176) 58%,rgb(74, 127, 188) 58%, rgb(74, 127, 188) 63%,rgb(118, 149, 200) 63%, rgb(118, 149, 200) 69%,rgb(162, 172, 213) 69%, rgb(162, 172, 213) 90%,rgba(49,59,217, 0.32) 90%, rgba(49,59,217, 0.32) 97%,rgba(52,99,250, 0.66) 97%, rgba(52,99,250, 0.66) 100%),linear-gradient(180deg, rgb(30, 105, 176) 0%, rgb(30, 105, 176) 58%,rgb(74, 127, 188) 58%, rgb(74, 127, 188) 63%,rgb(118, 149, 200) 63%, rgb(118, 149, 200) 69%,rgb(162, 172, 213) 69%, rgb(162, 172, 213) 90%,rgba(49,59,217, 0.32) 90%, rgba(49,59,217, 0.32) 97%,rgba(52,99,250, 0.66) 97%, rgba(52,99,250, 0.66) 100%),linear-gradient(225deg, rgb(30, 105, 176) 0%, rgb(30, 105, 176) 58%,rgb(74, 127, 188) 58%, rgb(74, 127, 188) 63%,rgb(118, 149, 200) 63%, rgb(118, 149, 200) 69%,rgb(162, 172, 213) 69%, rgb(162, 172, 213) 90%,rgba(49,59,217, 0.32) 90%, rgba(49,59,217, 0.32) 97%,rgba(52,99,250, 0.66) 97%, rgba(52,99,250, 0.66) 100%); background-blend-mode:overlay, overlay, overlay, normal;}		
.bg-555 {background-color: #555555 !important;}
.bg-light-gray {background-color: #f5f5f5 !important;}
.bg-light-blue {background-color: #f0f5ff !important;}
.bg-light-gold {background-color: #fcfae2 !important;}
.bg-light-red {background-color: rgba(255, 0, 10, 0.02) !important;}
.bg-dark-navy {background-color: #013F76;}
.bg-img-main-title {background: url('../../images/background/main-title-bg.png') no-repeat left top / cover;}
.bg-img-meter {	background: url('../../images/svg/meter-color.svg') no-repeat 70% 30%/40%;}
.bg-img-acupwater {	background: url('../../images/background/bg-acupwater.jpg') no-repeat right bottom/50%;}


.bg-img-banner00,.bg-img-banner01,.bg-img-banner02,.bg-img-banner03,.bg-img-banner04 {
	width:100%; 
	height:380px;	
	background-repeat:no-repeat;
	background-position: center;
	background-size:cover;	
	}
.bg-img-banner00 {
	background-image: url('../../images/banner/wide-wave.jpg');
	background-position: center 42%;
}
.bg-img-banner01 {
	background-image: url('../../images/banner/wide-start.gif');
}
.bg-img-banner02 {
	background-image: url('../../images/banner/wide-save-water.gif');
}
.bg-img-banner03 {
	background-image: url('../../images/banner/wide-breaktime.gif');
}
.bg-img-banner04 {
	background-image: url('../../images/banner/wide-reduction.gif');
}

.bg-img-glass {
	background: url('../../images/background/bg_glass-02.png') no-repeat 70% 30%/40%;
}

.bg-img-test {
	background: url('../../images/background/bg-qualitytest.jpg') no-repeat;
}
.bg-img-mongtan {
	background: url('../../images/background/mongtan.jpg') no-repeat right bottom / contain ;
}
.bg-img-tank {
	background: url('../../images/background/bg-test-tank.jpg') no-repeat right center / auto ;
}

.bg-img-inhouse {
	background: url('../../images/background/bg-test-inhouse.jpg') no-repeat right center / auto ;
}
.bg-img-water {
	background: url('../../images/banner/wide-water.jpg') no-repeat center / cover;
}
.bg-img-waterclean {
	background: url('../../images/background/bg-waterclean.gif') no-repeat right top/50%;
}

.bg-img-welcome {
	background: url('../../images/background/bg-welcome.jpg') no-repeat center/cover;
}

.bg-img-myhome {
	background: url('../../images/background/bg-myhome.jpg') no-repeat center/cover;
}

.bg-img-faq {
	background: url('../../images/background/bg-faq.jpg') no-repeat center/cover;
}

.bg-img-water-flow {
	background: url('../../images/background/bg-water-flow.jpg') no-repeat center/cover;
}

.bg-img-watertap {
	background: url('../../images/background/bg-watertap.jpg') no-repeat right bottom/30%;
}
	@media (max-width: 768px) { .bg-img-watertap {background: none;} } 
	
.bg-img-water-saving {
	background: url('../../images/background/bg-water-saving.jpg') no-repeat center/cover;
}

.bg-img-groundwater {
	background: url('../../images/background/bg-groundwater.jpg') no-repeat center/cover;
}

.bg-img-littlewater {
	background: url('../../images/background/bg-water-littlewater.jpg') no-repeat center/cover;
}

.bg-img-water-nusu {
	background: url('../../images/background/bg-water-nusu.jpg') no-repeat center/cover;
}

.bg-img-warm {
	background: url('../../images/background/bg-warm.jpg') no-repeat center/cover;
}

.bg-img-simple01 {
	background: url('../../images/background/bg-simple01.gif') no-repeat center/cover;
}

.bg-img-certification {
	background: url('../../images/svg/mobile-certification.svg') no-repeat center 50% / 4rem;
}
.bg-img-BI {
	background: url('../../images/logos/bi-only.svg') no-repeat;
}
.bg-img-CI {
	background: url('../../images/logos/ci-only.svg') no-repeat;
}
.bg-img-security {
	background: url('../../images/svg/security.svg') no-repeat;
}
.bg-img-waterdrop {
	background: url('../../images/svg/waterdrop-lightblue.svg') no-repeat;
}


/* 메인페이지 배경 이미지 버튼 */
.bg-btn-meta {background: url('../../images/background/bg-btn-meta.jpg') no-repeat;}
.bg-btn-microscope {background: url('../../images/background/bg-btn-microscope.jpg') no-repeat;}
.bg-btn-people {background: url('../../images/background/bg-btn-people.jpg') no-repeat;}
.bg-btn-meta,.bg-btn-microscope, .bg-btn-people {background-size:130%;  background-position: right bottom; transition: all .3s; }
.bg-btn-meta:hover,.bg-btn-microscope:hover, .bg-btn-people:hover {background-size:135%; }

.bg-icon-phone-info {
	background: url('../../images/background/phone-info.png') no-repeat 19px 20px; }
.bg-icon-arrow {
	background: url('../../images/background/syber-main-title.png') no-repeat right bottom; }

.bg-cover {background-size:cover !important;}
.bg-top {background-position:center top !important;}
.bg-bottom {background-position:center bottom !important;}
.bg-right {background-position:right center !important;}

#introduce mark {
	background-color: #ffffac;
}



#introduce .list-group-item, #history .list-group-item {
	background-color: transparent;
}

/* Scrollbar */
.scroll-blue::-webkit-scrollbar {
	width: 15px; height: 15px;
}

.scroll-blue::-webkit-scrollbar-thumb {
	background-color: #2972fa;
	border-radius: 10px;
	background-clip: padding-box;
	border: 3px solid transparent;
}

.scroll-blue::-webkit-scrollbar-track {
	background-color: #D9EEFF;
	border-radius: 10px;
	box-shadow: inset 0px 0px 0px blue;
}

.hand-drag:before {
	content: "";
	display: inline-block;
	width: 50px;
	height: 25px;
	background: url(../../images/common/hand-drag.gif) no-repeat center/40px;
	margin-right: 0.3rem;
	vertical-align: -10px;
}

/* Title 및 Text 꾸미기  */
.text-dodgerblue {color: dodgerblue;}
.text-greenblue {color: #006bac;}
.text-mokpogreen {color: #00894b;}
.text-mokpogblue {color: #19498c;}
.text-999 {color: #999;}
.text-777 {color: #777;}
.text-ddd {color: #ddd;}
.text-important {color: tomato;}
.text-shadow-a {text-shadow:1px 1px 0px #fff, 3px 3px 5px #777;}
.text-shadow-b {text-shadow:1px 1px 0px #000,2px 2px 0px #000, 2px 2px 5px #777;}
.text-shadow-c {text-shadow: 0 0 1px #fff, 1px 1px 1px #fff, -1px -1px 1px #fff, 0px 0px 3px #fff, 0px 0px 5px #fff, 3px 3px 5px #fff;}
.text-shadow-cc {text-shadow: 0 0 1px #fff, 1px 1px 1px #fff, -1px -1px 1px #fff, 0px 0px 3px #fff, 0px 0px 5px #fff, 3px 3px 5px #fff; -3px -3px 5px #fff; 5px 5px 5px #fff;-5px -5px 5px #fff;}
.text-shadow-d {text-shadow:1px 1px 0px #000, 2px 2px 0px #000;}

.ff-GM {
	font-family: 'GmarketSans', 'NotoSansKR', sans-serif !important;
}
.fw-700 {font-weight: 700;}
.fw-800 {font-weight: 800;}
.fw-900 {font-weight: 900;}


.box-phonenumber p span:nth-child(1) {padding-left: 1rem;}
.box-phonenumber p span:nth-child(2) {padding-right: 1rem;}

.box-phonenumber p span:nth-child(1):before {
	content: "\203A";
	color: rgba(10, 90, 255, 0.7);
	margin-right: 0.3rem;
}

.box-phonenumber p span:nth-child(2):before {
	content: "\260E";
	color: rgba(10, 90, 255, 0.7);
	margin-right: 0.3rem;
}
.l-tit-deco-img1:before {
	content: '0';
	display: inline-block;
	color: rgba(0, 0, 0, 0);
	position: relative;
	width: 1.3rem;
	height: 1.5rem;
	top: 2px;
	left: 0px;
	margin-right: 0.5rem;
	background-repeat: no-repeat;
	background-size: 1.3rem 1.5rem;
	background-image: url('../../images/svg/b-waterdrop-box.svg');
}

.m-tit-deco-img2:before {
	content: '0';
	display: inline-block;
	color: rgba(0, 0, 0, 0);
	position: relative;
	top: 0px;
	left: 0px;
	margin-right: 0.5rem;
	background-repeat: no-repeat;
	background-size: 0.65rem 1rem;
	background-image: url('../../images/svg/waterdrop-gradient.svg');
}

.s-text-deco-gray:before {
	content: '\276F';
	display: inline-block;
	color: rgba(0, 0, 0, 0.5);
	font-size: 12px;
	font-weight: bold;
	position: relative;
	width: 7px;
	vertical-align: 2px;
}

.s-text-deco-blue:before {
	content: '\276F';
	display: inline-block;
	color: rgba(0, 0, 255, 0.4);
	font-size: 12px;
	font-weight: bold;
	position: relative;
	width: 7px;
	vertical-align: 2px;
}

.s-text-deco-r3::before {
	content: "\2043";
	font-weight: bold;
	color: rgba(255, 0, 0, 0.7);
	margin-right: 0.5rem;
}

.header-deco-b1:before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	background: url(../../images/svg/gmstyle.svg) no-repeat center/cover;
	margin-right: 0.4rem;
	vertical-align: 5px;
}

.header-deco-02:before {
	content: "\220E";
	color: rgba(1, 91, 241, 1);
	text-shadow: 3px 2px 1px rgba(0, 0, 0, 0.2);
	/* font-size: 20px; */
	display: inline-block;
	margin-right: 0.3rem;
	margin-left: 0.2rem;
	vertical-align: 3px;
}
.tit-doco-star::after {
  content: "\002A";
  color: #f26522;
  margin-left: 1px;
  vertical-align: -70%;
  font-size: 190%;
}
.tit-doco-phone-blue::before {
	content: "\2706";
	color: rgba(10, 90, 255, 0.7);
	margin-right: 0.3rem;
}
.tit-doco-telephone-blue::before {
	content: "\260E";
	color: rgba(10, 90, 255, 0.7);
	margin-right: 0.3rem;
}
.b-newwin:after,.b-empty:after {
	content: "";
	display: inline-block;
	position: relative;
	width: 1rem;
	height: 1rem;
	top: 2px;
	right: 0px;
	margin-left: 0.22rem;
}
.b-newwin:after {background: url(../../images/svg/b-newwin.svg) no-repeat 0px 0px / cover;}
.b-empty:after {background: none;}
.b-newwin-m:after {
	content: "";
	display: inline-block;
	position: relative;
	width: 1.3rem;
	height: 1.3rem;
	top: 2px;
	right: 0px;
	margin-left: 0.08rem;
	background: url(../../images/svg/b-newwin.svg) no-repeat 0px 0px/1.3rem 1.3rem;
}

/* UL Li 꾸미기 */
.style-square  {margin-left: 1.5rem;} 
.style-square {list-style-type: square; padding: 5px;}
.style-square li::marker {color:steelblue;}

.style-decimal {list-style-type: decimal;}
.list-style-none {
	list-style: none;
}

.marker-coral li::marker {
	color: coral;
	font-weight: bold;
}

.marker-dodgerblue li::marker {
	color: dodgerblue;
	font-weight: bold;
}

.marker-lightblue li::marker {
	color: #78b7f5;
	font-weight: bold;
	font-size: 1.2rem;
}

/* Border 꾸미기 */
.border-t-2 {border-top: 2px solid;}
.border-color-ddd {border-color: #ddd;}
.border-bottom-coral01 {border-bottom: 1px solid coral;}
.border-bottom-dot-777 {border-bottom: 1px dotted #777;}
.border-color-top-gold {border-top-color: gold !important;}
.pointer, .link-callable {cursor: pointer;}

/* 추가  */
.mobile-only {display: none;}
.ps-lg-rem-8 {padding-left: 8rem !important;}

/* Top 버튼  */
#topbtn {display:none; position: fixed; right: 5%; bottom: 5%; background: rgba(250,0,0,0.8); outline:none; border:none; border-radius:6px; padding: 1rem; color: #fff; box-shadow:0 0 10px #000;transition: all .5s;}
#topbtn:hover {background: rgba(250,0,0,0.8); }

/* Table th V-align=middle */
tr.bg-light-blue th {vertical-align: middle;}

/* 줄바꿈 방지  */
.single-line {white-space: nowrap !important;}

/* ###########  추가 ########################################  */
.bg-grayblue {background-color: #5c667a!important;}
.bg-basic {background-color: #3399ff!important;}
.bg-navy {background-color: navy!important;}
.bg-cyan-10 {background-color:rgba(0,180,255,0.05) !important; } 
.bg-anyang {background-color: #0068b5!important;}
.bg-yellow {background-color: #ffffc8!important;}
.bg-text-white {background-color : rgba(255, 255, 255, 0.6)}

.text-primary {color: #003f8c!important;}
.text-navy {color: navy!important;}
.text-basic {color: #3399ff!important;}
.text-blue {color: blue!important;}
.text-anyang {color: #0068b5!important;}
.text-ddd {color: #ddd!important;}

.btn-basic {background-color: #3399ff; color: #fff;}
.btn-anyang {background-color: #0068b5; color: #fff;}
.btn-navy {background-color: navy; color: #fff;}
.btn-black70 {background-color: #555!important;}

.mt-mobile {margin-top: 0px;}
.p-0_5rem {padding: 0.5rem!important;}
.py-0_7rem {padding-top: 0.7rem!important; padding-bottom: 0.5rem!important;}
.px-0_2rem {padding-left: 0.2rem!important; padding-right: 0.2rem!important;}
.px-10px {padding-left: 10px!important; padding-right: 10px!important;}

.lh-120 {line-height: 120%!important;}
.lh-130 {line-height: 130%!important;}
.ls-1 {letter-spacing: -1px!important;}
.ls-15 {letter-spacing: -1.5px!important;}
.mobile-bg-white {background-color: transparent!important;}
.bg-transparent-gray {background-color : rgba(94, 94, 94, 0.7)}

#info-modal-content .list-group-item,
#info-modal-autopayGuide .list-group-item,
#info-modal-smartSMSGuide .list-group-item
{padding: 0.5rem!important;line-height: 130%!important;}

/* 메인페이지 배너 버튼에 그림자 추가 */
.fa-angle-left:before,.fa-angle-right:before { text-shadow: 1px 1px 3px #333;}
.carousel-indicators li { box-shadow: 1px 1px 3px #333;}

.w-45 { width: 45%!important;}
.w240 {	max-width: 240px !important;}

.hyphen {
    margin: 0 1rem;
    font-size: 1rem;
    vertical-align: middle;
}

input[type=password] {
  font-family: 'Roboto', Helvetica, Arial, sans-serif ;
  font-size: 18px;
  &::-webkit-input-placeholder {
    transform: scale(0.77);
    transform-origin: 0 50%;
  }
  
  &::-moz-placeholder {
    font-size: 14px;
    opacity: 1;
  }
  
  &:-ms-input-placeholder {
    font-size: 14px;
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
  }
}
.pink {color:red !important;}

.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-totop {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    display: none;
    z-index: 9999;
}