/* max-width 1120px
   header max 280px
   height auto

   コンテンツmax-width 930px

   【スマホ切り替え】
   ヘッダー、ナビ、フッター　768px
   メイン　600px

   z-index
   1  body .site
   4  .top-slider
   5  .img-balloon（タイトルの吹き出し下部分）
   10 nav.drawer-nav（スマホ版メニュー一覧）
   15 .main-header-all（ヘッダー）
   20 button.drawer--right .drawer-hamburger（スマホ版メニューボタン）

/*********** navi **********************************/
.main-navi li{
  width: 100%;
  margin: 0 auto;
  text-align: right;
}
/*********** TOP **********************************/
.top-img{
  width:100%;
  margin:0 auto;
}
.pdf-list{
  padding:3rem;
  background-color: #ffffff
}
.pdf-list p{
  margin:0;
  color:#ce4948;
  text-align: left;
  font-weight: bold;
}
/*********** ボタン **********************************/
li.button{
  margin:30px auto;
  padding: 10px;
  width: 35%;
  color: #FFFFFF;
  font-size: 18px;
  border:1.5px;
  border-style: solid;
  border-color: #ce4948;
  border-radius: 10px;
  background: transparent;
  position: relative;
  z-index: 1;
  transition: .3s;
}
li.button ::before {
  content: "";
  width: 100.8%;
  height: 100.8%;
  position: absolute;
  top: -0.5%;
  left: -0.5%;
  z-index: -1;
  background: #ce4948;
  border-radius: 10px;
  transform-origin: 50% 0%;
  transform: scaleY(0);
  transition: transform ease .3s;
}
li.button :hover {
  color: #fff;
}
li.button :hover::before {
  transform-origin: 50% 100%;
  transform: scaleY(1);
}
.pdf-list a {
  width: 35%;
    display: contents;
}

/*********** スマホ・ipadボタン **********************************/

@media screen and ( max-width:1024px ){
  li.button{
    width: 90%;
    margin:20px auto;
    font-size: 16px;
  }
}
