html  {
  overflow-x: hidden;
}


body {
  position: relative;
  overflow-x: hidden;
  margin: 0px ;
  padding: 0px ;
}


/* ------------------------------ */
/* ------------------------------ */



/* ------------------------------ */
/* ------------------------------ */


  .SlideShowStage {
    position:relative;
    margin:0px;
    padding:0px;
  }

  .SlideShowPhoto {
    position:absolute;
    z-index:1;
    top:0px;
    left:0px;
    margin:0px;
    padding:0px;
    object-fit:cover;
    opacity:0;
  }

  /* ------------------------------ */

  .PhotoLateralMoveStage {
    position:relative;
    margin:0px;
    padding:0px;
    overflow-x: hidden;
  }

  .PhotoLateralMoveStage .Photo {
    position:absolute;
    margin:0px;
    padding:0px;
    border:0px;
    object-fit:cover;
  }


  /* ------------------------------ */

  .LateralMoveStage {
    position:relative;
    margin:0px;
    padding:0px;
    overflow-x: hidden;
  }

  .LateralMoveStage .Contents {
    position:absolute;
/*
    margin:0px;
    padding:0px;
*/
    text-align:left;
  }

  .LateralMoveStage .Contents .Photo {
    position:static;
    margin:0px;
    padding:0px;
    border:0px;
    width:100%;
  }


/* ------------------------------ */

/*
.ContentsSlideInArea{
  position:relative;
  width:100%;
  overflow-x:hidden;
}

.ContentsSlideInPosition{
  margin:0px;
  padding:0px;
}

.ContentsSlideIn {
  width:100%;
  margin:0px;
  padding:0px;
  text-align:left;
  word-break: break-all;
}
*/

/* ------------------------------ */
  
.ContentsFlyingPosition{
  /*  position:relative; */
    margin:0px;
    padding:0px;
  }
  
  .ContentsFlying {
  /*
    position:absolute;
    top:0;
    left:0;
  */
    margin:0px;
    padding:0px;
  }
  
  /* ------------------------------ */

  .ScrollChangeStage {
    position:relative;
    margin:0px;
    padding:0px;
  }
  
  .ScrollChangePhoto {
    position:absolute;
    z-index:-1;
    top:0;
    left:0;
    opacity:1;
  }

  /* ------------------------------ */
  
  .PhotoCoverStage {
    position:static;
    margin:0px;
    padding:0px;
    width:100%;
    height:100vh;
  }
  
  .PhotoCover {
    position:absolute;
    object-fit:cover;
    width:100%;
    height:100vh;
    border:0px;
    z-index:-1;
  }

  .PhotoCoverBack {
    position:absolute;
    object-fit:cover;
    width:100%;
    height:100vh;
    border:0px;
    z-index:-2;
  }

  .PhotoCoverOverStage {
    display:table;
    margin:0px;
    padding:0px;
    width:100%;
    height:100vh;
  }
  
  .PhotoCoverOver {
    display:table-cell;
    object-fit:cover;
    width:100%;
    height:100vh;
    text-align:center;
    vertical-align:middle;
  }

  .PhotoCoverTxt {
    padding: 50px 0px 50px 0px;
    width:100%;
    margin:0px;
    text-align:center;
  }

/* ------------------------------ */
  
   
  .Photofit {
    object-fit:cover;
  }
    
    
/* ------------------------------ */

.PhotoPileupArea {
  position:relative;
  margin:0px;
  padding:0px;
}

.PhotoPileupStage {
  display:table;
  width:100%;
  height:100vh;
  margin:0px;
  padding:0px;
}

.PhotoPileup {
  position:static;
  object-fit:cover;
  width:100%;
  height:100vh;
  margin:0px;
  padding:0px;
}

/* ------------------------------ */

  .PhotoStepChange {
  /*  position:relative; */
    margin:0px;
    padding:0px;
  }

  .PhotoStepStage {
    position:relative;
/*    display:table; */
    margin:0px;
    padding:0px;
    width:100%;
    height:110vh;
    margin:0px;
    padding:0px;
    z-index:-1;
  }
  
  .PhotoStep {
    position:absolute;
    top:0;
    left:0;
    object-fit:cover;
    width:100%;
    height:110vh;
    margin:0px;
    padding:0px;
    opacity:1;
  }
  
  .PhotoStepOver {
  /*  display:table-cell; */
    width:100%;
    height:100vh;
    margin:0px;
    padding:0px;
    text-align:center;
    vertical-align:top;
    z-index:99;
  }
  
  .PhotoStepTxt {
    padding: 50px 0px 50px 0px;
    width:100%;
    margin:0px;
    text-align:center;
  }
  
/* ------------------------------ */

.TextContentsArea {
  position:relative;
  width:100%;
  max-width:1000px;
  margin:0px auto 0px auto;
  padding:0px;
}

.TextContentsArea .TextContents {
/*  position:absolute; */
  text-align:left;
}

/* ------------------------------ */

.PhotoEnlargementStage {
  width:100%;
  max-width:1200px;
  margin:10px auto 10px auto;
  padding:10px;
  text-align:left;
}

.PhotoEnlargementStage .View {
  width:100%;
  margin:0px auto 0px auto;
  object-fit:cover;
  object-position:50% 50%;
}

.PhotoEnlargementStage .Photo {
  display:inline;
  object-fit:cover;
  object-position:50% 50%;
  width:50px;
  height:50px;
  margin:0px 5px 5px 0px;
  border:0px;
  cursor:pointer;
}

/* ------------------------------ */

.LargeMoveSmallStage {
  width:100%;
  height:100vh;
  margin:0px;
  padding:0px;
}

.SmallMoveLargeStage {
  width:100%;
  height:100vh;
  margin:0px;
  padding:0px;
}

.LargeMoveSmallBefore {
  object-fit:cover;
  object-position:50% 50%;
  width:100%;
  height:100vh;
}

.SmallMoveLargeAfter {
  object-fit:cover;
  object-position:50% 50%;
  width:100%;
  height:100vh;
}

/* ------------------------------ */
/* ------------------------------ */

  
  .header {
    clear: both ;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    margin: 0px 0px 0px 0px ;
    padding: 0px 0px 0px 0px ;
    background: #FFFFFF url('') ;
    border: 0px ;
/*    border-bottom:double 3px #333333; */
    text-align: center;
  }
  
  .header_shadow {
    width: 100%;
    height: 50px;
    margin: 0px 0px 0px 0px ;
    padding: 0px 0px 0px 0px ;
    border: 0px ;
  }
  
  .hearer_top {
  /*  width: 980px; */
    height: 50px;
    margin: 0px auto 0px auto ;
    padding: 0px 0px 0px 0px ;
  }
  
  .header_title {
    float: left;
    width: 80%;
    height: 50px;
    margin: 0px 0px 0px 0px ;
    padding: 0px 0px 0px 0px ;
    border: 0px ;
    text-align: left;
    line-height: 1.0;
  }
  
  .header_menubotton {
    float: right;
    width: 50px;
    height: 50px;
    margin: 0px 0px 0px 0px ;
    padding: 0px 0px 0px 0px ;
    border: 0px ;
    text-align: right;
    line-height: 1.0;
  }

  #menuicon {
    cursor: pointer;
  }
  
  .mobilemenu {
    clear: both ;
    position: fixed;
    z-index: 990;
    top: 50;
    left: 0;
    width: 100%;
    margin: 0px 0px 0px 0px ;
    padding: 0px 0px 0px 0px ;
    border: 0px ;
    text-align: left;
    line-height: 1.0;
  }
  
  .mobilemenu_text {
  /*  width: 980px; */
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 0px ;
    border: 0px ;
    text-align: left;
    line-height: 1.5;
    color: #FFFFFF;
  }
  
  .mobiemenulinkstyle {
    color: #FFFFFF;
    text-decoration: underline;
    cursor: pointer;
  }
  

.hearer_top {
  width:100%;
  max-width:1000px;
}

.mobilemenu_text {
  width:100%;
  max-width:1000px;
}


/* ------------------------------ */

.linkposition {
/*  display: none; */
  opacity: 0;
  margin:0px 0px 50px 0px;
}

/* ------------------------------ */

.footermenulinkstyle {
  color: #0000FF;
  text-decoration: underline;
  cursor: pointer;
}

/* ------------------------------ */
/* ------------------------------ */
/* アニメーション  */

.AnimationBorderCircle {
  position: relative;
  width: 100%; /* コンテナの横幅 */
  height: 20px; /* コンテナの高さ */
  overflow: hidden;
  background: url('image/border_r.png') repeat-x center;
}  

.BorderCircle {
  position: absolute;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #FFFFFF;
  border:solid 2px #FF0000;
  animation: BorderAnimationCircle 5s linear infinite alternate-reverse;
}

@keyframes BorderAnimationCircle {
  0% {
    top: 10px;
    left: 0px;
    width: 0px;
    height: 0px;
    opacity: 0;
  }

  10% {
    opacity: 1;
  }

  20% {
    top: 0px;
    width: 20px;
    height: 20px;
    opacity: 1;
  }

  80% {
    top: 0px;
    width: 20px;
    height: 20px;
    opacity: 1;
  }

  90% {
    opacity: 1;
  }

  100% {
    top: 10px;
    left: 100%;
    width: 0px;
    height: 0px;
    opacity: 0;
  }
}

.AnimationBorderFlower {
  position: relative;
  width: 100%; /* コンテナの横幅 */
  height: 100px; /* コンテナの高さ */
  overflow: hidden;
  background: url('image/border_r.png') repeat-x center;
}  

.BorderFlower {
  position: absolute;
  width: 100px;
  height: 100px;
  animation: BorderAnimationFlower 5s linear infinite alternate-reverse;
}

@keyframes BorderAnimationFlower {
  0% {
    left: 0%;
    right: 100%;
    transform: scale(-1, 1);
  }

  10% {
    transform: scale(-1, 1);
  }

  90% {
    transform: scale(1, 1);
  }

  100% {
    left: 100%;
    right: 0%;
    transform: scale(1, 1);
  }
}