	
/*================================================
                    공통
  ================================================*/
  
  * { margin:0;  padding:0; }
ol,ul { list-style: none; }
img { border:0;}

body, input, textarea, button, select, table{font-family:'NanumGothic', 'Malgun Gothic', 'dotum', 'Arial', sans-serif; font-size:14px;}
table, th, td {
    border: 1px solid #ccc;
    border-collapse: collapse;
	padding:19px 0;
	font-size:12px;
	text-align:center;
}
table {width:100%;}


div.container {
    width: 100%;
}



article {
	width:1000px;
	margin: 0 auto;
    overflow: hidden;
}	
	
/*================================================
                    로고영역
  ================================================*/
  
#top {
	width:1000px;
	margin: 0 auto;
	}
	
#top .weather { 
	width:400px;
	margin-top:34px;
	float:right;
	}
	
header {	
    float: left;	
    margin: 0 0 10px 0;
    padding: 0;
    width: 100%;
    color: #444;
	background-color:#eee;
    clear: left;
}

	
	
/*================================================
                    메인네비게이션
  ================================================*/
  
  
nav {
	width:1000px;
    margin: 0 auto;
}

nav ul {
    list-style-type: none;
	background-color:#eee;
    margin: 0;
    padding: 0;
}
   
nav ul a {
    float: left;
    text-decoration: none;
	font-weight:600;
	color:#3e5cb5;
    padding: 10px 20px;
	font-size:15px;
}

nav ul a:hover {
    text-decoration: none;	
	background-color:#3e5cb5;
	color:#FFF;
}

nav ul .menu_on {
    text-decoration: none;	
	background-color:#3e5cb5;
	color:#FFF;
}


/*================================================
                   인덱스페이지
  ================================================*/
  
  
.visual { 
width:1000px;
margin: 10px auto;

}


.t01
{
	width:300px;
	float:left;
    overflow: hidden;
	text-align:center;
}
.t01 tr:nth-child(even){background-color: #e5f6fd}
.t02 tr:nth-child(even){background-color: #e5f6fd}
.t02
{
	width:320px;
	float:left;
    overflow: hidden;
	text-align:center;
}
.t03 tr:nth-child(even){background-color: #e5f6fd}
.t03
{
	width:340px;
	margin:0 20px;
	float:left;
    overflow: hidden;
	text-align:center;
}
.t04 tr:nth-child(even){background-color: #e5f6fd}
.t04
{
	width:840px;
	margin:0 0 20px 20px;
	float:left;
    overflow: hidden;
	text-align:center;
}
.t05 tr:nth-child(even){background-color: #e5f6fd}
.t05
{
	width:170px;
	float:left;
    overflow: hidden;
	text-align:center;
}
.t06 tr:nth-child(even){background-color: #e5f6fd}
.t06
{
	width:170px;
	float:left;
    overflow: hidden;
	text-align:center;
	margin:0;
}
.t07 tr:nth-child(even){background-color: #e5f6fd}
.t07
{
	width:480px;
	margin:0 0 0 20px;
	float:left;
    overflow: hidden;
	text-align:center;
}
.t08 tr:nth-child(even){background-color: #e5f6fd}
.t08
{
	width:160px;
	margin:0;
	float:left;
    overflow: hidden;
	text-align:center;
}
.tbth {
	color:#3e5cb5;
	background:#f3f3f3;
	border-bottom: 2px solid #3e5cb5;
	font-size:11px;
	padding:10px 0;
}
.tbstyle td {
	padding:8px 0;
}
.tbstyle02 td {
	padding:3px 0;
}
.tbstyle03 td {
	padding:7px 0;
}
.tbstyle04 td {
	padding:5px 0;
}
.tbstyle05 td {
	padding:16px 0;
}
.tbstyle06 td {
	padding:6px 0;
}
.orange{color:#ff9933;}
.blue{color:#0000ff;}
.red{color:#ff0000;}
.gold{color:#ffcc00;}
.brown{color:#a02d00;}
.green{color:#33ff00;}
.pink{color:#da445d;}
.gray{color:#606060;}

h4 {
	font-weight:600;	
	color:#3e5cb5;
	padding:5px 0 15px 0;
}


/*================================================
                    여백관련
  ================================================*/
.w40 {width:40px;}
.w50 {width:50px;}
.w60 {width:60px;}
.w70 {width:70px;}
.w80 {width:80px;}
.w90 {width:90px;}
.w100 {width:100px;}
.w110 {width:110px;}
.w120 {width:120px;}
.w130 {width:130px;}
.w140 {width:140px;}
.w150 {width:150px;}
.w160 {width:160px;}
.w170 {width:170px;}
.w180 {width:180px;}
.w190 {width:190px;}
.w200 {width:200px;}
.w300 {width:300px;}
.h10 {height:10px;}
.h20 {height:20px;}
.h100 {height:100px;}


	
	
/*================================================
                    푸터
  ================================================*/
  

footer {	
	width:1000px;
	margin: 0 auto;
	margin-top:20px;
    color: #444;
	border-top:solid 1px #ccc ;
}

.site-info {
	float:left;
	width:830px;
	font-size:12px;
	padding-top:20px;
}

.wa {
	float:right;
	width:170px;
}

	
	
	
/*================================================
                    서브레이아웃 여기부터
  ================================================*/
  
/* Sub */
.contents {
	width:1000px;	
	margin:0 auto;
	}

.title{
	width:1000px;
	margin: 0 auto;
	padding:70px 0 6px 0;
	font-size:34px;
	color:#3e5cb5;
	font-weight:400;
	text-align:center;
}
.location {
	width:1000px;
	font-size:12px;
	color:#444;
	text-align:right;
	margin:0 auto;
}

#grad {
	width:1000px;
	margin:10px auto;
	height:2px;
    background: linear-gradient(to right, #60d9c3 , #3e5cb5);
}
	

.sub_article {
    margin-left: 160px;
    padding: 0;
    overflow: hidden;
	min-height:620px;
	width:840px;
	background-size:cover;
	position:relative;
}	
.form_article {
    margin-left: 160px;
    padding: 0;
    overflow: hidden;
	width:840px;
	background-size:cover;
	position:relative;
}	

.m01 {
	background:url(../img/map_sub01.png) no-repeat;
}

.m02 {
	background:url(../img/map_sub02_new.png) no-repeat;height:1100px;
}
.m02_01 {
	background:url(../img/map_sub02_01.png) no-repeat;height:760px;
}
.m02_02 {
	background:url(../img/map_sub02_02.png) no-repeat;height:760px;
}
.m02_03 {
	background:url(../img/map_sub02_03.png) no-repeat;height:760px;
}

.m03 {
	background:url(../img/map_sub031.png) no-repeat;height:880px;
}
.m04 {
	background:url(../img/map_sub04.png) no-repeat;
}
.m06 {
	background:url(../img/wind_bg.png) no-repeat;height:626px;
}
.login_article {
    margin-left: 160px;
    padding: 0;
    overflow: hidden;
	min-height:440px;
	width:840px;
	position:relative;
}	

.login_txt {
    margin:0 auto;
	width:300px;
	text-align:center;
    text-decoration: none;
	font-weight:600;
	color:#3e5cb5;
    padding-bottom:20px;
	font-size:15px;
}

	
/*================================================
                    좌측메뉴 Aside
  ================================================*/
aside {
    float: left;
    min-height: 500px;
    width: 140px;
}

aside ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

aside ul li{
    margin: 0 0 4px 0;
}

aside ul li a{
    text-decoration: none;
	font-weight:600;
    color: #09ac8e;
    margin: 0;
    padding: 10px;
    padding-left: 20px;
    display: block;
	border: solid 1px #ddd;
}

aside a:hover{
    color: #3e5cb5;
    background:url(../img/arr.png) no-repeat right center ;
    background-color: #82ead7;
	border: solid 1px #82ead7;
}


aside .aaa {
    color: #3e5cb5;
    background:url(../img/arr.png) no-repeat right center ;
    background-color: #60d9c3;
	border: solid 1px #60d9c3;
}


bside {
    float: left;
    min-height: 500px;
    width: 140px;
}

bside ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

bside ul li{
    margin: 0 0 4px 0;
}

bside ul li a{
    text-decoration: none;
	font-weight:600;
    color: #09ac8e;
    margin: 0;
    padding: 4px;
    padding-left: 5px;
    display: block;
	border: solid 1px #ddd;
}
bside ul li .bb{

    color: #82ead7;
}

bside a:hover{
    color: #3e5cb5;
    background:url(../img/arr.png) no-repeat right center ;
    background-color: #82ead7;
	border: solid 1px #82ead7;
}


bside .aaa {
    color: #3e5cb5;
    background:url(../img/arr.png) no-repeat right center ;
    background-color: #60d9c3;
	border: solid 1px #60d9c3;
}

.gray_bg {
	width:95px;
	padding:10px 20px 10px 25px ;
	background:#efefef;
}
.gray_bg_w {
	width:110px;
	padding:10px 15px;
	background:#efefef;
}


  .p_txt {
	  color:#444;
	  font-size:10px;
	  font-weight:600;
	  text-align:left;
	  line-height:130%;
	  margin-top:100px;
  }
  .p_txt_w {
	  color:#444;
	  font-size:10px;
	  font-weight:600;
	  text-align:left;
	  line-height:130%;
	  margin-top:90px;
  }
  .p_txt_s {
	  color:#444;
	  font-size:10px;
	  font-weight:600;
	  text-align:left;
	  line-height:130%;
  }
  
  .p_txt_comm{
	  color:#444;
	  font-size:11px;
	  font-weight:600;
	  text-align:left;
	  line-height:130%;
	  margin-top:10px;
	line-height:70%;
  }
  
  .thumb01{
	margin:-3px 4px 0 0;
	background:#3e5cb5;
	width:30px;
	height:10px;
	border-radius:6px;
	float:left;
	border:1px solid #FFF;
  }
  
  .thumb02{
	margin:-3px 4px 0 0;
	background:#06c4a1;
	width:30px;
	height:10px;
	border-radius:6px;
	float:left;
	border:1px solid #FFF;
  }
  
  .thumb01_1{
	margin:-3px 4px 0 0;
	background:#3e5cb5;
	width:15px;
	height:15px;
	border-radius:6px;
	float:left;
	border:1px solid #FFF;
  }
  
  .thumb02_1{
	margin:-3px 4px 0 0;
	background:#06c4a1;
	width:15px;
	height:15px;
	border-radius:6px;
	float:left;
	border:1px solid #FFF;
  }

.r_txt{
	color:#fff;
	font-size:12px;
	text-align:left;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
}	
  
	  
  

/*================================================
                    지점레이어
  ================================================*/
  
  .place {
	width:90px;
	height:80px;
	background:transparent;
	color:#FFF;
	padding:15px;
	overflow:hidden;
	position: absolute; 
	display:block;
	margin:0 auto;
  }

.place_e {
	width:90px;
	height:80px;
	background:#transparent;
	color:#FFF;
	padding:15px;
	overflow:hidden;
	position: absolute; 
	display:block;
	margin:0 auto;
  }

  .place_w {
	display:none;
	width:90px;
	height:66px;
	background:#3e5cb5;
	color:#FFF;
	border:3px solid #FFF;
	border-radius: 10px;
	padding:5px 8px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  }   
    
  .place_t {
	width:130px;
	background:transparent;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
	padding:15px 0;
 }  
  
}
  .place2_w {
	display:none;
	width:90px;
	height:66px;
	background:#01b695;
	color:#FFF;
	border:3px solid #FFF;
	border-radius: 10px;
	padding:5px 8px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  }
  .place_wv2 {
	width:100px;
	height:66px;
	background:#3e5cb5;
	color:#FFF;
	border:3px solid #FFF;
	border-radius: 10px;
	padding:5px 8px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  }   
      
.place_wv {
	width:80px;
	height:66px;
	background:transparent;
	color:#FFF;
	padding:15px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  }  

.place2_wv {
	width:90px;
	height:66px;
	background:transparent;
	color:#FFF;
	padding:15px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  }
.place3_wv {
	width:100px;
	height:66px;
	background:transparent;
	color:#FFF;
	padding:15px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  }
.place_wd {
	width:120px;
	height:77px;
	background:transparent;
	color:#FFF;
	padding:15px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  } 
.place_wd1 {
	width:130px;
	height:77px;
	background:transparent;
	color:#FFF;
	padding:15px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  } 
.place_p {
	z-index:9999;
	width:200px;
	background:#3e5cb5;
	color:#FFF;
	border:3px solid #FFF;
	padding:5px 8px 8px 8px;
	display:block;
	position: absolute; 
	margin:0 auto;
  }   

.place_h {
	width:90px;
	height:300px;
	background:#3e5cb5;
	color:#FFF;
	border:3px solid #FFF;
	border-radius: 10px;
	padding:5px 8px;
	overflow:hidden;
	margin:0 auto;
}  
.place_clock {
	width:230px;
	height:20px;
	background:#FFF;
	color:#333;
	padding:5px;
	overflow:hidden;
	position: absolute; 
	margin:0 auto;
  }
.place_pop {
	z-index:9999;
	width:232px;
	background:#3e5cb5;
	color:#FFF;
	border:3px solid #FFF;
	padding:5px 8px 8px 8px;
	display:block;
	position: absolute; 
	margin:0 auto;

  }   
  
  .close{
    background:url(../img/close_w.png) no-repeat right center ;
    background-color: #3e5cb5;
 }
 .com_err{
     background:url(../img/com_er.png) no-repeat right center ;
	 width:24px;
	 height:52px;
	display:block;
	position: absolute; 
	margin:0 auto;
}
 .com_al{
     background:url(../img/com_al.png) no-repeat right center ;
	 width:24px;
	 height:52px;
	display:block;
	position: absolute; 
	margin:0 auto;
}

a#link{
	display:block;
	overflow:hidden;
	position:absolute;
	background:transparent;
	text-indent:-999999px;
}
#link {
left:222px;
top:3px;
width:17px;
height:17px;
}
  
  .p_point {
	position: absolute; 
	  width:10px;
	  height:10px;
	  border-radius:50%;
	  border:2px solid #FFF;
	  background:#3e5cb5;
  }  
  
  .p_point2 {
	position: absolute; 
	  width:10px;
	  height:10px;
	  border-radius:50%;
	  border:2px solid #FFF;
	  background:#01b695;
  }
  
  .p_point:hover {
	  width:8px;
	  height:8px;
	  background:#ff3333;
	  border:2px solid #000;	 
  }
  
  .p_point2:hover {
	  width:8px;
	  height:8px;
	  background:#ff3333;
	  border:2px solid #000;	 
  }
  


.p_digit{
	color:#FFF;
	font-size:15px;
	font-weight:bold;
	text-align:center;
}
.p_title {
	color:#FFF;
	font-size:12px;
	font-weight:bold;
	text-align:center;
}
.p_title2 {
	color:#FFF;
	font-size:10px;
	font-weight:bold;
	text-align:center;
}
.p_title_b {
	color:#000;
	font-size:13px;
	font-weight:bold;
	text-align:center;
}
  
 .line{
	 width:100%;
	 height:1px;
	 background:rgba(255,255,255,0.5);
	margin:3px 0;
 }
  
  .p_yellow {
	  color:#ffdd20;
	  font-size:10px;
	  font-weight:bold;
	  float:right;
  }  
  
  .p_white {
	  color:#FFF;
	  font-size:10px;
	  font-weight:bold;
	  width:100%;
  }
 .p_white2 {
	  color:#FFF;
	  font-size:10px;
	  font-weight:bold;
	  float:right;
 }
  .p_white3 {
	  color:#FFF;
	  font-size:10px;
	  font-weight:bold;
	  width:100%;
	  padding:2px;
  }  .p_yello {
	  color:#ffdd20;
	  font-size:10px;
	  font-weight:bold;
	  width:100%;
  }
    
  .p_small {
	  color:#fff;
	  font-size:9px;
	  font-weight:bold;
	  float:right;
  }
    .p_small2 {
	  color:#95e0d2;
	  font-size:9px;
	  font-weight:bold;
	  float:right;
  }

  .p_graph_bg{
	  width:100%;
	  height:15px;
	  text-align:center;
	  background:#FFF;
	  border-radius: 5px;
	  padding:1px;
	  margin:3px 0;
  }
    .p_graph{
	  height:15px;  
      background: linear-gradient(to right, #60d9c3, #ffd220 , #f92f20);
	  border-radius:5px;
  }

  .p_graph_bg2{
	  width:100%;
	  height:10px;
	  text-align:center;
	  background:#FFF;
	  border-radius: 5px;
	  padding:1px;
	  margin:3px 0 0 0;
  }
    .p_graph2{
	  height:10px;  
      background: linear-gradient(to right, #60d9c3, #ffd220 , #f92f20);
	  border-radius:5px;
  }
  
  .on_marker {
    width:17px;
    height:23px;
	background:url(../img/on_marker.png) no-repeat;
	position: absolute;
}
  .on_marker1 {
    width:17px;
    height:23px;
	background:url(../img/on_marker1.png) no-repeat;
	position: absolute;
}

/*================================================
                    표관련
  ================================================*/
     
  .p_box {
	  width:94%;
	  margin-top:10px;
	  padding:6px 8px 6px 6px;
	  text-align:center;
	  background:#FFF;
	  color:#444;
  }

  .popup_title {
	  color:#444;
	  font-size:12px;
	  font-weight:bold;
	  padding:0 0 4px 0;
  } 
  
   .popup_table {
	  background:#FFF;
	  border-collapse: collapse;
  }  
  
  .popup_table td {
	  color:#444;
	  font-size:11px;
	  font-weight:bold;
	  padding:2px;
	  border:1px solid #00b392;
  }  
  
  .popup_table th {
	  color:#3e5cb5;
	  background:#60d9c3;
	  font-size:11px;
	  font-weight:bold;
	  padding:2px;
	  border:1px solid #00b392;
  }
  
.popup_table2 {
	  background:#FFF;
	  border-collapse: collapse;
  }  
  
.popup_table2 td {
	  color:#444;
	  font-size:12px;
	  font-weight:bold;
	  padding:5px 2px;
	  border:1px solid #00b392;
  }  
  
.popup_table2 th {
	  color:#3e5cb5;
	  background:#60d9c3;
	  font-size:12px;
	  font-weight:bold;
	  padding:5px 2px;
	  border:1px solid #00b392;
  }
   
/*================================================
                    재원정보 관련
  ================================================*/
   
   .photo_table {
	  background:#FFF;
	  border-collapse: collapse;
	  margin-bottom:20px;
	  border-top:3px solid #6a8ae8;
  }  
  
  .photo_table td {
	  line-height:30px;
	  color:#444;
	  font-size:14px;
	  padding:5px 20px;
	  border:1px solid #a6b9d8;
	  text-align:left;
	  height:50px;
  }  
  
  .photo_table th {
	  color:#3e5cb5;
	  background:#e9f0f3;
	  font-size:14px;
	  font-weight:bold;
	  padding:10px 20px;
	  border:1px solid #a6b9d8;
	  text-align:center;
	  width:200px;
  }
  
.sub_title{
	width:100%;
	padding:24px 0 28px 0;
	font-size:28px;
	color:#444;
	font-weight:600;
	text-align:center;
}
.sub_tit{
	width:100%;
	padding:5px 0 5px 0;
	font-size:20px;
	color:#444;
	font-weight:600;
	text-align:center;
}
   .photo {
	   border:1px solid #60d9c3;
	   padding:7px;
	  margin-bottom:20px;
   }

   .map {
	   border:1px solid #a6b9d8;
	   padding:7px;
	  margin-bottom:30px;
   }


/********* 말풍선 ********/
/** left bottom **/
.arrow_box {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box:after, .arrow_box:before {
	right: 100%;
	top: 90%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left: 0;
	border-bottom: 0;
}

.arrow_box:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #3e5cb5;
	border-width: 10px;
	margin-top: -10px;
}
.arrow_box:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #fff;
	border-width: 13px;
	margin-top: -13px;
}

/** left top **/
.arrow_box_l {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_l:after, .arrow_box_l:before {
	right: 100%;
	top: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left: 0;
	border-bottom: 0;
}

.arrow_box_l:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #3e5cb5;
	border-width: 10px;
	margin-top: -10px;
}
.arrow_box_l:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #fff;
	border-width: 13px;
	margin-top: -11px;
}

/** left top another **/
.arrow_box_lt {
	position: relative;
	background: #01b695;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_lt:after, .arrow_box_lt:before {
	right: 100%;
	top: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left: 0;
	border-bottom: 0;
}

.arrow_box_lt:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #01b695;
	border-width: 10px;
	margin-top: -10px;
}
.arrow_box_lt:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #fff;
	border-width: 13px;
	margin-top: -11px;
}
/** left bottom another **/
.arrow_box_lb {
	position: relative;
	background: #01b695;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_lb:after, .arrow_box_lb:before {
	right: 100%;
	top: 90%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left: 0;
	border-bottom: 0;
}

.arrow_box_lb:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #01b695;
	border-width: 10px;
	margin-top: -10px;
}
.arrow_box_lb:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #fff;
	border-width: 13px;
	margin-top: -11px;
}

/** right **/
.arrow_box_r {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_r:after, .arrow_box_r:before {
	left: 100%;
	top: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right: 0;
	border-bottom: 0;
}

.arrow_box_r:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #3e5cb5;
	border-width: 10px;
	margin-top: -10px;
}

.arrow_box_r:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #fff;
	border-width: 13px;
	margin-top: -13px;
}

/*** right top another ***/
.arrow_box_rt {
	position: relative;
	background: #01b695;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_rt:after, .arrow_box_rt:before {
	left: 100%;
	top: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right: 0;
	border-bottom: 0;
}

.arrow_box_rt:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #01b695;
	border-width: 10px;
	margin-top: -10px;
}

.arrow_box_rt:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #fff;
	border-width: 13px;
	margin-top: -13px;
}

/** right bottom**/
.arrow_box_rb {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_rb:after, .arrow_box_r:before {
	left: 100%;
	top: 90%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right: 0;
	border-bottom: 0;
}

.arrow_box_rb:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #3e5cb5;
	border-width: 10px;
	margin-top: -10px;
}

.arrow_box_rb:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #fff;
	border-width: 13px;
	margin-top: -13px;
}


/** Bottom **/
.arrow_box_b {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_b:after, .arrow_box_b:before {
	left: 30%;
	top: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right: 0;
	border-bottom: 0;
}

.arrow_box_b:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: #3e5cb5;
	border-width: 10px;
	margin-left: -10px;
}

.arrow_box_b:before {
	border-color: rgba(194, 225, 245, 0);
	border-top-color: #fff;
	border-width: 13px;
	margin-left: -13px;
}
/** Bottom Left**/
.arrow_box_bl {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_bl:after, .arrow_box_bl:before {
	left: 20%;
	top: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right: 0;
	border-bottom: 0;
}

.arrow_box_bl:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: #3e5cb5;
	border-width: 10px;
	margin-left: -10px;
}

.arrow_box_bl:before {
	border-color: rgba(194, 225, 245, 0);
	border-top-color: #fff;
	border-width: 13px;
	margin-left: -13px;
}

/** Top Left **/
.arrow_box_t {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_t:after, .arrow_box_t:before {
	left: 30%;
	bottom: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-top: 0;
	border-left: 0;
}

.arrow_box_t:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #3e5cb5;
	border-width: 10px;
	margin-left: -10px;
}

.arrow_box_t:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #fff;
	border-width: 13px;
	margin-left: -13px;
}
/** Top Right **/
.arrow_box_tt {
	position: relative;
	background: #3e5cb5;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_tt:after, .arrow_box_tt:before {
	left: 80%;
	bottom: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-top: 0;
	border-right: 0;
}

.arrow_box_tt:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #3e5cb5;
	border-width: 10px;
	margin-left: -10px;
}

.arrow_box_tt:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #fff;
	border-width: 13px;
	margin-left: -13px;
}

/** Top Right Another **/
.arrow_box_tr {
	position: relative;
	background: #01b695;
	border: 2px solid #fff;
	border-radius: .4em;
	padding:3px;
}
.arrow_box_tr:after, .arrow_box_tr:before {
	left: 80%;
	bottom: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-top: 0;
	border-right: 0;
}

.arrow_box_tr:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #01b695;
	border-width: 10px;
	margin-left: -10px;
}

.arrow_box_tr:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #fff;
	border-width: 13px;
	margin-left: -13px;
}


/**** Pump Top Left ****/
.pump_box {
	position: relative;
	background: #3e5cb5;
	border: 3px solid #fff;
 	border-radius: 10px;
	padding:5px 8px;
}
.pump_box:after, .pump_box:before {
	bottom: 100%;
	left: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.pump_box:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #3e5cb5;
	border-width: 10px;
	margin-left: -10px;
}
.pump_box:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #fff;
	border-width: 14px;
	margin-left: -14px;
}
/** On **/
.on {
	position: relative;
	background: #ff6600;
	border: 3px solid #fff;
 	border-radius: 10px;
	padding:5px 8px;
}
.on:after, .on:before {
	bottom: 100%;
	left: 20%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.on:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #ff6600;
	border-width: 10px;
	margin-left: -10px;
}
.on:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #fff;
	border-width: 14px;
	margin-left: -14px;
}

/**** Pump Top Right ****/
.pump_box_r {
	position: relative;
	background: #3e5cb5;
	border: 3px solid #fff;
 	border-radius: 10px;
	padding:5px 8px;
}
.pump_box_r:after, .pump_box_r:before {
	bottom: 100%;
	left: 80%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.pump_box_r:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #3e5cb5;
	border-width: 10px;
	margin-left: -10px;
}
.pump_box_r:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #fff;
	border-width: 14px;
	margin-left: -14px;
}

.on_r {
	position: relative;
	background: #ff6600;
	border: 3px solid #fff;
 	border-radius: 10px;
	padding:5px 8px;
}
.on_r:after, .on_r:before {
	bottom: 100%;
	left: 80%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.on_r:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #ff6600;
	border-width: 10px;
	margin-left: -10px;
}
.on_r:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #fff;
	border-width: 14px;
	margin-left: -14px;
}

/** Pump Bottom Left **/
.pump_box_bl {
	position: relative;
	background: #3e5cb5;
	border: 3px solid #fff;
 	border-radius: 10px;
	padding:5px 8px;
}
.pump_box_bl:after, .pump_box_bl:before {
	left: 20%;
	top: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.pump_box_bl:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: #3e5cb5;
	border-width: 10px;
	margin-left: -10px;
}

.pump_box_bl:before {
	border-color: rgba(194, 225, 245, 0);
	border-top-color: #fff;
	border-width: 14px;
	margin-left: -14px;
}

.on_bl {
	position: relative;
	background: #ff6600;
	border: 3px solid #fff;
 	border-radius: 10px;
	padding:5px 8px;
}
.on_bl:after, .on_bl:before {
	left: 20%;
	top: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.on_bl:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: #ff6600;
	border-width: 10px;
	margin-left: -10px;
}

.on_bl:before {
	border-color: rgba(194, 225, 245, 0);
	border-top-color: #fff;
	border-width: 14px;
	margin-left: -14px;
}

