html {
  background-color: white;
}

.art-container {
  position: relative;
  margin: 0 auto;
  margin-top: 30px;
  width: 1000px;
  height: 563px;

  background-image: url(/img/art/top-banner7.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top;
  box-shadow: 0 0 7px 10px rgba(122,122,122,0.3);  
}

.txturt {
  font-size: 30px;
}
.art-img {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: top;

  border: 2px solid green;
}
.art-dmg {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: top;
  border: 2px solid blue;
}
.sdc {
  margin: 0 auto;
  margin-top: 30px;
  width: 1000px;
}
/* ============================= */
.m1 {
  /*border: 2px solid red;*/
  width: 130px;
  height: 559px;
  cursor: pointer;
}
.m2 {
  position: absolute;
  /*border: 2px solid red;*/
  top: 230px;
  left: 150px;
  width: 250px;
  height: 100px;
  cursor: pointer;
}
.m3 {
  position: absolute;
  /*border: 2px solid red;*/
  top: 380px;
  left: 280px;
  width: 250px;
  height: 100px;
  cursor: pointer;
}
.m4 {
  position: absolute;
  /*border: 2px solid red;*/
  top: 210px;
  left: 460px;
  width: 250px;
  height: 100px;
  cursor: pointer;
}
.m5 {
  position: absolute;
  /*border: 2px solid red;*/
  top: 100px;
  left: 660px;
  width: 300px;
  height: 100px;
  cursor: pointer;
}
/* ============================= */
@media screen and (min-width: 700px) {
  .art-container_ph {
    display: none;
  }
}
@media screen and (max-width: 700px) {
  .art-container {
    display: none;
  }
  .sdc {
    display: none;
  }
}