header {
   position: relative;
}

header .logo {
   position: absolute;
   left: 50%;
   transform: translate(-50%, -50%);
}

header {
   position: relative;
}

header .logo {
   position: absolute;
   left: 50%;
   transform: translate(-50%, -50%);
}

@media screen and (max-width: 767px) {
   header {
      height: 110vw;
   }

   header .logo {
      width: 25vw;
      top: 50%;
   }

   header h1 {
      max-width: 100%;
      box-sizing: border-box;
      /*position: absolute;
      bottom: 0;
      left: 0;*/
   }

   header .img {
      width: 100%;
      height: 110vw;
   }

   header .img img {
      width: 100%;
      max-width: inherit;
      height: 100%;
      object-fit: cover;
      object-position: -60vw 0vw;
   }
}

@media screen and (min-width: 768px) {
   html.responsive section img {
      max-width: 100%;
   }

   header {
      height: 820px;
      padding-top: 80px;
   }

   header .logo {
      top: calc(50% + 40px);
   }

   header h1 {
      max-width: 100%;
      box-sizing: border-box;
      position: absolute;
      top: 900px;
      left: 0;
   }

   header .img {
      width: 100%;
      height: 820px;
   }

   header .img img {
      width: 100%;
      max-width: inherit;
      height: 100%;
      object-fit: cover;
   }
}

#sec1 {
   position: relative;
}

@media screen and (max-width: 767px) {
   #sec1 {
      padding-bottom: 20vw;
	   padding-top: 25vw;
   }

   #sec1:before {
      content: '';
      width: 20vw;
      height: 100%;
      background: url("../img/shared/bg1.jpg") repeat center top/cover;
      position: absolute;
      top: 0;
      left: 0;
   }

   #sec1:after {
      content: '';
      width: 100%;
      height: 100%;
      background: url("../img/anniversary/sec1-deco.png") no-repeat center bottom/100% auto;
      position: absolute;
      top: 0;
      left: 0;
   }

   #sec1 .wrap:before {
      content: '';
      width: auto;
      height: 80vw;
      background: url("../img/anniversary/sec1-photo.jpg") no-repeat center top/cover;
      position: absolute;
      top: 0;
      right: 6.25%;
      left: 6.25%;
   }

   #sec1 h2 {
      padding: 29vw 5vw 20vw;
      position: relative;
      color: #fff;
	   letter-spacing: 0.35em;
   }

   #sec1 .txt {
      padding-top: 8vw;
	   position: relative;
        z-index: 1;
   }
}

@media screen and (min-width: 768px) {
   #sec1 {
      padding: 210px 0 187px;
   }

   #sec1:before {
      content: '';
      width: calc(50% - 356px);
      height: 100%;
      background: url("../img/shared/bg1.jpg") repeat center top;
      position: absolute;
      top: 0;
      left: 0;
   }

   #sec1:after {
      content: '';
      width: 100%;
      height: 100%;
      background: url("../img/anniversary/sec1-deco.png") no-repeat center bottom;
      position: absolute;
      top: 0;
      left: 0;
   }

   #sec1 .wrap:before {
      content: '';
      width: auto;
      height: 533px;
      background: url("../img/anniversary/sec1-photo.jpg") no-repeat center top;
      position: absolute;
      top: 0;
      right: -100px;
      left: -100px;
   }

   #sec1 h2 {
      padding: 262px 0 61px;
      position: relative;
      color: #fff;
   }

   #sec1 .txt {
      width: 762px;
      line-height: 50px;
      margin-left: auto;
      padding-top: 60px;
   }
}

#sec2 {
   position: relative;
}

@media screen and (max-width: 767px) {
   #sec2 {
      background: url("../img/anniversary/sec2-bg-img.jpg") no-repeat center top/150% auto;
      padding: 75vw 6.25vw 12vw;
   }

   #sec2 .note {
      font-size: 12px;
      padding-top: 4vw;
   }
}

@media screen and (min-width: 768px) {
   #sec2 {
      background: url("../img/anniversary/sec2-bg-img.jpg") no-repeat center top/cover;
      color: #fff;
      padding: 392px 0 50px;
   }

   #sec2 .txt {
      width: 467px;
      margin-left: auto;
   }

   #sec2 .note {
      font-size: 12px;
      padding-top: 8px;
   }
}

#sec3 {
   position: relative;
}

@media screen and (max-width: 767px) {
   #sec3 {
      background: url("../img/anniversary/sec3-deco-1.png") no-repeat center top/100% auto, url("../img/anniversary/sec3-deco-2.png") no-repeat center bottom/100% auto;
      padding: 20vw 0;
   }

   #sec3:before {
      content: '';
      width: 20vw;
      height: 100vw;
      background: url("../img/shared/bg1.jpg") repeat center top;
      position: absolute;
      bottom: 0;
      right: 0;
      z-index: -1;
   }

   #sec3 .note {
      font-size: 12px;
      padding-bottom: 4vw;
   }

   #sec3 .box-1 {
      display: flex;
      gap: 2vw;
      margin: 0 -3vw 0 -6.25vw;
   }

   #sec3 .box-1 h2 {
      width: 27vw;
      height: 105vw;
   }

   #sec3 .box-1 h2 small {
      display: inline-block;
      font-size: 4vw;
      line-height: 2;
   }

   #sec3 .box-1 figure img {
      width: 100%;
      max-width: inherit;
      height: 100%;
      object-fit: cover;
	object-position: -25vw;
   }

   #sec3 .box-2 {
      padding-top: 8vw;
   }

   #sec3 .box-2 .price {
      line-height: 2;
	text-align: center;
   }

   #sec3 .box-2 .price span {
      font-size: 5vw;
   }

   #sec3 .box-2 .txt,
   #sec3 .box-2 .button {
      padding-top: 8vw;
   }

   #sec3 .photo {
      display: flex;
      flex-direction: row-reverse;
      /*align-items: flex-end;*/
      gap: 4vw;
      padding-top: 12vw;
   }
	#sec3 .photo .img-2{
		margin-top: 30vw;
	}

   #sec3 .box-3 {
      padding-top: 12vw;
   }

   #sec3 .box-3 .col {
      padding-top: 8vw;
   }

   #sec3 .box-3 .txt {
      padding-top: 4vw;
   }
}

@media screen and (min-width: 768px) {
   #sec3 {
      background: url("../img/anniversary/sec3-deco-1.png") no-repeat center top, url("../img/anniversary/sec3-deco-2.png") no-repeat center bottom;
      padding: 110px 0 230px;
   }

   #sec3:before {
      content: '';
      width: calc(50% - 355px);
      height: 423px;
      background: url("../img/shared/bg1.jpg") repeat center top;
      position: absolute;
      bottom: 0;
      right: 0;
      z-index: -1;
   }

   #sec3 .note {
      font-size: 12px;
      padding-bottom: 28px;
   }

   #sec3 .box-1 {
      width: 747px;
      position: relative;
      padding: 28px 0 63px;
   }

   #sec3 .box-1 figure {
      width: 750px;
      position: absolute;
      top: 0;
      left: -250px;
   }

   #sec3 h2 {
      width: 165px;
      height: 480px;
      margin-left: auto;
      line-height: 60px;
   }

   #sec3 h2 small {
      display: inline-block;
      font-size: 20px;
      letter-spacing: 0.5em;
      line-height: 50px;
   }

   #sec3 .box-2 {
      width: 400px;
      padding-left: 360px;
   }

   #sec3 .box-2 .price {
      line-height: 44px;
   }

   #sec3 .box-2 .price span {
      font-size: 22px;
   }

   #sec3 .box-2 .txt {
      padding-top: 30px;
   }

   #sec3 .box-2 .button {
      padding-top: 40px;
   }

   #sec3 .box-2 .button a {
      margin: 0;
   }

   #sec3 .box-3 {
      position: relative;
   }

   #sec3 .box-3 figure {
      width: 700px;
      position: absolute;
      top: 0;
      right: -100px;
   }

   #sec3 .box-3 .col {
      width: 400px;
      padding: 110px 0 70px;
   }

   #sec3 .box-3 .txt {
      padding-top: 20px;
   }

   #sec3 .photo {
      padding-bottom: 195px;
   }

   #sec3 .photo .img-1 {
      width: 439px;
      position: absolute;
      top: 385px;
      right: -250px;
   }

   #sec3 .photo .img-2 {
      width: 355px;
      position: absolute;
      top: 755px;
      left: -100px;
   }
}

#sec4 {
   position: relative;
}

@media screen and (max-width: 767px) {
   #sec4 {
      padding-bottom: 20vw;
   }

   #sec4:before {
      content: '';
      width: 20vw;
      height: 100%;
      background: url("../img/shared/bg1.jpg") repeat center top;
      position: absolute;
      bottom: 0;
      right: 0;
      z-index: -1;
   }

   #sec4 .head {
      background: url("../img/anniversary/sec4-photo.jpg") no-repeat center/cover;
      padding: 10vw 6.25vw 0;
      position: relative;
   }

   #sec4 h2 {
      width: 27vw;
      height: 70vw;
      margin-left: auto;
      color: #fff;
   }

   #sec4 h2 small {
      display: inline-block;
      font-size: 4vw;
      line-height: 2;
   }

   #sec4 .box-1 {
      padding-top: 12vw;
   }

   #sec4 .box-1 .price {
      line-height: 2;
   }

   #sec4 .box-1 .price span {
      font-size: 5vw;
   }

   #sec4 .box-1 .hr {
      width: 100%;
      height: 0;
      border-top: 1px solid rgba(0, 0, 0, 0.3);
      margin-top: 6vw;
   }

   #sec4 .box-1 .txt {
      padding-top: 6vw;
   }

   #sec4 .box-2 {
      padding-top: 12vw;
   }

   #sec4 .box-2 h3 {
      letter-spacing: 0.3em;
      padding-top: 8vw;
   }

   #sec4 .box-2 .txt {
      padding-top: 6vw;
   }

   #sec4 .button {
      padding-top: 8vw;
   }
}

@media screen and (min-width: 768px) {
   #sec4 {
      padding-bottom: 173px;
   }

   #sec4:before {
      content: '';
      width: calc(50% - 355px);
      height: 100%;
      background: url("../img/shared/bg1.jpg") repeat center top;
      position: absolute;
      bottom: 0;
      right: 0;
   }

   #sec4 .head {
      width: calc(50% + 500px);
      background: url("../img/anniversary/sec4-photo.jpg") no-repeat center top/cover;
      color: #fff;
      box-sizing: border-box;
      padding: 112px 84px 0 0;
      position: relative;
   }

   #sec4 h2 {
      width: 165px;
      height: 390px;
      margin-left: auto;
      line-height: 60px;
   }

   #sec4 h2 small {
      display: inline-block;
      font-size: 20px;
      letter-spacing: 0.5em;
      line-height: 50px;
   }

   #sec4 .box-1 {
      display: flex;
      gap: 37px;
      padding: 60px 0 130px 53px;
   }

   #sec4 .box-1 .price {
      width: 200px;
      align-self: center;
      line-height: 44px;
   }

   #sec4 .box-1 .price span {
      font-size: 22px;
   }

   #sec4 .box-1 .hr {
      width: 0;
      border-left: 1px solid rgba(0, 0, 0, 0.3);
   }

   #sec4 .box-1 .txt {
      padding-left: 50px;
   }

   #sec4 .box-2 {
      position: relative;
      padding: 110px 70px 90px 0;
   }

   #sec4 .box-2 figure {
      width: 570px;
      position: absolute;
      top: 0;
      left: -100px;
   }

   #sec4 .box-2 .col {
      width: 400px;
      margin-left: auto;
   }

   #sec4 .box-2 h3 {
      font-size: 20px;
      line-height: 30px;
      letter-spacing: 0.3em;
   }

   #sec4 .box-2 .txt {
      padding-top: 30px;
   }

   #sec4 .button {
      padding-top: 138px;
   }
}

#sec5 {
   position: relative;
}

@media screen and (max-width: 767px) {
   #sec5 {
      padding-bottom: 20vw;
   }

   #sec5:before {
      content: '';
      width: 20vw;
      height: 100%;
      background: url("../img/shared/bg1.jpg") repeat center top;
      position: absolute;
      bottom: 0;
      right: 0;
   }

   #sec5 figure {
      height: 60vw;
      margin: 0 -6.25vw;
   }

   #sec5 figure img {
      width: 100%;
      max-width: inherit;
      height: 100%;
      object-fit: cover;
   }

   #sec5 h2 {
      width: 20vw;
      height: 70vw;
      margin: 0 auto;
      padding-top: 12vw;
   }

   #sec5 .button {
      padding-top: 8vw;
   }
}

@media screen and (min-width: 768px) {
   #sec5 {
      padding-bottom: 182px;
   }

   #sec5:before {
      content: '';
      width: calc(50% - 355px);
      height: 100%;
      background: url("../img/shared/bg1.jpg") repeat center top;
      position: absolute;
      bottom: 0;
      right: 0;
   }

   #sec5 .wrap {
      display: flex;
      flex-wrap: wrap;
      gap: 75px 87px;
   }

   #sec5 figure {
      width: 1200px;
      margin: 0 -100px;
   }

   #sec5 h2 {
      width: 140px;
      height: 350px;
      padding: 12px 0 0 87px;
   }

   #sec5 .col {
      width: 500px;
   }

   #sec5 .button {
      padding-top: 33px;
   }

   #sec5 .button a {
      margin: 0;
   }
}

#sec6 {
   position: relative;
}

@media screen and (max-width: 767px) {
   #sec6 {
      display: flex;
      align-items: flex-end;
      width: 100%;
      height: 150vw;
      background: url("../img/anniversary/sec6-bg-img.jpg") no-repeat center left 32%/cover;
      color: #fff;
      padding: 0 6.25vw 6.25vw;
      box-sizing: border-box;
      line-height: 2;
   }
}

@media screen and (min-width: 768px) {
   #sec6 {
      background: url("../img/anniversary/sec6-bg-img.jpg") no-repeat center bottom/cover;
      color: #fff;
      padding: 515px 0 65px 70px;
   }

   #sec6 .txt {
      width: 620px;
   }
}