.dashboard-pic {
    position: relative;
    border-radius: 15px;
    margin-bottom: 50px;
    padding-top: 9px;
    padding-left: 15px;
    min-height: 127px;
    background: url("../images/mice-dashboard/banner-name/bg-head.jpg") left top no-repeat;
}

.dashboard-pic .d-breadcrumb {
    position: absolute;
    top: 15px;
    width: 100%;
    font: 20px / 20px THSarabunNewRegular, Arial, sans-serif;
    color: rgb(0, 0, 0);
    text-align: left;
}

.dashboard-pic .d-breadcrumb a {
    color: rgb(0, 0, 0);
}

.dashboard-pic .d-breadcrumb span {
    padding-right: 19px;
    background: url("../images/mice-dashboard/o-arrow.png") 98% 50% no-repeat;
}

.dashboard-pic .d-breadcrumb span:last-child {
    background: none;
}

.sub-dashboard {
    background: url("../images/mice-dashboard/sub-d.png") center top no-repeat rgb(247, 247, 248);
    padding-bottom: 50px;
}

.mice-dashboard {
    background: rgb(247, 247, 248);
    margin-top: 0px;
    padding-top: 50px;
}

.mice-dashboard .tab-left {
    padding-bottom: 200px;
    background: #2f4692;
    border-radius: 10px;
}

.mice-dashboard .tab-left ul {
    padding: 60px 0px 15px;
}

.mice-dashboard .tab-left ul li {
    /* border-bottom: 1px solid rgb(44, 44, 163); */
    font: 17px / 24px lineseed, Arial, sans-serif;
    list-style: none;
    padding: 21px 10px 21px 55px;
    background: url("../images/mice-dashboard/gray-bullet.png") 30px 50% no-repeat;
}

.mice-dashboard .tab-left ul li:last-child {
}

.mice-dashboard .tab-left ul li a {
    color: rgb(255, 255, 255);
}

.mice-dashboard .tab-left ul li.select {
    position: relative;
    background: url("../images/mice-dashboard/blue-bullet.png") 15px 50% no-repeat rgb(246, 246, 247);
    border-bottom: none;
    margin-left: 15px;
    padding-left: 40px;
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
}

.mice-dashboard .tab-left ul li .c-t {
    position: absolute;
    top: -31px;
    right: 0px;
    width: 31px;
    height: 31px;
    background: url("../images/mice-dashboard/c-t.png") no-repeat;
    display: none;
}
/**********************************************/
.mice-dashboard .box-right{

	
	}	
.mice-dashboard .box-right .banner-name{
	min-height: 89px;
	padding:15px;
	padding-top: 31px;
	margin-bottom:30px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	font: 22px/24px 'lineseed', Arial, sans-serif;
	color:#333333;
	font-weight: bold;
}
.mice-dashboard .box-right  .di-bg1{
	background: #b0e8ff url(../images/mice-dashboard/banner-name/bg-1.jpg) bottom left no-repeat;
	background-size: 100%;
	/* background: #ffdaf8; */
}
.mice-dashboard .box-right  .di-bg2{
	background: url(../images/mice-dashboard/banner-name/bg-2.jpg) top left no-repeat;
		background-size: 100%;
}
.mice-dashboard .box-right  .di-bg3{
	background: url(../images/mice-dashboard/banner-name/bg-3.jpg) top left no-repeat;
		background-size: 100%;
}
.mice-dashboard .box-right  .di-bg4{
	background: url(../images/mice-dashboard/banner-name/bg-4.jpg) top left no-repeat;
		background-size: 100%;
}
.mice-dashboard .box-right  .di-bg5{
	background: url(../images/mice-dashboard/banner-name/bg-5.jpg) top left no-repeat;
		background-size: 100%;
}
.mice-dashboard .box-right  .di-bg6{
	background: url(../images/mice-dashboard/banner-name/bg-6.jpg) top left no-repeat;
		background-size: 100%;
}
.mice-dashboard .box-right  .di-bg7{
	background: url(../images/mice-dashboard/banner-name/bg-7.jpg) top left no-repeat;
		background-size: 100%;
}
.mice-dashboard .box-right  .di-bg8{
	background: url(../images/mice-dashboard/banner-name/8.jpg) top left no-repeat;
	background-size: 100%;
}
.mice-dashboard .box-right .banner-name img{
	max-width:100%;
	height:auto;
}



.mice-dashboard .box-right .top{

margin-bottom: 25px;
}		
.mice-dashboard .box-right .top .bar{
	background: #a8deff;
	padding:10px;
	font: 20px/24px 'lineseed', Arial, sans-serif;
	width:max-content;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border-radius: 25px;
	box-shadow: inset 0 0 10px #0003;
	}		
.mice-dashboard .box-right .top .bar a{
	color: #000;
}
.mice-dashboard .box-right .top .bar .select{
	padding:10px 35px;
	background:#fff;
	
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	
	font-weight:bold;

	}	
.mice-dashboard .box-right .top .bar .select a{
	color: #0c5494;
	}	
		
.mice-dashboard .box-right .top .bar .normal{
	padding:10px 35px;
	}		
/******************************************/
.mice-dashboard .tab-left ul li .c-b {
    position: absolute;
    bottom: -31px;
    right: 0px;
    width: 31px;
    height: 31px;
    background: url("../images/mice-dashboard/c-b.png") no-repeat;
    display: none;
}

.mice-dashboard .tab-left ul li.select .c-t {
    display: block;
}

.mice-dashboard .tab-left ul li.select .c-b {
    display: block;
}

.mice-dashboard .tab-left ul li.select a {
    color: rgb(0, 0, 0);
}

.mice-dashboard .box-right {
}

.mice-dashboard .box-right .mid {margin-bottom: 30px;}
.mice-dashboard .box-right .mid .g-map{
	padding: 0px;
	padding-top: 0;
	padding-bottom:30px;
	background:#fff;
	border:#bbbbbb 1px solid;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
	margin-bottom: 3rem;
}
.mice-dashboard .box-right .mid .g-map .g-tab{margin: 0;padding: 0px 25px 0 25px;background: #252587;-webkit-border-top-left-radius: 18px;-webkit-border-top-right-radius: 18px;-moz-border-radius-topleft: 18px;-moz-border-radius-topright: 18px;border-top-left-radius: 18px;border-top-right-radius: 18px;font: 20px/22px 'lineseed', Arial, sans-serif;/* font-weight: bold; */color: #fff;}
.mice-dashboard .box-right .mid .g-map .g-tab .menu {
    padding: 20px 0px;
    font: 20px/22px 'lineseed', Arial, sans-serif;
    /* font-weight: bold; */
    color: #fff;
}
.mice-dashboard .box-right .filter{
	/* border-bottom:#3B85C6 1px solid; */
	margin-left: 9px;
	margin-bottom: 0;
	/* margin-top: 10px; */
	margin-right: 9px;
	}
.mice-dashboard .box-right .mid .g-map .choice{
	margin-left:15px;
	/* margin-top: 29px; */
}
.mice-dashboard .box-right .mid .g-map .choice .choice-block{
	width:max-content;
}
.mice-dashboard .box-right .mid .g-map .choice .icon{
	margin-right: 5px;
}
.mice-dashboard .box-right .mid .g-map .choice .icon img{
	max-width: 83%;
	height:auto;
}
.mice-dashboard .box-right .mid .g-map .choice .text{
	margin-right:20px;
	font: 17px/28px 'lineseed', Arial, sans-serif;
	padding-top: 10px;
}



.mice-dashboard .box-right .mid .g-map .map-box{
	padding:15px;


	
	}
/************************************************/
.mice-dashboard .box-right .mid .d-total {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px;
    padding: 0px;
    background: rgb(255, 255, 255);
    border-radius: 18px;
    margin-bottom: 3rem;
}

.mice-dashboard .box-right .mid .d-tab{
	margin: 0;
	padding: 10px 25px 0 25px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#243edd+0,02c6a6+100 */
	background: #465ea8; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	-moz-border-radius-topleft: 15px;
	-moz-border-radius-topright: 15px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}
.mice-dashboard .box-right .mid .d-tab .menu{
	padding-top: 16px;
}

.mice-dashboard .box-right .mid .d-tab .menu .normal{
	margin-right: 8px;
	padding: 12px 35px;
	font: 18px/23px 'lineseed', Arial, sans-serif;
	/* font-weight:bold; */
	color:#fff;
	background: #152e7f;
	-webkit-border-top-left-radius: 9px;
	-webkit-border-top-right-radius: 9px;
	-moz-border-radius-topleft: 9px;
	-moz-border-radius-topright: 9px;
	border-top-left-radius: 9px;
	border-top-right-radius: 9px;
}

.mice-dashboard .box-right .mid .d-tab .menu .normal a{
	color:#fff;
	
}

.mice-dashboard .box-right .mid .d-tab .menu .select{
	background:#fff;
	color:#4ebcb7;
	font: 22px/23px 'lineseed', Arial, sans-serif;
}

.mice-dashboard .box-right .mid .d-tab .menu .select a{
	color: #023b70;
}

.mice-dashboard .box-right .mid .d-total .total-graph{
	margin-bottom: 1rem;
	padding:15px;
}

.mice-dashboard .box-right .mid .d-total .total-graph .t-title{
	font: 20px/24px 'lineseed', Arial, sans-serif;
	color: #000;
	text-align: center;
	margin-top: 30px;
	}

.mice-dashboard .box-right .mid .d-total .total-graph .t-box{
	padding:15px;
}

.mice-dashboard .box-right .mid .gg-box {
}

.mice-dashboard .box-right .mid .gg-box .color-box {
    margin-bottom: 15px;
    padding: 15px 15px 15px 15px;
    background: rgb(255, 255, 255);
    border-radius: 25px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.mice-dashboard .box-right .mid .gg-box .color-box .c-top {
    font: 17px / 22px lineseed, Arial, sans-serif;
    text-align: left;
    color: rgb(20 20 20);
    padding-bottom: 10px;
}

.mice-dashboard .box-right .mid .gg-box .color-box .c-num {
    padding: 0;
    font: 25px / 35px lineseed, Arial, sans-serif;
    /* font: 38px / 35px lineseed, Arial, sans-serif; */
    color: rgb(108 93 93);
    text-align: left;
    background: linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 100%);
    border-radius: 10px;
}
.mice-dashboard .box-right .mid .gg-box .color-box .c-top2 {
    font: 17px / 22px lineseed, Arial, sans-serif;
    text-align: left;
    color: rgb(20 20 20);
    padding-bottom: 10px;
    height: 90px;
}
.mice-dashboard .box-right .mid .gg-box .color-box .c-top2 .c-top3 {
    font: 18px / 22px lineseed, Arial, sans-serif;
    text-align: left;
    color: rgb(20 20 20);
    padding-bottom: 10px;
    /* height: 42px; */
}
.mice-dashboard .box-right .mid .gg-box .color-box .c-num2 {
    padding: 0;
    font: 27px / 35px lineseed, Arial, sans-serif;
    color: rgb(108 93 93);
    text-align: left;
    background: linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 100%);
    border-radius: 10px;
}
.mice-dashboard .box-right .mid .gg-box .color-box .c-more {
    padding: 0;
    font: 14px / 42px lineseed, Arial, sans-serif;
    color: rgb(108 93 93);
    text-align: left;
    background: linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 100%);
    border-radius: 10px;
}
.mice-dashboard .box-right .mid .gg-box .color-box .c-map {
    padding: 0;
    font: 38px / 35px lineseed, Arial, sans-serif;
    color: rgb(108 93 93);
    text-align: left;
    background: linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 100%);
    border-radius: 10px;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-1{
    color: #3698fc;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-2{
    color: #ff478b;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-3{
    color: #dba500;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-4{
    color: #c16115;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-5{
    color: #d6694d;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-6{
    color: #01998c;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-7{
    color: #40bc60;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-8{
    color: #e8245c;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-9{
    color: #7a558a;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-10{
    color: #577286;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-11{
    color: #4086bc;
}.mice-dashboard .box-right .mid .gg-box .color-box .ct-12{
    color: #f7524b;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-13{
    color: #259e00;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-14{
    color: #3698fc;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-15{
    color: #9c8000;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-16{
    color: #c57940;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-17{
    color: #e640db;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-18{
    color: #3c3acb;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-19{
    color: #c24244;
}
.mice-dashboard .box-right .mid .gg-box .color-box .ct-20{
    color: #004884;
}
.mice-dashboard .box-right .mid .gg-box .color-box .c-icon{
    text-align: end;
    width: 100%;
    height: 68px;
}
.mice-dashboard .box-right .mid .gg-box .color-box .c-num span {
    padding: 0px 5px;
    font: 22px / 22px lineseed, Arial, sans-serif;
}

.mice-dashboard .box-right .mid .gg-box .cc-1 {
    /* background: linear-gradient(rgb(97, 145, 227) 0%, rgb(42, 100, 198) 100%); */
}

.mice-dashboard .box-right .mid .gg-box .cc-2 {
    background: linear-gradient(rgb(245, 184, 85) 0%, rgb(224, 152, 35) 100%);
}

.mice-dashboard .box-right .mid .gg-box .cc-3 {
    background: linear-gradient(rgb(73, 195, 175) 0%, rgb(32, 168, 146) 100%);
}

.mice-dashboard .box-right .mid .gg-box .cc-4 {
    background: linear-gradient(rgb(241, 123, 94) 0%, rgb(219, 87, 56) 100%);
}

.mice-dashboard .box-right .mid .gg-box .cc-5 {
    background: rgb(247, 131, 221);
}

.mice-dashboard .box-right .mid .gg-box2 {
}

.mice-dashboard .box-right .mid .gg-box2 .color-box {
    margin-bottom: 15px;
    padding: 15px 15px 15px 15px;
    background: rgb(255, 255, 255);
    border-radius: 25px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.mice-dashboard .box-right .mid .gg-box2 .bg-in{
	border-radius: 25px;
	padding-bottom: 59px;
}

.mice-dashboard .box-right .mid .gg-box2 .color-box .c-top {
    font: 20px / 26px lineseed, Arial, sans-serif;
    text-align: left;
    color: rgb(20 20 20);
    padding-bottom: 10px;
    font-weight: bold;
}

.mice-dashboard .box-right .mid .gg-box2 .color-box .c-num {
    padding: 0;
    font: 38px / 35px lineseed, Arial, sans-serif;
    text-align: left;
    /* background: linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 100%); */
    border-radius: 10px;
}
.mice-dashboard .box-right .mid .gg-box2 .color-box .t-green{
	color:#1d9590;	
}
.mice-dashboard .box-right .mid .gg-box2 .color-box .t-blue{
	color:#24317e;	
}
.mice-dashboard .box-right .mid .gg-box2 .color-box .t-pink{
	color:#ec3c6e;	
}
.mice-dashboard .box-right .mid .gg-box2 .color-box .t-lightblue{
	color:#0189d4;	
}
.mice-dashboard .box-right .mid .gg-box2 .color-box .t-lightpink{
	color:#ee39cd;	
}
.mice-dashboard .box-right .mid .gg-box2 .color-box .t-red{
	color:#fe495d;	
}
.mice-dashboard .box-right .mid .gg-box2 .color-box .t-green{
	color:#88b24b;	
}




.mice-dashboard .box-right .main-1 {
    padding: 20px;
    background: rgb(255, 255, 255);
    border: 1px solid rgb(187, 187, 187);
    border-radius: 25px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    overflow: hidden;
    margin-bottom: 2rem;
}

.mice-dashboard .box-right .main-1 .topic {
    margin-bottom: 20px;
    font: 20px / 24px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
}

.mice-dashboard .box-right .main-1 .topic2 {
    margin-bottom: 20px;
    font: 20px / 24px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
    text-align: center;
}

.mice-dashboard .box-right .main-1 .mid {
}
.mice-dashboard .box-right .main-4 {
    padding: 10px;
    /* background: rgb(255, 255, 255); */
    /* border: 1px solid rgb(187, 187, 187); */
    border-radius: 25px;
    /* box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; */
    overflow: hidden;
}

.mice-dashboard .box-right .main-4 .topic {
    margin-bottom: 20px;
    font: 23px / 25px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
}

.mice-dashboard .box-right .main-4 .topic2 {
    margin-bottom: 20px;
    font: 20px / 24px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
    text-align: center;
}

.mice-dashboard .box-right .main-4 .mid {
}
.mice-dashboard .box-right .main-2 {
    padding: 20px;
    background: rgb(255, 255, 255);
    border: 1px solid rgb(187, 187, 187);
    border-radius: 25px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    overflow: hidden;
}

.mice-dashboard .box-right .main-2 .topic {
    margin: 20px 0px;
    font: 20px / 24px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
}

.mice-dashboard .box-right .main-2 .mid {
}

.mice-dashboard .box-right .main-3 {
    padding: 20px;
    background: rgb(255, 255, 255);
    /* border: 1px solid rgb(187, 187, 187); */
    border-radius: 25px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    overflow: hidden;
    margin-bottom: 2rem;
}

.mice-dashboard .box-right .main-3 .topic {
    margin-bottom: 20px;
    font: 20px / 24px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
}

.mice-dashboard .box-right .main-3 .topic2 {
    margin-bottom: 20px;
    font: 20px / 24px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
    text-align: center;
}

.mice-dashboard .box-right .main-3 .mid {
}

.mice-dashboard select {
    background-image: url("../images/mice-dashboard/o-arrow-down.png");
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    background-size: auto;
    padding-right: 2.5rem;
    padding-left: 22px;
}

.mice-dashboard .r-form {
    width: 100%;
    margin-bottom: 20px;
}

.mice-dashboard .r-form input[type="text"], select {
    width: 100%;
    padding: 13px 4px 13px 9px;
    margin: 3px 0px 0px;
    display: inline-block;
    border: 1px solid rgb(185, 185, 185);
    border-radius: 8px;
    box-sizing: border-box;
    appearance: none;
    font: 17px / 22px lineseed, Arial, sans-serif;
}

.mice-dashboard .r-form .topic {
    position: relative;
    color: rgb(132, 132, 132);
    top: 13px;
    padding: 0px 10px;
    width: max-content;
    left: 14px;
    background: rgb(255 255 255);
    font: 13px / 20px lineseed, Arial, sans-serif;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.dashmap-set{
	width:100%;
	height:auto;
	padding:17px;
	}
.dashmap-list1{
	width:100%;
	height:auto;
	background:#ececec;
	padding:15px 0;
	-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
	}
.dashmap-list1 .select{
	width:100%;
	/* height:38px; */
	font-family:'lineseed';
	font-size:18px;
	line-height: 36px;
	text-align:left;
	color:#0036b1;
	/* background:url(../images/mice-dashboard/map/se1.png) 13% 50% no-repeat; */
	/* padding-left: 80px; */
	}
.dashmap-list1 .normal{
	width:100%;
	/* height:38px; */
	font-family:'lineseed';
	font-size:18px;
	line-height: 36px;
	text-align:left;
	color:#000;
	/* background:url(../images/mice-dashboard/map/no1.png) 13% 50% no-repeat; */
	/* padding-left: 80px; */
	}
 .box-list {
	display: flex;	
}

.dashmap .box-list .pic {
	width: 55px;

}
.dashmap-pic-block{
	width:100%;
	height:auto;
	}
.dashmap-pic{
	width:100%;
	height:auto;
	text-align:center;
	}
.dashmap-pic img{
	max-width:100%;
	}




.mice-dashboard .box-right .mid .box-graph{

	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border: #bbbbbb 1px solid;
	border-radius: 25px;
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
	overflow:hidden;
	}		
.mice-dashboard .box-right .mid .box-graph .g-title{
	padding-bottom: 25px;
	font: 20px/22px 'lineseed', Arial, sans-serif;
	color: #fff;
	/* font-weight:bold; */
	padding: 15px;
	-webkit-border-top-left-radius: 18px;
	-webkit-border-top-right-radius: 18px;
	-moz-border-radius-topleft: 18px;
	-moz-border-radius-topright: 18px;
	border-top-left-radius: 18px;
	border-top-right-radius: 18px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#6392e3+0,2c66c8+100 */
	background: #c10091;
	/* background: linear-gradient(to bottom,  #6392e3 0%,#2c66c8 100%); */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}
	

.mice-dashboard .box-right .mid .box-graph .g-top{
	
	
}
	
.mice-dashboard .box-right .mid .box-graph .title{
	font: 20px/24px 'lineseed', Arial, sans-serif;
	color:#000;
	text-align: center;
	padding-bottom: 10px;
	}
.mice-dashboard .box-right .mid .box-graph .title span{
	padding: 0px 10px;
}
	
.mice-dashboard .box-right .mid .box-graph .g-mid{
	position:relative;
	margin-top:15px;
	
	
}
.mice-dashboard .box-right .mid .box-graph .g-mid img{
	max-width:100%;
}
.mice-dashboard .box-right .mid .g-map{

	background:#fff;
	border:#bbbbbb 1px solid;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
	box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
	margin-bottom: 3rem;
}

.mice-dashboard .box-right .mid .g-map .choice{
	margin-left:15px;
	margin-top: 21px;
}
.mice-dashboard .box-right .mid .g-map .choice .choice-block{
	width:max-content;
}
.mice-dashboard .box-right .mid .g-map .choice .icon{
	margin-right: 0;
}
.mice-dashboard .box-right .mid .g-map .choice .icon img{
	max-width: 83%;
	height:auto;
}
.mice-dashboard .box-right .mid .g-map .choice .text{
	margin-right: 0;
	font: 15px/28px 'lineseed', Arial, sans-serif;
	padding-top: 10px;
}



.mice-dashboard .box-right .mid .g-map .map-box{
	padding:15px;


	
	}

.mice-dashboard .box-right .mid .d-graph{
	padding:15px 0;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px;
	padding: 0;
	background:#fff;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
	border: #bbbbbb 1px solid;
	margin-bottom: 3rem;
	}
	
.mice-dashboard .box-right .mid .d-graph .g-title{
	padding-bottom: 25px;
	font: 20px/22px 'lineseed', Arial, sans-serif;
	color: #fff;
	/* font-weight:bold; */
	padding: 15px;
	-webkit-border-top-left-radius: 18px;
	-webkit-border-top-right-radius: 18px;
	-moz-border-radius-topleft: 18px;
	-moz-border-radius-topright: 18px;
	border-top-left-radius: 18px;
	border-top-right-radius: 18px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#6392e3+0,2c66c8+100 */
	background: linear-gradient(to bottom,  #6392e3 0%,#2c66c8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}
	
.mice-dashboard .box-right .mid .d-graph .g-title-2{
	padding-bottom: 25px;
	font: 20px/22px 'lineseed', Arial, sans-serif;
	color: #fff;
	/* font-weight:bold; */
	padding: 15px;
	-webkit-border-top-left-radius: 18px;
	-webkit-border-top-right-radius: 18px;
	-moz-border-radius-topleft: 18px;
	-moz-border-radius-topright: 18px;
	border-top-left-radius: 18px;
	border-top-right-radius: 18px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#47c2ad+1,22aa94+100 */
background: linear-gradient(to bottom,  #47c2ad 1%,#22aa94 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	}
	
	.mice-dashboard .box-right .mid .d-graph .g-title-3{
	padding-bottom: 25px;
	font: 20px/22px 'lineseed', Arial, sans-serif;
	color: #fff;
	/* font-weight:bold; */
	padding: 15px;
	-webkit-border-top-left-radius: 18px;
	-webkit-border-top-right-radius: 18px;
	-moz-border-radius-topleft: 18px;
	-moz-border-radius-topright: 18px;
	border-top-left-radius: 18px;
	border-top-right-radius: 18px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f17a5e+1,dc5939+100 */
background: linear-gradient(to bottom,  #f17a5e 1%,#dc5939 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	}
	
		
.mice-dashboard .box-right .mid .d-graph .g-box{
	
padding: 15px;
}
	
.mice-dashboard .box-right .mid .d-graph .g-box .color-box{
	margin-bottom:15px;
	padding:20px;
	
	-webkit-border-radius: 13px;
	-moz-border-radius: 13px;
	border-radius: 13px;
	
	background:#ddd;
	
}

.mice-dashboard .box-right .mid .d-graph .g-box .color-box .c-top{
	font: 24px/22px 'lineseed', Arial, sans-serif;
	text-align:center;
	color:#fff;
	padding-bottom:10px;
}

.mice-dashboard .box-right .mid .d-graph .g-box .color-box .c-num{
	padding:20px;
	font: 38px/35px 'lineseed', Arial, sans-serif;
	color:#fff;
	text-align:center;
	background: rgb(255,255,255);
	background: linear-gradient(180deg, rgba(255,255,255,0.35057773109243695) 0%, rgba(255,255,255,0) 100%);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.mice-dashboard .box-right .mid .d-graph .g-box .color-box .c-num span{
	padding: 0 5px;
	font: 22px/22px 'lineseed', Arial, sans-serif;
}
		
.mice-dashboard .box-right .mid .d-graph .g-box .cc-1{
	background:#07a61a;
}

.mice-dashboard .box-right .mid .d-graph .g-box .cc-2{
	background:#008ffb;
}

.mice-dashboard .box-right .mid .d-graph .g-box .cc-3{
	background:#ff8800;
}
.mice-dashboard .box-right .mid .d-graph .g-box .cc-4{
	background:#775dd0;
}

.mice-dashboard .box-right .mid .d-graph .g-box .cc-5{
	background:#f783dd;
}	
.dashboard-pic img {
    max-width: 100%;
    height: auto;
}






.mice-dashboard .stat-all {
}

.mice-dashboard .stat-all .s-box {
    padding: 15px;
    border-bottom: 1px solid rgb(221, 221, 221);
}

.mice-dashboard .stat-all .s-box .pic {
}

.mice-dashboard .stat-all .s-box .text {
    margin-left: 10px;
    margin-right: 80px;
    padding-top: 15px;
    font: bold 18px / 20px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
    width: 128px;
}

.mice-dashboard .stat-all .s-box .num {
    padding-top: 2px;
    font: bold 33px / 33px lineseed, Arial, sans-serif;
    color: rgb(81, 81, 81);
}

.mice-dashboard .stat-all .s-box .cho {
    font: bold 17px / 20px lineseed, Arial, sans-serif;
    color: rgb(11, 152, 226);
    padding-top: 5px;
}

.mice-dashboard .stat-all .s-box:last-child {
    border-bottom: none;
}

.mice-dashboard .fac-all {
}

.mice-dashboard .fac-all .f-box {
    padding: 15px;
    border-radius: 20px;
}

.mice-dashboard .fac-all .f-box .pic {
}

.mice-dashboard .fac-all .f-box .text {
    font: bold 18px / 20px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
    padding-bottom: 2px;
    overflow-wrap: break-word;
}

.mice-dashboard .fac-all .f-box .num {
    padding-top: 26px;
    font: bold 38px / 38px lineseed, Arial, sans-serif;
    color: rgb(89, 89, 89);
}

.mice-dashboard .fac-all .ccc-1 {
    background: rgb(251, 241, 241);
}

.mice-dashboard .fac-all .ccc-2 {
    background: rgb(249, 233, 251);
}

.mice-dashboard .fac-all .ccc-3 {
    background: rgb(241, 246, 253);
}

.mice-dashboard .fac-all .ccc-4 {
    background: rgb(235, 246, 227);
}

.mice-dashboard .fac-all .ccc-5 {
    background: rgb(251, 250, 243);
}

.mice-dashboard .alpha {
    background: rgba(0, 0, 0, 0.51);
    padding-top: 50px;
    margin-left: -20px;
    margin-right: -20px;
    margin-bottom: -36px;
    padding-bottom: 37px;
}

.mice-dashboard .alpha .d-alert {
    padding-bottom: 15px;
    text-align: center;
}

.mice-dashboard .alpha .d-text {
    padding-bottom: 25px;
    font: 20px / 30px lineseed, Arial, sans-serif;
    color: rgb(255, 255, 255);
    text-align: center;
}

.mice-dashboard .alpha .d-btn {
    width: max-content;
    padding: 3px 25px;
    background: rgb(255, 255, 255);
    border-radius: 15px;
    font: 20px / 20px lineseed, Arial, sans-serif;
    color: rgb(0, 0, 0);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

.mice-dashboard .alpha .d-link {
    padding-right: 20px;
    width: max-content;
    font: 20px / 20px lineseed, Arial, sans-serif;
    color: rgb(255, 255, 255);
}

.mice-dashboard .human {
}

.mice-dashboard .human .pic {
    padding-top: 20px;
    text-align: center;
}

.mice-dashboard .human .pic img {
    max-width: 100%;
    height: auto;
}

.mice-dashboard .human .text {
    margin-top: 30px;
    padding-bottom: 15px;
    text-align: center;
    font: bold 39px / 39px lineseed, Arial, sans-serif;
    color: rgb(59, 133, 198);
}

@media (min-width: 1441px) and (max-width: 1600px) {
}

@media (min-width: 1367px) and (max-width: 1440px) {
    .mice-dashboard .stat-all .s-box .text {
        margin-left: 5px;
        margin-right: 10px;
        padding-top: 15px;
        font: bold 16px / 20px lineseed, Arial, sans-serif;
        color: rgb(0, 0, 0);
        width: 120px;
    }

    .mice-dashboard .stat-all .s-box .num {
        padding-top: 9px;
        font: bold 25px / 25px lineseed, Arial, sans-serif;
        color: rgb(81, 81, 81);
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-top {
        font: 18px / 22px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-num {
        font: 33px / 35px lineseed, Arial, sans-serif;
    }
}

@media (min-width: 1281px) and (max-width: 1366px) {
    .mice-dashboard .stat-all .s-box .text {
        margin-left: 5px;
        margin-right: 10px;
        padding-top: 15px;
        font: bold 16px / 20px lineseed, Arial, sans-serif;
        color: rgb(0, 0, 0);
        width: 120px;
    }

    .mice-dashboard .stat-all .s-box .num {
        padding-top: 9px;
        font: bold 25px / 25px lineseed, Arial, sans-serif;
        color: rgb(81, 81, 81);
    }

    .mice-dashboard .fac-all .f-box .text {
        font: bold 15px / 18px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-top {
        font: 18px / 22px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-num {
        font: 33px / 35px lineseed, Arial, sans-serif;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .mice-dashboard .box-right .banner-name {
        background-size: 168%;
    }

    .mice-dashboard .stat-all .s-box .text {
        margin-left: 5px;
        margin-right: 10px;
        padding-top: 15px;
        font: bold 16px / 20px lineseed, Arial, sans-serif;
        color: rgb(0, 0, 0);
        width: 82px;
    }

    .mice-dashboard .stat-all .s-box .num {
        padding-top: 9px;
        font: bold 25px / 25px lineseed, Arial, sans-serif;
        color: rgb(81, 81, 81);
    }

    .mice-dashboard .fac-all .f-box .text {
        font: bold 15px / 18px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .fac-all .f-box .num {
        font: bold 25px / 38px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .r-form input[type="text"], select {
        width: auto;
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-top {
        font: 18px / 22px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-num {
        font: 33px / 35px lineseed, Arial, sans-serif;
    }
}

@media (min-width: 320px) and (max-width: 767px) {
    .dashboard-pic {
        padding-top: 15px;
        padding-left: 15px;
        min-height: 115px;
        margin-bottom: 0px;
    }

    .dashboard-pic img {
        max-width: 95%;
        height: auto;
    }

    .mice-dashboard .tab-left {
        background: none;
        padding-bottom: 0px;
    }

    .mice-dashboard .box-right .banner-name {
        background: none;
        padding: 0px;
        min-height: auto;
        font: bold 20px / 26px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .box-right .mid .list table {
        width: 800px;
        font: 15px / 20px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .box-right .top .bar .select {
        padding: 10px 15px;
    }

    .mice-dashboard .box-right .top .bar .normal {
        padding: 10px 15px;
    }

    .mice-dashboard .r-form {
        width: 100%;
    }

    .mice-dashboard .r-form input[type="text"], select {
        width: 100%;
    }

    .mice-dashboard .tab-left ul {
        display: flex;
        padding: 15px;
    }

    .mice-dashboard .tab-left ul li {
        width: max-content;
        display: block;
        padding: 10px 15px;
        border: none;
        background: none;
    }

    .mice-dashboard .tab-left ul li.select .c-t {
        display: none;
    }

    .mice-dashboard .tab-left ul li.select .c-b {
        display: none;
    }

    .mice-dashboard .tab-left ul li.select {
        position: relative;
        border-bottom: none;
        padding: 10px 15px;
        margin-left: 0px;
        background: rgb(246, 246, 247);
        border-radius: 50px;
    }

    .mice-dashboard .tab-left ul li a {
        color: rgb(255, 255, 255);
        display: block;
        width: max-content;
    }

    .mice-dashboard .box-right .top .bar {
        font: 17px / 24px lineseed, Arial, sans-serif;
        width: 100%;
    }

    .mice-dashboard .stat-all .s-box .text {
        margin-left: 5px;
        margin-right: 10px;
        padding-top: 15px;
        width: 103px;
        font: bold 15px / 20px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .stat-all .s-box {
        padding: 5px;
    }

    .mice-dashboard .stat-all .s-box .num {
        padding-top: 9px;
        font: bold 23px / 27px lineseed, Arial, sans-serif;
    }

    .sub-dashboard .d-profile {
        padding-top: 15px;
    }

    .sub-dashboard .d-profile .pic {
        width: 35px;
        height: 35px;
        margin: 0px auto;
    }

    .sub-dashboard .d-profile .p-name {
        padding-top: 7px;
        font: 19px / 18px THSarabunNewRegular, Arial, sans-serif;
        color: rgb(0, 0, 0);
        width: auto;
        padding-right: 0px;
    }

    .sub-dashboard .pic-content .top-name {
        padding-top: 20px;
        font: bold 19px / 20px Metropolis-Bold, Arial, sans-serif;
    }

    .sub-dashboard .pic-content .top-name span {
        font: bold 19px / 20px THSarabunNewRegular, Arial, sans-serif;
    }

    .sub-dashboard .d-profile .p-status {
        font: 12px / 13px tahoma, Arial, sans-serif;
        color: rgb(156, 156, 156);
    }

    .sub-dashboard .p-arrow {
        margin-top: 49px;
        padding-right: 5px;
    }

    .sub-dashboard .p-arrow img {
        max-width: 100%;
        height: auto;
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-top {
        font: 15px / 22px lineseed, Arial, sans-serif;
    }

    .mice-dashboard .box-right .mid .gg-box .color-box .c-num {
        font: 33px / 35px lineseed, Arial, sans-serif;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
	    .mice-dashboard .tab-left {
        background: none;
        padding-bottom: 0px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) { 
.mice-dashboard .r-form{
	margin-bottom: 0;	
}
.mice-dashboard .box-right .mid .g-map .choice{
	margin-top: 0;	
	margin-bottom:20px;
}
.mice-dashboard .box-right .mid .g-map .choice .text{
	    margin-right: 0;
}

}

@media (min-width: 1281px) and (max-width: 1366px) { 
.mice-dashboard .box-right .mid .g-map .choice{
	          margin-top: 21px;
	
}
.mice-dashboard .box-right .mid .g-map .choice .text{
	    font: 14px / 28px 'lineseed', Arial, sans-serif;	
}
 }
@media (min-width: 1367px) and (max-width: 1440px) {
	 
.mice-dashboard .box-right .mid .g-map .choice{
	          margin-top: 21px;
	
}
.mice-dashboard .box-right .mid .g-map .choice .text{
	    font: 14px / 28px 'lineseed', Arial, sans-serif;	
}
 }


