.img_effect_rakuera{
    width: 720px;
    height: 360px;
    position: relative;
    overflow: hidden;
    border: 2px solid #000000;
    margin: 0 auto;
  }

  .img1{
    width: 720px;
    height: 360px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img1_a 24s infinite;
  }

  .img2{
    width: 720px;
    height: 720px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img2_a 24s infinite ease-out;
  }

  .img3{
    width: 720px;
    height: 720px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img3_a 24s infinite ease-out;
  }

  .img4{
    width: 1080px;
    height: 720px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img4_a 24s infinite ease-out;
  }

  .img5{
    width: 720px;
    height: 360px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img5_a 24s infinite;
  }

  @keyframes img1_a{
    0%{opacity: 0;}
    5%{opacity: 1;}
    15%{opacity: 1;}
    20%{opacity: 0;}
    100%{opacity: 0;}
  }

  @keyframes img2_a{
    0%{opacity: 0;}
    20%{opacity: 0;transform: translateY(0px);}
    25%{opacity: 1;}
    38%{opacity: 1;}
    40%{opacity: 0;transform: translateY(-360px);}
    100%{opacity: 0;}
  }

  @keyframes img3_a{
    0%{opacity: 0;}
    40%{opacity: 0;transform: translateY(-360px);}
    45%{opacity: 1;}
    58%{opacity: 1;}
    60%{opacity: 0;transform: translateY(0px);}
    100%{opacity: 0;}
  }

  @keyframes img4_a{
    0%{opacity: 0;}
    60%{opacity: 0;transform: translateX(-360px);}
    65%{opacity: 1;}
    78%{opacity: 1;}
    80%{opacity: 0;transform: translateX(0px);}
    100%{opacity: 0;}
  }

  @keyframes img5_a{
    0%{opacity: 0;}
    80%{opacity: 0;}
    85%{opacity: 1;}
    95%{opacity: 1;}
    100%{opacity: 0;}
  }


.hp_link_btn{
width: 720px;
border-top: 2px solid #b8860b;
border-bottom: 2px solid #b8860b;
background-color:#ffebcd;
display:block;
color:#000000;
font-size:24px;
font-weight:bold;
line-height:300%;
text-decoration:none;
text-align:center;
transition:0.5s;
position:relative;  
}

.hp_link_btn::after{
content: "";
border-top:1px solid #b8860b;
border-bottom:1px solid #b8860b;
position:absolute;
top:3px;
left:0px;
width:calc(100%);
height:calc(100% - 8px);
}



.hp_link_btn span{
color:#000000;
}


.hp_link_btn > .hover{
display:none;
}


.hp_link_btn:hover{
background-color: #ffebcd;
border-top:2px solid #b8860b;
border-bottom:2px solid #b8860b;
text-decoration:none;
/* box-shadow:8px 8px 6px gray; */
}

.hp_link_btn:hover > .nomal{
display:none;
}

.hp_link_btn:hover > .hover{
display:inline;
color:#000000;
}



.con_daimei{
width:720px;
font-size:26px;
color:#000000;
font-weight:bold;
line-height:220%;
border-top:2px solid #b8860b;
border-bottom:2px solid #b8860b;
background:linear-gradient(to left, #f5deb3, #ffffff 20%, #ffffff 80%, #f5deb3);
}

.con_setsumei{
width:720px;
font-size:20px;
font-weight:bold;
line-height:130%;
padding:30px 0;
background:linear-gradient(to left, #ffebcd, #ffffff 10%, #ffffff 90%, #ffebcd);
}



.rakuera_con2{
width:720px;
height: 320px;
position: relative;
overflow: hidden;
border-bottom: 2px solid #b8860b;
margin-bottom: 30px;
}

.con2_img1{
width:1550px;
height: 320px;
position: absolute;
top:0px;
left:0px;
animation: con2_img1_a 14s linear infinite;
vertical-align: bottom;
}

.con2_img2{
width:1550px;
height: 320px;
position: absolute;
top:0px;
left:0px;
animation: con2_img2_a 14s linear infinite;
vertical-align: bottom;
}



@keyframes con2_img1_a{
0%{transform: translateX(0%);}
100%{transform: translateX(-100%);}
}

@keyframes con2_img2_a{
0%{transform: translateX(100%);}
100%{transform: translateX(0%);}
}



/*空間プラン*/

.effect_p{
width:720px;
height:360px;
border:3px solid #000000;
position:relative;
overflow:hidden;
}

.effect_p a{
display:block;
position: absolute;
top:0;
left:0;
height:100%;
width:100%;
text-indent: -999px;
}

.img_p01{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p01_a 24s infinite;
}

.img_p02{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p02_a 24s infinite;
}

.img_p03{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p03_a 24s infinite;
}

.img_p04{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p04_a 24s infinite;
}

.img_p05{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p05_a 24s infinite;
}

.img_p06{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p06_a 24s infinite;
}

.img_p07{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p07_a 24s infinite;
}

.img_p08{
width:720px;
height:360px;
position:absolute;
top:0;
left:0;
animation:img_p08_a 24s infinite;
}


@keyframes img_p01_a{
0%{opacity:1;}
100%{opacity:1;}
}

@keyframes img_p02_a{
0%{opacity:0;}
22.4%{opacity:0;}
22.5%{opacity:1;}
37.5%{opacity:1;}
37.6%{opacity:0;}
100%{opacity:0;}
}

@keyframes img_p03_a{
0%{opacity:0;transform:translateY(-100%);}
10%{opacity:0;transform:translateY(-100%);}
12.5%{opacity:1;transform:translateY(0);}
22.5%{opacity:1;transform:translateY(0);}
25%{opacity:1;transform:translateY(100%);}
26%{opacity:0;transform:translateY(100%);}
100%{opacity:0;}
}

@keyframes img_p05_a{
0%{opacity:0;transform:translateY(100%);}
35%{opacity:0;transform:translateY(100%);}
37.5%{opacity:1;transform:translateY(0);}
47.5%{opacity:1;transform:translateY(0);}
50%{opacity:1;transform:translateY(-100%);}
51%{opacity:0;transform:translateXY(-100%);}
100%{opacity:0;}
}

@keyframes img_p04_a{
0%{opacity:0;}
47.4%{opacity:0;}
47.5%{opacity:1;}
62.5%{opacity:1;}
62.6%{opacity:0;}
100%{opacity:0;}
}

@keyframes img_p07_a{
0%{opacity:0;transform:translateY(-100%);}
60%{opacity:0;transform:translateY(-100%);}
62.5%{opacity:1;transform:translateY(0);}
75%{opacity:1;transform:translatey(0);}
77.5%{opacity:1;transform:translateY(100%);}
77.6%{opacity:0;transform:translateY(100%);}
100%{opacity:0;}
}

@keyframes img_p06_a{
0%{opacity:0;}
74.9%{opacity:0;}
75%{opacity:1;}
87.5%{opacity:1;}
87.6%{opacity:0;}
100%{opacity:0;}
}

@keyframes img_p08_a{
0%{opacity:0;transform:translateY(100%);}
84.9%{opacity:0;transform:translateY(100%);}
87.5%{opacity:1;transform:translateY(0);}
97.5%{opacity:1;transform:translateY(0);}
99.9%{opacity:1;transform:translateY(-100%);}
100%{opacity:0;}
}

/*ＨＰリンクボタン*/

.link_centro_hp{
font-size:24px;
font-weight:bold;
/*text-shadow:2px 2px 1px #ffffff;*/
background-color: #f5deb3;
line-height:300%;
width:726px;
margin-bottom:150px;
border-bottom:2px solid #000000;
transition:0.5s;
}

.effect_p:hover + .link_centro_hp{
color:#000000;
background-color: #ffebcd;
}

.rakuera_h3{width: 720px;font-size: 26px;padding-bottom: 3px;border-bottom: 3px solid #dda520;margin-bottom: 20px;}

h4{margin: 0;padding: 0;}
