@charset "UTF-8";
/*
このファイルの用途・使用方法
https://github.com/q-jutaku/coding_rule/blob/main/css.md#sassstylescss

各importファイルの詳細
https://github.com/q-jutaku/coding_rule/blob/main/css.md#%E5%90%84%E3%82%BB%E3%82%AF%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AE%E8%A9%B3%E7%B4%B0
*/
@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@200;400;500;700;900&display=swap);
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, button, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

li, dd {
  list-style-type: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}

q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
}

img {
  vertical-align: bottom;
  border: none;
}

input[type=submit],
input[type=button] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  -moz-appearance: button;
       appearance: button;
  border: none;
  box-sizing: border-box;
}
input[type=submit]::-webkit-search-decoration,
input[type=button]::-webkit-search-decoration {
  display: none;
}
input[type=submit]::focus,
input[type=button]::focus {
  outline-offset: -2px;
}

/*
このファイルの用途・使用方法
https://github.com/q-jutaku/coding_rule/blob/main/css.md#variables_commonscss
*/
/*
このファイルの用途・使用方法
https://github.com/q-jutaku/coding_rule/blob/main/css.md#_fontfamilyscss-webfont1-%E3%81%AE-import%E3%83%95%E3%82%A9%E3%83%B3%E3%83%88%E3%83%95%E3%82%A1%E3%83%9F%E3%83%AA%E3%83%BC%E5%90%8D%E3%82%92%E6%8C%87%E5%AE%9A
*/
/*
このファイルの用途・使用方法
https://github.com/q-jutaku/coding_rule/blob/main/css.md#_skinscss-%E3%82%AB%E3%83%A9%E3%83%BC%E3%82%B3%E3%83%BC%E3%83%89%E5%A4%89%E6%95%B0%E7%AD%89
*/
/*
このファイルの用途・使用方法
https://github.com/q-jutaku/coding_rule/blob/main/css.md#sassmixins
*/
/*
このファイルの用途・使用方法
https://github.com/q-jutaku/coding_rule/blob/main/css.md#mixins_responsivescss
*/
/* chrome, edge */
/*
このファイルの用途・使用方法
https://github.com/q-jutaku/coding_rule/blob/main/css.md#sassmixins
*/
/*
 +	core css
 */
* {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  font-family: "Noto Sans JP", "游ゴシック", "ヒラギノ角ゴ Pro", sans-serif;
  font-feature-settings: "palt";
}

a,
button {
  transition: opacity 0.2s;
  text-decoration: none;
  cursor: pointer;
}
@media (hover: hover) {
  a:hover,
button:hover {
    opacity: 0.7;
  }
}

img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

.content_inner {
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .content_inner {
    max-width: 606px;
  }
}

.parts_division {
  background: no-repeat center top/100% auto;
  padding-top: 3.7288135593%;
  padding-bottom: 11.2211221122%;
}
.parts_division.mod-1 {
  background-image: url(../images/common/divisions/1/bg.webp);
}
.parts_division.mod-2 {
  background-image: url(../images/common/divisions/2/bg.webp);
}
.parts_division.mod-3 {
  background-image: url(../images/common/divisions/3/bg.webp);
}
.parts_division.mod-4 {
  background-image: url(../images/common/divisions/4/bg.webp);
}
.parts_division.mod-5 {
  background-image: url(../images/common/divisions/5/bg.webp);
}
.parts_division.mod-6 {
  background-image: url(../images/common/divisions/6/bg.webp);
}

.parts_division_member {
  margin-top: 4.3%;
  padding: 0 3.7288135593%;
}

.parts_division_ttl {
  padding: 0 3.7288135593%;
}

.parts_division_subTtl {
  filter: drop-shadow(0 0 1.6438356164vw rgba(0, 0, 0, 0.6));
  margin-top: 8.0586080586%;
  padding: 0 3.7288135593%;
}
@media (min-width: 607px) {
  .parts_division_subTtl {
    filter: drop-shadow(0 0 9.9780821918px rgba(0, 0, 0, 0.6));
  }
}
.parts_division_subTtl.mod-3 {
  filter: drop-shadow(0 0 1.6438356164vw #ff9900);
}
@media (min-width: 607px) {
  .parts_division_subTtl.mod-3 {
    filter: drop-shadow(0 0 9.9780821918px #ff9900);
  }
}
.parts_division_subTtl.mod-5 {
  filter: drop-shadow(0 0 1.6438356164vw #cc0000);
}
@media (min-width: 607px) {
  .parts_division_subTtl.mod-5 {
    filter: drop-shadow(0 0 9.9780821918px #cc0000);
  }
}

.parts_division_slideItem_goods {
  width: 65.7627118644%;
  margin: 0 auto;
}
.parts_division_slideItem_goods.mod-2 {
  width: 74.5762711864%;
  margin-top: 3%;
}
.parts_division_slideItem_goods.mod-3 {
  width: 81.661017%;
  margin-top: -5%;
}

.parts_division_slideItem_text {
  margin-top: 4.406779661%;
}
.parts_division_slideItem_text.mod-2 {
  margin-top: 5.40678%;
}

.parts_division_slideItem_text_ttl {
  width: 61.0169491525%;
  margin: 0 auto;
  position: relative;
}
.parts_division_slideItem_text_ttl .mod-set {
  width: 12.8767123288vw;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -16.1643835616vw;
}
@media (min-width: 607px) {
  .parts_division_slideItem_text_ttl .mod-set {
    width: 78.1616438356px;
    left: -98.1178082192px;
  }
}
.parts_division_slideItem_text_ttl.mod-2, .parts_division_slideItem_text_ttl.mod-3 {
  font-size: 4.3835616438vw;
  line-height: 1;
  letter-spacing: -0.02em;
  font-weight: 900;
  margin-left: 44%;
}
@media (min-width: 607px) {
  .parts_division_slideItem_text_ttl.mod-2, .parts_division_slideItem_text_ttl.mod-3 {
    font-size: 26.6082191781px;
  }
}
.parts_division_slideItem_text_ttl.mod-3 {
  margin-left: 38%;
}

.parts_division_slideItem_text_content {
  margin-top: 3.3898305085%;
  padding-top: 5.0847457627%;
  position: relative;
}
.parts_division_slideItem_text_content:before {
  content: "";
  display: block;
  margin: 0 auto;
  width: 74.5762711864%;
  height: 2px;
  background: #000;
  z-index: 1;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
}
.parts_division_slideItem_text_content.mod-2, .parts_division_slideItem_text_content.mod-3 {
  margin-top: 5.6%;
}
.parts_division_slideItem_text_content.mod-2:before, .parts_division_slideItem_text_content.mod-3:before {
  width: 89.1525423729%;
}

.parts_division_slideItem_text_strong {
  font-size: 3.0136986301vw;
  line-height: 1.2727272727;
  letter-spacing: -0.02em;
  font-weight: 900;
  -webkit-text-stroke: 0.8219178082vw #fff;
  paint-order: stroke fill;
  text-align: center;
  position: relative;
}
@media (min-width: 607px) {
  .parts_division_slideItem_text_strong {
    font-size: 18.2931506849px;
    -webkit-text-stroke: 4.9890410959px #fff;
  }
}

.parts_division_slideItem_text_small {
  font-size: 2.4657534247vw;
  -webkit-text-stroke: 0.5479452055vw #fff;
  paint-order: stroke fill;
  text-align: center;
  line-height: 1.4444444444;
  letter-spacing: -0.02em;
  font-feature-settings: "palt";
  margin-top: 4%;
}
@media (min-width: 607px) {
  .parts_division_slideItem_text_small {
    font-size: 14.9671232877px;
    -webkit-text-stroke: 3.3260273973px #fff;
  }
}
.parts_division_slideItem_text_small.mod-2, .parts_division_slideItem_text_small.mod-3 {
  line-height: 2;
  font-weight: bold;
  margin-top: 0;
}

.parts_division_slider {
  margin-top: 14%;
  overflow: visible;
  overflow-x: clip;
}

.parts_division_slider_button {
  width: 6.8493150685vw;
  height: 12.3287671233vw;
  background: url(../images/common/divisions/common/icon-arrow.png) no-repeat center center/100% auto;
  position: absolute;
  top: 27.397260274vw;
  transform: translateY(-50%);
  z-index: 2;
}
@media (min-width: 607px) {
  .parts_division_slider_button {
    width: 41.5753424658px;
    height: 74.8356164384px;
    top: 166.301369863px;
  }
}
.parts_division_slider_button.mod-prev {
  left: 2.7%;
}
.parts_division_slider_button.mod-next {
  right: 2.7%;
  transform: translateY(-50%) rotate(180deg);
}

.parts_division_btns {
  padding: 0 3.7288135593% 0 2.5641025641%;
  margin-top: 2.7%;
}

.parts_division_btn {
  padding: 4.683516% 0 5.6% 4.126007%;
  background: url(../images/common/divisions/1/btn_frame.webp) no-repeat center center/100% 100%;
  color: #000;
  font-size: 4.1095890411vw;
  line-height: 1;
  display: flex;
  align-items: center;
  position: relative;
  font-weight: 500;
}
@media (min-width: 607px) {
  .parts_division_btn {
    font-size: 24.9452054795px;
  }
}
.parts_division_btn + .parts_division_btn {
  margin-top: 3%;
}
.parts_division_btn.mod-2 {
  background-image: url(../images/common/divisions/2/btn_frame.webp);
}
.parts_division_btn.mod-3 {
  background-image: url(../images/common/divisions/3/btn_frame.webp);
}
.parts_division_btn.mod-4 {
  background-image: url(../images/common/divisions/4/btn_frame.webp);
}
.parts_division_btn.mod-5 {
  background-image: url(../images/common/divisions/5/btn_frame.webp);
}
.parts_division_btn.mod-6 {
  background-image: url(../images/common/divisions/6/btn_frame.webp);
}
.parts_division_btn .mod-text {
  position: relative;
}
.parts_division_btn .mod-text:after {
  content: "";
  display: inline-block;
  width: 12.602739726vw;
  height: 1.6438356164vw;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: calc(100% + 0.3em);
  background: url(../images/common/divisions/common/btn_arrow.webp) no-repeat center center/100% 100%;
}
@media (min-width: 607px) {
  .parts_division_btn .mod-text:after {
    width: 76.498630137px;
    height: 9.9780821918px;
  }
}

.parts_division_note {
  font-size: 3.2876712329vw;
  color: #fff;
  line-height: 1;
  padding: 1.6949152542% 0;
  text-align: center;
  width: 93.739274%;
  margin: 5% 0 0 2.8%;
  font-weight: bold;
}
@media (min-width: 607px) {
  .parts_division_note {
    font-size: 19.9561643836px;
  }
}
.mod-1 .parts_division_note {
  background-color: #CF121B;
}
.mod-2 .parts_division_note {
  background-color: #2660AC;
}
.mod-3 .parts_division_note {
  background-color: #FCC80E;
}
.mod-4 .parts_division_note {
  color: #000;
  background-color: #B4B4B5;
}
.mod-5 .parts_division_note {
  background-color: #EE6C00;
}
.mod-6 .parts_division_note {
  background-color: #86519C;
}

.parts_divisionSelect_list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 8.4931506849vw;
  grid-row-gap: 7.1232876712vw;
  row-gap: 7.1232876712vw;
}
@media (min-width: 607px) {
  .parts_divisionSelect_list {
    margin-top: 51.5534246575px;
    grid-row-gap: 43.2383561644px;
    row-gap: 43.2383561644px;
  }
}

.parts_divisionSelect_item {
  width: 28.880866426%;
}
.parts_divisionSelect_item.mod-1 {
  margin-top: 3.2876712329vw;
}
@media (min-width: 607px) {
  .parts_divisionSelect_item.mod-1 {
    margin-top: 19.9561643836px;
  }
}
.parts_divisionSelect_item.mod-4 {
  margin-top: 1.095890411vw;
}
@media (min-width: 607px) {
  .parts_divisionSelect_item.mod-4 {
    margin-top: 6.6520547945px;
  }
}
.parts_divisionSelect_item.mod-6 {
  margin-top: 4.1095890411vw;
}
@media (min-width: 607px) {
  .parts_divisionSelect_item.mod-6 {
    margin-top: 24.9452054795px;
  }
}

.parts-annotationList_ttl {
  position: relative;
  font-size: 6.5506849315vw;
  background-color: #000;
  color: #fff;
  font-weight: bold;
  padding: 5.9% 0;
  text-align: center;
}
@media (min-width: 607px) {
  .parts-annotationList_ttl {
    font-size: 39.7626575342px;
  }
}
.parts-annotationList_ttl::before, .parts-annotationList_ttl::after {
  content: "";
  display: block;
  position: absolute;
  top: 10%;
  left: 0;
  width: 100%;
  height: 1.095890411vw;
  background-color: #fff;
}
@media (min-width: 607px) {
  .parts-annotationList_ttl::before, .parts-annotationList_ttl::after {
    height: 6.6520547945px;
  }
}
.parts-annotationList_ttl::after {
  top: auto;
  bottom: 10%;
}

.parts-annotationList_inner {
  width: 72.7178082192vw;
  margin: 4.1095890411vw auto 0;
}
@media (min-width: 607px) {
  .parts-annotationList_inner {
    width: 441.3970958904px;
    margin: 24.9452054795px auto 0;
  }
}

.parts-annotationList_list {
  margin-top: 5.4794520548vw;
}
@media (min-width: 607px) {
  .parts-annotationList_list {
    margin-top: 33.2602739726px;
  }
}

.parts-annotationList_desc {
  font-size: 2.8767123288vw;
  font-weight: bold;
  line-height: 1.7142857143;
}
@media (min-width: 607px) {
  .parts-annotationList_desc {
    font-size: 17.4616438356px;
  }
}

.parts-annotationList_item {
  font-size: 2.8767123288vw;
  font-weight: 100;
  line-height: 1.7142857143;
}
@media (min-width: 607px) {
  .parts-annotationList_item {
    font-size: 17.4616438356px;
  }
}
.parts-annotationList_item.mod-marginTop {
  margin-top: 4.6575342466vw;
}
@media (min-width: 607px) {
  .parts-annotationList_item.mod-marginTop {
    margin-top: 31.597260274px;
  }
}

.content {
  position: relative;
}

.content_inner {
  background-color: #fff;
}

.content_products {
  position: fixed;
  width: calc(50% - 303px);
  right: calc(50% + 303px);
  top: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .content_products {
    display: none;
  }
}
.content_products::before, .content_products::after {
  content: "";
  display: block;
  width: 100%;
  height: 45px;
  background: url(../images/common/rail-origin.webp) repeat-x left center/656px 100%;
  background-color: #fff;
  position: absolute;
  right: 0;
  background-position-x: right;
  z-index: 3;
}
.content_products:before {
  top: 0;
}
.content_products:after {
  bottom: 0;
}

.content_nav {
  position: fixed;
  width: calc(50% - 303px);
  left: calc(50% + 303px);
  top: 0;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .content_nav {
    display: none;
  }
}
.content_nav::before, .content_nav::after {
  content: "";
  display: block;
  width: 100%;
  height: 45px;
  background: url(../images/common/rail-origin.webp) repeat-x left center/656px 100%;
  background-color: #fff;
  position: absolute;
  right: 0;
  background-position-x: left;
  z-index: 2;
}
.content_nav:before {
  top: 0;
}
.content_nav:after {
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .content_nav {
    display: none;
  }
}

.content_products {
  min-height: 750px;
}

.content_products_img,
.content_products_imgBg {
  aspect-ratio: 430/806;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 19.5454545455vw;
}
@media (max-width: 1140px) {
  .content_products_img,
.content_products_imgBg {
    display: none;
  }
}

.content_products_img {
  z-index: 2;
}

.content_products_yogosi {
  position: absolute;
  width: 657px;
  left: 0;
  top: 0;
  z-index: 1;
  mix-blend-mode: multiply;
}

.content_products_copyRight {
  position: absolute;
  bottom: -7%;
  left: -10%;
  z-index: 3;
  width: 7.1818181818vw;
}
@media (max-width: 1200px) {
  .content_products_copyRight {
    bottom: -10%;
    left: 0px;
  }
}
@media (max-width: 1140px) {
  .content_products_copyRight {
    display: none;
  }
}

/*************
content_nav
*************/
.content_nav {
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 750px;
}

.content_navInner {
  margin-right: 2.1276595745vw;
  text-align: right;
  position: relative;
  z-index: 1;
}
@media (max-width: 1140px) {
  .content_navInner {
    display: none;
  }
}

.content_nav_ttl {
  width: 12.3829787234vw;
  margin-left: auto;
}

.content_nav_list {
  margin-top: 2.3404255319vw;
}

.content_nav_item + .content_nav_item {
  margin-top: 1.8723404255vw;
}

.content_nav_link {
  font-size: 1.2765957447vw;
  font-weight: 400;
  color: #000;
  line-height: 1;
  position: relative;
  letter-spacing: 0.08em;
}
.content_nav_link:before {
  content: "";
  height: 2px;
  width: 0;
  background-color: #000;
  position: absolute;
  bottom: -0.1em;
  right: 0;
  transition: width 0.2s ease-out;
}
.content_nav_link:hover {
  opacity: 1;
}
.content_nav_link:hover:before {
  width: 100%;
}

.content_nav_options {
  margin-top: 2.4255319149vw;
}

.content_nav_option + .content_nav_option {
  margin-top: 1.0638297872vw;
}

.content_nav_option_link {
  line-height: 1;
  font-size: 0.8085106383vw;
  color: #000;
  font-weight: 400;
  position: relative;
  letter-spacing: 0.05em;
}
.content_nav_option_link:before {
  content: "";
  position: absolute;
  margin-right: 0.4255319149vw;
  width: 1em;
  height: 1px;
  background-color: #000;
  top: 50%;
  left: -1.5em;
  transform: translateY(-50%);
}
@media (min-width: 607px) {
  .content_nav_option_link:before {
    margin-right: 16.6301369863px;
  }
}
.content_nav_option_link:after {
  content: "";
  display: inline-block;
  margin-left: 0.4255319149vw;
  width: 0.8510638298vw;
  aspect-ratio: 1/1;
  background: url(../images/common/icon-target-blank.svg) no-repeat center center/cover;
}

.content_nav_yogosi {
  position: absolute;
  width: 657px;
  right: 0;
  top: 0;
  z-index: 1;
  mix-blend-mode: multiply;
}

footer {
  position: relative;
  z-index: 3;
  background-color: #000;
  padding: 6.2% 12.9476584022% 16.3%;
  color: #fff;
  display: grid;
  grid-gap: 3.8356164384vw;
  gap: 3.8356164384vw;
}
@media (min-width: 607px) {
  footer {
    grid-gap: 23.2821917808px;
    gap: 23.2821917808px;
  }
}

.footer-linkList {
  display: grid;
  grid-gap: 3.8356164384vw;
  gap: 3.8356164384vw;
}
@media (min-width: 607px) {
  .footer-linkList {
    grid-gap: 23.2821917808px;
    gap: 23.2821917808px;
  }
}

.footer-copyList {
  display: grid;
  grid-gap: 1.3698630137vw;
  gap: 1.3698630137vw;
}
@media (min-width: 607px) {
  .footer-copyList {
    grid-gap: 8.3150684932px;
    gap: 8.3150684932px;
  }
}

.footer-linkItem_link {
  color: #fff;
  font-size: 4.2739726027vw;
  line-height: 1;
}
@media (min-width: 607px) {
  .footer-linkItem_link {
    font-size: 25.9430136986px;
  }
}

.footer-copyItemTxt {
  font-size: 3.2054794521vw;
}
@media (min-width: 607px) {
  .footer-copyItemTxt {
    font-size: 19.457260274px;
  }
}

.footer-linkItemTxt_inline {
  position: relative;
}
.footer-linkItemTxt_inline::after {
  content: "";
  display: inline-block;
  width: 4.0273972603vw;
  height: 4.0273972603vw;
  background: url(../images/common/icon-target-blank_white.svg) no-repeat center center/100% auto;
  margin-left: 2.4657534247vw;
}
@media (min-width: 607px) {
  .footer-linkItemTxt_inline::after {
    width: 24.4463013699px;
    height: 24.4463013699px;
    margin-left: 14.9671232877px;
  }
}

.top {
  position: relative;
}
.top .parts-annotation {
  margin-top: 0.815068%;
  width: 104%;
  margin-left: -1.5%;
}

.top_load {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: center;
}
.add-load .top_load {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s 0s ease-in-out, visibility 0s 0.3s ease-in-out;
}

.top_loadInner {
  width: 40px;
  height: 40px;
  border: 4px solid rgba(0, 0, 0, 0.1); /* Or use a CSS var for this color */
  border-radius: 50%;
  border-top-color: #000;
  -webkit-animation: spin 1s ease-in-out infinite;
          animation: spin 1s ease-in-out infinite;
}

@-webkit-keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.top_openingWrap {
  position: fixed;
  z-index: 2;
}
.add-loaded .top_openingWrap {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s 0s ease-in-out, visibility 0s 0.3s ease-in-out;
}
.add-skipped .top_openingWrap {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s 0s ease-in-out, visibility 0s 0.3s ease-in-out;
}
.top_openingWrap.add-end {
  display: none;
}

.top_opening {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100svh;
  background-color: #fff;
  z-index: 2;
  opacity: 1;
  visibility: visible;
  will-change: opacity, visibility;
}
.add-load .top_opening {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s 9s ease-in-out, visibility 0s 9.3s ease-in-out;
}

.top_openingInner {
  position: absolute;
  margin: 0 auto;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
@media (min-width: 607px) {
  .top_openingInner {
    aspect-ratio: 365/650;
    width: auto;
  }
}

.top_opening_layer {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  will-change: opacity;
}
@media (max-width: 606px) {
  .top_opening_layer {
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    top: -1px;
    left: -1px;
  }
}
.top_opening_layer.mod-first {
  background: url(../images/top/op/first_bg.webp) no-repeat center center/100% 100%;
}
.top_opening_layer.mod-second {
  background: url(../images/top/op/second_bg.png) no-repeat center center/cover;
  transition: opacity 0.3s ease-in-out;
  opacity: 0;
}
.top_opening_layer.mod-third {
  background: url(../images/top/op/third_bg.png) no-repeat center center/100% 100%;
  transition: opacity 0.3s 0s ease-in-out;
  opacity: 0;
}

.top_opening_layer_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 73.9726027397%;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.top_opening_layer_logos {
  background: url(../images/top/op/second_logos.webp) no-repeat center center/cover;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.top_opening_layer_text {
  width: 67.246575%;
  position: absolute;
  top: 47.8%;
  left: 47%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.top_kv {
  position: relative;
}

/**
top_lead
**/
.top_lead {
  background: url(../images/top/lead/deco-bg.webp) no-repeat center top/100% auto;
  position: relative;
  padding: 16.1643835616% 0 16.1643835616%;
}
.top_lead:before {
  content: "";
  display: block;
  width: 84.1095890411%;
  aspect-ratio: 320/162;
  background: url(../images/top/lead/deco-text.webp) no-repeat center center/100% 100%;
  position: absolute;
  top: 3.8356164384vw;
  left: 0;
}
@media (min-width: 607px) {
  .top_lead:before {
    top: 23.2821917808px;
  }
}
.top_lead:after {
  content: "";
  display: block;
  background: url(../images/top/lead/under-gradient.webp) no-repeat center bottom/100% auto;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 21.9178082192vw;
}
@media (min-width: 607px) {
  .top_lead:after {
    height: 133.0410958904px;
  }
}

.top_leadInner {
  position: relative;
  z-index: 1;
}

.top_lead_ttl {
  font-size: 5.2054794521vw;
  font-weight: 900;
  color: #cf121b;
  line-height: 1.4736842105;
  text-align: center;
}
@media (min-width: 607px) {
  .top_lead_ttl {
    font-size: 31.597260274px;
  }
}

.top_lead_txt {
  font-size: 3.5616438356vw;
  line-height: 2.1538461538;
  font-weight: bold;
  color: #000;
  text-align: center;
}
@media (min-width: 607px) {
  .top_lead_txt {
    font-size: 21.6191780822px;
  }
}

.top_lead_txt_inner {
  display: block;
  margin-top: 11.2328767123%;
}
.top_lead_txt_inner + .top_lead_txt_inner {
  margin-top: 9.0410958904%;
}

.top_lead_divider {
  width: 89.8630136986%;
  margin: 8.2191780822% auto 0;
}

.top_divisionSelect {
  margin: 11.2328767123% auto 0;
  width: 90.1369863014%;
}
.top_divisionSelect .parts_divisionSelect_list {
  padding: 0 5.1671732523%;
}

.top_divisions {
  padding: 0 9.5890410959% 6.315068%;
  background: url(../images/common/divisions/common/rail.png) no-repeat top left/calc(100% + 1px) auto;
}

.top_annotation {
  margin-top: 7.9452054795vw;
}
@media (min-width: 607px) {
  .top_annotation {
    margin-top: 48.2273972603px;
  }
}

.top_opening_skip {
  position: absolute;
  bottom: 5.4794520548vw;
  right: 8.2191780822vw;
  font-size: 3.5616438356vw;
  color: #000;
  line-height: 1;
  background-color: transparent;
  border: none;
  padding: 2.7397260274%;
  cursor: pointer;
}
@media (min-width: 607px) {
  .top_opening_skip {
    bottom: 16.6301369863px;
    right: 49.8904109589px;
    font-size: 16.6301369863px;
  }
}
.top_opening_skip:after {
  content: "";
  display: block;
  background: url(../images/top/op/skip-arrow.webp) no-repeat right center/100% 100%;
  width: 5.4794520548vw;
  height: 1.3698630137vw;
  margin-left: 2.7397260274%;
  position: absolute;
  top: 50%;
  left: calc(100% - 0.5em);
  transform: translateY(-50%);
}
@media (min-width: 607px) {
  .top_opening_skip:after {
    width: 24.9452054795px;
    height: 6.6520547945px;
  }
}

.under {
  position: relative;
  background-color: #fff;
}
.under::before, .under::after {
  content: "";
  display: block;
  position: absolute;
  background: url(../images/under/1/bg1.png) repeat top center/100% auto;
  top: 0vw;
  left: 0;
  width: 4.8vw;
  height: 100%;
  pointer-events: none;
}
@media (min-width: 768px) {
  .under::before, .under::after {
    top: 0px;
    width: 29.9342465753px;
  }
}
.under::after {
  top: 0;
  right: 0;
  left: auto;
}
.under::before {
  top: 4.6204620462vw;
}
@media (min-width: 768px) {
  .under::before {
    top: 11px;
  }
}
.under.mod-purple::before, .under.mod-purple::after {
  background: url(../images/under/6/bg1.png) repeat top center/100% auto;
}
.under.mod-purple::before {
  top: 4.6204620462vw;
}
@media (min-width: 768px) {
  .under.mod-purple::before {
    top: 11px;
  }
}
.under.mod-orange::before, .under.mod-orange::after {
  background: url(../images/under/5/bg1.png) repeat top center/100% auto;
}
.under.mod-orange::before {
  top: 4.6204620462vw;
}
@media (min-width: 768px) {
  .under.mod-orange::before {
    top: 11px;
  }
}
.under.mod-yellow::before, .under.mod-yellow::after {
  background: url(../images/under/3/bg1.png) repeat top center/100% auto;
}
.under.mod-yellow::before {
  top: 4.6204620462vw;
}
@media (min-width: 768px) {
  .under.mod-yellow::before {
    top: 11px;
  }
}
.under.mod-gray::before, .under.mod-gray::after {
  background: url(../images/under/4/bg1.png) repeat top center/100% auto;
}
.under.mod-gray::before {
  top: 4.6204620462vw;
}
@media (min-width: 768px) {
  .under.mod-gray::before {
    top: 11px;
  }
}
.under.mod-blue::before, .under.mod-blue::after {
  background: url(../images/under/2/bg1.png) repeat top center/100% auto;
}
.under.mod-blue::before {
  top: 4.6204620462vw;
}
@media (min-width: 768px) {
  .under.mod-blue::before {
    top: 11px;
  }
}

.under_header {
  position: relative;
  width: 100%;
  height: 23.462046vw;
}
@media (min-width: 768px) {
  .under_header {
    max-height: 127px;
  }
}

.under_header_link {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 24.262046vw;
  background-color: #710000;
  height: 100%;
  -webkit-clip-path: polygon(100% 0, 0% 100%, 0 0);
          clip-path: polygon(100% 0, 0% 100%, 0 0);
}
.under_header_link:hover {
  opacity: 1 !important;
}
@media (min-width: 768px) {
  .under_header_link {
    max-width: 124px;
  }
}
.mod-purple .under_header_link {
  background-color: #482156;
}
.mod-orange .under_header_link {
  background-color: #803400;
}
.mod-yellow .under_header_link {
  background-color: #876b00;
}
.mod-gray .under_header_link {
  background-color: #4c4948;
}
.mod-blue .under_header_link {
  background-color: #042e60;
}

.under_header_link_img {
  position: absolute;
  display: block;
  top: 11%;
  left: 15%;
  width: 36%;
}

.under_header_title {
  width: 56.6260273973%;
  margin: 0 auto;
  padding-top: 5.2%;
}

.under_disaster {
  padding: 0 8.2191780822% 7.397260274%;
}

.under_team_wrap {
  margin-top: -3%;
}

.under_team_ttl_img {
  width: 56.1099344262%;
  display: block;
  margin: 3.3% auto 0;
}

.under_disaster_list {
  margin-top: 9.8360655738%;
}

.under_disaster_title {
  position: relative;
  font-size: 6.5506849315vw;
  background-color: #c11920;
  color: #fff;
  font-weight: bold;
  padding: 5.9% 0;
  text-align: center;
}
.mod-purple .under_disaster_title {
  background-color: #86519c;
}
.mod-orange .under_disaster_title {
  background-color: #ed6c00;
}
.mod-yellow .under_disaster_title {
  background-color: #fcc80e;
}
.mod-gray .under_disaster_title {
  background-color: #4c4948;
}
.mod-blue .under_disaster_title {
  background-color: #2660ac;
}
@media (min-width: 607px) {
  .under_disaster_title {
    font-size: 39.7626575342px;
  }
}
.under_disaster_title::before, .under_disaster_title::after {
  content: "";
  display: block;
  position: absolute;
  top: 10%;
  left: 0;
  width: 100%;
  height: 1.095890411vw;
  background-color: #fff;
}
@media (min-width: 607px) {
  .under_disaster_title::before, .under_disaster_title::after {
    height: 6.6520547945px;
  }
}
.under_disaster_title::after {
  top: auto;
  bottom: 10%;
}

.under_disaster_ttlTxt {
  font-size: 3.2876712329vw;
  color: #000;
  font-weight: bold;
  text-align: center;
  line-height: 2.1666666667;
  margin-top: 3.9%;
}
@media (min-width: 607px) {
  .under_disaster_ttlTxt {
    font-size: 19.9561643836px;
  }
}

.under_disaster_item:nth-child(n+2) {
  margin-top: 23.8%;
}

.under_disaster_itemList {
  width: 86.8852459016%;
  margin: 10.4% auto 0;
}

.under_disaster_itemTitle {
  position: relative;
  font-size: 5.4575342466vw;
  color: #000;
  font-weight: bold;
  line-height: 1.3052208835;
  text-align: left;
  padding-left: 9.5%;
  white-space: noWrap;
}
@media (min-width: 607px) {
  .under_disaster_itemTitle {
    font-size: 33.1272328767px;
  }
}
.under_disaster_itemTitle::before {
  content: "";
  display: block;
  position: absolute;
  top: 1px;
  left: 0;
  width: 4.3835616438vw;
  height: 100%;
  background-color: #c11920;
}
.mod-purple .under_disaster_itemTitle::before {
  background-color: #86519c;
}
.mod-orange .under_disaster_itemTitle::before {
  background-color: #ed6c00;
}
.mod-yellow .under_disaster_itemTitle::before {
  background-color: #fcc80e;
}
.mod-gray .under_disaster_itemTitle::before {
  background-color: #4c4948;
}
.mod-blue .under_disaster_itemTitle::before {
  background-color: #2660ac;
}
@media (min-width: 607px) {
  .under_disaster_itemTitle::before {
    width: 26.6082191781px;
  }
}
.under_disaster_itemTitle::after {
  content: "";
  display: block;
  position: absolute;
  top: 1px;
  left: 4.9%;
  width: 0.2739726027vw;
  height: 100%;
  background-color: #fff;
}
@media (min-width: 607px) {
  .under_disaster_itemTitle::after {
    width: 1.6630136986px;
  }
}

.under_disaster_itemFig {
  margin-top: 3.4%;
}
.mod-sleepbag .under_disaster_itemFig {
  width: 63.2%;
  margin: 5.8% auto 0;
}
.mod-hybrid .under_disaster_itemFig {
  width: 63.7%;
  margin: 5.8% auto 0;
}
.mod-mask .under_disaster_itemFig {
  width: 64.7%;
  margin: 5.8% auto 0;
}
.mod-toilet .under_disaster_itemFig {
  width: 63%;
  margin: 5.8% auto 0;
}
.mod-flashlight .under_disaster_itemFig {
  width: 43%;
  margin: 5.8% auto 0;
}
.mod-minilife .under_disaster_itemFig {
  width: 69.1%;
  margin: 5.2% auto 0;
}
.mod-sliderpouch .under_disaster_itemFig {
  width: 100%;
  margin: 5.8% auto 0;
}
.mod-acrylickeyholder .under_disaster_itemFig {
  width: 51.1%;
  margin: 5.8% auto 0;
}
.mod-sticker .under_disaster_itemFig {
  width: 100%;
  margin: 5.8% auto 0;
}

.under_disaster_itemSubTtl {
  font-size: 3.2876712329vw;
  color: #fff;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  background-color: #c11920;
  width: 75.5%;
  margin: 5.7% auto 0;
  padding: 1.55% 0;
}
.mod-purple .under_disaster_itemSubTtl {
  background-color: #86519c;
}
.mod-orange .under_disaster_itemSubTtl {
  background-color: #ed6c00;
}
.mod-yellow .under_disaster_itemSubTtl {
  background-color: #fcc80e;
}
.mod-gray .under_disaster_itemSubTtl {
  background-color: #4c4948;
}
.mod-blue .under_disaster_itemSubTtl {
  background-color: #2660ac;
}
@media (min-width: 607px) {
  .under_disaster_itemSubTtl {
    font-size: 19.9561643836px;
  }
}

.under_disaster_itemDesc {
  font-size: 3.2876712329vw;
  color: #000;
  line-height: 1.75;
  margin-top: 3.9%;
  font-weight: 100;
}
@media (min-width: 607px) {
  .under_disaster_itemDesc {
    font-size: 19.9561643836px;
  }
}
.mod-minilife .under_disaster_itemDesc {
  width: 86.6013071895%;
  margin: 2.9% auto 0;
}

.under_disaster_itemSubAnnot {
  font-size: 2.7397260274vw;
  color: #c11920;
  text-align: justify;
  margin-top: 2.2%;
  display: block;
  font-weight: 500;
}
.mod-purple .under_disaster_itemSubAnnot {
  color: #86519c;
}
.mod-orange .under_disaster_itemSubAnnot {
  color: #ed6c00;
}
.mod-yellow .under_disaster_itemSubAnnot {
  color: #fcc80e;
}
.mod-gray .under_disaster_itemSubAnnot {
  color: #4c4948;
}
.mod-blue .under_disaster_itemSubAnnot {
  color: #2660ac;
}
@media (min-width: 607px) {
  .under_disaster_itemSubAnnot {
    font-size: 16.6301369863px;
  }
}

.under_disaster_itemInfo {
  font-size: 2.7397260274vw;
  color: #000;
  line-height: 1.7;
  font-weight: 100;
  margin-top: 4.4%;
}
@media (min-width: 607px) {
  .under_disaster_itemInfo {
    font-size: 16.6301369863px;
  }
}
.mod-minilife .under_disaster_itemInfo {
  width: 86.6013071895%;
  margin: 3.7% auto 0;
}

.under_disaster_itemInfoItem {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.under_disaster_itemListItem:nth-child(n+2) {
  margin-top: 26.2%;
}

.under_disaster_itemFigSecondary {
  margin-top: 8%;
}
.mod-sleepbag .under_disaster_itemFigSecondary {
  margin-top: 3.5%;
}
.mod-hybrid .under_disaster_itemFigSecondary {
  margin-top: 3.5%;
}
.mod-mask .under_disaster_itemFigSecondary {
  margin-top: 3.5%;
}
.mod-toilet .under_disaster_itemFigSecondary {
  margin-top: 4%;
}
.mod-flashlight .under_disaster_itemFigSecondary {
  margin-top: 4%;
}

.under_disaster_itemInfo_title {
  white-space: nowrap;
}

.under_divisionSelect {
  margin: 5.7534246575% auto 0;
  width: 90.8196721311%;
}

.under_toTop {
  width: 26.0273972603%;
  margin: 9.8630136986% auto 0;
}

.under_division {
  margin-top: 10%;
}

/*
https://github.com/q-jutaku/coding_rule/blob/main/css.md#sass_utilscss
*/
.util-pc {
  display: none;
}
@media screen and (min-width: 767px) {
  .util-pc {
    display: block;
  }
}
.util-sp {
  display: block;
}
@media screen and (min-width: 767px) {
  .util-sp {
    display: none;
  }
}

@media print {
  html {
    zoom: 0.8;
  }
}