html {scroll-behavior: smooth;}


/* ------------------------------------------------ */
/* モーダルウィンドウ */
/* ------------------------------------------------ */
/* 共通：表示画像 */
.modal_img {
  width                 : 100% ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
}

/* ------------------------------------------------ */
/* モーダルウィンドウ01 */
/* 背景のマスク */
.modal01_close {
    display               : none;
    position              : absolute ;
    z-index               : +2 ;
    bottom                : 2.5% ; /*調整*/
    right                 : 9.5% ; /*調整*/
    width                 : 2.25vw ;
    height                : auto ;
    filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
    animation             : delay 0.3s linear;
}
.modal01_close:hover {opacity:0.6;}

/* 表示されるウィンドウの領域 */
.modal01 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 92.2%; /*調整*/
  margin-left           : 57.5%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 75%; /*調整*/
  height                : auto;
  animation             : pop-down 0.3s linear;
}
.modal01.show, .modal01_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal01_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  animation             : tsun2-L1 3.0s linear infinite ;
}
.modal01_put:hover { opacity : 0.6 ; }

/* ------------------------------------------------ */
/* モーダルウィンドウ02 */
/* 背景のマスク */
.modal02_close {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  bottom                : 25% ; /*調整*/
  right                 : 11% ; /*調整*/
  width                 : 2.25vw ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  animation             : delay 0.3s linear;
}
/* 表示されるウィンドウのデザイン */
.modal02 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 61.7%; /*調整*/
  margin-left           : 57.5%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 75%; /*調整*/
  height                : auto;
  animation             : pop-up 0.3s linear;
}
.modal02.show, .modal02_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal02_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  transform-origin      : center center 0 ;
  animation             : tsun2-L2 3.0s linear infinite ;
}
.modal02_put:hover { opacity: 0.6 ; }


/* ------------------------------------------------ */
/* モーダルウィンドウ03 */
/* 背景のマスク */
.modal03_close {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  bottom                : 18% ; /*調整*/
  right                 : 8.5% ; /*調整*/
  width                 : 2.25vw ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  animation             : delay 0.3s linear;
}
/* 表示されるウィンドウのデザイン */
.modal03 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 105.7%; /*調整*/
  margin-left           : 52.2%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 85%; /*調整*/
  height                : auto;
  animation             : pop-up 0.3s linear;
}
.modal03.show, .modal03_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal03_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  transform-origin      : center center 0 ;
  animation             : tsun2-L3 3.0s linear infinite ;
}
.modal03_put:hover { opacity: 0.6 ; }


/* 横スライダー01のボタン位置 */
.slider01_put {
  position              : absolute;
  z-index               : +2 ;
  bottom                : 51%; /*調整*/
  right                 : 16.7vw; /*調整*/
  width                 : 3vw;
  height                : 3vw;
  animation             : delay 0.3s linear ;
  animation-fill-mode   : both ;
  animation-delay       : 0.3s;
}

/* 横スライダー02のボタン位置 */
.slider02_put {
  position              : absolute;
  z-index               : +2 ;
  bottom                : 26%; /*調整*/
  right                 : 51.3vw; /*調整*/
  width                 : 3vw;
  height                : 3vw;
  animation             : delay 0.3s linear ;
  animation-fill-mode   : both ;
  animation-delay       : 0.3s;
}

/* ------------------------------------------------ */
/* モーダルウィンドウ04 */
/* 背景のマスク */
.modal04_close {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  bottom                : 37.2% ; /*調整*/
  right                 : 8% ; /*調整*/
  width                 : 2.25vw ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  animation             : delay 0.3s linear;
}
/* 表示されるウィンドウのデザイン */
.modal04 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 73%; /*調整*/
  margin-left           : 57.2%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 75%; /*調整*/
  height                : auto;
  animation             : pop-up 0.3s linear;
}
.modal04.show, .modal04_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal04_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  transform-origin      : center center 0 ;
  animation             : tsun2-L1 3.0s linear infinite ;
}
.modal04_put:hover { opacity : 0.6 ; }


/* ------------------------------------------------ */
/* モーダルウィンドウ05 */
/* 背景のマスク */
.modal05_close {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  bottom                : 36.5% ; /*調整*/
  right                 : 7.75% ; /*調整*/
  width                 : 2.25vw ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  animation             : delay 0.3s linear;
}
/* 表示されるウィンドウのデザイン */
.modal05 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 106.7%; /*調整*/
  margin-left           : 57.2%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 75%; /*調整*/
  height                : auto;
  animation             : pop-up 0.3s linear;
}
.modal05.show, .modal05_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal05_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  transform-origin      : center center 0 ;
  animation             : tsun2-L2 3.0s linear infinite ;
}
.modal05_put:hover { opacity : 0.6 ; }


/* ------------------------------------------------ */
/* モーダルウィンドウ06 */
/* 背景のマスク */
.modal06_close {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  bottom                : 36.5% ; /*調整*/
  right                 : 7.75% ; /*調整*/
  width                 : 2.25vw ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  animation             : delay 0.3s linear;
}
/* 表示されるウィンドウのデザイン */
.modal06 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 123.5%; /*調整*/
  margin-left           : 57.2%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 75%; /*調整*/
  height                : auto;
  animation             : pop-up 0.3s linear;
}
.modal06.show, .modal06_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal06_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  transform-origin      : center center 0 ;
  animation             : tsun2-L3 3.0s linear infinite ;
}
.modal06_put:hover { opacity : 0.6 ; }




/* ------------------------------------------------ */
/* モーダルウィンドウ07 */
/* 背景のマスク */
.modal07_close {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  bottom                : 40% ; /*調整*/
  right                 : 7.75% ; /*調整*/
  width                 : 2.25vw ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  animation             : delay 0.3s linear;
}
/* 表示されるウィンドウのデザイン */
.modal07 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 197.5%; /*調整*/
  margin-left           : 57.2%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 75%; /*調整*/
  height                : auto;
  animation             : pop-up 0.3s linear;
}
.modal07.show, .modal07_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal07_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  transform-origin      : center center 0 ;
  animation             : tsun2-L4 3.0s linear infinite ;
}
.modal07_put:hover { opacity : 0.6 ; }

/* ------------------------------------------------ */
/* モーダルウィンドウ08 */
/* 背景のマスク */
.modal08_close {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  bottom                : 30% ; /*調整*/
  right                 : 7.25% ; /*調整*/
  width                 : 2.25vw ;
  height                : auto ;
  filter                : drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  animation             : delay 0.3s linear;
}
/* 表示されるウィンドウのデザイン */
.modal08 {
  display               : none;
  position              : absolute ;
  z-index               : +2 ;
  margin-top            : 159%; /*調整*/
  margin-left           : 52.2%; /*調整*/
  transform             : translate(-50%, -50%) ;
  width                 : 85%; /*調整*/
  height                : auto;
  animation             : pop-up 0.3s linear;
}
.modal08.show, .modal08_close.show { display : block ;}

/* POPUPボタンのデザイン */
.modal08_put {
  cursor                : pointer ;
  filter                : drop-shadow( 1px 1px 2px rgba(0, 0, 0, 0.3)) ;
  transform-origin      : center center 0 ;
  animation             : tsun2-L1 3.0s linear infinite ;
}
.modal08_put:hover { opacity : 0.6 ; }