#gameContent {
	position: relative;
}


#click-overlay {
	position: absolute;
	z-index: 10;
}

#click-overlay_menu {
	position: absolute;
	z-index: 15;
	background: rgba( 255, 255, 192, 0.8 );
	display: none;

	line-height: 2;

}


#menu-overlay {
	position: absolute;
	z-index: 10;
	background-color: black;

/*	display: none; */
}


#throw-cancel {

  position: absolute;
  cursor: pointer;
  z-index: 8;
  border: 1px solid #000;
  background-color: #fff;
}

#throw-cancel::before,
#throw-cancel::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 2px;
  background-color: #333;
  transform-origin: center;
}

#throw-cancel::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

#throw-cancel::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}







#progress-container {
  height: 15%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

#progress-bar {
  width: 100%;
  height: 100%;
  background-color: #aaa;
  position: relative;
/*  border-radius: 10px; */
  overflow: hidden;
}

#progress-fill {
  height: 100%;
  width: 0%;
  background-color: #76c7c0;
/*  transition: width 0.4s ease; */
}

#progress-goal-line {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  background-color: red;
  left: 0%; /* 目標が80%の場合 */
}

#progress-text {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
  font-size: 24px;
  color: #333;
}



#achievement-button {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: purple;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  cursor: pointer;
  z-index: 10;
  desplay: none;
}




#slider-container {
  position: absolute;
  bottom: 5%;
  left: 0;
  width: 60%;
  display: flex;
  flex-direction: column;
  align-items: center; /* タイトルを中央に */
  color: white;
/*  background-color: #004400; */
}

#slider-title {
  text-align: center;
}

#slider-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
}





#throw-button {
  position: absolute;
  top: 25%;
  left: 5%;
  width: 55%;
  padding: 1% 2%;
  background-color: #4CAF50;
  color: white;
  text-align: center;
  border-radius: 12px;
  cursor: pointer;
  user-select: none;
}

#throw-label,
#throw-remaining {
  white-space: nowrap;
}

#menu-button {
  position: absolute;
  top: 30%;
  right: 5%;
  width: 25%;
  padding: 2% 0;
  background-color: #2196F3;
  color: white;
  border-radius: 10px;
  cursor: pointer;
}

#reset-button {
  position: absolute;
  bottom: 5%;
  right: 5%;
  width: 25%;
  padding: 2% 0;
  background-color: #f44336;
  color: white;
  border-radius: 10px;
  cursor: pointer;
}


#click-overlay_menu a.disabled {
  pointer-events: none;
  color: #aaa;
  cursor: default;
}