@charset "utf-8";

body {
  overflow: hidden;
}
#wrap {
  position: relative;
  width: 1280px;
  height: 720px;
  padding: 113px 236px 100px;
  background: url(./digitaltool_gatePage_bg.svg) 0 0/ contain no-repeat;
}
.buttonList {
  display: flex;
  flex-wrap: wrap;
  gap: 32px 51px;
}
.button {
  width: 235px;
  height: 235px;
  cursor: pointer;
}
.button.hover {
  animation: zoomOn 0.2s linear forwards;
  -webkit-animation: zoomOn 0.2s linear forwards;
  -ms-animation: zoomOn 0.2s linear forwards;
}
.button a {
  width: 100%;
  height: 100%;
}

@-webkit-keyframes zoomOn {
  0% {
    -ms-transform: scale(1); /* IE 9 */
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);
  }
  100% {
    -ms-transform: scale(1.05); /* IE 9 */
    -webkit-transform: scale(1.05); /* Safari */
    transform: scale(1.05);
  }
}
@keyframes zoomOn {
  0% {
    -ms-transform: scale(1); /* IE 9 */
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);
  }
  100% {
    -ms-transform: scale(1.05); /* IE 9 */
    -webkit-transform: scale(1.05); /* Safari */
    transform: scale(1.05);
  }
}
.buttonList > .button:nth-child(1) { background: url(./digitalBtn_01.svg) center/ contain no-repeat;}
.buttonList > .button:nth-child(2) { background: url(./digitalBtn_02.svg) center/ contain no-repeat;}
.buttonList > .button:nth-child(3) { background: url(./digitalBtn_03.svg) center/ contain no-repeat;}
.buttonList > .button:nth-child(4) { background: url(./digitalBtn_04.svg) center/ contain no-repeat;}
.buttonList > .button:nth-child(5) { background: url(./digitalBtn_05.svg) center/ contain no-repeat;}
.buttonList > .button:nth-child(6) { background: url(./digitalBtn_06.svg) center/ contain no-repeat;}