/*!*******************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/App.css ***!
  \*******************************************************************/
.container {
    width: 500px;
    height: 650px;
    margin: 0 auto;
    background-size: cover;
    background-color: #E0CFD3;
    margin-top: 40px;
    color: #2B3A46;
}

body {
    background-color: rgba(224, 207, 211, 0.9);
}
/*!********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/Main.css ***!
  \********************************************************************/
.title {
  text-align: center;
}

.buttonWrapper {
  margin-top: 20px;
  width: 500px;
}
/*!***********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/MineGif.css ***!
  \***********************************************************************/
.mineGif {
  width: 400px;
}

div.gifWrapper {
  text-align: center;
}
/*!**********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/Header.css ***!
  \**********************************************************************/
.menu {
  height: 3.5rem;
  /*     드래그 방지      */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* ***************** */
}

.menu-item {
  display: inline-block;
  font-size: 1em;
  font-style: bold;
  line-height: 3.5rem;
  width: 33.3333%;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.3s;
  text-decoration: none;
  color: #2B3A46;
}

.menu-item:hover {
  /* background-color: #cdfff3; */
  background-color: #d8c7cb;
}

.menu-item:active,
.menu-item.active {
  background-color: #cebec2;
}
/*!*********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/Modal.css ***!
  \*********************************************************************/
.modal {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 99;
  background-color: rgba(0, 0, 0, 0.6);
}
.modal button {
  outline: none;
  cursor: pointer;
  border: 0;
}
.modal > section {
  width: 90%;
  max-width: 450px;
  margin: 0 auto;
  border-radius: 0.3rem;
  background-color: #fff;
  /* 팝업이 열릴때 스르륵 열리는 효과 */
  animation: modal-show 0.3s;
  overflow: hidden;
}
.modal > section > header {
  position: relative;
  padding: 16px 64px 16px 16px;
  background-color: #f1f1f1;
  font-weight: 700;
}
.modal > section > header button {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 30px;
  font-size: 21px;
  font-weight: 700;
  text-align: center;
  color: #999;
  background-color: transparent;
}
.modal > section > main {
  padding: 16px;
  border-bottom: 1px solid #dee2e6;
  border-top: 1px solid #dee2e6;
}
.modal > section > footer {
  padding: 12px 16px;
  text-align: right;
}
.modal > section > footer button {
  padding: 6px 12px;
  color: #fff;
  background-color: #6c757d;
  border-radius: 5px;
  font-size: 13px;
}
.modal.openModal {
  display: flex;
  align-items: center;
  /* 팝업이 열릴때 스르륵 열리는 효과 */
  animation: modal-bg-show 0.3s;
}
@keyframes modal-show {
  from {
    opacity: 0;
    margin-top: -50px;
  }
  to {
    opacity: 1;
    margin-top: 0;
  }
}
@keyframes modal-bg-show {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/*!********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/Game.css ***!
  \********************************************************************/
.title {
  text-align: center;
}

.board {
  padding: 0px 15px;
  text-align: center;
}

table {
  margin: auto;
}

.buttonWrapper-game {
  display: flex;
  justify-content: space-around;
  width: 300px;
  margin:0 auto;
  margin-bottom: 20px;
}
/*!******************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/Td.css ***!
  \******************************************************************/
.boardTd {
  width: 30px;
  height: 30px;
  border: 1px solid black;
  border-spacing: 0px;
}

.closeCell {
  box-shadow: 1px 1px 1px;
  background-color: rgb(226, 205, 210);
}

img {
  height: 100%;
}

.cell {
  height: 100%;
}

.openNumber {
  
}
/*!*********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/Timer.css ***!
  \*********************************************************************/
.timer {
  font-size: 30px;
  margin-top: 10px;
}
/*!*********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/Score.css ***!
  \*********************************************************************/
.history {
  text-align: center;
}