/********************************************************

setting

********************************************************/
:root {
  --margin-block: 200px; }

@media (min-width: 1101px) and (max-width: 1280px) {
  :root {
    --margin-block: 120px; } }
@media (min-width: 641px) and (max-width: 1100px) {
  :root {
    --margin-block: 90px; } }
@media (max-width: 640px) {
  :root {
    --margin-block: 70px; } }
.h2-type1 h2,
.h2-type2 h2 {
  font-family: 'Gilda Display', serif;
  font-weight: normal;
  letter-spacing: 0.05em;
  color: #b4a57f; }

.h2-type2 {
  text-align: center;
  font-size: 110%; }

.h2-type2 h2 + p {
  color: #FFF;
  font-size: 130%; }

.main-visual {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 1920 / 950;
  background: #0a131b; }
  @media screen and (max-width: 600px) {
    .main-visual {
      aspect-ratio: 750 / 870; } }

.main-visual #animation_pc,
.main-visual #animation_sp {
  width: 100%;
  height: auto;
  display: block; }

#appeal-area {
  background: #080E14;
  background: linear-gradient(90deg, #080e14 0%, #0c1620 50%, #080e14 100%);
  padding: 20px 0; }
  @media screen and (max-width: 600px) {
    #appeal-area {
      padding: 20px 0 30px; } }
  #appeal-area .inner {
    width: min(90%, 1240px);
    margin: 0 auto; }

#pickup-bnr {
  background-color: transparent;
  padding: 3.5% 0;
  margin: 0 auto;
  background: #0c0f12; }
  #pickup-bnr h2 {
    text-align: center; }
  #pickup-bnr .slick-dots li.slick-active button:before {
    color: #a69a68; }

#topics-area {
  background: #0c0f12; }

.info-area.top-info {
  background-color: transparent;
  background: none; }

.wrap_marit-pickup-information .info-area {
  padding: 5% 0 4%; }
  @media screen and (max-width: 600px) {
    .wrap_marit-pickup-information .info-area {
      padding: 6% 0 8%; } }

@media screen and (max-width: 600px) {
  #topics-area {
    margin: 0 auto; } }
#topics-area #topics-in {
  padding: 6% 0; }

.t_info_update {
  color: #FFF;
  margin-top: 4%; }

#aj-area {
  padding: 6% 0;
  margin: 0 auto;
  background: #0c0f12; }

#insta-area {
  padding: 0 0 6%;
  margin: 0 auto; }
  @media screen and (max-width: 600px) {
    #insta-area {
      padding: 6% 0; } }
  @media screen and (max-width: 600px) {
    #insta-area .h2-type2 {
      width: 90%;
      font-size: 100%; } }
  @media screen and (max-width: 600px) {
    #insta-area .h2-type2 h2 {
      font-size: 230%; } }