@charset "UTF-8";

/* ___ vc-planets.com　トップページ _____________________________ */

body{
  font-family:  "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1.5;
  font-size: 16px;
  margin: 0;
}
#title-area {
  height: 720px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  background-color: #339; 
}
#title-area .bg-img {
  position: absolute;
  background: url("../img/vcp_bg.jpg") center center no-repeat;
  background-size: cover;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  animation  : myanime 20s infinite;
}
#title-area .bg-img.pic01 {
  background-image: url("../img/vcp_bg.jpg");
}
#title-area .bg-img.pic02 {
  background-image: url("../img/vcp_bg2.jpg");
  animation-delay: 5s;
}
#title-area .bg-img.pic03 {
  background-image: url("../img/vcp_bg3.jpg");
  animation-delay: 10s;
}
#title-area .bg-img.pic04 {
  background-image: url("../img/vcp_bg4.jpg");
  animation-delay: 15s;
}
@keyframes myanime {
   0% { opacity: 0; }
   5% { opacity: 1; }
  25% { opacity: 1; }
  30% { opacity: 0; }
  100% { opacity: 0; }
}
#title-area h1 {
  width: 80%;
  max-width: 924px;
  z-index: 1000;
}
#title-area h1 img {
  width: 100%;
}
.job {
  text-align: center;
  margin: 15px
}
.copy {
  line-height: 2.6;
  background-color: #ccc;
  text-align: center;
  color: #fff;
}

@media screen and (max-width: 767px) {
  #title-area {
    height: 320px;
  }
  p {
    font-size: 13px;
  }
}
@media print, screen and (min-width: 768px) {
  .pc-none {
    display: none;
  }
}