@charset "shift_jis";
/* Updated 2025/12/16.T */
/* Updated 2025/05/02.T */
/* Updated 2025/03/31.T */
/* Updated 2025/03/03.T */

.js-karte-keyword {
  display: none;
}

/* CSS custom property */
/* =================================================== */
:root {
  --bg-light-green01: #f9f8f2;
  --bg-light-green01-rgba: rgba(249, 248, 242, 0.9);
  --bg-light-green02: #eaf5e9;
  --bg-light-green03: #f3f8f6;
  --bg-light-beige: #e6e4d9;
  --bg-white: #fff;
  --bg-trad-green: #004831;
  --bg-green: #4d7f6f;
  --bg-orange: #ea8832;
  --bg-gray-green: #d5dedb;
  --bg-flesh-green: #c4d700;
  --bg-ud-flesh-green: #a0c81e;
  --border-gray-green: #d5dedb;
  --border-trad-green: #004831;
  --border-light-beige: #e6e4d9;
  --border-orange: #ea8832;
  --border-beige: #f2ebdc;
  --border-white: #fff;
  --text-trad-green: #004831;
  --text-beige: #eae5dc;
  --text-black: #333;
  --text-gray-green: #56635f;
  --text-light-gray: #707070;
  --text-orange: #dd7230;
  --text-white: #fff;
  --text-red: #bb4084;
  --text-blue: #404abb;
  --text-green: #54bb40;
  --drop-shadow-button01: 0px 10px 12px 0px #141D1D14;
  --drop-shadow-button02: 20px 20px 40px 0px #0A221614;
  --drop-shadow-panel-card: 12px 12px 32px 0px #0A22160D;
}

/* General style */
/* =================================================== */
@font-face {
  font-family: noto-sans;
  font-display: swap;
  src: url(/kojin/cmn/fonts/Noto_Sans_JP/NotoSansJP-Regular.otf)
}

@font-face {
  font-family: noto-sans-bold;
  font-display: swap;
  src: url(/kojin/cmn/fonts/Noto_Sans_JP/NotoSansJP-Bold.otf)
}

@font-face {
  font-family: noto-sans;
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url(/kojin/cmn/fonts/Noto_Sans_JP/NotoSansJP-Bold.otf)
}

@font-face {
  font-family: roboto;
  font-display: swap;
  src: url(/kojin/cmn/fonts/Roboto/RobotoCondensed-Regular.ttf)
}

@font-face {
  font-family: roboto-bold;
  font-display: swap;
  src: url(/kojin/cmn/fonts/Roboto/RobotoCondensed-Bold.ttf)
}

@font-face {
  font-family: roboto;
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url(/kojin/cmn/fonts/Roboto/RobotoCondensed-Bold.ttf)
}

body, button, input, select, textarea {
  color: var(--text-black);
}

button,
a {
  transition: opacity 0.25s;
}

@media screen and (min-width: 768px) {
  button:hover,
  a:hover {
    opacity: 0.7;
  }

  #header-wrap a:hover > img,
  #header-wrap a:hover {
    opacity: 1;
  }
}

/* Override CSS */
/* =================================================== */
.toggle-area01 > .toggle-content.-close {
  height: 772px;
}

.toggle-area01 > .toggle-content.-close::after {
  content: none;
}

.toggle-area01 > .toggle-content:not(.-close) + div > .btn-layout {
  display: none;
}

@media screen and (min-width: 768px) {
  .toggle-area01>.toggle-content.-close {
    height: 728px;
  }
}

.text-mark01 {
  background: linear-gradient(transparent 60%, #ebf19b 60%);
}

.table-type01 > thead > tr > th {
  text-align: center;
}

/* Common design */
/* =================================================== */

/* Body */
#page-olivetimes {
  overflow-x: hidden;
  background-color: var(--bg-light-green01);
  color: var(--text-black);
}

@media screen and (max-width : 767px) {
  #page-olivetimes {
    padding-top: 39px;
  }
}

body.-openMenu::before {
  background: none;
}

body::before {
  z-index: 2;
}

/* Link */
a[target="_blank"]:not(:has(img))::after {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  vertical-align: middle;
  background: url(/kojin/cmn/imgs/ico_blank_01.svg) no-repeat center / contain;
}

/* Header */
[data-type="header"] {
  min-height: 67px;
}

#header-body {
  position: relative;
  margin-top: 40px;
}

#header-body > .inner {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 40px;
}

#header-body > .inner > .header-main .header-mediaLogo > p {
  height: 35px;
  width: 260px;
  margin: 0 auto;
}

#header-body > .inner > .header-main .header-text {
  margin-top: 12px;
  font-size: 13px;
  font-weight: 700;
  line-height: 19.5px;
  text-align: center;
}

@media screen and (min-width : 768px) {
  [data-type="header"] {
    min-height: 243px;
  }

  #header-body {
    width: 100%;
    max-width: 1200px;
    margin: 40px auto 0;
  }
  
  #header-body > .inner {
    row-gap: 32px;
  }

  #header-body > .inner > .header-main {
    display: grid;
    grid-template-columns: 188px 1fr 188px;
    column-gap: 60px;
  }
  
  #header-body > .inner > .header-main::before {
    content: "";
  }
  
  #header-body > .inner > .header-main > div > .header-btn {
    display: flex;
    justify-content: center;
    column-gap: 4px;
    width: 188px;
    height: 40px;
    padding: 8px;
    border-radius: 8px;
    border: 1px solid var(--border-trad-green);
    background-color: var(--bg-white);
  }
  
  #header-body > .inner > .header-main > div > .header-btn::before {
    content: "";
    width: 24px;
    height: 24px;
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_question_01.svg) no-repeat center / contain;
  }
  
  #header-body > .inner > .header-main > div > .header-btn > .inner {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    color: var(--text-trad-green);
    text-align: left;
  }
}

@media screen and (max-width: 767px) {
  #header-body > .inner > .header-tool {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    padding-block: 39px 128px;
    z-index: 3;
    background-color: var(--bg-light-green01-rgba);
    overflow: auto;
  }

  #header-body > .inner > .header-tool > div:has(.header-btn) {
    display: flex;
    justify-content: center;
    margin-top: 24px;
  }

  #header-body > .inner > .header-tool > div > .header-btn {
    display: flex;
    justify-content: center;
    column-gap: 4px;
    width: 188px;
    height: 40px;
    padding: 8px;
    border-radius: 8px;
    border: 1px solid var(--border-trad-green);
    background-color: var(--bg-white);
  }
  
  #header-body > .inner > .header-tool > div > .header-btn::before {
    content: "";
    width: 24px;
    height: 24px;
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_question_01.svg) no-repeat center / contain;
  }
  
  #header-body > .inner > .header-tool > div > .header-btn > .inner {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    color: var(--text-trad-green);
    text-align: left;
  }
}

@media screen and (min-width: 768px) {
  #header-body > .inner > [aria-hidden=true] {
    display: block;
  }

  #header-body > .inner > .header-tool[aria-hidden=true] {
    display: block;
    position: static;
    width: 100%;
    height: auto;
    background: none;
    overflow-y: visible;
  }
}

#header-nav > .list > .item > a::before {
  content: "";
  width: 100%;
  height: 24px;
}

#header-nav > .list > .item > a.icon01::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_01.svg) no-repeat center / contain;
}

#header-nav > .list > .item > a.icon02::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_02.svg) no-repeat center / contain;
}

#header-nav > .list > .item > a.icon03::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_03.svg) no-repeat center / contain;
}

#header-nav > .list > .item > a.icon04::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_04.svg) no-repeat center / contain;
}

@media screen and (max-width: 767px) {
  #header-nav {
    margin-top: 25px;
  }

  #header-nav > .list {
    border-top: 1px solid var(--border-gray-green);
  }

  #header-nav > .list > .item {
    border-bottom: 1px solid var(--border-gray-green);
  }

  #header-nav > .list > .item > a {
    display: grid;
    grid-template-columns: 24px 1fr 16px;
    align-items: center;
    column-gap: 12px;
    width: 100%;
    min-height: 64px;
    padding: 0 16px;
    font-weight: 700;
    text-decoration: none;
  }
  
  #header-nav > .list > .item > a::before {
    height: 32px;
  }

  #header-nav > .list > .item > a::after {
    content: "";
    width: 100%;
    height: 16px;
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_02.svg) no-repeat center / contain;
  }
}

@media screen and (min-width: 768px) {
  #header-nav > .list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }

  #header-nav > .list > .item {
    width: 100%;
    min-height: 64px;
  }
  
  #header-nav > .list > .item:not(:last-child) {
    border-right: 1px solid var(--border-gray-green);
  }
  
  #header-nav > .list > .item > a {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
    width: 100%;
    height: 100%;
    background-color: var(--bg-white);
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    text-decoration: none;
  }
  
  #header-nav > .list > .item:first-child > a {
    border-radius: 4px 0 0 4px;
  }
  
  #header-nav > .list > .item:last-child > a {
    border-radius: 0 4px 4px 0;
  }
  
  #header-nav > .list > .item > a::before {
    width: 32px;
  }
}

@media screen and (max-width: 767px) {
  #header-keywordArea {
    margin-top: 24px;
    padding: 0 18px;
  }

  #header-keywordArea > .text {
    text-align: center;
  }

  #header-keywordArea > .text > strong {
    font-size: 14px;
    font-weight: 700;
    line-height: 21px;
  }

  #header-keywordArea > .list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
  }
  
  #header-keywordArea > .list > .item > .btn {
    display: grid;
    place-content: center;
    grid-template-columns: 1em 1fr;
    height: 32px;
    width: fit-content;
    padding: 0 12px;
    background-color: var(--bg-white);
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    border: 1px solid var(--border-gray-green)
  }
  
  #header-keywordArea > .list > .item > .btn::before {
    content: '#';
    color: var(--text-trad-green);
  }
}

@media screen and (max-width: 767px) {
  #header-spMenu {
    position: absolute;
    top: 0;
    right: 16px;
    transform: translate(0, -90%);
    z-index: 3;
  }
  
  body.-openMenu #header-spMenu > .header-hamburgerBtn,
  #header-spMenu > .header-hamburgerBtnClose {
    display: none;
  }
  
  #header-spMenu > .header-hamburgerBtn,
  body.-openMenu #header-spMenu > .header-hamburgerBtnClose {
    position: relative;
    height: 32px;
    display: grid;
    place-content: center;
    width: 32px;
    background-color: var(--bg-white);
    border: 1px solid var(--border-gray-green);
    border-radius: 50%;
  }
  
  #header-spMenu .header-hamburgerBtn::before,
  #header-spMenu .header-hamburgerBtnClose::before {
    content: "";
    display: block;
    width: 16px;
    height: 15px;
  }
  
  #header-spMenu .header-hamburgerBtn::before {
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_menu_01.svg) no-repeat center / contain;
  }

  #header-spMenu .header-hamburgerBtnClose::before {
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_menu_close_01.svg) no-repeat center / contain;
  }
}

@media screen and (min-width: 768px) {
  #header-spMenu {
    display: none;
  }
}

/* Main contents */
#main-contents {
  margin-top: 40px;
  padding: 0 18px;
}

@media screen and (min-width: 768px) {
  #main-contents {
    width: 100%;
    max-width: 1236px;
    margin: 0 auto;
  }
}

/* Keyword area */
[data-type="keyword"] {
  min-height: 48px;
}

#keyword-area {
  display: grid;
  align-items: center;
  grid-template-columns: 70px 1fr;
  column-gap: 12px;
  margin-top: 40px;
}

#keyword-area .text > strong {
  font-size: 14px;
  font-weight: 700;
  line-height: 21px;
}

#keyword-area > .slider .splide:not(.is-active)[data-initialized="true"] .slider-list {
  column-gap: 10px;
}

#keyword-area > .slider .slider-list .btn {
  display: grid;
  place-content: center;
  grid-template-columns: 1em 1fr;
  height: 32px;
  width: fit-content;
  padding: 0 12px;
  background-color: var(--bg-white);
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  border: 1px solid var(--border-gray-green);
  text-decoration: none;
}

#keyword-area > .slider .slider-list .btn::before {
  content: '#';
  color: var(--text-trad-green);
}

#keyword-area > .slider {
  overflow: hidden;
}

#keyword-area > .slider .splide__track::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 32px;
  height: 100%;
  background: var(--bg-light-green01);
  background: linear-gradient(90deg, transparent 0%, rgba(249,248,242,1) 50%);
  z-index: 1;
}

#keyword-area > .slider .splide:not(.is-active)[data-initialized="true"] .splide__track::after {
  content: none;
}

#keyword-area > .slider .splide:where(.is-initialized.is-active) .slider-list .item:last-child {
  padding-right: 32px;
}

#keyword-area > .slider :where(.splide__arrow--prev, .splide__arrow--next) svg {
  display: none;
}

@media screen and (min-width: 768px) {
  [data-type="keyword"] {
    min-height: 32px;
  }

  #keyword-area {
    grid-template-columns: 112px 1fr;
    column-gap: 16px;
  }

  #keyword-area > .slider {
    padding: 0 32px;
  }

  #keyword-area > .slider:has(.splide:not(.is-active)) {
    padding: 0;
  }

  #keyword-area > .slider .splide__track::after {
    right: -32px;
    width: 54px;
  }

  #keyword-area > .slider .splide:where(.is-initialized.is-active) .slider-list .item:last-child {
    padding-right: 16px
  }

  #keyword-area > .slider :where(.splide__arrow--prev, .splide__arrow--next) {
    display: block;
    height: 32px;
    background: none;
    border-radius: 0;
    width: 32px;
    opacity: 1;
    z-index: 2;
  }

  #keyword-area > .slider :where(.splide__arrow--prev, .splide__arrow--next):disabled {
    opacity: 0.2;
  }

  #keyword-area > .slider .splide__arrow--prev {
    left: -32px;
  }

  #keyword-area > .slider .splide__arrow--next {
    right: -32px;
  }

  #keyword-area > .slider :where(.splide__arrow--prev, .splide__arrow--next)::after {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_02.svg) no-repeat center / contain;
    z-index: 1;
    margin: auto;
  }

  #keyword-area > .slider .splide__arrow--prev::after {
    transform: rotate(180deg);
  }
}

/* About area */
[data-type="about"] {
  min-height: 972px;
}

#about-area {
  margin: 56px auto;
}

#about-area * {
  box-sizing: border-box;
}

#about-area > .inner > .heading-level2 {
  display: block;
  margin-bottom: 32px;
}

#about-area > .inner > .heading-level2::before {
  content: none;
}

#about-area > .inner > .heading-level2 .title > .inner {
  display: flex;
  align-items: baseline;
  justify-content: center;
  font-size: 32px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 0.1em;
  text-align: center;
}

#about-area > .inner > .heading-level2 .title img {
  width: 143px;
  height: 40px;
}

@media screen and (min-width: 768px) {
  [data-type="about"] {
    /* min-height: 1282px; */
  }

  #about-area {
    width: 100%;
    max-width: 885px;
  }
}

/* Banner block */
#bnr-block {
  margin: 56px auto 0;
}

#bnr-block > .inner {
  display: grid;
  row-gap: 16px;
}

#bnr-block > .inner > .bnr-img {
  padding: 0 18px;
}

#article-bnrBlock > .inner > .bnr-img {
  padding-right: 0;
  padding-left: 0;
  text-align: center;
}

@media screen and (min-width: 768px) {
  #bnr-block {
    width: 100%;
    max-width: 885px;
  }
  
  #bnr-block > .inner {
    row-gap: 56px;
  }
  
  #bnr-block > .inner > .bnr-img {
    padding: 0;
  }
}

.about-numberList {
  display: grid;
  row-gap: 4px;
}

.about-numberList > .item {
  display: grid;
  grid-template-columns: 2em 1fr;
  font-size: 14px;
  line-height: 21px;
}

.about-normalList {
  display: grid;
  row-gap: 4px;
}

.about-normalList > .item {
  display: grid;
  grid-template-columns: 1em 1fr;
  column-gap: 4px;
  font-size: 14px;
  line-height: 21px;
}

/* Breadcrumb list */
#breadcrumb-list {
  margin-top: 96px;
}

#breadcrumb-list > .list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  column-gap: 10px;
}

#breadcrumb-list > .list > .item:has(a) {
  display: grid;
  grid-template-columns: auto 6px;
  align-items: center;
  column-gap: 10px;
  width: fit-content;
}

#breadcrumb-list > .list > .item:has(a)::after {
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_02.svg) no-repeat center / contain;
}

#breadcrumb-list > .list > .item > a {
  text-decoration: none;
  font-size: 12px;
  line-height: 18px;
}

#breadcrumb-list > .list > .item > span {
  font-size: 12px;
  line-height: 18px;
}

/* Foot menu */
[data-type*="footer"] {
  min-height: 650px;
}

#foot-menu {
  margin-top: 20px;
}

#foot-menu > .menu-block {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 32px;
}

#foot-menu > .menu-block > .inner {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

#foot-menu > .menu-block > .inner > .title {
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}

#foot-menu > .menu-block > .inner > .contents > .list {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}

#foot-menu > .menu-block > .inner > .contents > .list > .item > a {
  text-decoration: none;
}

@media screen and (min-width: 768px) {
  [data-type="footer"] {
    min-height: 200px;
  }

  #foot-menu > .menu-block {
    grid-template-columns: repeat(3, 1fr);
    column-gap: 33px;
  }
}

/* Tab contents */
.about-section .about-headingLevel3 > .title {
  text-align: center;
}

.about-section .about-headingLevel3 > .title > .inner {
  font-size: 28px;
  font-weight: 700;
  line-height: 42px;
  letter-spacing: 0.1em;
}

@media screen and (min-width: 768px) {
  .about-section .about-headingLevel3 > .title > .inner {
    font-size: 40px;
    line-height: 60px;
  }
}

.about-section .about-subSection {
  margin-top: 40px;
}

@media screen and (min-width: 768px) {
  .about-section .about-subSection {
    margin-top: 32px;
  }

  .about-section .about-subSection + .about-subSection {
    margin-top: 56px;
  }
}

.about-section .about-headingLevel4 > .group > .text {
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  color: var(--text-light-gray);
}

#about-investmentManagement .about-headingLevel4 > .group > .text:has(.img) {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

#about-investmentManagement .about-headingLevel4 > .group > .text > .img > img {
  width: 148px;
  height: 32px;
}

#about-point .about-headingLevel4 > .group > .text > img {
  width: 160px;
  height: auto;
}

.about-section .about-headingLevel4 > .group > .title {
  text-align: center;
}

#about-point .about-headingLevel4 > .group > .title {
  margin-top: 8px;
}

.about-section .about-headingLevel4 > .group > .title > .inner {
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
}

.about-section .about-headingLevel4 > .group > .title > .inner > sup {
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  vertical-align: super;
}

#about-point .about-headingLevel4 > .group > .title > .inner {
  color: var(--text-orange);
}

@media screen and (min-width: 768px) {
  .about-section .about-headingLevel4 > .group > .text {
    font-size: 18px;
    line-height: 27px;
  }
  
  .about-section .about-headingLevel4 > .group > .title > .inner {
    font-size: 28px;
    line-height: 42px;
  }
  
  #about-investmentManagement .about-headingLevel4 > .group > .text > .img > img {
    width: 194px;
    height: 42px;
  }
  
  #about-point .about-headingLevel4 > .group > .text > img {
    width: 242px;
    height: auto;
  }
}

.about-section .about-img {
  margin-top: 32px;
  text-align: center;
}

.about-section .about-img + .about-img {
  margin-top: 40px;
}

@media screen and (min-width: 768px) {
  .about-section .about-img + .about-img {
    margin-top: 56px;
  }
}

.about-section .about-cardLayout4 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 24px;
  border-radius: 4px;
  border-top: 1px solid var(--border-light-beige);
  border-left: 1px solid var(--border-light-beige);
}

.about-section .about-cardLayout4 > .card {
  padding: 8px 3px;
  border-bottom: 1px solid var(--border-light-beige);
  border-right: 1px solid var(--border-light-beige);
}

.about-section .about-cardLayout4 > .card:nth-child(1) {
  border-radius: 4px 0 0 0;
}

.about-section .about-cardLayout4 > .card:nth-child(2) {
  border-radius: 0 4px 0 0;
}

.about-section .about-cardLayout4 > .card:nth-child(3) {
  border-radius: 0 0 4px 0;
}

.about-section .about-cardLayout4 > .card:nth-child(4) {
  border-radius: 0 0 0 4px;
}

.about-section .about-cardLayout4 > .card > .text {
  margin-top: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 21px;
  text-align: center;
}

.about-section .about-cardLayout4 > .card > .text > strong {
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
  color: var(--text-orange);
}

.about-section .about-cardLayout4 > .card > .text > strong > sup {
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  vertical-align: super;
}

@media screen and (min-width: 768px) {
  .about-section .about-cardLayout4 {
    grid-template-columns: repeat(4, 1fr);
    margin-top: 32px;
  }
  
  .about-section .about-cardLayout4 > .card {
    padding: 22px 7px;
  }
  
  .about-section .about-cardLayout4 > .card:nth-child(1) {
    border-radius: 4px 0 0 4px;
  }
  
  .about-section .about-cardLayout4 > .card:nth-child(2),
  .about-section .about-cardLayout4 > .card:nth-child(3) {
    border-radius: 0;
  }
  
  .about-section .about-cardLayout4 > .card:nth-child(4) {
    border-radius: 0 4px 4px 0 ;
  }
  
  .about-section .about-cardLayout4 > .card > .text {
    margin-top: 16px;
    font-size: 16px;
    line-height: 27px;
  }
}

.about-section .about-cardLayout4Gap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 24px;
}

.about-section .about-cardLayout4Gap > .card {
  padding: 18px 4px;
  background-color: var(--bg-light-green01);
  border-radius: 4px;
}

.about-section .about-cardLayout4Gap > .card > .title {
  font-size: 15px;
  font-weight: 700;
  line-height: 22.5px;
  text-align: center;
}

.about-section .about-cardLayout4Gap > .card > .text-en {
  margin-top: 8px;
  font-family: roboto;
  font-size: 40px;
  font-weight: 900;
  line-height: 40px;
  text-align: center;
  color: var(--text-orange);
}

.about-section .about-cardLayout4Gap > .card > .text-ja {
  margin-top: 8px;
  font-size: 30px;
  font-weight: 700;
  line-height: 30px;
  text-align: center;
  color: var(--text-orange);
}

.about-section .about-cardLayout4Gap > .card > .text-en > .en {
  font-family: roboto;
  font-size: 20px;
  font-weight: 900;
  line-height: 20px;
  text-align: center;
}

.about-section .about-cardLayout4Gap > .card > .text-en > .ja {
  font-size: 15px;
  font-weight: 700;
  line-height: 15px;
  text-align: center;
}

.about-section .about-cardLayout4Gap > .card > dd > sup {
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  vertical-align: super;
}

@media screen and (min-width: 768px) {
  .about-section .about-cardLayout4Gap {
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 32px;
  }
  
  .about-section .about-cardLayout4Gap > .card {
    padding: 18px 4px;
    background-color: var(--bg-light-green01);
    border-radius: 4px;
  }
  
  .about-section .about-cardLayout4Gap > .card > .title {
    font-size: 15px;
    font-weight: 700;
    line-height: 22.5px;
    text-align: center;
  }
  
  .about-section .about-cardLayout4Gap > .card > .text-en {
    margin-top: 8px;
    font-family: roboto;
    font-size: 40px;
    font-weight: 900;
    line-height: 40px;
    text-align: center;
    color: var(--text-orange);
  }
  
  .about-section .about-cardLayout4Gap > .card > .text-ja {
    margin-top: 8px;
    font-size: 30px;
    font-weight: 700;
    line-height: 30px;
    text-align: center;
    color: var(--text-orange);
  }
  
  .about-section .about-cardLayout4Gap > .card > .text-en > .en {
    font-family: roboto;
    font-size: 20px;
    font-weight: 900;
    line-height: 20px;
    text-align: center;
  }
  
  .about-section .about-cardLayout4Gap > .card > .text-en > .ja {
    font-size: 15px;
    font-weight: 700;
    line-height: 15px;
    text-align: center;
  }
}

.about-section .about-slider {
  margin-top: 24px;
}

.about-section .about-slider .card {
  padding: 24px 15px;
  border-radius: 4px;
  border: 1px solid var(--border-light-beige);
}

.about-section .about-slider .card > .title {
  font-size: 14px;
  font-weight: 700;
  line-height: 21px;
  text-align: center;
}

.about-section .about-slider .card > .title > strong {
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  color: var(--text-orange);
}

.about-section .about-slider .card > .body {
  margin-top: 16px;
  text-align: center;
}

.about-section .about-slider .card > .body > .price {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  column-gap: 8px;
  min-height: 45px;
  margin-top: 16px;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}

.about-section .about-slider .card > .body > .price > strong {
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  color: var(--text-orange);
}

.about-section .about-slider .card > .body > .price > span {
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;
}

.about-section .about-slider .card > .body > .layout {
  display: flex;
  justify-content: center;
  column-gap: 8px;
  min-height: 58px;
  margin-top: 16px;
}

.about-section .about-slider .card > .body > .layout.-type02 {
  column-gap: 4px;
}

.about-section .about-slider .card > .body > .layout.-type02 > .item:not(:first-child) {
  padding-left: 4px;
}

.about-section .about-slider .card > .body > .layout.-type01 > .item {
  width: fit-content;
}

.about-section .about-slider .card > .body > .layout > .item:not(:first-child) {
  padding-left: 8px;
  border-left: 1px solid var(--border-light-beige);
}

.about-section .about-slider .card > .body > .layout > .item > .text {
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;
}

.about-section .about-slider .card > .body > .layout.-type02 > .item > .text:first-child {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
}

.about-section .about-slider .card > .body > .layout > .item > .text:last-child {
  margin-top: 8px;
}

.about-section .about-slider .card > .body > .layout.-type02 > .item > .text:last-child {
  margin-top: 4px;
}

.about-section .about-slider .card > .body > .layout > .item > .text > .note {
  font-size: 8px;
  line-height: 8px;
}

.about-section .about-slider .card > .body > .layout > .item > .text > strong {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  font-family: roboto '���C���I', Meiryo;
  font-weight: 700;
  font-size: 24px;
  line-height: 1;
  color: var(--text-orange);
  letter-spacing: 0.05em;
}

.about-section .about-slider .card > .body > .layout.-type02 > .item > .text > strong {
  font-size: 18px;
}

.about-section .about-slider .card > .body > .layout > .item > .text > strong > span {
  font-family: roboto noto-sans;
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
}

.about-section .about-slider .card > .body > .layout.-type02 > .item > .text > strong > span {
  font-weight: 400;
  font-size: 8px;
}

.about-section .about-slider .card > .body > .btn {
  max-width: 180px;
  margin: 24px auto 0;
}
.about-section .about-slider .card > .body > .btn > .btn-ellipse04{
  text-decoration: none;
}

.about-section .splide__arrows > .splide__arrow svg{
  display: none;
}

.about-section .splide__arrows > .splide__arrow--prev,
.about-section .splide__arrows > .splide__arrow--next {
  width: 50px;
  height: 50px;
  background: var(--bg-white);
  opacity: 1;
  box-shadow: var(--drop-shadow-button01);
  top: 50%;
}

.about-section .splide__arrows > .splide__arrow--prev {
  left: -0.5em;
}

.about-section .splide__arrows > .splide__arrow--next {
  right: -0.5em;
}

.about-section .splide__arrows > .splide__arrow--prev::before,
.about-section .splide__arrows > .splide__arrow--next::before {
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_02.svg) no-repeat center / contain;
}

.about-section .splide__arrows > .splide__arrow--prev::before {
  transform: scale(-1, 1);
}

.about-section .about-cardLayout {
  display: grid;
  row-gap: 12px;
  margin-top: 8px;
}

.about-section .about-cardLayout > .card {
  border-radius: 4px;
  border: 1px solid var(--border-beige);
}

.about-section .about-cardLayout > .card > .title {
  padding: 28px 18px;
  border-radius: 4px 4px 0 0;
  background-color: var(--bg-light-green01);
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
  text-align: center;
}

.about-section .about-cardLayout > .card > .title > span {
  font-size: 18px;
  line-height: 27px;
}

.about-section .about-cardLayout > .card > .body {
  padding: 24px 14px;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .about-section .about-cardLayout {
    margin-top: 24px;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 12px;
  }
  
  .about-section .about-cardLayout > .card > .title {
    display: grid;
    place-content: center;
    min-height: 92px;
    padding: 8px 15px;
  }
  
  .about-section .about-cardLayout > .card > .body {
    padding: 38px;
  }
}

.about-section .about-card {
  margin: 8px auto;
  padding: 40px 16px;
  border-radius: 4px;
  background-color: var(--bg-light-green01);
}

.about-section .about-card > .list {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 8px;
}

.about-section .about-card > .list > .item {
  display: grid;
  grid-template-columns: 40px 1fr;
  align-items: center;
  column-gap: 8px;
}

.about-section .about-card > .list > .item > .number {
  display: grid;
  place-content: center;
  width: 100%;
  height: 40px;
  background-color: var(--bg-white);
  border-radius: 50%;
  font-family: roboto;
  font-size: 24px;
  font-weight: 900;
  line-height: 36px;
}

.about-section .about-card > .list > .item > .text {
  font-size: 18px;
  font-weight: 700;
  line-height: 27px;
}

@media screen and (min-width: 768px) {
  .about-section .about-card {
    max-width: 500px;
    margin-top: 24px;
    padding: 40px;
  }
  
  .about-section .about-card > .list > .item > .text {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
  }
}

.about-note:not(:first-child) {
  margin-top: 16px;
}

.about-note > .inner {
  position: relative;
  padding: 16px 48px 16px 14px;
  background-color: var(--bg-light-green01);
}

.about-note > .inner::before {
  content: "";
  display: block;
  position: absolute;
}

#about-bankAccount .about-note > .inner::before {
  bottom: -12px;
  right: -10px;
  width: 62px;
  height: 83px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_bank_account_05.svg) no-repeat center / contain;
}

#about-investmentManagement .about-note > .inner::before {
  bottom: -5px;
  right: -7px;
  width: 84px;
  height: 90px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_investment_management_01.svg) no-repeat center / contain;
}

.about-note > .inner > .text {
  font-size: 15px;
}

.about-note > .inner > .text sup {
  font-weight: 400;
  font-size: 10px;
  line-height: 12px;
}

.about-note > .note-list {
  padding-right: 48px;
}

.about-note > .note-list:not(:first-child) {
  margin-top: 14px;
}

.about-note .note-block {
  column-gap: 4px;
}

.about-note .note-block > p {
  font-size: 12px;
}

@media screen and (min-width: 768px) {
  .about-note:not(:first-child) {
    margin-top: 32px;
  }
  
  .about-note > .inner {
    display: flex;
    align-items: center;
    min-height: 96px;
    padding: 24px 100px 24px 24px;
  }
  
  #about-bankAccount .about-note > .inner::before {
    top: 0;
    bottom: auto;
    right: 0;
    width: 86px;
    height: 115px;
  }
  #about-investmentManagement .about-note > .inner::before {
    bottom: -19px;
    right: 0;
    width: 87px;
    height: 92px;
  }
  
  .about-note > .inner > .text {
    font-size: 18px;
  }
  
  .about-note .note-block > p {
    font-size: 14px;
  }
}
.about-subSection .accordion-layout .card-normal01 .header{
  outline-offset: -2px;
}

#about-area .btn-layout + .btn-layout {
  margin-top: 16px;
}

.about-textLink {
  display: flex;
  align-items: center;
  column-gap: 8px;
  color: var(--text-orange);
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  text-decoration: none;
}

.about-textLink:visited {
  color: var(--text-orange);
}

.about-textLink::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_01_orange.svg) no-repeat center / contain;
}

@media screen and (min-width: 768px) {
  .about-textLink:hover {
    color: var(--text-orange);
  }
}

.about-moreBlock {
  transition: 0.5s grid-template-rows;
}

.about-moreBlock[aria-hidden=true] {
  display: grid; 
  grid-template-rows: 0fr;
}

.about-moreBlock[aria-hidden=false] {
  display: grid; 
  grid-template-rows: 1fr;
}

.about-moreBlock > div {
  position: relative;
  min-height: 80px;
  overflow: hidden;
}

.about-moreBlock > div::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(255,255,255);
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
  z-index: 2;
}

.about-moreBlock[aria-hidden=false] > div::before {
  content: none;
}

.about-balloon {
  position: relative;
  margin-top: 20px;
  padding: 24px 0 24px 12px;
  border: 1px solid var(--border-light-beige);
}

.about-balloon::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  border-style: solid;
  border-width: 0 15px 16px 15px;
  border-color: transparent transparent var(--border-light-beige);
  translate: -50% -100%;
}

.about-balloon::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  border-style: solid;
  border-width: 0 12.3px 13.1px 12.3px;
  border-color: transparent transparent var(--bg-white);
  translate: -50% -100%;
}

.about-balloon > .inner {
  display: grid;
  grid-template-areas:
    "heading image"
    "link link";
  grid-template-columns: 1fr 107px;
  grid-template-rows: auto 1fr;
  row-gap: 16px;
  max-width: 300px;
  margin: 0 auto;
}

.about-balloon > .inner > .heading {
  grid-area: heading;
}

.about-balloon > .inner > .heading > .text {
  color: var(--text-gray-green);
  font-weight: 700;
  font-size: 15px;
  line-height: 22.5px;
}

.about-balloon > .inner > .heading > .name {
  margin-top: 4px;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
}

.about-balloon > .inner > .link {
  grid-area: link;
  padding-right: 12px;
}

.about-balloon > .inner > .link > .text-block > p > a {
  text-decoration: none;
}

.about-balloon > .inner > .img {
  grid-area: image;
}

@media screen and (max-width: 767px) {
  .about-balloon > .inner > .heading > .name {
    position: relative;
  }

  .about-balloon > .inner > .heading > .name::after {
    content: "";
    display: inline-block;
    position: absolute;
    bottom: -12px;
    right: -7px;
    width: 43px;
    height: 40px;
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_card_01.svg) no-repeat center / contain;
    vertical-align: top;
  }
  
  .about-balloon > .inner > .link > .text-block > p {
    text-align: center;
  }
}

@media screen and (min-width: 768px) {
  .about-balloon {
    position: relative;
    margin-top: 20px;
    padding: 18px 24px 0;
    border: 1px solid var(--border-light-beige);
  }

  .about-balloon > .inner {
    grid-template-areas:
      "heading image"
      "link image";
    grid-template-columns: 310px 206px;
    column-gap: 50px;
    row-gap: 28px;
    max-width: 566px;
  }
  
  .about-balloon > .inner > .heading {
    position: relative;
    margin-top: 17px;
  }

  .about-balloon > .inner > .heading::after {
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 72px;
    height: 67px;
    background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_card_01.svg) no-repeat center / contain;
    vertical-align: top;
  }
  
  .about-balloon > .inner > .heading > .text {
    font-size: 18px;
    line-height: 27px;
  }
  
  .about-balloon > .inner > .heading > .name {
    font-size: 24px;
    line-height: 36px;
  }
}

/* Modal */
#detailed-modal {
  max-height: calc(100vh - 80px);
  background-color: var(--bg-white);
  border-radius: 8px;
  overflow-y: auto;
}

.modal-btn {
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

#detailed-modal > .inner > .img > img {
  border-radius: 8px 8px 0 0;
}

#detailed-modal > .inner > .detail {
  padding: 40px 24px 24px;
}

#detailed-modal > .inner > .detail > .title {
  font-size: 14px;
  font-weight: 700;
  line-height: 14px;
}

#detailed-modal > .inner > .detail > .title > .inner {
  display: flex;
  align-items: baseline;
  justify-content: center;
  column-gap: 4px;
}

#detailed-modal > .inner > .detail > .title > .inner > img {
  width: 180px;
  height: 24px;
}

#detailed-modal > .inner > .detail > .body {
  margin-top: 40px;
  text-align: center;
}

#detailed-modal > .inner > .detail > .body > .text {
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  color: var(--text-gray-green);
}

#detailed-modal > .inner > .detail > .body > .text + .text {
  margin-top: 10px;
}

#detailed-modal > .inner > .detail > .body > .foot {
  margin-top: 24px;
}

#detailed-modal > .inner > .detail > .body > .foot > .text {
  font-weight: 700;
  font-size: 14px;
  line-height: 24px;
  color: var(--bg-trad-green);
}

#detailed-modal > .inner > .detail > .body > .foot > .logo {
  margin-top: 10px;
}

@media screen and (min-width: 768px) {
  #detailed-modal {
    max-width: 640px;
  }
  
  #detailed-modal > .inner > .detail > .title {
    font-size: 16px;
    line-height: 16px;
  }
  
  #detailed-modal > .inner > .detail > .title > .inner > img {
    width: 240px;
    height: 32px;
  }
}

#app-modal {
  display: flex;
  position: relative;
  width: 1000px;
  height: 370px;
  overflow: hidden;
  background: rgba(237, 243, 179, 0.9);
  border-radius: 8px;
  box-shadow: 0 14px 40px 0 rgba(20, 29, 29, .16);
  padding: 50px 87px 0 77px;
}

#app-modal > .btn-close {
  position: absolute;
  top: 24px;
  right: 20px;
  z-index: 2;
}

#app-modal > .inner {
  display: flex;
  justify-content: center;
  column-gap: 70px;
  position: relative;
}

#app-modal > .inner > .img {
  display: flex;
  align-items: flex-end;
}

#app-modal > .inner > .body > .text {
  color: var(--text-trad-green);
  font-size: 24px;
  font-weight: 700;
  text-align: center;
}

#app-modal > .inner > .body > .img {
  margin-top: 24px;
  text-align: center;
}

#app-modal > .inner > .body > .note {
  margin-top: 16px;
  color: var(--text-trad-green);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
}

/* Parts design */
/* =================================================== */
/* Title */
.cat-heading-level1 {
	width: 100vw;
  margin: 32px calc(50% - 50vw) 56px;
  background-color: var(--bg-white);
}

.cat-heading-level1 > .inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 18px;
}

.cat-heading-level1 > .inner .group {
  display: grid;
  row-gap: 16px;
}

.cat-heading-level1 > .inner .title {
  font-size: 28px;
  font-weight: 700;
  line-height: 42px;
  text-align: center;
}

.cat-heading-level1 > .inner .text {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: center; 
}

@media screen and (min-width: 768px) {
  .cat-heading-level1 > .inner .title {
    font-size: 36px;
    line-height: 54px;
  }
}

/* Title2 */
.heading-level2 {
  display: grid;
  grid-template-columns: 4px 1fr;
  column-gap: 12px;
}

.heading-level2::before {
  content: "";
  display: block;
  width: 4px;
  height: 100%;
  background-color: var(--bg-flesh-green);
  border-radius: 9999px;
}

.heading-level2 > .title {
  color: var(--text-trad-green);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
}

/* Title3 */
.heading-level3 {
  display: grid;
  row-gap: 4px;
}

.heading-level3::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--bg-flesh-green);
}

.heading-level3 > .title {
  color: var(--text-trad-green);
  font-size: 20px;
  font-weight: 700;
}

/* Title4 */
.heading-level4:not(:has( > .title > .number)):not(.-icon01):not(.-icon02) {
  display: grid;
  grid-template-columns: 16px 1fr;
  align-items: baseline;
  column-gap: 8px;
}

.heading-level4:not(:has( > .title > .number)):not(.-icon01):not(.-icon02)::before {
  content: "";
  display: block;
  width: 100%;
  height: 16px;
  background-color: var(--bg-flesh-green);
  border-radius: 2px;
}

.heading-level4 > .title {
  color: var(--text-trad-green);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
}

.heading-level4:has( > .title > .number) > .title {
  display: grid;
  grid-template-columns: 40px 1fr;
  column-gap: 12px;
}

.heading-level4 > .title > .number {
  display: inline-block;
  background-color: var(--bg-ud-flesh-green);
  border-radius: 4px;
  color: var(--text-white);
  height: 30px;
  text-align: center;
  width: 40px;
}

.heading-level4.-icon01,
.heading-level4.-icon02 {
  display: grid;
  grid-template-columns: 24px 1fr;
  column-gap: 4px;
}

.heading-level4.-icon01::before,
.heading-level4.-icon02::before {
  content: "";
  display: block;
  height: 24px;
  margin-top: 3px;
  width: 100%;
}

.heading-level4.-icon01::before {
  background: url(/kojin/cmn/imgs/ico_light_01.svg) no-repeat center / contain;
}

.heading-level4.-icon02::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_check.svg) no-repeat center / contain;
}

/* Column */
.column-layout1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

.column-layout1:not(:first-child) {
  margin-top: 24px;
}

.column-layout2Gap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

.column-layout2Gap:not(:first-child) {
  margin-top: 24px;
}

@media screen and (min-width: 768px) {
  .column-layout2Gap {
    grid-template-columns: repeat(2, 1fr);
    gap: 33px;
  }
}

.column-layout3Gap {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 16px;
}

@media screen and (min-width: 768px) {
  .column-layout3Gap {
    grid-template-columns: repeat(3, 1fr);
    gap: 33px;
  }
}

/* Panel card */
#article-block .panel-card,
.column-layout1 .panel-card,
.column-layout2Gap .panel-card {
  padding: 12px;
  border-radius: 4px;
  background: var(--bg-white);
  box-shadow: var(--drop-shadow-panel-card);
}

.panel-card > .inner {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  /* align-items: center; */
  column-gap: 16px;
  text-decoration: none;
}

.panel-card.-add-title > .inner {
  grid-template-areas: 
    "text text"
    "image title"
  ;
  gap: 12px;
}

.panel-card.-add-title > .inner > .heading {
  grid-area: text;
}

.panel-card.-add-title > .inner > .heading > .text {
  font-weight: 700;
  font-size: 16px;
  line-height: 16px;
  color: var(--text-trad-green);
}

.panel-card.-add-title > .inner > .thumbnail {
  grid-area: image;
}

.panel-card > .inner > .detail {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}

.panel-card.-add-title > .inner > .detail {
  grid-area: title;
}

.panel-card > .inner > .detail > .label {
  color: var(--text-black);
  font-size: 12px;
  line-height: 12px;
}

.panel-card > .inner > .detail > .title {
  margin-block: calc((1em - 1lh) / 2);
  color: var(--text-black);
  font-size: 14px;
  line-height: 21px;
}

@media screen and (max-width: 767px) {
  .panel-card > .inner {
    grid-template-columns: 106px 1fr;
  }
}

@media screen and (min-width: 768px) {
  .column-layout1 .panel-card {
    padding: 20px;
  }

  .column-layout1 .panel-card > .inner {
    grid-template-columns: 182px 1fr;
  }
  
  .panel-card.-add-title > .inner {
    grid-template-areas: 
      "image text"
      "image title"
    ;
    grid-template-rows: auto 1fr;
    gap: 16px;
  }
  
  .column-layout1 .panel-card.-small-layout > .inner > .detail > .title {
    font-size: 16px;
    line-height: 24px;
  }
}

@media screen and (min-width: 768px) {
  #article-block .panel-card {
    padding: 20px;
  }

  .panel-card:not(.-small-layout) > .inner {
    grid-template-columns: 1fr;
  }

  #article-block .panel-card > .inner .detail {
    padding: 16px 0 0;
  }
  
  .panel-card:not(.-small-layout) > .inner > .detail {
    padding: 16px 16px 0;
  }

  .panel-card:not(.-small-layout) > .inner > .detail > .label {
    line-height: 18px;
  }
}

/* Button */
.btn-layout {
  display: flex;
  justify-content: center;
}

.btn-layout.-column2 {
  flex-direction: column;
  gap: 16px;
}

.btn-layout:not(:first-child) {
  margin-top: 32px;
}

@media screen and (min-width: 768px) {
  .btn-layout.-column2 {
    flex-direction: row;
  }
}

.btn-ellipse01 {
  display: grid;
  grid-template-columns: 18px auto;
  column-gap: 8px;
  place-content: center;
  width: 100%;
  max-width: 320px;
  min-height: 52px;
  padding: 12px 16px;
  border-radius: 9999px;
  background-color: var(--bg-light-green02);
  text-decoration: none;
  font-weight: 700;
  border: 2px solid var(--border-white);
}

.btn-ellipse01.-drop-shadow {
  box-shadow: var(--drop-shadow-button02);
}

.btn-ellipse01::before {
  content: "";
  display: block;
  height: 24px;
  width: 18px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_01.svg) no-repeat center / contain;
}

.btn-ellipse01.-arrow-down::before {
  transform: rotate(90deg); 
  transform: rotate(0.25turn); 
}

.btn-ellipse02 {
  width: 100%;
  max-width: 320px;
  min-height: 52px;
  padding: 12px 16px;
  border-radius: 9999px;
  background-color: var(--bg-light-green02);
  text-decoration: none;
  text-align: center;
  font-weight: 700;
}

.btn-ellipse03 {
  display: grid;
  place-content: center;
  width: 100%;
  max-width: 320px;
  min-height: 52px;
  padding: 12px 16px;
  border-radius: 9999px;
  background-color: var(--bg-orange);
  text-decoration: none;
  font-weight: 700;
  color: var(--text-white);
}

.btn-ellipse03:visited {
  color: var(--text-white);
}

@media screen and (min-width: 768px) {
  .btn-ellipse03:hover {
    color: var(--text-white);
  }
}

.btn-ellipse04 {
  display: grid;
  grid-template-columns: 18px auto;
  column-gap: 8px;
  place-content: center;
  width: 100%;
  max-width: 320px;
  min-height: 52px;
  padding: 12px 16px;
  border: 2px solid var(--border-orange);
  border-radius: 9999px;
  background-color: var(--bg-white);
  text-decoration: none;
  font-weight: 700;
  color: var(--text-orange);
}

.btn-ellipse04::before {
  content: "";
  display: block;
  height: 24px;
  width: 18px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_01_orange.svg) no-repeat center / contain;
}

.btn-ellipse04[target="_blank"] {
  grid-template-columns: 18px 1fr 22px;
}

.btn-ellipse04:visited {
  color: var(--text-orange);
}

@media screen and (min-width: 768px) {
  .btn-ellipse04:hover {
    color: var(--text-orange);
  }
}

.btn-show[aria-expanded="false"] > span:last-child {
  display: none;
}

.btn-show[aria-expanded="true"] > span:first-child {
  display: none;
}

.btn-show {
  display: flex;
  align-items: center;
  column-gap: 8px;
  width: fit-content;
  margin: 16px auto 0;
  padding-right: 2px;
  border-bottom: 1px solid var(--text-black);
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}

.btn-show::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_01_black.svg) no-repeat center / contain;
}

.btn-show[aria-expanded="false"]::before {
  transform: rotate(0.5turn);
}

.btn-showAdd {
  display: none;
}

.btn-show[aria-expanded="true"] + .btn-showAdd {
  display: block;
  margin-top: 24px;
}

/* Note */
.note-list {
  display: grid;
  row-gap: 2px;
}

.note-block {
  display: flex;
  column-gap: 8px;
}

.note-block:not(:first-child):not(+ .note-block) {
  margin-top: 24px;
}

.note-block > p {
  color: var(--text-light-gray);
  font-size: 14px;
  line-height: 21px;
}

/* Section */
.section-block:not(:first-child) {
  margin-block-start: 52px;
}

.section-subBlock:not(:first-child) {
  margin-block-start: 22px;
}

.section-subBlock .section-subBlock:not(:first-child) {
  margin-block-start: 24px;
}

/* Tab */
.tab-contents {
  position: relative;
  padding-top: 46px;
}

.tab-contents > .list {
  position: absolute;
  top: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 4px;
  width: 100%;
}

.tab-contents > .list > .item > .switch {
  display: grid;
  place-content: center;
  min-height: 48px;
  width: 100%;
  background-color: var(--bg-white);
  padding: 0px 4px 0px 4px;
  background-color: var(--bg-light-beige);
  border-radius: 8px 8px 0px 0px;
  border: solid var(--bg-light-beige);
  border-width: 2px 2px 0px 2px;
  font-size: 14px;
  font-weight: 700;
  line-height: 21px;
  text-align: center;
}

.tab-contents > .list > .item > .switch[aria-selected="true"] {
  background-color: var(--bg-white);
}

.tab-contents > .wrap {
  background-color: var(--bg-white);
  border: solid 2px var(--bg-light-beige);
  padding: 32px 13px;
  border-radius: 0px 0px 8px 8px;
}

@media screen and (min-width: 768px) {
  .tab-contents > .wrap {
    padding: 40px;
  }
}

/* Table */
.table-type01 th,
.table-type01 td {
  vertical-align: middle;
}

.table-type01 .data.-bg-lightGreen {
  background-color: var(--bg-light-green03)
}

@media screen and (max-width: 767px) {
  .table-note {
    width: calc(100vw - 36px);
    padding: 8px 16px;
    background-color: var(--bg-white);
    border: 1px solid var(--border-gray-green);
    border-radius: 4px;
    font-size: 16px;
  }
  
  .table-note:not(:first-child) {
    margin-top: 28px;
  }
}

@media screen and (min-width: 768px) {
  .table-note {
    display: none;
  }
}

/* Text */
.text-block:not(:first-child) {
  margin-block-start: 14px;
}

.text-block:has( .anchor-text) + .text-block:has( .anchor-text) {
  margin-block-start: 8px;
}

.text-block > p {
  font-size: 16px;
  font-weight: 400;
  line-height: 27.2px;
}

/* Thumbnail */
.thumb-block {
  margin-block: 56px;
  text-align: center;
}

/* Table of Contents */
.toc-block {
  display: grid;
  row-gap: 12px;
  margin-block: 52px;
  padding: 16px;
  background-color: var(--bg-white);
  border-radius: 8px;
  border: 1px solid var(--border-gray-green);
}

.toc-block > .title {
  color: var(--text-trad-green);
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
  text-align: center;
}

.toc-block > .body > .list {
  display: grid;
  row-gap: 8px;
}

.toc-block > .body > .list .item {
  display: grid;
  grid-template-columns: 24px 1fr;
  column-gap: 8px;
  color: var(--text-trad-green);
  font-size: 16px;
  line-height: 24px;
}

.toc-block > .body > .list .item > .normal-icon {
  display: grid;
  place-content: center;
  width: 24px;
  height: 24px;
}

.toc-block > .body > .list .item > .normal-icon::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  background-color: var(--bg-green);
  border-radius: 50%;
}

.toc-block > .body > .list .item a {
  text-decoration: none;
}

/* Img */
.img-block {
  margin-block-start: 24px;
  text-align: center;
}

/* List */
.list-box {
  margin-block: 24px;
  padding: 16px;
  background-color: var(--bg-white);
  border-radius: 8px;
  border: 1px solid var(--border-gray-green);
}

.list-box:has( .heading) {
  padding: 0;
}

.list-box > .list {
  display: grid;
  row-gap: 8px;
}

.list-box > .list .item {
  display: grid;
  grid-template-columns: 24px 1fr;
  column-gap: 8px;
  color: var(--text-trad-green);
  font-size: 16px;
  line-height: 24px;
}

.list-box > .list .item > .normal-icon {
  display: grid;
  place-content: center;
  width: 24px;
  height: 24px;
}

.list-box > .list .item > .normal-icon::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  background-color: var(--bg-green);
  border-radius: 50%;
}

.list-box > .body {
  margin-block-start: 12px;
}

.list-box:has( .heading) .body {
  padding: 4px 16px 16px;
}

.list-box > .heading {
  padding: 16px;
  background-color: var(--bg-gray-green);
  border-radius: 8px 8px 0 0;
}

.list-box > .heading > .title {
  font-weight: 700;
  font-size: 18px;
  line-height: 1.5;
}

/* Author */
.author-block {
  display: grid;
  gap: 20px;
  padding: 20px;
  border-radius: 8px;
  background-color: var(--bg-white);
  border: 1px solid var(--border-gray-green);
}

.author-block:has(> .img.-small) {
  grid-template-columns: 72px 1fr;
  column-gap: 10px;
}

.author-block:not(:first-child) {
  margin-top: 24px;
}

.author-block > .img {
  text-align: center;
}

.author-block > .img > img {
  clip-path: inset(2px 2px round 50%);
  filter: drop-shadow(0 0 0 white);
}

.author-block > .detail {
  display: grid;
  row-gap: 8px;
}

.author-block > .detail > .name {
  font-size: 16px;
  font-weight: 700;
  line-height: 27.2px;
}

.author-block > .detail > .name.-red {
  color: var(--text-orange);
}

.author-block > .detail > .name.-blue {
  color: var(--text-blue);
}

.author-block > .detail > .name.-green {
  color: var(--text-green);
}

@media screen and (min-width: 768px) {
  .author-block {
    grid-template-columns: 120px 1fr;
  }
}

.unordered-list {
  display: grid;
  row-gap: 8px;
}

.unordered-list .unordered-list {
  margin-top: 8px;
}

.unordered-list > .item {
  display: grid;
  grid-template-columns: 12px 1fr;
  column-gap: 2px;
  /* color: var(--text-trad-green); */
  font-size: 16px;
  line-height: 24px;
}

.unordered-list > .item > .icon {
  display: grid;
  place-content: center;
  width: 12px;
  height: 24px;
}

.unordered-list > .item > .icon::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background-color: var(--bg-green);
  border-radius: 50%;
}

.unordered-list .unordered-list > .item > .icon::before {
  width: 4px;
}

.accordion-layout:not(:first-child) {
  margin-block-start: 24px;
}

.accordion-layout > .card-normal01 {
  border-radius: 8px;
}

.accordion-layout > .card-normal01 > .inner > .header {
  padding: 16px;
}

.accordion-layout > .card-normal01 > .inner > .header > .title {
  font-size: 1.6rem;
  text-align: left;
}

.accordion-layout > .toggle-block01.card-normal01:not(.-red01) > .inner > .header[role=tab] > .title {
  color: var(--text-black);
}

.accordion-layout > .card-normal01 > .inner > .body:not(:first-child)::before {
  content: none;
}

.accordion-layout > .card-normal01 > .inner > .body {
  padding: 16px;
  border-top: 1px solid var(--border-gray-green);
}

.comment-block01 {
  padding: 20px;
  background-color: var(--bg-white);
  border: 1px solid var(--border-gray-green);
  border-radius: 8px;
}

.comment-block01 > .inner {
  display: block grid;
  row-gap: 24px;
}

.comment-block01 > .inner > .comment {
  display: block flex;
  column-gap: 8px;
}

.comment-block01 > .inner > .comment > .img {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  clip-path: inset(1px 1px round 50%);
  filter: drop-shadow(0 0 0 white);
}

.comment-block01 > .inner > .comment > .balloon {
  position: relative;
  display: inline-block;
  padding: 16px;
  border: 1px solid var(--border-gray-green);
  border-radius: 8px;
  background-color: var(--bg-light-green01);
  text-align: left;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}

.comment-block01 > .inner > .comment > .balloon.-right {
  margin-left: 20px;
}

.comment-block01 > .inner > .comment > .balloon.-left {
  margin-right: 20px;
}

.comment-block01 > .inner > .comment > .balloon::before {
  content: "";
  position: absolute;
  top: 24px;
  border-style: solid;
  border-width: 10px 20px 10px 0;
  border-color: transparent var(--border-gray-green) transparent transparent;
  translate: -100% 0;
}

.comment-block01 > .inner > .comment > .balloon::after {
  content: "";
  position: absolute;
  top: 25px;
  border-style: solid;
  border-width: 9px 17px 9px 0;
  border-color: transparent var(--bg-light-green01) transparent transparent;
  translate: -100% 0;
}

.comment-block01 > .inner > .comment > .balloon.-right::before,
.comment-block01 > .inner > .comment > .balloon.-right::after {
  left: 0;
}

.comment-block01 > .inner > .comment > .balloon.-left::before,
.comment-block01 > .inner > .comment > .balloon.-left::after {
  right: 0;
  translate: 100% 0;
  rotate: 0.5turn;
}

.comment-block02 {
  display: grid;
  row-gap: 24px;
}

.comment-block02:not(:first-child) {
  margin-top: 24px;
}

.comment-block02 > .inner {
  display: grid;
  grid-template-columns: 80px 1fr;
  column-gap: 10px;
}

.comment-block02 > .inner > .name {
  font-size: 16px;
  font-weight: 700;
  line-height: 27.2px;
}

.comment-block02 > .inner > .name.-red {
  color: var(--text-orange);
}

.comment-block02 > .inner > .name.-blue {
  color: var(--text-blue);
}

.comment-block02 > .inner > .name.-green {
  color: var(--text-green);
}

.comment-block02 > .inner > .text {
  font-size: 16px;
  line-height: 27.2px;
}

/* Card */
.card-box {
  margin-block: 24px;
  padding: 16px;
  background-color: var(--bg-white);
  border-radius: 8px;
  border: 1px solid var(--border-gray-green);
}

/* Anchor Text */
.anchor-text {
  display: grid;
  grid-template-columns: 22px 1fr;
}

.anchor-text::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 28px;
  background: url(/kojin/cmn/imgs/ico_arrow_right_01.svg) no-repeat center / contain;
  transform: rotate(0.25turn);
}

.anchor-text.-up::before {
  transform: rotate(0.75turn);
}

/* Number Anchor */
.number-anchor {
  display: grid;
  row-gap: 8px;
}

.number-anchor > .item {
  display: grid;
  grid-template-columns: 24px 1fr;
  column-gap: 4px;
}

.number-anchor > .item > .number {
  width: 16px;
  height: 16px;
  background-color: var(--bg-flesh-green);
  border-radius: 50%;
  font-size: 10px;
  margin: 0.4em auto 0;
  text-align: center;
}

/* Check Box */
.check-box:not(:first-child) {
  margin-top: var(--spacing-24);
}

.check-box + .check-box {
  margin-top: 12px;
}

.check-box > .label {
  transition: opacity 0.4s 0s ease;
  cursor: pointer;
  column-gap: 4px;
  display: grid;
  grid-template-columns: auto 1fr;
  position: relative;
}

.check-box > .label > input[type="checkbox"] {
  margin: 0;
  pointer-events: none;
  position: absolute;
  appearance: none;
  height: 20px;
  outline-offset: -1px;
  opacity: 1;
  top: 2px;
  width: 20px;
}

.check-box > .label > .icon {
  height: 18px;
  border: solid 1px var(--border-trad-green);
  border-radius: 2px;
  margin: calc((1lh - 18px) / 2) 0;
  width: 18px;
}

.check-box > .label input[type="checkbox"]:checked + .icon {
  display: grid;
  place-content: center;
  position: relative;
  background-color: var(--bg-trad-green);
}

.check-box > .label input[type="checkbox"]:checked + .icon::before {
  height: 14px;
  content: "";
  display: block;
  width: 14px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_check_01.svg) no-repeat center / contain;
}

@media screen and (min-width: 768px) {
  .check-box > .label:hover {
    opacity: .7;
  }
}

/* Text Link */
.text-link::after {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  vertical-align: middle;
  background: url(/kojin/cmn/imgs/ico_arrow_right_01.svg) no-repeat center / contain;
}

/* Label Icon */
.label-icon {
  display: inline-block;
  margin-right: 4px;
  padding: 0 4px;
  border-radius: 2px;
  font-size: 12px;
  line-height: 18px;
}

.label-icon.-orange {
  background-color: var(--bg-orange);
  color: var(--text-white);
}

.label-icon.-uppercase {
  text-transform: uppercase;
  text-wrap: balance;
}

@media screen and (min-width: 768px) {
  .label-icon {
    padding: 0 8px;
  }
}

.btn-pageToTop {
  position: fixed;
  right: 12px;
  bottom: 24px;
  height: 50px;
  width: 50px;
  z-index: 2;
}

.btn-pageToTop > .btn {
  display: block;
  height: 100%;
  width: 100%;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_01_black.svg) no-repeat center / 14px 18px;
  background-color: var(--bg-white);
  border-radius: 50%;
  box-shadow: 0px 10px 12px 0px #141d1d14;
}

/* Top design */
/* =================================================== */
/* Top section */
.top-section {
  padding: 32px 16px;
  background-color: var(--bg-white);
  border-radius: 8px;
}

.top-section:not(:first-child) {
  margin-top: 56px;
}

@media screen and (min-width: 768px) {
  .top-section {
    padding: 48px;
    border-radius: 32px;
  }
  
  .top-section + .top-section {
    margin-top: 104px;
  }
}

/* Title */
.top-headingLevel2 {
  margin-bottom: 32px;
}

.top-headingLevel2 > .group {
  position: relative;
  padding-top: 30px;
}

.top-headingLevel2 > .group > .title {
  position: relative;
  font-size: 26px;
  font-weight: 700;
  line-height: 39px;
  letter-spacing: 0.1em;
  text-align: center;
  z-index: 1;
}

.top-headingLevel2 > .group > .text {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  font-family: roboto;
  font-size: 48px;
  font-weight: 900;
  line-height: 48px;
  letter-spacing: 0.05em;
  text-align: center;
  text-transform: uppercase;
  text-wrap:balance;
  color: var(--text-beige);
}

@media screen and (min-width: 768px) {
  .top-headingLevel2 {
    margin-bottom: 48px;
  }
  
  .top-headingLevel2 > .group {
    padding-top: 60px;
  }
  
  .top-headingLevel2 > .group > .title {
    font-size: 40px;
    line-height: 60px;
    letter-spacing: 0.1em;
  }
  
  .top-headingLevel2 > .group > .text {
    font-size: 100px;
    line-height: 100px;
  }
}

/* Top kv */
#slider-area {
  margin-top: 32px;
}

.top-kv01 {
  display: block;
  padding: 16px;
  background-color: var(--bg-white);
  border-radius: 8px;
  text-decoration: none;
}

.top-kv01 > .kv img {
  width: 100%;
}

.top-kv01 > .detail {
  margin-top: 16px;
}

.top-kv01 > .detail > .label {
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  color: var(--text-black);
}

.top-kv01 > .detail > .title {
  margin-top: 4px;
  font-size: 16px;
  font-weight: 700;
  line-height: 21px;
  color: var(--text-black);
}

@media screen and (min-width: 768px) {
  .top-kv01 {
    display: grid;
    grid-template-columns: 637px 1fr;
    align-items: center;
    column-gap: 32px;
    padding: 16px 82px 16px 16px;
    border-radius: 8px;
  }
  
  .top-kv01 > .detail {
    margin-top: 0;
  }
  
  .top-kv01 > .detail > .title {
    margin-top: 8px;
    font-size: 24px;
    line-height: 36px;
  }
}

#slider-area .navigation > .navigation-prev,
#slider-area .navigation > .navigation-next {
  width: 50px;
  height: 50px;
  background: var(--bg-white);
  opacity: 1;
  box-shadow: var(--drop-shadow-button01);
  top: 45%;
}

#slider-area .navigation > .navigation-prev {
  left: -0.5em;
}

#slider-area .navigation > .navigation-next {
  right: -0.5em;
}

#slider-area .navigation > .navigation-prev::before,
#slider-area .navigation > .navigation-next::before {
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_arrow_02.svg) no-repeat center / contain;
}

#slider-area .navigation > .navigation-prev::before {
  transform: scale(-1, 1);
}

#slider-area .controls {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  margin-top: 8px;
}

#slider-area .controls .pagination {
  position: relative;
  padding: 0;
  display: flex;
  align-items: center;
  column-gap: 8px;
  bottom: 0;
}

#slider-area .controls .pagination .splide__pagination__page {
  margin: 0;
  background: var(--bg-gray-green);
  display: block;
}

#slider-area .controls .pagination .splide__pagination__page.is-active {
  background: var(--bg-trad-green);
  transform: scale(1);
}

#slider-area .controls > .toggle:not(.is-active) {
  position: relative;
  background-color: var(--border-gray-green);
  width: 8px;
  height: 8px;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
  border: none;
}

#slider-area .controls > .toggle {
  width: 6px;
  height: 8px;
  border-left: 2px solid var(--border-gray-green);
  border-right: 2px solid var(--border-gray-green);
}

@media screen and (min-width: 768px) {
  #slider-area .controls {
    column-gap: 12px;
    margin-top: 24px;
  }
  
  #slider-area .controls .pagination .splide__pagination__page {
    width: 10px;
    height: 10px;
  }
  
  #slider-area .controls > .toggle:not(.is-active) {
    width: 10px;
    height: 10px;
  }
  
  #slider-area .controls > .toggle {
    width: 6px;
    height: 10px;
  }
}

/* Article page */
/* =================================================== */
#article-content {
  width: 100%;
  max-width: 800px;
  margin: 56px auto 0;
}

.article-head > .inner {
  display: grid;
  row-gap: 16px;
}

.article-head > .inner > .head {
  display: flex;
  justify-content: space-between;
}

.article-head > .inner > .head .cat-type {
  display: flex;
  align-items: center;
  column-gap: 4px;
  color: var(--text-trad-green);
  font-size: 16px;
  font-weight: 700;
  line-height: 27.2px;
}

.article-head > .inner > .head .cat-type::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
}

.article-head > .inner > .head .cat-type.-know::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_02.svg) no-repeat center / contain;
}

.article-head > .inner > .head .cat-type.-start::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_03.svg) no-repeat center / contain;
}

.article-head > .inner > .head .cat-type.-use::before {
  background: url(/kojin/olive/olive-times/cmn/imgs/cmn_icon_04.svg) no-repeat center / contain;
}

.article-head > .inner > .head .date {
  font-size: 16px;
  font-weight: 400;
  line-height: 27.2px;
}

.article-head > .inner > .title {
  font-size: 24px;
  font-weight: 700;
  line-height: 40.8px;
}

.article-head > .inner > .tag {
  display: flex;
  column-gap: 8px;
}

.article-head > .inner > .tag .btn {
  display: grid;
  place-content: center;
  place-items: center;
  grid-template-columns: 1em 1fr;
  height: 32px;
  width: fit-content;
  padding: 0 12px;
  background-color: var(--bg-white);
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  border: 1px solid var(--border-gray-green);
  text-decoration: none;
}

.article-head > .inner > .tag .btn::before {
  content: '#';
  color: var(--text-trad-green);
}

/* Override splide */
/* =================================================== */
.splide:not(.is-initialized)[data-initialized="true"] {
  visibility: visible;
}

.splide.is-initialized:not(.is-active) .splide__list {
  display: flex !important;
}

.splide__slide {
  display: block !important;/* To override the style of "/kojin/cmn/styles/module.min.css" */
}

.splide.is-focus-in .splide__arrow:focus,
.splide.is-focus-in .splide__toggle:focus,
.splide.is-focus-in .splide__pagination__page:focus {
  outline: 3px solid #c4d700;
}

/* Utility */
/* =================================================== */
._visually-hidden {
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

._mt56 {
  margin-top: 56px !important;
}