@charset "UTF-8";
#top #link01,
#top #link02,
#top #link03,
#top #link04,
#top #link05,
#top #link06 {
  margin-top: -150px;
  padding-top: 150px;
}
@media screen and (max-width: 820px) {
  #top #link01,
  #top #link02,
  #top #link03,
  #top #link04,
  #top #link05,
  #top #link06 {
    margin-top: -70px;
    padding-top: 70px;
  }
}
#top .secTitle.mb-35 {
  margin-bottom: 35px;
}
@media screen and (max-width: 820px) {
  #top .secTitle.mb-35 {
    margin-bottom: 20px;
  }
}
#top .secTitle.mb-40 {
  margin-bottom: 40px;
}
@media screen and (max-width: 820px) {
  #top .secTitle.mb-40 {
    margin-bottom: 20px;
  }
}
#top .secTitle.mb-85 {
  margin-bottom: 85px;
}
@media screen and (max-width: 820px) {
  #top .secTitle.mb-85 {
    margin-bottom: 40px;
  }
}
#top .headText {
  line-height: 26px;
  margin-bottom: 70px;
}
@media screen and (max-width: 520px) {
  #top .headText {
    line-height: 22px;
    margin-bottom: 35px;
    text-align: left;
  }
}
#top .blueBg {
  background-image: url(../images/top/blueBg@2x.jpg);
  background-repeat: repeat;
  background-size: 498px 498px;
  padding: 175px 0 70px;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  #top .blueBg {
    background-size: 20vw 20vw;
  }
}
@media screen and (max-width: 820px) {
  #top .blueBg {
    padding: 90px 0 50px;
  }
}
#top .blueBg::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/cloud@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  z-index: -1;
  top: 77px;
  animation: floating-y 1.8s ease-in-out infinite alternate-reverse;
}
#top .blueBg:after {
  position: absolute;
  content: "";
  background-image: url(../images/top/bgDeco01@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 120px;
  bottom: -119px;
  left: 0;
}
@media screen and (max-width: 1024px) {
  #top .blueBg:after {
    height: 8vw;
    bottom: -7.9vw;
  }
}
#top .blueBg .people01 {
  position: absolute;
  bottom: -95px;
  right: 86px;
  z-index: 1;
}
@media screen and (max-width: 1760px) {
  #top .blueBg .people01 {
    right: 1vw;
    width: 9.3vw;
  }
}
@media screen and (max-width: 820px) {
  #top .blueBg .people01 {
    bottom: -5vw;
    width: 70px;
  }
}
#top .blueBg .airplane {
  position: absolute;
  top: 600px;
  left: 0;
  z-index: -1;
  will-change: transform;
}
@media screen and (max-width: 1200px) {
  #top .blueBg .airplane {
    width: 310px;
    top: 670px;
  }
}
@media screen and (max-width: 820px) {
  #top .blueBg .airplane {
    top: 530px;
    width: 200px;
  }
}
@media screen and (max-width: 800px) {
  #top .blueBg .airplane {
    top: 650px;
  }
}
@media screen and (max-width: 520px) {
  #top .blueBg .airplane {
    top: 570px;
  }
}
@media screen and (max-width: 410px) {
  #top .blueBg .airplane {
    top: 630px;
  }
}
#top .beigeBg {
  background-image: url(../images/top/beigeBg@2x.jpg);
  background-repeat: repeat;
  background-size: 62px 60px;
  padding: 240px 0 80px;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  #top .beigeBg {
    background-size: 3vw 3vw;
    padding-top: 22vw;
  }
}
@media screen and (max-width: 820px) {
  #top .beigeBg {
    padding-bottom: 80px;
  }
}
#top .beigeBg:after {
  position: absolute;
  content: "";
  background-image: url(../images/top/bgDeco02@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 120px;
  bottom: -119px;
  left: 0;
}
@media screen and (max-width: 1024px) {
  #top .beigeBg:after {
    height: 8vw;
    bottom: -7.9vw;
  }
}
#top .beigeBg .people02 {
  position: absolute;
  bottom: -64px;
  left: 50px;
  z-index: 1;
}
@media screen and (max-width: 1760px) {
  #top .beigeBg .people02 {
    left: 1vw;
    width: 12vw;
  }
}
@media screen and (max-width: 820px) {
  #top .beigeBg .people02 {
    bottom: -9.8vw;
    left: 2vw;
    width: 100px;
  }
}
@media screen and (max-width: 520px) {
  #top .beigeBg .people02 {
    bottom: -13.4vw;
  }
}
#top .pinkBg {
  background-image: url(../images/top/pinkBg@2x.jpg);
  background-repeat: repeat;
  background-size: 90px 90px;
  padding: 240px 0 80px;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 1400px) {
  #top .pinkBg {
    padding-bottom: 13vw;
  }
}
@media screen and (max-width: 1024px) {
  #top .pinkBg {
    background-size: 5vw 5vw;
    padding-top: 22vw;
  }
}
@media screen and (max-width: 820px) {
  #top .pinkBg {
    padding-bottom: 50px;
  }
}
#top .pinkBg:after {
  position: absolute;
  content: "";
  background-image: url(../images/top/bgDeco03@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 120px;
  bottom: -119px;
  left: 0;
}
@media screen and (max-width: 1024px) {
  #top .pinkBg:after {
    height: 8vw;
    bottom: -7.9vw;
  }
}
#top .pinkBg .people03 {
  position: absolute;
  bottom: -98px;
  right: 70px;
  z-index: 1;
}
@media screen and (max-width: 1760px) {
  #top .pinkBg .people03 {
    right: 1vw;
    width: 7vw;
  }
}
@media screen and (max-width: 1300px) {
  #top .pinkBg .people03 {
    bottom: -6vw;
  }
}
@media screen and (max-width: 820px) {
  #top .pinkBg .people03 {
    bottom: -11.5vw;
    right: 2vw;
    width: 70px;
  }
}
@media screen and (max-width: 520px) {
  #top .pinkBg .people03 {
    bottom: -22.9vw;
    right: 2vw;
    width: 58.2px;
  }
}
#top .lantern {
  padding: 125px 0 115px;
}
@media screen and (max-width: 820px) {
  #top .lantern {
    padding: 60px 0;
  }
}
#top #main .mainImage {
  position: relative;
}
@media print {
  #top #main .mainImage .ipad__show {
    display: none !important;
  }
}
#top #main .mainImage .scroll_down {
  position: absolute;
  bottom: 1.565vw;
  right: 4.167vw;
  width: 16px;
}
@media screen and (max-width: 820px) {
  #top #main .mainImage .scroll_down {
    bottom: 5.73vw;
    right: 7vw;
  }
}
#top #main .mainImage .scroll_down::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #dc709b;
  animation: circlemove 1.6s ease-in-out infinite, cirlemovehide 1.6s ease-out infinite;
  z-index: 1;
}
@media screen and (max-width: 820px) {
  #top #main .mainImage .scroll_down::before {
    animation: circlemove_sp 1.6s ease-in-out infinite, cirlemovehide 1.6s ease-out infinite;
  }
}
#top #main .mainImage .scroll_down::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 2px;
  height: 104px;
  background: #fff;
  transform: translate(-50%, 0);
}
@media screen and (max-width: 820px) {
  #top #main .mainImage .scroll_down::after {
    height: 17vw;
  }
}
#top #main .mainImage .scroll_down .scrollIn {
  position: absolute;
  left: 0;
  bottom: 115px;
  width: 16px;
  height: 74px;
}
@media screen and (max-width: 820px) {
  #top #main .mainImage .scroll_down .scrollIn {
    bottom: 20vw;
  }
}
#top #lead .leadText {
  font-size: 20px;
  line-height: 39px;
}
@media screen and (max-width: 820px) {
  #top #lead .leadText {
    font-size: 18px;
  }
}
@media screen and (max-width: 520px) {
  #top #lead .leadText {
    font-size: 16px;
    text-align: left;
  }
}
#top #lead .leadText span {
  font-size: 30px;
  font-weight: bold;
  color: #179798;
  background: linear-gradient(180deg, transparent 0%, transparent 65%, rgba(220, 112, 155, 0.45) 65%, rgba(220, 112, 155, 0.45) 100%);
}
@media screen and (max-width: 820px) {
  #top #lead .leadText span {
    font-size: 26px;
  }
}
@media screen and (max-width: 520px) {
  #top #lead .leadText span {
    font-size: 24px;
  }
}
#top #recommend {
  margin-top: 180px;
}
@media screen and (max-width: 820px) {
  #top #recommend {
    margin-top: 90px;
  }
}
@media screen and (max-width: 820px) {
  #top #recommend .secTitle {
    margin-bottom: 85px;
  }
}
#top #recommend .title02 {
  display: inline-block;
  position: relative;
}
@media screen and (max-width: 1024px) {
  #top #recommend .title02 {
    padding-right: 70px;
  }
}
@media screen and (max-width: 520px) {
  #top #recommend .title02 {
    padding-right: 40px;
  }
}
#top #recommend .title02::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/title02Deco@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 43px;
  height: 53px;
  top: 50%;
  right: -61px;
  transform: translate(0, -50%);
}
@media screen and (max-width: 1024px) {
  #top #recommend .title02::before {
    right: 0;
  }
}
@media screen and (max-width: 520px) {
  #top #recommend .title02::before {
    width: 24px;
    height: 31px;
    top: 63%;
  }
}
#top #recommend .pointFlex {
  max-width: 1000px;
  margin: 0 auto;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #top #recommend .pointFlex {
    justify-content: space-between;
  }
}
#top #recommend .pointFlex + .pointFlex {
  margin-top: 85px;
}
#top #recommend .pointFlex .pointItem {
  width: 30.7%;
  opacity: 0;
  transform: translateY(100px);
}
@media print {
  #top #recommend .pointFlex .pointItem {
    opacity: 1;
    transform: translateY(0px);
  }
}
#top #recommend .pointFlex .pointItem.point02 {
  margin-left: 40px;
}
@media screen and (max-width: 820px) {
  #top #recommend .pointFlex .pointItem.point02 {
    margin-left: 0;
  }
}
#top #recommend .pointFlex .pointItem.active {
  animation: popUp 0.5s ease forwards;
}
#top #recommend .pointFlex .pointItem:nth-child(2) {
  animation-delay: 0.3s;
}
#top #recommend .pointFlex .pointItem:nth-child(3) {
  animation-delay: 0.6s;
}
@media screen and (max-width: 820px) {
  #top #recommend .pointFlex .pointItem:nth-child(3) {
    animation-delay: 0s;
    margin-top: 85px;
  }
}
@media screen and (max-width: 820px) {
  #top #recommend .pointFlex .pointItem {
    width: 47%;
  }
}
@media screen and (max-width: 520px) {
  #top #recommend .pointFlex .pointItem {
    width: 100%;
  }
  #top #recommend .pointFlex .pointItem + .pointItem {
    margin-top: 85px;
  }
}
#top #recommend .pointFlex .pointItem .pointImage {
  position: relative;
  margin-bottom: 20px;
}
@media screen and (max-width: 520px) {
  #top #recommend .pointFlex .pointItem .pointImage {
    width: 80%;
    margin: 0 auto 20px;
  }
}
#top #recommend .pointFlex .pointItem .pointImage .point {
  position: absolute;
  top: -45px;
  left: -18px;
}
@media screen and (max-width: 520px) {
  #top #recommend .pointFlex .pointItem .pointImage .point {
    width: 100px;
    top: -25px;
    left: 0;
  }
}
#top #recommend .pointFlex .pointItem .pointTitle {
  font-size: 26px;
  font-weight: bold;
  color: #dc709b;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  #top #recommend .pointFlex .pointItem .pointTitle {
    font-size: 22px;
    margin-bottom: 5px;
  }
}
#top #recommend .pointFlex .pointItem .pointText {
  line-height: 26px;
}
@media screen and (max-width: 520px) {
  #top #recommend .pointFlex .pointItem .pointText {
    line-height: 22px;
  }
}
#top #movie {
  margin-top: 115px;
}
@media screen and (max-width: 820px) {
  #top #movie {
    margin-top: 60px;
  }
}
#top #movie .title03 {
  display: inline-block;
  position: relative;
}
@media screen and (max-width: 1024px) {
  #top #movie .title03 {
    padding-right: 70px;
  }
}
@media screen and (max-width: 520px) {
  #top #movie .title03 {
    padding-right: 45px;
  }
}
#top #movie .title03::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/title03Deco@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 48px;
  height: 57px;
  top: 50%;
  right: -61px;
  transform: translate(0, -50%);
}
@media screen and (max-width: 1024px) {
  #top #movie .title03::before {
    right: 0;
  }
}
@media screen and (max-width: 520px) {
  #top #movie .title03::before {
    width: 33px;
    height: 40px;
    top: 62%;
  }
}
@media screen and (max-width: 820px) {
  #top #movie .movieFlex {
    flex-direction: column;
  }
}
#top #movie .movieFlex .movieItem {
  width: 27.1%;
}
@media screen and (max-width: 820px) {
  #top #movie .movieFlex .movieItem {
    width: 60%;
    margin: 0 auto;
  }
  #top #movie .movieFlex .movieItem + .movieItem {
    margin-top: 30px;
  }
}
@media screen and (max-width: 520px) {
  #top #movie .movieFlex .movieItem {
    width: 80%;
  }
}
#top #movie .movieFlex .movieItem:hover {
  cursor: pointer;
}
#top #movie .movieFlex .movieItem .blueTitle {
  color: #179798;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 10px;
}
#top #movie .movieFlex .movieItem .movieText {
  margin-top: 20px;
  font-size: 20px;
}
@media screen and (max-width: 820px) {
  #top #movie .movieFlex .movieItem .movieText {
    margin-top: 10px;
  }
}
@media screen and (max-width: 520px) {
  #top #movie .movieFlex .movieItem .movieText {
    font-size: 16px;
  }
}
#top #spot .title04 {
  display: inline-block;
  position: relative;
}
@media screen and (max-width: 1024px) {
  #top #spot .title04 {
    padding-right: 70px;
  }
}
@media screen and (max-width: 520px) {
  #top #spot .title04 {
    padding-right: 35px;
  }
}
#top #spot .title04::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/title04Deco@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 48px;
  height: 57px;
  top: 50%;
  right: -61px;
  transform: translate(0, -50%);
}
@media screen and (max-width: 1024px) {
  #top #spot .title04::before {
    right: 0;
  }
}
@media screen and (max-width: 520px) {
  #top #spot .title04::before {
    width: 24px;
    height: 34px;
    top: 61%;
  }
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex {
    flex-direction: column-reverse;
  }
}
@media print {
  #top #spot .spotFlex {
    page-break-inside: avoid;
    padding-top: 40px;
  }
}
#top #spot .spotFlex.row {
  flex-direction: row-reverse;
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex.row {
    flex-direction: column-reverse;
  }
}
#top #spot .spotFlex + .spotFlex {
  margin-top: 90px;
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex + .spotFlex {
    margin-top: 65px;
  }
}
#top #spot .spotFlex .sliderText {
  width: 39.25%;
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex .sliderText {
    width: 100%;
  }
}
#top #spot .spotFlex .sliderText .spotTextArea .spotName {
  color: #179798;
  font-size: 20px;
  font-weight: bold;
  position: relative;
  padding-left: 21px;
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex .sliderText .spotTextArea .spotName {
    font-size: 18px;
  }
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderText .spotTextArea .spotName {
    font-size: 16px;
    margin-bottom: 5px;
  }
}
#top #spot .spotFlex .sliderText .spotTextArea .spotName::before {
  position: absolute;
  content: "";
  background-color: #179798;
  width: 14px;
  height: 1px;
  left: 0;
  top: 50%;
  transform: translate(0, -50%);
}
#top #spot .spotFlex .sliderText .spotTextArea .spotTitle {
  font-size: 26px;
  font-weight: bold;
  color: #179798;
  margin-bottom: 20px;
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex .sliderText .spotTextArea .spotTitle {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderText .spotTextArea .spotTitle {
    font-size: 24px;
    line-height: 1;
  }
}
#top #spot .spotFlex .sliderText .spotTextArea .spotTitle span {
  font-size: 18px;
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderText .spotTextArea .spotTitle span {
    font-size: 16px;
  }
}
#top #spot .spotFlex .sliderText .spotTextArea .spotText {
  line-height: 28px;
}
#top #spot .spotFlex .sliderImage {
  width: 53.3%;
  position: relative;
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex .sliderImage {
    width: 100%;
  }
}
#top #spot .spotFlex .sliderImage.sliderImage01::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/spotBaloon01@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 124px;
  height: 104px;
  top: -45px;
  left: 13px;
  z-index: 1;
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderImage.sliderImage01::before {
    width: 81px;
    height: 71px;
    top: -29px;
    left: -5px;
  }
}
#top #spot .spotFlex .sliderImage.sliderImage01::after {
  position: absolute;
  content: "";
  background-image: url(../images/top/spotItem01@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 121px;
  height: 84px;
  bottom: -23px;
  right: -38px;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  #top #spot .spotFlex .sliderImage.sliderImage01::after {
    width: 102px;
    height: 71px;
    bottom: -23px;
    right: -20px;
  }
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderImage.sliderImage01::after {
    width: 69px;
    height: 50px;
    bottom: -15px;
    right: -10px;
  }
}
#top #spot .spotFlex .sliderImage.sliderImage02::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/spotBaloon02@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 124px;
  height: 104px;
  top: -40px;
  right: 30px;
  z-index: 1;
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderImage.sliderImage02::before {
    width: 81px;
    height: 71px;
    top: -29px;
    right: -5px;
  }
}
#top #spot .spotFlex .sliderImage.sliderImage02::after {
  position: absolute;
  content: "";
  background-image: url(../images/top/spotItem02@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 119px;
  height: 92px;
  bottom: -23px;
  left: -21px;
  z-index: 1;
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderImage.sliderImage02::after {
    width: 81px;
    height: 65px;
    bottom: -12px;
    left: -10px;
  }
}
#top #spot .spotFlex .sliderImage.sliderImage03::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/spotBaloon03@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 124px;
  height: 104px;
  top: -40px;
  left: 13px;
  z-index: 1;
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderImage.sliderImage03::before {
    width: 81px;
    height: 71px;
    top: -29px;
    left: -5px;
  }
}
#top #spot .spotFlex .sliderImage.sliderImage03::after {
  position: absolute;
  content: "";
  background-image: url(../images/top/spotItem03@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 112px;
  height: 122px;
  bottom: -30px;
  right: -53px;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  #top #spot .spotFlex .sliderImage.sliderImage03::after {
    width: 92px;
    height: 100px;
    bottom: -30px;
    right: -20px;
  }
}
@media screen and (max-width: 520px) {
  #top #spot .spotFlex .sliderImage.sliderImage03::after {
    width: 58px;
    height: 65px;
    bottom: -14px;
    right: -10px;
  }
}
#top #spot .spotFlex .sliderImage .slick-dots {
  bottom: -30px;
}
@media screen and (max-width: 820px) {
  #top #spot .spotFlex .sliderImage .slick-dots {
    bottom: -20px;
  }
}
#top #spot .spotFlex .sliderImage .slick-dots li {
  width: 11px;
  height: 11px;
  margin: 0;
}
#top #spot .spotFlex .sliderImage .slick-dots li + li {
  margin-left: 20px;
}
#top #spot .spotFlex .sliderImage .slick-dots li.slick-active button::before {
  color: #dc709b;
}
#top #spot .spotFlex .sliderImage .slick-dots li button {
  width: 11px;
  height: 11px;
}
#top #spot .spotFlex .sliderImage .slick-dots li button::before {
  font-size: 11px;
  width: 11px;
  height: 11px;
  color: #bcbcbc;
  opacity: 1;
}
#top #movie02 .title05 {
  display: inline-block;
  position: relative;
}
@media screen and (max-width: 1024px) {
  #top #movie02 .title05 {
    padding-right: 110px;
  }
}
@media screen and (max-width: 520px) {
  #top #movie02 .title05 {
    padding-right: 60px;
  }
}
#top #movie02 .title05::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/title05Deco@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 88px;
  height: 52px;
  top: 41%;
  right: -102px;
  transform: translate(0, -50%);
}
@media screen and (max-width: 1024px) {
  #top #movie02 .title05::before {
    right: 0;
  }
}
@media screen and (max-width: 520px) {
  #top #movie02 .title05::before {
    width: 47px;
    height: 29px;
    top: 59%;
  }
}
@media screen and (max-width: 820px) {
  #top #movie02 .movieFlex {
    flex-direction: column;
  }
}
#top #movie02 .movieFlex .movieItem {
  width: 27.1%;
}
@media screen and (max-width: 820px) {
  #top #movie02 .movieFlex .movieItem {
    width: 60%;
    margin: 0 auto;
  }
  #top #movie02 .movieFlex .movieItem + .movieItem {
    margin-top: 30px;
  }
}
@media screen and (max-width: 520px) {
  #top #movie02 .movieFlex .movieItem {
    width: 80%;
  }
}
#top #movie02 .movieFlex .movieItem:hover {
  cursor: pointer;
}
#top #movie02 .movieFlex .movieItem .blueTitle {
  color: #179798;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 10px;
}
@media screen and (max-width: 520px) {
  #top #movie02 .movieFlex .movieItem .blueTitle {
    font-size: 20px;
  }
}
#top #movie02 .movieFlex .movieItem .movieText {
  margin-top: 20px;
  font-size: 20px;
}
@media screen and (max-width: 820px) {
  #top #movie02 .movieFlex .movieItem .movieText {
    margin-top: 10px;
  }
}
@media screen and (max-width: 520px) {
  #top #movie02 .movieFlex .movieItem .movieText {
    font-size: 16px;
  }
}
#top #photo .title06 {
  display: inline-block;
  position: relative;
}
@media screen and (max-width: 1100px) {
  #top #photo .title06 {
    padding-right: 105px;
  }
}
@media screen and (max-width: 520px) {
  #top #photo .title06 {
    padding-right: 45px;
  }
}
#top #photo .title06::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/title06Deco@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 86px;
  height: 58px;
  top: 50%;
  right: -100px;
  transform: translate(0, -50%);
}
@media screen and (max-width: 1100px) {
  #top #photo .title06::before {
    right: 0;
  }
}
@media screen and (max-width: 520px) {
  #top #photo .title06::before {
    width: 38px;
    height: 26px;
    top: 66%;
  }
}
#top #photo .photoFlex {
  flex-wrap: wrap;
}
#top #photo .photoFlex .photoItem {
  width: 19%;
}
#top #photo .photoFlex .photoItem:nth-child(n+6) {
  margin-top: 2%;
}
@media screen and (max-width: 820px) {
  #top #photo .photoFlex .photoItem {
    width: 24%;
  }
  #top #photo .photoFlex .photoItem:nth-child(n+5) {
    margin-top: 1.5%;
  }
}
@media screen and (max-width: 520px) {
  #top #photo .photoFlex .photoItem {
    width: 48%;
  }
  #top #photo .photoFlex .photoItem:nth-child(n+3) {
    margin-top: 4%;
  }
}
#top #photo .photoFlex .photoItem:hover {
  cursor: pointer;
}
#top #report .title07 {
  display: inline-block;
  position: relative;
}
@media screen and (max-width: 1024px) {
  #top #report .title07 {
    padding-right: 120px;
  }
}
@media screen and (max-width: 520px) {
  #top #report .title07 {
    padding-right: 50px;
  }
}
#top #report .title07::before {
  position: absolute;
  content: "";
  background-image: url(../images/top/title07Deco@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 102px;
  height: 100px;
  top: 50%;
  right: -133px;
  transform: translate(0, -50%);
}
@media screen and (max-width: 1024px) {
  #top #report .title07::before {
    right: 0;
  }
}
@media screen and (max-width: 520px) {
  #top #report .title07::before {
    width: 37px;
    height: 38px;
  }
}
#top #report .reportBox + .reportBox {
  margin-top: 135px;
}
@media screen and (max-width: 820px) {
  #top #report .reportBox + .reportBox {
    margin-top: 60px;
  }
}
#top #report .reportBox .reportTitle {
  position: relative;
  margin-bottom: 30px;
}
@media screen and (max-width: 520px) {
  #top #report .reportBox .reportTitle {
    zoom: 0.7;
  }
}
#top #report .reportBox .reportTitle::before, #top #report .reportBox .reportTitle:after {
  position: absolute;
  content: "";
  background-color: #179798;
  height: 1px;
  top: 50%;
  transform: translate(0, -50%);
}
#top #report .reportBox .reportTitle::before {
  left: 0;
}
#top #report .reportBox .reportTitle:after {
  right: 0;
}
#top #report .reportBox .reportTitle.reportTitle01::before, #top #report .reportBox .reportTitle.reportTitle01::after, #top #report .reportBox .reportTitle.reportTitle02::before, #top #report .reportBox .reportTitle.reportTitle02::after {
  width: calc(50% - 90px);
}
#top #report .reportBox .reportTitle.reportTitle03::before, #top #report .reportBox .reportTitle.reportTitle03::after {
  width: calc(50% - 150px);
}
#top #report .reportBox .reportFlex {
  flex-wrap: wrap;
}
#top #report .reportBox .reportFlex .reportItem {
  background-color: #fff;
  border-radius: 10px;
  width: 48.75%;
  padding: 35px 40px;
}
#top #report .reportBox .reportFlex .reportItem:nth-child(n+3) {
  margin-top: 30px;
}
@media screen and (max-width: 820px) {
  #top #report .reportBox .reportFlex .reportItem {
    width: 100%;
  }
  #top #report .reportBox .reportFlex .reportItem:nth-child(n+2) {
    margin-top: 15px;
  }
}
@media screen and (max-width: 520px) {
  #top #report .reportBox .reportFlex .reportItem {
    padding: 20px;
  }
}
#top #report .reportBox .reportFlex .reportItem .detailTitle {
  font-size: 24px;
  font-weight: bold;
  color: #dc709b;
  margin-bottom: 15px;
}
@media screen and (max-width: 520px) {
  #top #report .reportBox .reportFlex .reportItem .detailTitle {
    font-size: 20px;
    margin-bottom: 7px;
  }
}
#top #report .reportBox .reportFlex .reportItem .reportText {
  line-height: 26px;
}
@media screen and (max-width: 520px) {
  #top #report .reportBox .reportFlex .reportItem .reportText {
    line-height: 22px;
  }
}
#top #link .linkBg {
  background-color: #fcfaf0;
  padding: 225px 0;
}
@media screen and (max-width: 1024px) {
  #top #link .linkBg {
    padding: 18vw 0 18vw;
  }
}
@media screen and (max-width: 820px) {
  #top #link .linkBg .secTitle img {
    zoom: 0.7;
  }
}
@media screen and (max-width: 520px) {
  #top #link .linkBg .secTitle img {
    zoom: 0.5;
  }
}
#top #link .linkBg .linkFlex {
  margin: 0 auto;
  flex-wrap: wrap;
}
#top #link .linkBg .linkFlex .linkItem {
  filter: drop-shadow(5px 5px 1px rgba(0, 0, 0, 0.1));
  width: 23.75%;
}
@media screen and (max-width: 520px) {
  #top #link .linkBg .linkFlex .linkItem {
    width: 48.3%;
  }
  #top #link .linkBg .linkFlex .linkItem:nth-child(n+3) {
    margin-top: 10px;
  }
}
@media print {
  #top .fadein {
    opacity: 1 !important;
    transform: translateY(0px) !important;
  }
}

#modal,
#imgModal {
  display: none;
  position: fixed;
  z-index: 999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(89, 89, 89, 0.7);
  justify-content: center;
  align-items: center;
}
#modal .modal-content,
#imgModal .modal-content {
  position: relative;
  margin-top: 60px;
  width: 90%;
  max-width: 45vh;
}
@media screen and (max-width: 820px) {
  #modal .modal-content,
  #imgModal .modal-content {
    margin-top: 40px;
  }
}
#modal .modal-content video,
#imgModal .modal-content video {
  width: 100%;
  max-height: 80vh;
}
#modal .imageArea,
#imgModal .imageArea {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 90%;
  max-height: 80vh;
  display: inline-block; /* これが重要 */
  margin-top: 60px;
}
@media screen and (max-width: 820px) {
  #modal .imageArea,
  #imgModal .imageArea {
    margin-top: 40px;
  }
}
#modal .imageArea img,
#imgModal .imageArea img {
  display: block;
  max-width: 100%;
  max-height: 80vh;
  width: auto;
  height: auto;
}
#modal .close,
#imgModal .close {
  position: absolute;
  top: -60px;
  right: 0;
  cursor: pointer;
  background-image: url(../images/top/close@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 50px;
  height: 50px;
}
@media screen and (max-width: 820px) {
  #modal .close,
  #imgModal .close {
    width: 30px;
    height: 30px;
    top: -40px;
  }
}

@keyframes leftIn {
  from {
    transform: translate(0, 0);
  }
  to {
    transform: translate(40vw, -70px);
  }
}
@keyframes circlemove {
  0% {
    bottom: 104px;
  }
  100% {
    bottom: 0px;
  }
}
@keyframes circlemove_sp {
  0% {
    bottom: 17vw;
  }
  100% {
    bottom: 0px;
  }
}
@keyframes cirlemovehide {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  80% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
  }
}
@keyframes popUp {
  0% {
    opacity: 0;
    transform: translateY(80px);
  }
  50% {
    opacity: 1;
    transform: translateY(-40px);
  }
  75% {
    transform: translateY(20px);
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes floating-y {
  0% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(10px);
  }
}