/* 全般の設定 */
*{

margin: 0px;
padding: 0px;
}


* a{
text-decoration: underline;
color: #000000;
}

* a:hover{
text-decoration: underline;
color: #0000ff;
}

/* 各項の設定 */
body {
  font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
  background: url("../img/bg.png");
  animation: bgiLoop 5s linear infinite;
  background-color: #fff;
    left: 0;
    right: 0;
    margin: auto;
}
@keyframes bgiLoop {
    0% { background-position: 0 0;}
  100% { background-position: -100px 200px;}
}


#header{
height: auto;
margin: 0;
padding: 0;
}

p.headerimgbox img{
max-width: 100%;
margin: 20px 0px 5px 0px;
}

#contents{
height: auto;
margin: 0;
padding: 0;
position: relative;
}

#footer {
    padding: 10px;
    background-color: rgb(198 0 25);
    font-size: 13px;
    color: #fff;
    text-align: center;
}


#footer a{
color: #ffffff;
text-decoration: none;
font-size: 12px;
}

#footer a:hover{
color: #cccccc;
text-decoration: none;
}
.wrapper{
	 background:#ffffe9;
  background-size: 109px 109px, 109px 109px,100% 6px, 109px 109px, 109px 109px;
  background-position: 54px 55px, 0px 0px, 0px 0px, 0px 0px, 0px 0px;
}
h1{
margin: 0px;
font-size: 120%;
color: #ffffff;
text-align: left;
padding: 0.4em 0.5em;/*文字の上下 左右の余白*/
color: #494949;/*文字色*/
background: #f4f4f4;/*背景色*/
border-left: solid 5px #7db4e6;/*左線*/
border-bottom: solid 3px #d7d7d7;/*下線*/
}

h2 {
    margin: 0px 0px 10px 0px;
    padding: 15px 0px;
    font-size: 23px;
    font-weight: bold;
    background-color: #00a1e9;
    color: #ffffff;
    text-align: center;
}

img {
  vertical-align: bottom;
 pointer-events: none;
}
 
img {
  display: block;
  width: 100%;
}


/* strong、b、markerなどの設定 */


/* 重要なキーワード */
strong {
color: #ff0000;
font-size: 120%;
}

/* 強調表示 */
b {
color: #ff5555;
font-size: 120%;
}

/* マーカー表示 */
.marker {
background-color: #ffff00;
}


.txt_box{
text-align: left;
margin: 30px 0px;
padding: 0px 5% 0px 5%;
}

p.img_box img{
max-width: 100%;
}

/* 追加class */
.contents {
    top: 0px;
    position: relative;
    max-width: 960px;
    margin: 0 auto;
    height: auto;
}

.contents2 {
    top: 0px;
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    background: #ffe700;
}
.contents3 {
    top: 0px;
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    background: #f22f30;
}
.img_box {
	margin-bottom: -7px;
}

.midashi{
  padding: 0.4em 0.5em;/*文字の上下 左右の余白*/
  color: #494949;/*文字色*/
  background: #f4f4f4;/*背景色*/
  border-left: solid 5px #7db4e6;/*左線*/
  border-bottom: solid 3px #d7d7d7;/*下線*/
	
}
ol, ul {
    list-style: none;
}






.kaisha {
width: 100%;
border-collapse: collapse ;
font-size: 11px;
text-align: left;
}

.kaisha th,
.kaisha td {
border: 1px solid #ccc;
padding: 10px;
}

.kaisha th {
font-weight: bold;
background-color: #dedede; 
}





.unei_j{
	margin: 8px;
}
.unei {
    font-size: 12px;
    padding: 15px;
    text-align: left;
}


#home {
  clip-path: url(#cache);
}

#red {
  fill: none;
  opacity: 0.15;
  stroke: #CE1B5F;
  stroke-width: 12;
  stroke-miterlimit:10;
  animation: show 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out; 
}

#blue {
  fill: none;
  opacity: 0.15;
  stroke: #06A1C4;
  stroke-width: 12;
  stroke-miterlimit:10;
  animation: show 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

#light-blue {
  fill: none;
  opacity: 0.15;
  stroke: #06A1C4;
  stroke-width: 6;
  stroke-miterlimit:10;
  stroke-dasharray: 200;
  stroke-dashoffset: 800;
  animation: draw 4s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;    
}

@keyframes draw {
  to {
    stroke-dashoffset: 0;
 }
    }

@keyframes show {
  0% {
    opacity: 0.15;
 }
  50% {
    opacity: 0.2;
 }
  100% {
    opacity: 0.15;
 }
    }


.bg {
  animation:slide 3s ease-in-out infinite alternate;
 background-image: linear-gradient(-60deg, #fff 50%, #17eb08 50%);
  bottom:0;
  left:-50%;
  opacity:.5;
  position:fixed;
  right:-50%;
  top:0;
  z-index:-1;
}

.bg2 {
  animation-direction:alternate-reverse;
  animation-duration:4s;
}

.bg3 {
  animation-duration:5s;
}

.content {
  background-color:rgba(255,255,255,.8);
  border-radius:.25em;
  box-shadow:0 0 .25em rgba(0,0,0,.25);
  box-sizing:border-box;
  left:50%;
  padding:10vmin;
  position:fixed;
  text-align:center;
  top:50%;
  transform:translate(-50%, -50%);
}

h1 {
  font-family:monospace;
}

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

.linka{
    font-size: 12px;
}


.transparent_01 {
display:block;
position:absolute;
width:100%;
height:100%;
background: url("../img/pp2bg1.png");
}

.transparent_02 {
display:block;
position:absolute;
width:100%;
height:100%;
background: url("../img/pp3bg2.png");
}

@media screen and (min-width: 769px){
.transparent_01 {
display:block;
position:absolute;
width:100%;
height:100%;
background: url("../img/pp1bg1.png");
}

.transparent_02 {
display:block;
position:absolute;
width:100%;
height:100%;
background: url("../img/pp1bg2.png");
}
}



.p_text{
    font-size: 16px;
    font-weight: normal;
    line-height: 28px;
}

 .midashi1{
    margin: 20px 0;
    border-bottom: solid 2px #00a1e9;
	 font-size: 17px;
}
 .area_f {
    margin: 20px 15px 0;
    padding-bottom: 20px;
}
 #footer_menu {
    padding: 10px 0 !important;
    background-color: #00AFCC;
    font-size: 11px !important;
    color: #fff;
    text-align: center;
}

#footer_menu a{
    
    color: #fff;
   
}
.jst-hours,.jst-minutes,.jst-seconds{
 font-family: 'Yuji Boku', serif !important;
}
.timer-3 {
    font-size: 20px;
    font-size: 36px;
    color: #ffffff;
    font-weight: bold;
    font-family: 'Yuji Boku', serif !important;
    background: #565146;
    margin: 0 23px 0px;
    padding-bottom: 4px;
}
body {
    background: #ffffff;
}
.ft_banner {
    position: fixed;
    bottom: 0px;
    width: 100%;
    display: none;
    z-index: 9999;
    left: 0px;
    right: 0px;
    margin: auto;
    background: #fff;
}
.con_eria {
    background: #0279c7;
    margin: 0;
    padding: 20px;
    color: #ffffff;
}
 .tyuijikou_h3 {
    font-size: 14pxpx;
    margin-bottom: 5px;
}
. con_eria_p{
    text-align: left;
    margin-bottom: 10px;
}
.contents {
    top: 0px;
    position: relative;
    overflow: hidden;
}
.contents23 {
    top: 0px;
    position: relative;
    background: #e3d9c2;
   overflow: hidden;
}
#footer {
    padding: 10px;
    background-color: #018cc7;
    font-size: 12px;
    color: #fff;
    text-align: center;
    padding-bottom: 12px;
}
#footer_menu {
    padding: 3px;
    background-color: #00AFCC;
    font-size: 77%;
    color: #fff;
    text-align: center;
}
.stb_riyuu1 {
    position: absolute;
    top: 9%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.stb_riyuu2 {
    position: absolute;
    top: 55%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.stb_main {
    position: absolute;
    top: 31%;
    left: -1%;
    /* right: 0; */
    margin: auto;
    width: 70%;
    z-index: 3;
}
.stb_sb4 {
    position: absolute;
    top: 22.3%;
    right: 0;
    left: 0;
    margin: auto;
    width: 16%;
}

.stb_sb3 {
    position: absolute;
    top: 4.2%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.stb_sb3_2 {
    position: absolute;
    top: 11%;
    left: 11.5%;
    /* right: 0px; */
    margin: auto;
    width: 78%;
    z-index: 9;
}
.stb_toroku2 {
    position: absolute;
    top: 76%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.stb_sb6 {
    position: absolute;
    top: 25.5%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.stb_sb2 {
    position: absolute;
    top: 82.5%;
    right: 17%;
    margin: auto;
    width: 36%;
}
.stb_sb1 {
    position: absolute;
    top: 12%;
    left: 0;
    right: 0;
    margin: auto;
    width: 61%;
}

.stb_sb5 {
    position: absolute;
    top: 61%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.stb_toroku1 {
    position: absolute;
    top: 65%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.stb_toroku22 {
    position: absolute;
    top: 24%;
    left: 0;
    right: 0;
    margin: auto;
    width: 85%;
}
.engine{
  animation:engine 0.2s infinite;
  -webkit-animation:engine 0.2s infinite;
  -moz-animation:engine 0.2s infinite;
}
@keyframes engine{
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  50%  { transform: scale(1.0, 0.98) translate(0%, 1.5%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}
@-webkit-keyframes engine{
  0%   { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
  50%  { -webkit-transform: scale(1.0, 0.98) translate(0%, 1.5%); }
  100% { -webkit-transform: scale(1.0, 1.0) translate(0%, 0%); }
}
@-moz-keyframes engine{
  0%   { -moz-transform: scale(1.0, 1.0) translate(0%, 0%); }
  50%  { -moz-transform: scale(1.0, 0.98) translate(0%, 1.5%); }
  100% { -moz-transform: scale(1.0, 1.0) translate(0%, 0%); }
}
.cloud{
  animation:cloud ease-in-out 4s infinite alternate;
  -webkit-animation:cloud ease-in-out 4s infinite alternate;
  -moz-animation:cloud ease-in-out 4s infinite alternate;
}
@keyframes cloud{
  0%   { transform:translate(0%, 0%);  opacity:1;}
  100% { transform:translate(-30px, 0%); opacity:0;}
}
@-webkit-keyframes cloud{
  0%   { -webkit-transform:translate(0%, 0%);  opacity:1;}
  100% { -webkit-transform:translate(-30px, 0%); opacity:0;}
}
@-moz-keyframes cloud{
  0%   { -moz-transform:translate(0%, 0%);  opacity:1;}
  100% { -moz-transform:translate(-30px, 0%); opacity:0;}
}
.jump{
  animation:jump 5s infinite;
  -webkit-animation:jump 5s infinite;
  -moz-animation:jump 5s infinite;
}
@keyframes jump{
  0%{transform:translate(0,0px);}
  3%{transform:translate(0,-20px);}
  5%{transform:translate(0,0px);}
  6%{transform:translate(0,-5px);}
  7%{transform:translate(0,0px);}
  100%{transform:translate(0,0px);}
}
@-webkit-keyframes jump{
  0%{-webkit-transform:translate(0,0px);}
  3%{-webkit-transform:translate(0,-20px);}
  5%{-webkit-transform:translate(0,0px);}
  6%{-webkit-transform:translate(0,-5px);}
  7%{-webkit-transform:translate(0,0px);}
  100%{-webkit-transform:translate(0,0px);}
}
@-moz-keyframes jump{
  0%{-moz-transform:translate(0,0px);}
  3%{-moz-transform:translate(0,-20px);}
  5%{-moz-transform:translate(0,0px);}
  6%{-moz-transform:translate(0,-5px);}
  7%{-moz-transform:translate(0,0px);}
  100%{-moz-transform:translate(0,0px);}
}

.stb_sb8 {
    position: absolute;
    top: 12%;
    left: 0;
    right: 0;
    margin: auto;
    width: 95%;
}
.nanaco1 {
    position: absolute;
    top: 3.7%;
    left: 0;
    right: 0;
    margin: auto;
    width: 76%;
    z-index: 3;
}


.nanaco2 {
    position: absolute;
    top: 21.5%;
    left: 0;
    right: 0;
    margin: auto;
    width: 74%;
    z-index: 9;
}




.nanaco3 {
    position: absolute;
    top: 58%;
    left: 0%;
    right: 0;
    margin: auto;
    width: 69%;
}

.nanaco4 {
    position: absolute;
    top: 62%;
    left: 0;
    right: 0;
    margin: auto;
    width: 91%;
    z-index: 999;
}
.nanaco5 {
    position: absolute;
    top: 72.7%;
    left: 0;
    right: 0;
    margin: auto;
    width: 98%;
}


.nanaco6 {
    position: absolute;
    top: 36.2%;
    left: 0;
    right: 0%;
    margin: auto;
    width: 74%;
}


.nanaco7 {
    position: absolute;
    top: 44%;
    left: 0;
    right: 0;
    margin: auto;
    width: 61%;
}

.nanaco8 {
    position: absolute;
    top: 1%;
    left: 2.5%;
    /* right: 0; */
    margin: auto;
    width: 93%;
}
.nanaco4_2 {
    position: absolute;
    top: 9%;
    left: 0;
    right: 0;
    margin: auto;
    width: 80%;
    z-index: 999;
}
.nanaco4_3 {
    position: absolute;
    top: 22%;
    left: 0;
    right: 0;
    margin: auto;
    width: 72%;
    z-index: 99999;
}
.nanaco5_2 {
    position: absolute;
    top: 87%;
    left: 12%;
    /* right: 0; */
    margin: auto;
    width: 46%;
    z-index: 3;
}
.nanaco5_3 {
    position: absolute;
    top: 80%;
    left: 0;
    right: 0;
    margin: auto;
    width: 79%;
    z-index: 2;
}
.contents2 {
    top: 0px;
    position: relative;
    margin: 27px 0px;
    /* overflow: hidden; */
}
 .btn_e{
    margin-top: 30px;
}
/****--------- ふりこ ---------****/
.pendulum{
  transform-origin:top;
  -webkit-transform-origin:top;
  -moz-transform-origin:top;
  animation:pendulum ease-in-out 3s infinite alternate;
  -webkit-animation:pendulum ease-in-out 3s infinite alternate;
  -moz-animation:pendulum ease-in-out 3s infinite alternate;
 }
@keyframes pendulum{
  0%{transform: rotate(10deg);}
  100%{transform: rotate(-10deg);}
}
@-webkit-keyframes pendulum{
  0%{-webkit-transform: rotate(10deg);}
  100%{-webkit-transform: rotate(-10deg);}
}
@-moz-keyframes pendulum{
  0%{-moz-transform: rotate(10deg);}
  100%{-moz-transform: rotate(-10deg);}
}
.area_tex{
    padding: 20px;
    text-align: center;
    height: 500px;
}

.kaisha {
width: 100%;
}

.kaisha th,
.kaisha td {
border: 1px solid #ccc;
padding: 20px;
}

.kaisha th {
font-weight: bold;
background-color: #dedede; 
}



*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;
}

.btn,
a.btn,
button.btn {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn--orange,
a.btn--orange {
  color: #fff;
  background-color: #eb6100;
}

.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: #f56500;
}

 .btn_a{
    margin: 20px auto;
    text-align: center;
}