@media screen and (max-width: 560px) { .js-scrollable { overflow-x: auto; }
  .js-scrollable > figure, .js-scrollable > .image { padding: 0 0 12px; height: 50vh; }
  .js-scrollable > figure img, .js-scrollable > .image img { width: auto; height: 100%; object-fit: contain; } }

.select-conts h3 { font-size: clamp(20px, 2.8vw, 1.75rem); font-weight: 500; text-align: center; width: 100%; /*margin-bottom: 2.5rem;*/ margin-bottom: 1rem; line-height: 1.44; letter-spacing: 0.075em; }
.select-conts .maincopy { font-size: clamp(18px, 2.6vw, 1.5rem); }

.bg3 { background-color: #504b41; color: #fff; }

.my-style-select-wrap > ul { padding-top: 5rem; display: grid; grid-template-columns: repeat(2, 1fr); gap: 5rem 8%; }
.my-style-select-wrap > ul .select-container { display: grid; grid-template-rows: subgrid; grid-row: span 3; gap: 0; }
.my-style-select-wrap > ul .select-container .select-name { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 0 0 0.5rem 16px; margin-bottom: 1rem; position: relative; }
.my-style-select-wrap > ul .select-container .select-name p, .my-style-select-wrap > ul .select-container .select-name h4 { font-weight: 500; text-align: left; line-height: 1.28; letter-spacing: 0.025em; }
.my-style-select-wrap > ul .select-container .select-name p.en, .my-style-select-wrap > ul .select-container .select-name h4.en { font-size: clamp(24px, 2vw, 1.5rem); color: #af9c78; }
.my-style-select-wrap > ul .select-container .select-name p.ja, .my-style-select-wrap > ul .select-container .select-name h4.ja { font-size: clamp(13px, 1.45vw, 0.875rem); color: #ebdec6; }
.my-style-select-wrap > ul .select-container .select-name::before { content: ""; display: block; width: 4px; height: 100%; background-color: #ebdec6; position: absolute; left: 0; top: 0; }
.my-style-select-wrap > ul .select-container .lead { text-align: left; color: #fff; padding: 0 12px 1.5rem; }
.my-style-select-wrap > ul .select-container.size-l { grid-column: span 2; grid-template-rows: initial; grid-template-columns: auto 46%; column-gap: 4%; }
.my-style-select-wrap > ul .select-container.size-l .select-name { order: 1; }
.my-style-select-wrap > ul .select-container.size-l .image { order: 2; grid-row: span 3; }
.my-style-select-wrap > ul .select-container.size-l .lead { order: 3; }
.my-style-select-wrap > ul .select-container.size-l:nth-of-type(2n) { grid-template-columns: 46% auto; }
.my-style-select-wrap > ul .select-container.size-l:nth-of-type(2n) .select-name { order: 2; }
.my-style-select-wrap > ul .select-container.size-l:nth-of-type(2n) .image { order: 1; }
@media screen and (max-width: 560px) { .my-style-select-wrap > ul { grid-template-columns: 1fr; row-gap: 4rem; }
  .my-style-select-wrap > ul .select-container.size-l { grid-column: span 1; grid-template-columns: 1fr !important; }
  .my-style-select-wrap > ul .select-container.size-l .select-name { order: 1 !important; }
  .my-style-select-wrap > ul .select-container.size-l .image { order: 3 !important; grid-row: span 1; }
  .my-style-select-wrap > ul .select-container.size-l .lead { order: 2 !important; } }

.mystyle-container .chart { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.mystyle-container .chart .head-step-num { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; padding-top: 36px; }
.mystyle-container .chart .head-step-num div, .mystyle-container .chart .head-step-num li { min-height: 0%; }
.mystyle-container .chart .head-step-num::before, .mystyle-container .chart .head-step-num::after { content: ""; display: block; height: 1px; background-color: #af9c78; flex-grow: 1; }
.mystyle-container .chart .head-step-num .txt { width: calc((38/332)*100%); min-width: 24px; max-width: 40px; margin: 0 auto 8px; text-align: center; position: absolute; left: 50%; top: 0; transform: translateX(-50%); }
.mystyle-container .chart .head-step-num .num { width: calc((60/332)*100%); max-width: 60px; }
.mystyle-container .chart .head-step-title { padding: 1rem 2rem 0; font-size: clamp(12px, 1.6vw, 15px); text-align: center; line-height: 1.28; letter-spacing: 0.1em; }
.mystyle-container .chart .text-box { padding: 2.25rem 8% 1rem; }
.mystyle-container .chart .text-box .note { margin-top: 1%; }
.mystyle-container .chart .lead { font-size: clamp(11px, 1.45vw, 13px); text-align: left; }
.mystyle-container .chart li { display: grid; grid-template-rows: subgrid; grid-row: span 4; }
.mystyle-container .chart li:first-of-type .head-step-num::before { background-color: #ffffff00; }
.mystyle-container .chart li:last-of-type .head-step-num::after { background-color: #ffffff00; }
.mystyle-container > .note { margin-top: 1rem; padding: 0 2%; }
@media screen and (max-width: 834px) { .mystyle-container .chart .text-box { padding-top: 1.5rem; } }
@media screen and (max-width: 560px) { .mystyle-container .chart { grid-template-columns: 1fr; }
  .mystyle-container .chart .head-step-num { padding-top: 0; flex-direction: column; justify-content: space-between; grid-row: span 5; }
  .mystyle-container .chart .head-step-num::before, .mystyle-container .chart .head-step-num::after { width: 1px; height: 4vh; }
  .mystyle-container .chart .head-step-num .txt { position: static; transform: none; }
  .mystyle-container .chart .head-step-num .num { width: 100%; }
  .mystyle-container .chart .head-step-title { padding: 0; grid-column-start: 2; grid-row-start: 2; padding-top: 6%; }
  .mystyle-container .chart .text-box { padding: 2% 0 0; grid-column-start: 2; grid-row-start: 3; }
  .mystyle-container .chart li { grid-template-columns: 60px auto; column-gap: 5.6%; align-items: center; position: relative; } }
@media screen and (max-width: 380px) { .mystyle-container .chart .head-step-num::before, .mystyle-container .chart .head-step-num::after { height: 5vh; } }

.outro .conversion-buttons li.others a { background-color: #dcd9d7; }
.outro .conversion-buttons:has(li.others) { margin-bottom: 4rem; }
.outro .conversion-buttons li { margin-right: 0; }
.outro .conversion-reserve .conversion-buttons li.entry { display: none !important; }
.outro .conversion-entry .conversion-buttons li.reserve { display: none !important; }
