* {margin:0; padding:0;}

body {width: 100%; margin:0; padding:0; font-size:18px; line-height:1.4; background-image: url("../themes/dronestation-theme/backimage002.webp");background-size: cover;font-family:ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic ProN,"Trebuchet MS", Verdana, sans-serif;}

/* 一般タグの設定 */
table {width:100%; border-collapse:collapse;}
table td {vertical-align:top;}
th { background:url(header.gif) repeat-x bottom left; color:#000; padding:3px; vertical-align:middle;}
th a, th a b {color:#ffcc00; text-decoration:none;}

h1,h2,h3,h4,h5,p,b,i,u,form {margin:0.5em 0;}

video {
  width: 600px;
}
@media screen and (max-width: 600px) {
	video {width:100%;}
}

#content{
  width: 100%;
  max-width: 600px;
  margin: 0px auto;
}

h1 {
  color: #000;
  text-align:center;
  width:90%;
  text-shadow: 1px 2px 3px #8c8c8c;
  font-size: 40px;
  font-weight: lighter;
  margin: 20px auto;
}

.overview{
 width: 100%;
 max-width: 600px;
 margin: 10px auto;
}
.overview p {
  font-size: 10px;
  color: #949495;
  padding: 10px;
}
.font-xs{
  font-size: 10px;
  text-align: center;
}

@media screen and (max-width: 480px) {
  h1 {font-size: 34px;font-weight: normal;}
}
h2 {
  color: #949494;
  text-align:center;
  width:100%;
  text-shadow: 1px 2px 3px #8c8c8c;
  font-size: 34px;
  font-weight: lighter;
}
@media screen and (max-width: 480px) {
  h2 {width:98%;font-size: 28px;font-weight: normal;}
}
.com {
  width: 600px;
  text-align:center;
  margin: 0px auto;
}

.absolute_test {
    position:  absolute;        /* 要素の配置方法を指定 */
    padding:  20px;             /* 余白指定 */
    left:  50px;                /* 左からの位置指定 */
    top: 10px;                  /* 上からの位置指定 */
    width: 90px;
    height: 40px;
}
.wrapper {
  animation: floating-x 7.2s ease-in-out infinite alternate-reverse;
}
.target {
  animation: floating-y 1.8s ease-in-out infinite alternate-reverse;
}
@keyframes floating-x {
  0% {
    transform: translateX(-5%);
  }
  100% {
    transform: translateX(5%);
  }
}
@keyframes floating-y {
  0% {
    transform: translateY(-10%);
  }
  100% {
    transform: translateY(10%);
  }
}
@media screen and (max-width: 480px) {
  .com {
  width: 100%;
  max-width: 400px;
  text-align:center;
}
.absolute_test {
    position:  absolute;        /* 要素の配置方法を指定 */
    padding:  20px;             /* 余白指定 */
    left:  20px;                /* 左からの位置指定 */
    top: 10px;                  /* 上からの位置指定 */
    width: 80px;
    height: 30px;
}
}
.close{
  position: relative;
  text-align: center;
  /* 中央揃え */
  display: block;
  margin: 0 auto;
  /* 幅の指定 */
  width: 100%;
  max-width: 100px;
  box-sizing: border-box;
  padding: 10px;
  /* 色の指定 */
  background: linear-gradient(135deg, #ffd900, #ff9300);
  color: #fff;
  font-weight: bold;
  border-radius: 8px;
  transition: 0.3s;
}
.close:hover {
  opacity: 0.7;
}
.close:active, .close:focus {
  top: 2px;
}