/* トップページCSS */
/* index.htmlに対応 */

header{
  opacity:0;
}

/* top-treeセクション */
.top-tree-section{
  width:100%;
}
.top-tree{
  position: relative;
  width:100%;
  height:720px;
}
.top-tree-stem{
  position: absolute;
  top:-10%;
  left:50%;
  transform: translateX(-50%);
  width:650px;
  background-color: transparent;
  z-index:100;
  display:none;
}
.top-tree-leaf{
  position: absolute;
  top:-10%;
  left:50%;
  transform: translateX(-50%);
  width:650px;
  background-color: transparent;
  display:none;
}
/* スクロール */
.scroll{
  margin: 0 auto;
  display: none;
  position: relative;
  height: 100px;
  text-align: center;
  z-index:201;
  animation: vertical 1s ease-in-out infinite alternate;
}
.scroll a{
  margin: 0 auto;
  color: #0C1864;
  font-size:16px;
}
.scroll-text{
  cursor: pointer;
}
.scroll-line{
  position: absolute;
  width:2px;
  height:60px;
  content:"";
  left:50%;
  top:24px;
  background-color: #0C1864;
  transform: translateX(-1px);
  border-radius: 30%;
}
/* messageセクション */
.message-section{
  text-align:center;
  margin-top:100px;
}
.message-image{
  margin-bottom:50px;
}
.message-text{
  font-size:26px;
  line-height:56px;
}

/* 追記バナー */
.banner-container {
  text-align: center;
  padding: 100px 20px;
}

@media(max-width: 650px) {
  .banner-container {
    padding: 50px 20px;
  }
}

.banner-container img {
  max-width: 100%;
}

.banner-container img:hover {
  opacity: .5;
  transition: .2s;
}