/* =========================================================
 COMPLETE RESET
========================================================= */

#mp-news,
#mp-news *,
#mp-news *::before,
#mp-news *::after {
  box-sizing: border-box !important;
}


#mp-news {
  --mpn-bg: #fffdf9;
  --mpn-sub-bg: #f7f1e8;

  --mpn-dark: #44382f;
  --mpn-text: #75695f;

  --mpn-brown: #876e59;
  --mpn-brown-hover: #745c49;

  --mpn-light-brown: #b89c84;

  --mpn-line:
    rgba(119,95,76,.14);

  position:
    relative !important;

  display:
    block !important;

  width:
    100vw !important;

  max-width:
    none !important;

  min-width:
    0 !important;

  margin:
    0 !important;

  margin-left:
    calc(50% - 50vw) !important;

  margin-right:
    calc(50% - 50vw) !important;

  padding:
    105px
    0
    110px !important;

  background:
    var(--mpn-bg) !important;

  background-image:
    none !important;

  color:
    var(--mpn-dark) !important;

  border:
    0 !important;

  border-radius:
    0 !important;

  box-shadow:
    none !important;

  font-family:
    "Noto Sans JP",
    "Yu Gothic",
    "Hiragino Kaku Gothic ProN",
    "Meiryo",
    sans-serif !important;

  font-size:
    16px !important;

  line-height:
    1.6 !important;

  overflow:
    hidden !important;
}


/* =========================================================
 THEME RESET
========================================================= */

#mp-news h1,
#mp-news h2,
#mp-news h3,
#mp-news h4,
#mp-news h5,
#mp-news h6,
#mp-news p {
  display:
    block !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border:
    0 !important;

  border-radius:
    0 !important;

  background:
    none !important;

  background-image:
    none !important;

  box-shadow:
    none !important;

  text-shadow:
    none !important;

  color:
    inherit !important;

  text-transform:
    none !important;
}


#mp-news h1::before,
#mp-news h1::after,
#mp-news h2::before,
#mp-news h2::after,
#mp-news h3::before,
#mp-news h3::after,
#mp-news h4::before,
#mp-news h4::after {
  content:
    none !important;

  display:
    none !important;

  border:
    0 !important;

  background:
    none !important;
}


#mp-news ul,
#mp-news ol,
#mp-news li {
  margin:
    0 !important;

  padding:
    0 !important;

  list-style:
    none !important;
}


#mp-news a,
#mp-news a:link,
#mp-news a:visited,
#mp-news a:hover,
#mp-news a:active,
#mp-news a:focus {
  color:
    inherit !important;

  text-decoration:
    none !important;

  outline:
    none !important;

  background-image:
    none !important;

  box-shadow:
    none !important;
}


#mp-news img {
  display:
    block !important;

  max-width:
    none !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border:
    0 !important;

  box-shadow:
    none !important;
}


/* =========================================================
 INNER
========================================================= */

#mp-news .mpn-inner {
  position:
    relative !important;

  z-index:
    3 !important;

  display:
    grid !important;

  grid-template-columns:
    320px
    minmax(0,1fr) !important;

  gap:
    82px !important;

  width:
    min(
      1320px,
      calc(100% - 80px)
    ) !important;

  max-width:
    1320px !important;

  margin:
    0 auto !important;

  padding:
    0 !important;
}


/* =========================================================
 HEADING
========================================================= */

#mp-news .mpn-heading {
  position:
    relative !important;

  display:
    block !important;

  margin:
    0 !important;

  padding:
    6px
    0
    0 !important;
}


/* =========================================================
 ENGLISH
========================================================= */

#mp-news .mpn-en {
  display:
    block !important;

  margin:
    0
    0
    13px !important;

  font-family:
    Arial,
    "Helvetica Neue",
    sans-serif !important;

  font-size:
    11px !important;

  font-weight:
    700 !important;

  line-height:
    1.2 !important;

  letter-spacing:
    .30em !important;

  color:
    #a38770 !important;
}


/* =========================================================
 TITLE
========================================================= */

#mp-news .mpn-title {
  display:
    block !important;

  margin:
    0 !important;

  padding:
    0 !important;

  font-family:
    "Noto Serif JP",
    "Yu Mincho",
    "Hiragino Mincho ProN",
    serif !important;

  font-size:
    clamp(
      34px,
      3vw,
      45px
    ) !important;

  font-weight:
    500 !important;

  line-height:
    1.45 !important;

  letter-spacing:
    .06em !important;

  color:
    #44382f !important;
}


/* =========================================================
 HEADING LINE
========================================================= */

#mp-news .mpn-heading-line {
  display:
    block !important;

  width:
    46px !important;

  height:
    1px !important;

  margin:
    22px
    0
    23px !important;

  background:
    #b89c84 !important;
}


/* =========================================================
 DESCRIPTION
========================================================= */

#mp-news .mpn-lead {
  display:
    block !important;

  margin:
    0 !important;

  font-family:
    "Noto Serif JP",
    "Yu Mincho",
    "Hiragino Mincho ProN",
    serif !important;

  font-size:
    14px !important;

  font-weight:
    500 !important;

  line-height:
    1.95 !important;

  letter-spacing:
    .035em !important;

  color:
    #76695f !important;
}


/* =========================================================
 PC BUTTON
========================================================= */

#mp-news .mpn-button,
#mp-news .mpn-button:link,
#mp-news .mpn-button:visited {
  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  gap:
    20px !important;

  min-width:
    190px !important;

  height:
    55px !important;

  margin:
    30px
    0
    0 !important;

  padding:
    0
    24px !important;

  border:
    1px solid
    var(--mpn-brown) !important;

  border-radius:
    100px !important;

  background:
    transparent !important;

  color:
    #705947 !important;

  font-family:
    "Noto Sans JP",
    "Yu Gothic",
    "Hiragino Kaku Gothic ProN",
    sans-serif !important;

  font-size:
    13px !important;

  font-weight:
    700 !important;

  line-height:
    1 !important;

  letter-spacing:
    .055em !important;

  transition:
    background .3s ease,
    border-color .3s ease,
    color .3s ease,
    transform .3s ease !important;
}


#mp-news .mpn-button:hover {
  background:
    var(--mpn-brown) !important;

  border-color:
    var(--mpn-brown) !important;

  color:
    #fff !important;

  transform:
    translateY(-2px) !important;
}


#mp-news .mpn-button-arrow {
  display:
    inline-block !important;

  font-family:
    Arial,
    sans-serif !important;

  font-size:
    17px !important;

  font-weight:
    400 !important;

  line-height:
    1 !important;

  transition:
    transform .3s ease !important;
}


#mp-news .mpn-button:hover
.mpn-button-arrow {
  transform:
    translateX(4px) !important;
}


/* =========================================================
 NEWS LIST
========================================================= */

#mp-news .mpn-list {
  position:
    relative !important;

  display:
    block !important;

  width:
    100% !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border-top:
    1px solid
    var(--mpn-line) !important;
}


/* =========================================================
 NEWS ITEM
========================================================= */

#mp-news .mpn-item,
#mp-news .mpn-item:link,
#mp-news .mpn-item:visited {
  position:
    relative !important;

  display:
    grid !important;

  grid-template-columns:
    110px
    132px
    minmax(0,1fr)
    44px !important;

  align-items:
    center !important;

  gap:
    17px !important;

  width:
    100% !important;

  min-height:
    114px !important;

  margin:
    0 !important;

  padding:
    23px
    5px !important;

  border:
    0 !important;

  border-bottom:
    1px solid
    var(--mpn-line) !important;

  background:
    transparent !important;

  transition:
    padding-left .3s ease,
    background .3s ease !important;
}


#mp-news .mpn-item:hover {
  padding-left:
    13px !important;

  background:
    linear-gradient(
      90deg,
      rgba(247,241,232,.65),
      rgba(247,241,232,0)
    ) !important;
}


/* =========================================================
 DATE
========================================================= */

#mp-news .mpn-date {
  display:
    block !important;

  margin:
    0 !important;

  font-family:
    "Times New Roman",
    Times,
    serif !important;

  font-size:
    13px !important;

  font-weight:
    500 !important;

  line-height:
    1.2 !important;

  letter-spacing:
    .06em !important;

  color:
    #8d7867 !important;
}


/* =========================================================
 CATEGORY
========================================================= */

#mp-news .mpn-category {
  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  min-width:
    120px !important;

  width:
    max-content !important;

  white-space:
    nowrap !important;

  height:
    29px !important;

  margin:
    0 !important;

  padding:
    0
    12px !important;

  border:
    1px solid
    rgba(133,106,85,.14) !important;

  border-radius:
    100px !important;

  background:
    var(--mpn-sub-bg) !important;

  font-family:
    "Noto Sans JP",
    "Yu Gothic",
    sans-serif !important;

  font-size:
    9px !important;

  font-weight:
    700 !important;

  line-height:
    1 !important;

  letter-spacing:
    .05em !important;

  color:
    #806956 !important;
}


/* =========================================================
 NEWS TITLE
========================================================= */

#mp-news .mpn-item-title {
  display:
    block !important;

  min-width:
    0 !important;

  margin:
    0 !important;

  padding:
    0 !important;

  font-family:
    "Noto Serif JP",
    "Yu Mincho",
    "Hiragino Mincho ProN",
    serif !important;

  font-size:
    15px !important;

  font-weight:
    600 !important;

  line-height:
    1.7 !important;

  letter-spacing:
    .035em !important;

  color:
    #504137 !important;
}


/* =========================================================
 ARROW
========================================================= */

#mp-news .mpn-arrow {
  display:
    flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  width:
    40px !important;

  height:
    40px !important;

  margin:
    0 !important;

  border-radius:
    50% !important;

  background:
    #f2ebe3 !important;

  color:
    var(--mpn-brown) !important;

  font-family:
    Arial,
    sans-serif !important;

  font-size:
    17px !important;

  line-height:
    1 !important;

  transition:
    background .3s ease,
    color .3s ease,
    transform .3s ease !important;
}


#mp-news .mpn-item:hover
.mpn-arrow {
  background:
    var(--mpn-brown) !important;

  color:
    #fff !important;

  transform:
    translateX(3px) !important;
}


/* =========================================================
 BACKGROUND CIRCLE
========================================================= */

#mp-news .mpn-circle {
  position:
    absolute !important;

  z-index:
    1 !important;

  width:
    500px !important;

  height:
    500px !important;

  right:
    -330px !important;

  bottom:
    -300px !important;

  border-radius:
    50% !important;

  background:
    rgba(244,237,228,.48) !important;

  pointer-events:
    none !important;
}


/* =========================================================
 LEFT TOP LEAF
========================================================= */

#mp-news .mpn-leaf-image {
  position:
    absolute !important;

  z-index:
    1 !important;

  display:
    block !important;

  width:
    82px !important;

  max-width:
    none !important;

  height:
    auto !important;

  left:
    24px !important;

  top:
    32px !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border:
    0 !important;

  box-shadow:
    none !important;

  opacity:
    .38 !important;

  transform:
    rotate(-14deg) !important;

  transform-origin:
    center center !important;

  pointer-events:
    none !important;

  user-select:
    none !important;

  -webkit-user-drag:
    none !important;
}


/* =========================================================
 MOBILE BUTTON
========================================================= */

#mp-news .mpn-mobile-button,
#mp-news .mpn-mobile-button:link,
#mp-news .mpn-mobile-button:visited {
  display:
    none !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  gap:
    20px !important;

  width:
    100% !important;

  height:
    53px !important;

  margin:
    26px
    0
    0 !important;

  padding:
    0
    20px !important;

  border:
    1px solid
    var(--mpn-brown) !important;

  border-radius:
    100px !important;

  background:
    transparent !important;

  color:
    #705947 !important;

  font-family:
    "Noto Sans JP",
    "Yu Gothic",
    sans-serif !important;

  font-size:
    12px !important;

  font-weight:
    700 !important;

  line-height:
    1 !important;

  letter-spacing:
    .05em !important;
}


/* =========================================================
 TABLET
========================================================= */

@media (max-width: 1050px) {

  #mp-news {
    padding:
      88px
      0
      94px !important;
  }


  #mp-news .mpn-inner {
    grid-template-columns:
      260px
      minmax(0,1fr) !important;

    gap:
      50px !important;

    width:
      calc(100% - 50px) !important;
  }


  #mp-news .mpn-title {
    font-size:
      37px !important;
  }


  #mp-news .mpn-item {
    grid-template-columns:
      90px
      125px
      minmax(0,1fr)
      40px !important;

    gap:
      12px !important;
  }


  #mp-news .mpn-category {
    min-width:
      115px !important;

    white-space:
      nowrap !important;
  }


  #mp-news .mpn-item-title {
    font-size:
      14px !important;
  }


  #mp-news .mpn-leaf-image {
    width:
      72px !important;

    left:
      16px !important;

    top:
      25px !important;

    opacity:
      .34 !important;
  }

}


/* =========================================================
 MOBILE
========================================================= */

@media (max-width: 767px) {

  #mp-news {
    padding:
      62px
      0
      68px !important;
  }


  #mp-news .mpn-inner {
    display:
      block !important;

    width:
      calc(100% - 34px) !important;
  }


  /* =====================================================
   HEADING
  ====================================================== */

  #mp-news .mpn-heading {
    padding:
      0 !important;

    margin:
      0
      0
      34px !important;
  }


  #mp-news .mpn-en {
    margin-bottom:
      10px !important;

    font-size:
      9px !important;
  }


  #mp-news .mpn-title {
    font-size:
      29px !important;
  }


  #mp-news .mpn-heading-line {
    margin:
      19px
      0
      20px !important;
  }


  #mp-news .mpn-lead {
    font-size:
      13px !important;

    line-height:
      1.85 !important;
  }


  /* PC BUTTON OFF */

  #mp-news .mpn-button,
  #mp-news .mpn-button:link,
  #mp-news .mpn-button:visited,
  #mp-news .mpn-button:hover,
  #mp-news .mpn-button:active,
  #mp-news .mpn-button:focus {
    display:
      none !important;
  }


  /* =====================================================
   NEWS ITEM
  ====================================================== */

  #mp-news .mpn-item {
    display:
      grid !important;

    grid-template-columns:
      minmax(0,1fr)
      40px !important;

    gap:
      7px
      13px !important;

    min-height:
      0 !important;

    padding:
      21px
      2px !important;
  }


  #mp-news .mpn-item:hover {
    padding-left:
      2px !important;

    background:
      none !important;
  }


  #mp-news .mpn-date {
    grid-column:
      1 !important;

    grid-row:
      1 !important;

    display:
      inline-block !important;

    width:
      auto !important;

    font-size:
      12px !important;
  }


  #mp-news .mpn-category {
    grid-column:
      1 !important;

    grid-row:
      2 !important;

    justify-self:
      start !important;

    min-width:
      0 !important;

    width:
      max-content !important;

    white-space:
      nowrap !important;

    height:
      26px !important;

    padding:
      0
      11px !important;

    font-size:
      8px !important;
  }


  #mp-news .mpn-item-title {
    grid-column:
      1 !important;

    grid-row:
      3 !important;

    margin-top:
      4px !important;

    font-size:
      13px !important;

    line-height:
      1.65 !important;
  }


  #mp-news .mpn-arrow {
    grid-column:
      2 !important;

    grid-row:
      1 / 4 !important;

    align-self:
      center !important;

    width:
      37px !important;

    height:
      37px !important;

    font-size:
      16px !important;
  }


  /* =====================================================
   MOBILE BUTTON
  ====================================================== */

  #mp-news .mpn-mobile-button,
  #mp-news .mpn-mobile-button:link,
  #mp-news .mpn-mobile-button:visited {
    display:
      flex !important;
  }


  /* =====================================================
   LEAF
  ====================================================== */

  #mp-news .mpn-leaf-image {
    width:
      58px !important;

    left:
      -20px !important;

    top:
      18px !important;

    opacity:
      .30 !important;

    transform:
      rotate(-14deg) !important;
  }


  /* =====================================================
   CIRCLE
  ====================================================== */

  #mp-news .mpn-circle {
    width:
      330px !important;

    height:
      330px !important;

    right:
      -245px !important;

    bottom:
      -190px !important;
  }

}


/* =========================================================
 SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

  #mp-news {
    padding:
      58px
      0
      62px !important;
  }


  #mp-news .mpn-inner {
    width:
      calc(100% - 28px) !important;
  }


  #mp-news .mpn-title {
    font-size:
      27px !important;
  }


  #mp-news .mpn-heading {
    margin-bottom:
      31px !important;
  }


  #mp-news .mpn-item {
    padding:
      19px
      2px !important;
  }


  #mp-news .mpn-mobile-button {
    height:
      51px !important;

    margin-top:
      24px !important;
  }

}

/* Empty state keeps the same row layout without becoming a link. */
#mp-news .mpn-item-empty{cursor:default!important;}