
div.slide-show {
    width: 640px; /* スライドショーの幅 */
    max-width: 100%; /* スマホで表示が欠けないように */
    margin: 10px auto; /* 中央揃え */
    position: relative;
}
 
.slide-show img { 
    animation: show 12s infinite; /* 12秒のスライドショーを繰り返し */
    max-width: 100%;
    height: auto;
    opacity: 0;
    position: absolute; /* 画像を重ねて表示 */
    left: 0;
    top: 0;
}
 
@keyframes show {
    0% {opacity: 0}
    17% {opacity: 1}
    33% {opacity: 1}
    50% {opacity: 0}
}
 
.slide-show img:nth-of-type(1) {
    position: relative;
}
 
.slide-show img:nth-of-type(2) {
    animation-delay: 0s;
}
 
.slide-show img:nth-of-type(3) {
    animation-delay: 4s;
}
 
.slide-show img:nth-of-type(4) {
    animation-delay: 8s;
}
}

/*------------------------------------------会社案内----------------------------------------*/ 
.button1 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button1::before,
.button1::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button1,
.button1::before,
.button1::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button1 {
  background-color: #ffc0cb;
  color: #fff;
}
.button1:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

/*------------------------------------------サイトマップ----------------------------------------*/ 
.button2 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button2::before,
.button2::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button2,
.button2::before,
.button2::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button2 {
  background-color: #6699FF;
  color: #fff;
}
.button2:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

/*------------------------------------------お問い合わせ----------------------------------------*/ 
.button3 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button3::before,
.button3::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button3,
.button3::before,
.button3::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button3 {
  background-color: #6699FF;
  color: #fff;
}
.button3:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

/*------------------------------------------オンデマンド印刷----------------------------------------*/ 
.button4 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button4::before,
.button4::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button4,
.button4::before,
.button4::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button4 {
  background-color: #6699FF;
  color: #fff;
}
.button4:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

/*------------------------------------------自費出版----------------------------------------*/ 
.button5 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button5::before,
.button5::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button5,
.button5::before,
.button5::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button5 {
  background-color: #6699FF;
  color: #fff;
}
.button5:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

/*------------------------------------------自分史制作----------------------------------------*/ 
.button6 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button6::before,
.button6::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button6,
.button6::before,
.button6::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button6 {
  background-color: #6699FF;
  color: #fff;
}
.button6:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

/*------------------------------------------出版書籍紹介----------------------------------------*/ 
.button7 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button7::before,
.button7::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button7,
.button7::before,
.button7::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button7 {
  background-color: #6699FF;
  color: #fff;
}
.button7:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

/*------------------------------------------古書販売----------------------------------------*/ 
.button8 {
  display: inline-block;
  width: 200px;
  height: 54px;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.button8::before,
.button8::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button8,
.button8::before,
.button8::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.button8 {
  background-color: #6699FF;
  color: #fff;
}
.button8:hover {
  background-color: #000;
}
/*----------------------------------ここまで-------------------------------------------------*/ 

