html{
	font-size: 10px;
}

body {
font-family: Arial, sans-serif;
}

.bar-area {
font-size: 1rem;
}

.pentaText 	{ font-size: 62px; }
.teraText 	{ font-size: 48px; }
.gigaText 	{ font-size: 30px; }
.megaText 	{ font-size: 24px; }
.kiloText 	{ font-size: 20px; }
.byteText 	{ font-size: 16px; }
.bitText 	{ font-size: 12px; }

.pentaImage { height: 100px; }
.teraImage 	{ height: 80px; }
.gigaImage 	{ height: 54px; }
.megaImage 	{ height: 40px; }
.kiloImage 	{ height: 30px; }
.byteImage	{ height: 24px; }
.bitImage 	{ height: 20px; }

.flowHV { 
	display: flex ;
	align-items: center ;
}

.barHV { 
	display: flex ;
	align-items: center ;
	width: max-content ;
}

.drop_exp-area { /* on PC, hibrid area is drop */
  display: none; 
  background-color: #FFFFFF;
  transition: 0.6s;
  position: fixed ;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 2;
  overflow-x : hidden ;
  overflow-y: auto;	
  width: max-content ;
  min-width:100px;
}