@charset "utf-8";
/* CSS Document */

/*******************************
 * FileName : BasicSet.css
 * Site	: 국가수질자동측정망
 * Update - 2024.04.25.
********************************/

@font-face {
  font-family: 'NanumGothic';
  font-style: normal;
  font-weight: 400;
  src: url(font/NanumGothic-Regular.eot);
  src: url(font/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),
       url(font/NanumGothic-Regular.woff2) format('woff2'),
       url(font/NanumGothic-Regular.woff) format('woff'),
       url(font/NanumGothic-Regular.ttf) format('truetype');
}

@font-face {
  font-family: 'NanumGothicBlod';
  font-style: normal;
  font-weight: 700;
  src: url(font/NanumGothic-Bold.eot);
  src: url(font/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(font/NanumGothic-Bold.woff2) format('woff2'),
       url(font/NanumGothic-Bold.woff) format('woff'),
       url(font/NanumGothic-Bold.ttf) format('truetype');
}

@font-face {
  font-family: 'MyriadPro-Bold';
  src: urlfont/(MyriadPro-Bold.otf.eot);
  src: url(font/MyriadPro-Bold?#iefix) format('embedded-opentype'),
       url(font/MyriadPro-Bold.woff) format('woff'),
       url(font/MyriadPro-Bold.ttf) format('truetype');
}

@font-face {
  font-family: 'malgun';
  src: url(font/malgun.eot);
  src: url(font/malgun?#iefix) format('embedded-opentype'),
       url(font/malgun.woff) format('woff'),
       url(font/malgun.ttf) format('truetype');
}

@font-face {
  font-family: 'malgunbd';
  src: url(font/malgunbd.eot);
  src: url(font/malgunbd?#iefix) format('embedded-opentype'),
       url(font/malgunbd.woff) format('woff'),
       url(font/malgunbd.ttf) format('truetype');
}


/* Noto Sans Font */
@font-face {
    font-family: "NotoKrL";
    font-style: normal;
    font-weight: 100;
    src: local('Noto Sans Light'), local('NotoSans-Light'), url(font/NotoSans-Light.eot);
    src: url(font/NotoSans-Light.eot?#iefix) format('embedded-opentype'),
          url(font/NotoSans-Light.woff2) format('woff2'),
          url(font/NotoSans-Light.woff) format('woff');;
    }
    
    @font-face {
    font-family: "NotoKrR";
    font-style: normal;
    font-weight: 300;
    src: local('Noto Sans Regular'), local('NotoSans-Regular'), url(font/NotoSans-Regular.eot);
    src: url(font/NotoSans-Regular.eot?#iefix) format('embedded-opentype'),
          url(font/NotoSans-Regular.woff2) format('woff2'),
          url(font/NotoSans-Regular.woff) format('woff');
    }
    
    @font-face {
    font-family: "NotoKrM";
    font-style: normal;
    font-weight: 500;
    src: local('Noto Sans Medium'), local('NotoSans-Medium'), url(font/NotoSans-Medium.eot);
    src: url(font/NotoSans-Medium.eot?#iefix) format('embedded-opentype'),
          url(font/NotoSans-Medium.woff2) format('woff2'),
         url(font/NotoSans-Medium.woff) format('woff');
    }
    
    @font-face {
    font-family: "NotoKrB";
    font-style: normal;
    font-weight: 700;
    src: local('Noto Sans Bold'), local('NotoSans-Bold'), url(font/NotoSans-Bold.eot);
    src: url(font/NotoSans-Bold.eot?#iefix) format('embedded-opentype'),
          url(font/NotoSans-Bold.woff2) format('woff2'),
          url(font/NotoSans-Bold.woff) format('woff');
    }

html, body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, hr, pre, code, form, fieldset, legend, input, textarea, button, p, blockquote, th, td, label, select, p, i {
    margin: 0px;
    padding: 0px;
    font-family: 'NanumGothic';
}


dl, dt, dd, ul, ol, li { list-style: none; }

a { text-decoration: none; color: inherit; }

/*테두리 없애기*/
img, fieldset, abbr,acronym { border: 0px; vertical-align: middle;}


/* 테이블 - 마크업에 'cellspacing="0"' 지정 함께 필요 */
table {
    border-collapse: separate;
    border-spacing:0;
    border:0 none;
    }
caption, th, td {
    text-align:left;
    font-weight: normal;
}

/* 텍스트 관련 요소 초기화 */
address, caption, em, cite {
    font-weight:normal;
    font-style:normal;
    }

footer { clear: both; }

select{padding: 4px 3px; border: 1px solid #d4d4d4; font-size: 14px; color:#555; box-sizing: border-box;  outline: none;}





.bl { border-left: 0px !important;}
.br { border-right: 0px !important;}
.bt { border-top: 0px !important;}
.bb { border-bottom: 0px !important;}

.L0 { letter-spacing: 0px; }


.dis_ib { display: inline-block; }
.dis_no { display: none ; }

/*글씨방향*/
.AL { text-align: left !important; }
.AR { text-align: right !important; }
.AC { text-align: center !important; }

/*폰트굵기*/
.FW700 { font-weight: 700; }
.FW900 { font-weight: 900; }

/*border*/
.bor0 { border: 0px !important; }
.borL0 { border-left: 0px !important; }
.borR0 { border-right: 0px !important; }
.borT0 { border-top: 0px !important; }
.borB0 { border-bottom: 0px !important; }

/*float*/
.fl { float: left !important; } 
.fr { float: right !important; } 
.fn { float: none !important; } 


/*backgroud*/
.BgNone { background: none !important; }
.Bgwhite { background: #FFF !important; }


/*width*/
.W10 { width: 10px !important; }
.W20 { width: 20px !important; }
.W30 { width: 30px !important; }
.W40 { width: 40px !important; }
.W45 { width: 45px !important; }
.W50 { width: 50px !important; }
.W60 { width: 60px !important; }
.W70 { width: 70px !important; }
.W80 { width: 80px !important; }
.W90 { width: 90px !important; }
.W100 { width: 100px !important; }
.W105 { width: 105px !important; }
.W110 { width: 110px !important; }
.W120 { width: 120px !important; }
.W130 { width: 130px !important; }
.W140 { width: 140px !important; }
.W150 { width: 150px !important; }
.W160 { width: 160px !important; }
.W170 { width: 170px !important; }
.W180 { width: 180px !important; }
.W190 { width: 190px !important; }
.W200 { width: 200px !important; }
.W210 { width: 210px !important; }
.W220 { width: 220px !important; }
.W230 { width: 230px !important; }
.W240 { width: 240px !important; }
.W250 { width: 250px !important; }
.W260 { width: 260px !important; }
.W270 { width: 270px !important; }
.W280 { width: 280px !important; }
.W290 { width: 290px !important; }
.W300 { width: 300px !important; }
.W310 { width: 310px !important; }
.W320 { width: 320px !important; }
.W330 { width: 330px !important; }
.W340 { width: 340px !important; }
.W350 { width: 350px !important; }
.W360 { width: 360px !important; }
.W400 { width: 400px !important; }
.W410 { width: 410px !important; }
.W420 { width: 420px !important; }
.W430 { width: 430px !important; }
.W435 { width: 435px !important; }
.W440 { width: 440px !important; }
.W450 { width: 450px !important; }
.W460 { width: 460px !important; }
.W500 { width: 500px !important; }
.W510 { width: 510px !important; } /*20151019추가*/
.W550 { width: 550px !important; }
.W600 { width: 600px !important; }
.W650 { width: 650px !important; }
.W750 { width: 750px !important; }
.W900 { width: 900px !important; }
.W94_6 { width: 94.6px !important; }

/*width percent*/
.W10p { width: 10% !important; }
.W15p { width: 15% !important; }
.W16p { width: 16% !important; }
.W16_5p { width: 16.5% !important; }
.W17p { width: 17% !important; }
.W18p { width: 18% !important; }
.W19p { width: 19% !important; }
.W20p { width: 20% !important; }
.W25p { width: 25% !important; }
.W30p { width: 30% !important; }
.W35p { width: 35% !important; }
.W40p { width: 40% !important; }
.W45p { width: 45% !important; }
.W50p { width: 50% !important; }
.W55p { width: 55% !important; }
.W60p { width: 60% !important; }
.W65p { width: 65% !important; }
.W70p { width: 70% !important; }
.W75p { width: 75% !important; }
.W80p { width: 80% !important; }
.W85p { width: 85% !important; }
.W90p { width: 90% !important; }
.W95p { width: 95% !important; }
.W100p { width: 100% !important; }

/*height*/
.H10 { height: 10px !important; }
.H20 { height: 20px !important; }
.H30 { height: 30px !important; }
.H40 { height: 40px !important; }
.H50 { height: 50px !important; }
.H60 { height: 60px !important; }
.H70 { height: 70px !important; }
.H80 { height: 80px !important; }
.H90 { height: 90px !important; }
.H100 { height: 110px !important; }
.H110 { height: 110px !important; } /*20151023추가*/
.H120 { height: 120px !important; }
.H125 { height: 125px !important; }
.H130 { height: 130px !important; }
.H140 { height: 140px !important; }
.H150 { height: 150px !important; }
.H160 { height: 160px !important; }
.H165 { height: 165px !important; }
.H170 { height: 170px !important; }
.H180 { height: 180px !important; }
.H190 { height: 190px !important; }
.H200 { height: 200px !important; }
.H211 { height: 211px !important; }
.H225 { height: 225px !important; }
.H228 { height: 228px !important; }
.H250 { height: 250px !important; }
.H265 { height: 265px !important; }
.H267 { height: 267px !important; }
.H285 { height: 285px !important; }
.H300 { height: 300px !important; }
.H310 { height: 310px !important; }
.H350 { height: 350px !important; }
.H400 { height: 400px !important; }
.H450 { height: 450px !important; }
.H500 { height: 500px !important; }
.H550 { height: 550px !important; }
.H600 { height: 600px !important; }
.H650 { height: 650px !important; }

.H100p { height: 100% !important; }


/*margin*/
.Mg0 { margin: 0px !important; }

.MgT0 {margin-top:0px !important}
.MgT1 {margin-top:1px !important}
.MgT2 {margin-top:2px !important}
.MgT3 {margin-top:3px !important}
.MgT4 {margin-top:4px !important}
.MgT5 {margin-top:5px !important}
.MgT10 {margin-top:10px !important}
.MgT15 {margin-top:15px !important}
.MgT20 {margin-top:20px !important}
.MgT25 {margin-top:25px !important}
.MgT30 {margin-top:30px !important}
.MgT35 {margin-top:35px !important}
.MgT40 {margin-top:40px !important}
.MgT45 {margin-top:45px !important}
.MgT50 {margin-top:50px !important}
.MgT55 {margin-top:55px !important}
.MgT60 {margin-top:60px !important}
.MgT70 {margin-top:70px !important}
.MgT80 {margin-top:80px !important}
.MgT90 {margin-top:90px !important}
.MgT100 {margin-top:100px !important}
.MgT200 {margin-top:200px !important}
.MgT300 {margin-top:300px !important}
.MgT400 {margin-top:400px !important}
.MgT500 {margin-top:500px !important}
.MgT600 {margin-top:600px !important}


.MgL0 {margin-left:0px !important}
.MgL5 {margin-left:5px !important}
.MgL10 {margin-left:10px !important}
.MgL15 {margin-left:15px !important}
.MgL20 {margin-left:20px !important}
.MgL25 {margin-left:25px !important}
.MgL30 {margin-left:30px !important}
.MgL35 {margin-left:35px !important}
.MgL40 {margin-left:40px !important}
.MgL45 {margin-left:45px !important}
.MgL50 {margin-left:50px !important}
.MgL55 {margin-left:55px !important}
.MgL60 {margin-left:60px !important}
.MgL65 {margin-left:65px !important}
.MgL70 {margin-left:70px !important}
.MgL75 {margin-left:75px !important}
.MgL80 {margin-left:80px !important}
.MgL85 {margin-left:85px !important}
.MgL90 {margin-left:90px !important}
.MgL95 {margin-left:95px !important}
.MgL100 {margin-left:100px !important}
.MgL120 {margin-left:120px !important}

.MgR0 {margin-right:0px !important}
.MgR2 {margin-right:2px !important}
.MgR5 {margin-right:5px !important}
.MgR10 {margin-right:10px !important}
.MgR15 {margin-right:15px !important}
.MgR20 {margin-right:20px !important}
.MgR25 {margin-right:25px !important}
.MgR30 {margin-right:30px !important}
.MgR35 {margin-right:35px !important}
.MgR40 {margin-right:40px !important}
.MgR45 {margin-right:45px !important}
.MgR50 {margin-right:50px !important}
.MgR55 {margin-right:55px !important}
.MgR56 {margin-right:56px !important}
.MgR57 {margin-right:57px !important}
.MgR58 {margin-right:58px !important}
.MgR59 {margin-right:59px !important}
.MgR60 {margin-right:60px !important}
.MgR70 {margin-right:70px !important}
.MgR80 {margin-right:80px !important}
.MgR90 {margin-right:90px !important}
.MgR100 {margin-right:100px !important}


.MgB0 {margin-bottom:0px !important}
.MgB2 {margin-bottom:2px !important}
.MgB3 {margin-bottom:3px !important}
.MgB5 {margin-bottom:5px !important}
.MgB10 {margin-bottom:10px !important}
.MgB15 {margin-bottom:15px !important}
.MgB20 {margin-bottom:20px !important}
.MgB25 {margin-bottom:25px !important}
.MgB30 {margin-bottom:30px !important}
.MgB35 {margin-bottom:35px !important}
.MgB40 {margin-bottom:40px !important}
.MgB45 {margin-bottom:45px !important}
.MgB50 {margin-bottom:50px !important}
.MgB55 {margin-bottom:55px !important}
.MgB56 {margin-bottom:56px !important}
.MgB57 {margin-bottom:57px !important}
.MgB58 {margin-bottom:58px !important}
.MgB59 {margin-bottom:59px !important}
.MgB60 {margin-bottom:60px !important}
.MgB70 {margin-bottom:70px !important}
.MgB80 {margin-bottom:80px !important}
.MgB90 {margin-bottom:90px !important}
.MgB100 {margin-bottom:100px !important}

/*padding*/
.Pd0 { padding: 0px !important; }

.PdT0 {padding-top:0px !important}
.PdT2 {padding-top:2px !important}
.PdT5 {padding-top:5px !important}
.PdT10 {padding-top:10px !important}
.PdT15 {padding-top:15px !important}
.PdT20 {padding-top:20px !important}
.PdT25 {padding-top:25px !important}
.PdT30 {padding-top:30px !important}
.PdT35 {padding-top:35px !important}
.PdT40 {padding-top:40px !important}
.PdT45 {padding-top:45px !important}
.PdT50 {padding-top:50px !important}
.PdT55 {padding-top:55px !important}
.PdT60 {padding-top:60px !important}
.PdT65 {padding-top:65px !important}
.PdT70 {padding-top:70px !important}
.PdT75 {padding-top:75px !important}
.PdT80 {padding-top:80px !important}
.PdT85 {padding-top:85px !important}
.PdT95 {padding-top:95px !important}
.PdT100 {padding-top:100px !important}
.PdT110 {padding-top:110px !important}
.PdT120 {padding-top:120px !important}

.PdL0 {padding-left:0px !important}
.PdL5 {padding-left:5px !important}
.PdL10 {padding-left:10px !important}
.PdL15 {padding-left:15px !important}
.PdL20 {padding-left:20px !important}
.PdL25 {padding-left:25px !important}
.PdL30 {padding-left:30px !important}
.PdL35 {padding-left:35px !important}
.PdL40 {padding-left:40px !important}
.PdL45 {padding-left:45px !important}
.PdL50 {padding-left:50px !important}
.PdL55 {padding-left:55px !important}
.PdL60 {padding-left:60px !important}
.PdL65 {padding-left:65px !important}
.PdL70 {padding-left:70px !important}
.PdL75 {padding-left:75px !important}
.PdL80 {padding-left:80px !important}
.PdL85 {padding-left:85px !important}
.PdL90 {padding-left:90px !important}
.PdL95 {padding-left:95px !important}
.PdL100 {padding-left:100px !important}


.PdR0 {padding-right:0px !important}
.PdR5 {padding-right:5px !important}
.PdR10 {padding-right:10px !important}
.PdR15 {padding-right:15px !important}
.PdR20 {padding-right:20px !important}
.PdR25 {padding-right:25px !important}
.PdR30 {padding-right:30px !important}
.PdR35 {padding-right:35px !important}
.PdR40 {padding-right:40px !important}
.PdR45 {padding-right:45px !important}
.PdR50 {padding-right:50px !important}
.PdR55 {padding-right:55px !important}

.PdB0 {padding-bottom:0px !important}
.PdB2 {padding-bottom:2px !important}
.PdB5 {padding-bottom:5px !important}
.PdB10 {padding-bottom:10px !important}
.PdB15 {padding-bottom:15px !important}
.PdB20 {padding-bottom:20px !important}
.PdB25 {padding-bottom:25px !important}
.PdB30 {padding-bottom:30px !important}
.PdB35 {padding-bottom:35px !important}
.PdB40 {padding-bottom:40px !important}
.PdB45 {padding-bottom:45px !important}
.PdB50 {padding-bottom:50px !important}
.PdB55 {padding-bottom:55px !important}

.backGray{background-color: #cccccc}

button { border: 0px; cursor: pointer; background-color:transparent;}
.errInpt{border :1px #fb9a4a solid !important}
.hidden { width: 0; height: 0; overflow: hidden; position: absolute; left: -9999999999999999px; font-size: 0; line-height: 0;}

/* button 
---------------------------------------------- */
.button {
    display: inline-block;
    zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
    *display: inline;
    vertical-align: baseline;
    /* margin: 0 2px; */
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    font: 12px/100% Arial, Helvetica, NanumGothic, sans-serif;
    padding: .8em 1.8em .60em;
    /* -webkit-border-radius: .5em; 
    -moz-border-radius: .5em; */
    /* border-radius: .5em; 둥글게 하고싶을때 사용*/
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    vertical-align: middle;
    
}
.button:hover {
    text-decoration: none;
}
.button:active {
    position: relative;
    top: 1px;
}
.medium {
    font-size: 12px;
    padding: .43em 1em .45em;
}
.small {
    font-size: 12px;
    padding: .2em 1em .275em;
}

/* color styles 
---------------------------------------------- */

/* white */
.white {
    color: #606060;
    border: solid 1px #b7b7b7;
    background: #fff;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
    background: -moz-linear-gradient(top,  #fff,  #ededed); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}
.white:hover {
    background: #ededed;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
    background: -moz-linear-gradient(top,  #fff,  #dcdcdc); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}
.white:active {
    color: #999;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
    background: -moz-linear-gradient(top,  #ededed,  #fff); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}

/* blue */
.blue {
    color: #d9eef7;
    border: solid 1px #0076a3;
    background: #086cba;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
    background: -moz-linear-gradient(top,  #00adee,  #0078a5); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
}
.blue:hover {
    background: #075ca3;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e));
    background: -moz-linear-gradient(top,  #0095cc,  #00678e); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e');
}
.blue:active {
    color: #80bed6;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
    background: -moz-linear-gradient(top,  #0078a5,  #00adee); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee');
}

/* orange */
.orange {
    color: #fef4e9;
    border: solid 1px #da7c0c;
    background: #f78d1d;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
    background: -moz-linear-gradient(top,  #faa51a,  #f47a20); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}
.orange:hover {
    background: #f47c20;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
    background: -moz-linear-gradient(top,  #f88e11,  #f06015); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.orange:active {
    color: #fcd3a5;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
    background: -moz-linear-gradient(top,  #f47a20,  #faa51a); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

/* gray */
.gray {
    color: #e9e9e9;
    border: solid 1px #555;
    background: #6e6e6e;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
    background: -moz-linear-gradient(top,  #888,  #575757); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.gray:hover {
    background: #616161;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
    background: -moz-linear-gradient(top,  #757575,  #4b4b4b); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}
.gray:active {
    color: #afafaf;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
    background: -moz-linear-gradient(top,  #575757,  #888); */
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}

.page_list {margin-top:15px;text-align:center}
.page_list a {display:inline-block;width:18px;height:16px;border:1px #d7d7d7 solid;padding:5px 5px 3px 5px;vertical-align:middle}
.page_list a:hover {border:1px #2176bc solid;font-weight:bold;color:#2176bc}
.page_list a.over {border:1px #2176bc solid;font-weight:bold;color:#2176bc}
.page_list a.start {font-size:0;line-height:0;background:url(/_images/common/start.gif) no-repeat center center}
.page_list a.prev {font-size:0;line-height:0;background:url(/_images/common/prev.gif) no-repeat center center}
.page_list a.next {font-size:0;line-height:0;background:url(/_images/common/next.gif) no-repeat center center}
.page_list a.last {font-size:0;line-height:0;background:url(/_images/common/last.gif) no-repeat center center}