@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@600;700&display=swap");
@keyframes titleUp {
  0% {
    transform: translateY(120px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
/*** The new CSS reset - version 1.11.3 (last updated 25.8.2024) ***/
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
  all: unset;
  display: revert;
}

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

a, button {
  cursor: revert;
}

ol, ul, menu, summary {
  list-style: none;
}

ol {
  counter-reset: revert;
}

img {
  max-inline-size: 100%;
  max-block-size: 100%;
}

table {
  border-collapse: collapse;
}

input, textarea {
  -webkit-user-select: auto;
}

textarea {
  white-space: revert;
}

meter {
  -webkit-appearance: revert;
  -moz-appearance: revert;
       appearance: revert;
}

:where(pre) {
  all: revert;
  box-sizing: border-box;
}

::-moz-placeholder {
  color: unset;
}

::placeholder {
  color: unset;
}

:where([hidden]) {
  display: none;
}

:where([contenteditable]:not([contenteditable=false])) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  -webkit-user-select: auto;
}

:where([draggable=true]) {
  -webkit-user-drag: element;
}

:where(dialog:modal) {
  all: revert;
  box-sizing: border-box;
}

::-webkit-details-marker {
  display: none;
}

body, html {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  min-height: 100dvh;
  position: relative;
  font-family: "Zen Kaku Gothic New", sans-serif;
  color: #FFF;
  font-size: 22px;
  line-height: 40px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #000;
  font-feature-settings: "palt";
}
body img, html img {
  width: 100%;
  height: auto;
}
body *, html * {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

body {
  display: flex;
  flex-direction: column;
}
body.is-loading {
  overflow: hidden;
  height: 100vh;
}
body.is-menu-open {
  overflow: hidden;
  height: 100vh !important;
}
body.view {
  opacity: 1;
}
body.lock {
  position: fixed;
  left: 0;
  width: 100%;
  overflow-y: scroll;
}
body.bye {
  opacity: 0;
  transition: opacity 0.4s linear;
}

strong {
  font-weight: bold;
}

a {
  text-decoration: none;
}

p {
  text-justify: inter-ideograph;
  -ms-text-justify: inter-ideograph;
}

.fadeup {
  opacity: 0;
}

.loading {
  width: 100%;
  width: 100vw;
  height: 100%;
  background-color: #000;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  overflow: hidden;
}
.loading .loading_icon {
  position: absolute;
  max-width: 944px;
  width: 49.166%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  animation: blink-simple 2s infinite;
}

#overlay, #page_cover {
  width: 100%;
  width: 100vw;
  height: 100%;
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 997;
  opacity: 1;
}
#overlay.fadeOut, #page_cover.fadeOut {
  opacity: 0;
  transition: opacity 1s linear;
}

.anim-trigger-fade {
  transition: transform 0.5s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.5s linear;
}
.anim-trigger-fade.init {
  transform: translateY(100px);
  opacity: 0;
}

@keyframes zoomInSettle {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(4);
  }
  60% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.9); /* 少し行き過ぎて小さくなる */
  }
  80% {
    transform: translate(-50%, -50%) scale(1.02); /* 軽く反発 */
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
  }
}
@keyframes blink-simple {
  0%, 100% {
    filter: brightness(90%);
  }
  50% {
    filter: brightness(300%);
  }
}
@keyframes scrollDown {
  from {
    transform: translateY(-50%);
  }
  to {
    transform: translateY(0%);
  }
}
@keyframes scrollUp {
  from {
    transform: translateY(0%);
  }
  to {
    transform: translateY(-50%);
  }
}
.anim_trigger {
  transform: translateY(100px);
  opacity: 0;
  transition: all 0.6s ease-out;
}
.anim_trigger.view {
  transform: translateY(0);
  opacity: 1;
}

canvas {
  transform: translateZ(0);
}

/********************************************
PC
*********************************************/
.sp, .sp-in, .sp-flex {
  display: none !important;
}

.pc {
  display: block !important;
}

.pc-in {
  display: inline-block !important;
}

.pc-flex {
  display: flex !important;
}

header,
footer,
main,
section,
.sec_inner {
  width: 100%;
  position: relative;
}

main {
  overflow: hidden;
}

section .sec_inner {
  display: block;
  width: 100%;
  position: relative;
}
section .sec_inner .inner_cont {
  position: relative;
  width: 100%;
  max-width: 1200px;
  padding: 0 50px;
  margin: 0 auto;
}

header {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  pointer-events: none;
  width: 100%;
  height: 70px;
  padding: 0 50px;
  background: #000;
  display: flex;
  justify-content: space-between;
}
header nav {
  width: 100%;
  pointer-events: all;
}
header nav ul {
  display: flex;
  height: 70px;
  padding-left: 20px;
  border-bottom: 1px solid #FFF;
}
header nav ul li {
  margin-right: 55px;
  display: flex;
}
header nav ul li:last-of-type {
  margin-right: 0;
}
header nav ul li a {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 18px;
  line-height: 18px;
  font-weight: 700;
  font-family: "Poppins", sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
}
header nav ul li a .makita {
  width: 131px;
  display: block;
}
header nav ul li a {
  transition: opacity 0.3s linear;
}
header nav ul li a.hover {
  opacity: 0.6;
}
header .btn_trigger {
  position: absolute;
  top: 0;
  right: 50px;
  width: 90px;
  height: 70px;
  cursor: pointer;
}
header .btn_trigger span {
  position: absolute;
  display: inline-block;
  left: 33.33%;
  width: 33.33%;
  height: 2px;
  background: #FFF;
}
header .btn_trigger span {
  transition: all 0.3s ease-out;
  box-sizing: border-box;
}
header .btn_trigger span:nth-of-type(1) {
  top: 23px;
}
header .btn_trigger span:nth-of-type(2) {
  top: 49%;
}
header .btn_trigger span:nth-of-type(3) {
  bottom: 23px;
}

/* ===== 上→下 に流れる帯 ===== */
.down .track {
  animation: scrollDown 65s linear infinite;
}

/* ===== 下→上 に流れる帯（テレコ = 逆方向） ===== */
.up .track {
  animation: scrollUp 65s linear infinite;
}

.left_obi {
  background: #008ca2;
  position: fixed;
  top: 0;
  left: 0;
  width: 50px;
  height: 100%;
  overflow: hidden;
  z-index: 11;
  padding-top: 5px;
  padding-right: 3px;
}
.left_obi .item {
  width: 76%;
  height: 100%;
  background-image: url("../images/left_obi_text.png");
  background-repeat: repeat-y;
  background-position: top right;
  background-size: 100% auto;
  margin: 0 0 0 auto;
}

.right_obi {
  background: #008ca2;
  position: fixed;
  top: 0;
  right: 0;
  width: 50px;
  height: 100%;
  overflow: hidden;
  z-index: 11;
  padding-top: 5px;
  padding-left: 3px;
}
.right_obi .item {
  width: 76%;
  height: 100%;
  background-image: url("../images/right_obi_text.png");
  background-repeat: repeat-y;
  background-position: top right;
  background-size: 100% auto;
  background-color: #008ca2;
}

footer {
  padding: 21.5px 0;
}
footer .copyright {
  text-align: center;
  font-size: 12px;
  line-height: 12px;
  color: #727171;
}

#ytModal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  justify-content: center;
  z-index: 10;
  opacity: 0;
  transition: opacity 0.3s ease;
  padding-bottom: 15px;
}
#ytModal.is-show {
  display: flex;
  align-items: flex-start;
  padding: 15px 0;
}
#ytModal.is-active {
  opacity: 1;
}
#ytModal .yt-close {
  width: 39px;
  height: 26px;
  display: block;
  position: relative;
  margin: 0 0 15px auto;
}
#ytModal .yt-close:before, #ytModal .yt-close:after {
  content: "";
  width: 100%;
  height: 2px;
  display: inline-block;
  background: #FFF;
  position: absolute;
  top: 50%;
  left: 0;
}
#ytModal .yt-close:before {
  transform: rotate(35deg);
}
#ytModal .yt-close:after {
  transform: rotate(-35deg);
}
#ytModal .yt-modal-inner {
  position: relative;
  width: min(1200px, 90vw, 155.5555555556vh);
  aspect-ratio: 16/9;
  margin: auto 0;
}
#ytModal .yt-modal-inner iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

.modal_navi {
  position: fixed;
  top: 0;
  left: 100%;
  z-index: 10;
  background: rgba(0, 0, 0, 0.9);
  width: 100%;
  height: 100vh;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  padding-right: 2px;
}
.modal_navi.view {
  left: 0;
}
.modal_navi .close_btn {
  width: 39px;
  height: 26px;
  display: block;
  position: absolute;
  top: 21px;
  right: 75px;
  z-index: 1;
}
.modal_navi .close_btn:before, .modal_navi .close_btn:after {
  content: "";
  width: 100%;
  height: 2px;
  display: inline-block;
  background: #FFF;
  position: absolute;
  top: 50%;
  left: 0;
}
.modal_navi .close_btn:before {
  transform: rotate(35deg);
}
.modal_navi .close_btn:after {
  transform: rotate(-35deg);
}
.modal_navi .modal_navi_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  top: 0;
  left: 50px;
  right: 50px;
  height: 100%;
  box-sizing: border-box;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.modal_navi .modal_navi_inner::before, .modal_navi .modal_navi_inner::after {
  content: "";
  margin: auto 0;
}
.modal_navi .navi {
  width: 100%;
  padding: 70px 0;
}
.modal_navi .navi li {
  padding-bottom: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.modal_navi .navi li:nth-of-type(4) {
  padding-bottom: 85px;
}
.modal_navi .navi li:last-of-type {
  padding-bottom: 0;
}
.modal_navi .navi li a {
  display: flex;
  font-family: "Poppins", sans-serif;
  text-align: center;
  font-size: 26px;
  line-height: 26px;
  font-weight: 700;
  transition: opacity 0.3s linear;
}
.modal_navi .navi li a.hover {
  opacity: 0.6;
}
.modal_navi .sns {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 307px;
  margin: 0 auto;
}
.modal_navi .sns li {
  padding-bottom: 0;
}
.modal_navi .sns li:nth-of-type(1) {
  width: 10.404%;
}
.modal_navi .sns li:nth-of-type(2) {
  width: 9.8%;
}
.modal_navi .sns li:nth-of-type(3) {
  width: 11.43%;
}
.modal_navi .sns li:nth-of-type(4) {
  width: 9.8%;
  padding-bottom: 0;
}
.modal_navi .sns li:nth-of-type(5) {
  width: 12.09%;
}
.modal_navi .sns li a {
  display: flex;
  width: 100%;
  transition: opacity 0.3s linear;
}
.modal_navi .sns li a.hover {
  opacity: 0.6;
}

.contents-wrap {
  position: relative;
  width: 100%;
}

.container {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

@keyframes bounce {
  0% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(0, 5px);
  }
  100% {
    transform: translate(0, 0);
  }
}
#kv_2nd {
  width: 100%;
  height: auto;
  padding: 70px 50px 0 50px;
  position: relative;
}
#kv_2nd .bg img {
  display: block;
}
#kv_2nd h2 {
  width: 92.29%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 3%;
  opacity: 0;
  transition: opacity 1s linear;
}
#kv_2nd h2 img {
  display: block;
}
#kv_2nd h2.view {
  opacity: 1;
}

#philosophy_2nd .sec_inner {
  padding: 160px 0 200px 0;
  position: relative;
  overflow: hidden;
}
#philosophy_2nd .eff {
  width: 558px;
  position: absolute;
  right: 13.2%;
  top: -3.8%;
}
#philosophy_2nd .philosophy_2nd_copy {
  width: 468px;
  margin: 0 auto 0 auto;
}

#cm {
  width: 100%;
  padding: 55px 50px 100px 50px;
}
#cm .sec_inner {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 1410px;
  margin: 0 auto;
}
#cm h3.ttl_gallery {
  width: 74.75%;
  margin: 0 auto;
  position: relative;
  right: -0.56%;
}
#cm h3.ttl_products {
  width: 60.92%;
  margin: 22.2% auto 0 7.51%;
}
#cm h3.ttl_challenge {
  width: 71.13%;
  position: relative;
  margin: 0 auto 0 6.7%;
}
#cm .cm_person {
  width: 75.31%;
  margin: -2.3% 0 0 11.78%;
  position: relative;
}
#cm .num1 {
  width: 22.19%;
  margin: -16.77% 0 0 auto;
  position: relative;
}
#cm .num2 {
  width: 25.39%;
  margin: -20.5% 0 0 auto;
}
#cm .num3 {
  width: 25.39%;
  position: absolute;
  right: 0;
  bottom: -13.2%;
  z-index: 1;
}
#cm .cm_eff {
  width: 34.75%;
  margin: -3.68% auto 0 3.12%;
}
#cm .cm_list {
  width: 85.1%;
  margin: 2.9% auto 0 auto;
  display: flex;
  justify-content: space-between;
}
#cm .cm_list li {
  width: 31.66%;
}
#cm .cm_list li a {
  display: flex;
  border: 1px solid #FFF;
  background: #000;
}
#cm .cm_list li a img {
  transition: opacity 0.3s linear;
  opacity: 1;
}
#cm .cm_list li a.hover img {
  opacity: 0.6;
}
#cm .cm_list li p {
  text-align: center;
  font-size: 22px;
  line-height: 33px;
  font-weight: 800;
  margin-top: 3.5%;
  letter-spacing: -2px;
}
#cm .cm_list li p span {
  font-weight: 500;
  letter-spacing: 0;
}
#cm .maktrack_pr {
  width: 85.1%;
  margin: 2.9% auto 0 auto;
  border: 1px solid #FFF;
}
#cm .maktrack_pr h4 {
  text-align: center;
  font-size: 32px;
  line-height: 1;
  padding: 2.95% 0;
  font-weight: 700;
}
#cm .maktrack_pr dl {
  width: 100%;
  display: flex;
  border-top: 1px solid #FFF;
}
#cm .maktrack_pr dl dt {
  width: 37.5%;
  border-right: 1px solid #FFF;
  padding: 4.2% 4% 5% 4%;
}
#cm .maktrack_pr dl dt h5 {
  font-size: 32px;
  line-height: 1;
  margin-bottom: 6.5%;
  font-weight: 700;
}
#cm .maktrack_pr dl dt p {
  font-size: 22px;
  line-height: 40px;
  text-align: justify;
  text-justify: inter-ideograph; /* 日本語向け */
  line-break: strict; /* 禁則処理を厳格に */
  word-break: normal;
  -ms-text-justify: inter-ideograph;
}
#cm .maktrack_pr dl dt p span {
  margin-left: -20px;
}
#cm .maktrack_pr dl dt p .last {
  margin-left: -2px;
}
#cm .maktrack_pr dl dt .link_btn {
  display: block;
  width: 100%;
  border: 1px solid #fff;
  border-radius: 10px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 700;
  text-align: center;
  padding: 13px 0;
  margin-top: 15%;
  position: relative;
}
#cm .maktrack_pr dl dt .link_btn:before, #cm .maktrack_pr dl dt .link_btn:after {
  content: "";
  width: 15px;
  height: 1px;
  display: inline-block;
  background: #FFF;
  position: absolute;
  right: 15px;
  top: 50%;
}
#cm .maktrack_pr dl dt .link_btn:before {
  top: 50%;
  transform: rotate(60deg);
}
#cm .maktrack_pr dl dt .link_btn:after {
  bottom: 50%;
  transform: rotate(-60deg);
  right: 8px;
}
#cm .maktrack_pr dl dt .link_btn {
  transition: opacity 0.3s linear;
}
#cm .maktrack_pr dl dt .link_btn.hover {
  opacity: 0.6;
}
#cm .maktrack_pr dl dd {
  width: 62.5%;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cm .maktrack_pr dl dd .pr {
  width: 52.4%;
}
#cm .more_pr {
  width: 85.1%;
  margin: 5% auto 0 auto;
  border: 1px solid #FFF;
}
#cm .more_pr h4 {
  text-align: center;
  font-size: 32px;
  line-height: 1;
  padding: 2.95% 0;
  font-weight: 700;
}
#cm .more_pr dl {
  width: 100%;
  display: flex;
  border-top: 1px solid #FFF;
}
#cm .more_pr dl dt {
  width: 37.5%;
  border-right: 1px solid #FFF;
  padding: 4.2% 4% 5% 4%;
}
#cm .more_pr dl dt h5 {
  font-size: 32px;
  line-height: 1;
  margin-bottom: 6.5%;
  font-weight: 700;
}
#cm .more_pr dl dt p {
  font-size: 22px;
  line-height: 40px;
  text-align: justify;
  text-justify: inter-ideograph; /* 日本語向け */
  line-break: strict; /* 禁則処理を厳格に */
  word-break: normal;
  -ms-text-justify: inter-ideograph;
}
#cm .more_pr dl dt p span {
  margin-left: -10px;
}
#cm .more_pr dl dt .link_btn {
  display: block;
  width: 100%;
  border: 1px solid #fff;
  border-radius: 10px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 700;
  text-align: center;
  padding: 13px 0;
  margin-top: 15%;
  position: relative;
}
#cm .more_pr dl dt .link_btn:before, #cm .more_pr dl dt .link_btn:after {
  content: ""; /* 疑似要素に指定必須 */
  width: 15px; /* 線の長さを指定 */
  height: 1px; /* 線の幅を指定 */
  display: inline-block; /* インラインブロックにする */
  background: #FFF; /* 線の色を指定 */
  position: absolute; /* 相対位置に指定 */
  right: 15px; /* 右から10pxの位置に配置 */
}
#cm .more_pr dl dt .link_btn:before {
  top: calc(50% - 4px); /* 数値は微調整してください */
  transform: rotate(30deg); /* 45度回転させる */
}
#cm .more_pr dl dt .link_btn:after {
  bottom: calc(50% - 4px); /* 数値は微調整してください */
  transform: rotate(-30deg); /* -45度回転させる */
}
#cm .more_pr dl dt .link_btn {
  transition: opacity 0.3s linear;
}
#cm .more_pr dl dt .link_btn.hover {
  opacity: 0.6;
}
#cm .more_pr dl dd {
  width: 62.5%;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cm .more_pr dl dd .swiper-wrapper {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  height: 500px;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide {
  width: 33.33%;
  padding: 1.5% 3.3% 2% 3.3%;
  height: 50%;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(1), #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(2), #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(3) {
  border-bottom: 1px solid #FFF;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(2), #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(5) {
  border-left: 1px solid #FFF;
  border-right: 1px solid #FFF;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .name {
  font-size: 12px;
  line-height: 16px;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .pr_img {
  height: 78.8%;
  width: auto;
  display: flex;
  justify-content: center;
  margin-top: -9%;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .pr_img img {
  width: auto;
  height: 100%;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn {
  display: block;
  width: 100%;
  background: #008ca2;
  border-radius: 10px;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  line-height: 1;
  font-weight: 600;
  text-align: center;
  padding: 4.8% 0;
  margin: -2% auto 0 auto;
  position: relative;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:before, #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:after {
  content: ""; /* 疑似要素に指定必須 */
  width: 8%; /* 線の長さを指定 */
  height: 1px; /* 線の幅を指定 */
  display: inline-block; /* インラインブロックにする */
  background: #FFF; /* 線の色を指定 */
  position: absolute; /* 相対位置に指定 */
  right: 5%;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:before {
  top: 37%;
  transform: rotate(30deg); /* 45度回転させる */
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:after {
  bottom: 37%;
  transform: rotate(-30deg); /* -45度回転させる */
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn {
  transition: opacity 0.3s linear;
}
#cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn.hover {
  opacity: 0.6;
}
#cm .special {
  margin-top: 15.3%;
  margin-bottom: 8.7%;
  padding-top: 3%;
  position: relative;
}
#cm .special .copy {
  width: 52.05%;
  position: relative;
  margin: 2.6% auto 0 7.5%;
  z-index: 2;
}
#cm .list {
  width: 85.1%;
  margin: 0 auto 10.2% auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#cm .list li {
  width: 31.66%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#cm .list li:nth-of-type(1), #cm .list li:nth-of-type(2), #cm .list li:nth-of-type(3) {
  margin-bottom: 3.5%;
}
#cm .list li .coming_thum {
  display: block;
  width: 100%;
  border: 1px solid #FFF;
}
#cm .list li .coming_thum img {
  display: block;
}
#cm .list li a {
  display: block;
  width: 100%;
  border: 1px solid #FFF;
  background: #000;
}
#cm .list li a img {
  transition: opacity 0.3s linear;
  opacity: 1;
  display: block;
}
#cm .list li a.hover img {
  opacity: 0.6;
}
#cm .list li .text {
  display: flex;
  align-items: center;
  margin-top: 4.5%;
}
#cm .list li .text .vol {
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: 3px;
}
#cm .list li .text .coming {
  font-size: 13px;
  line-height: 1;
  padding: 3px 8px;
  border: 1px solid #FFF;
  border-radius: 10px;
  margin-left: 7px;
  position: relative;
  top: 1px;
}
#cm .title {
  width: 100%;
}
#cm .title ol {
  display: flex;
  height: 115px;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
  justify-content: center;
}
#cm .title ol li {
  display: flex;
  align-items: center;
  justify-content: center;
}
#cm .title ol li:nth-of-type(1) {
  justify-content: right;
}
#cm .title ol li:nth-of-type(1) p {
  font-family: "Poppins", sans-serif;
  font-size: 63px;
  font-weight: 700;
  color: #008ca2;
}
#cm .title ol li:nth-of-type(1) p span {
  letter-spacing: -5px;
}
#cm .title ol li:nth-of-type(2) {
  width: 378px;
  border-left: 1px solid #FFF;
  border-right: 1px solid #FFF;
}
#cm .title ol li:nth-of-type(2) a {
  color: #008ca2;
  position: relative;
  padding-right: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
#cm .title ol li:nth-of-type(2) a span {
  letter-spacing: -4px;
}
#cm .title ol li:nth-of-type(2) a:after {
  content: "";
  width: 14px;
  height: 14px;
  border: 0;
  border-top: solid 2px #008ca2;
  border-right: solid 2px #008ca2;
  transform: rotate(45deg) translateY(-50%);
  position: absolute;
  top: 12%;
  right: 16%;
  bottom: 0;
  margin: auto;
}
#cm .title ol li .new {
  width: 190px;
  margin-left: 60px;
}
#cm .title ol li .maktrak {
  width: 303px;
  margin: 0 0 0 25px;
}

#kv1, #kv2, #kv3 {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: relative;
}
#kv1 .scroll_attention, #kv2 .scroll_attention, #kv3 .scroll_attention {
  display: block;
  position: absolute;
  bottom: 45px;
  left: 50%;
  transform: translateX(-50%);
}
#kv1 .scroll_attention .text, #kv2 .scroll_attention .text, #kv3 .scroll_attention .text {
  font-size: 14px;
  line-height: 14px;
  text-align: center;
  display: flex;
}
#kv1 .scroll_attention .arrow, #kv2 .scroll_attention .arrow, #kv3 .scroll_attention .arrow {
  display: flex;
  width: 18px;
  margin: 6px auto 0 auto;
  animation: bounce 1s infinite;
}
#kv1 .kv_copy01, #kv2 .kv_copy01, #kv3 .kv_copy01 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 353px;
  width: 100%;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s linear;
}
#kv1 .kv_copy01.view, #kv2 .kv_copy01.view, #kv3 .kv_copy01.view {
  opacity: 1;
}
#kv1 .kv_copy02, #kv2 .kv_copy02, #kv3 .kv_copy02 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 862px;
  width: 100%;
  z-index: 1;
}
#kv1 .kv_copy03, #kv2 .kv_copy03, #kv3 .kv_copy03 {
  position: absolute;
  left: 50%;
  bottom: 6%;
  transform: translateX(-50%);
  max-width: 906px;
  width: 100%;
  z-index: 1;
}
#kv1 .kv_copy06, #kv2 .kv_copy06, #kv3 .kv_copy06 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 769px;
  width: 100%;
  z-index: 1;
}
#kv1 .kv_img01, #kv2 .kv_img01, #kv3 .kv_img01 {
  position: absolute;
  left: 50%;
  bottom: 0;
  max-width: 1272px;
  width: 100%;
}
#kv1 .kv_img02, #kv1 .kv_img03, #kv1 .kv_img04, #kv1 .kv_img05, #kv2 .kv_img02, #kv2 .kv_img03, #kv2 .kv_img04, #kv2 .kv_img05, #kv3 .kv_img02, #kv3 .kv_img03, #kv3 .kv_img04, #kv3 .kv_img05 {
  position: absolute;
  left: 50%;
  bottom: 0;
  height: 100vh; /* 親の高さも明示 */
}
#kv1 .kv_img02 img, #kv1 .kv_img03 img, #kv1 .kv_img04 img, #kv1 .kv_img05 img, #kv2 .kv_img02 img, #kv2 .kv_img03 img, #kv2 .kv_img04 img, #kv2 .kv_img05 img, #kv3 .kv_img02 img, #kv3 .kv_img03 img, #kv3 .kv_img04 img, #kv3 .kv_img05 img {
  width: auto !important; /* 一旦、確実に上書きするため */
  height: 100% !important;
  max-width: none; /* リセット側にmax-width:100%等があると効くのでこちらも解除 */
}

#philosophy {
  border-top: 1px solid #FFF;
}
#philosophy .sec_inner {
  padding: 115px 0 90px 0;
}
#philosophy h2 {
  width: 476px;
  margin: 0 auto;
}
#philosophy .philosophy_copy {
  width: 480px;
  margin: 78px auto 47px auto;
}
#philosophy .timer_txt {
  font-size: 25px;
  text-align: center;
  font-weight: 900;
  margin-bottom: 13px;
  padding-top: 30px;
}
#philosophy .timer {
  font-family: "Poppins", sans-serif;
  font-size: 51px;
  font-weight: 700;
  text-align: center;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
}
#philosophy .timer .num {
  display: inline-flex;
}
#philosophy .timer .d {
  display: inline-block;
  width: 1ch;
  text-align: center;
}
#philosophy .timer_after {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 9px;
}
#philosophy .timer_after span {
  font-weight: 700;
  font-size: 13px;
  line-height: 13px;
  text-align: center;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  width: 55px;
  display: inline-block;
}

#wats_maktrak {
  border-top: 1px solid #FFF;
}
#wats_maktrak .sec_inner {
  padding: 0 50px;
}
#wats_maktrak .title {
  width: 100%;
}
#wats_maktrak .title ol {
  display: flex;
  height: 115px;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
  justify-content: center;
}
#wats_maktrak .title ol li {
  display: flex;
  align-items: center;
  justify-content: center;
}
#wats_maktrak .title ol li:nth-of-type(1) {
  justify-content: right;
}
#wats_maktrak .title ol li:nth-of-type(1) p {
  font-family: "Poppins", sans-serif;
  font-size: 63px;
  font-weight: 700;
  color: #008ca2;
}
#wats_maktrak .title ol li:nth-of-type(1) p span {
  letter-spacing: -5px;
}
#wats_maktrak .title ol li:nth-of-type(2) {
  width: 378px;
  border-left: 1px solid #FFF;
  border-right: 1px solid #FFF;
}
#wats_maktrak .title ol li:nth-of-type(2) a {
  color: #008ca2;
  position: relative;
  padding-right: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
#wats_maktrak .title ol li:nth-of-type(2) a span {
  letter-spacing: -4px;
}
#wats_maktrak .title ol li:nth-of-type(2) a:after {
  content: "";
  width: 14px;
  height: 14px;
  border: 0;
  border-top: solid 2px #008ca2;
  border-right: solid 2px #008ca2;
  transform: rotate(45deg) translateY(-50%);
  position: absolute;
  top: 12%;
  right: 16%;
  bottom: 0;
  margin: auto;
}
#wats_maktrak .title ol li .new {
  width: 190px;
  margin-left: 60px;
}
#wats_maktrak .title ol li .maktrak {
  width: 303px;
  margin: 0 0 0 25px;
}
#wats_maktrak .line {
  display: block;
  background: #FFF;
  width: 100%;
  height: 1px;
}
#wats_maktrak .point01_block {
  max-width: 1180px;
  padding: 0 90px;
  width: 100%;
  margin: 0 auto 0 auto;
  display: flex;
  justify-content: space-between;
}
#wats_maktrak .point01_block .text {
  width: 50%;
}
#wats_maktrak .point01_block .text h3 {
  margin: 142px 0 26px 0;
  width: 34.8%;
}
#wats_maktrak .point01_block .text h4 {
  margin-bottom: 30px;
  width: 94.6%;
  position: relative;
  z-index: 1;
}
#wats_maktrak .point01_block .text p {
  position: relative;
  z-index: 1;
  text-align: justify;
  text-justify: inter-ideograph; /* 日本語向け */
  line-break: strict; /* 禁則処理を厳格に */
  word-break: normal;
  -ms-text-justify: inter-ideograph;
}
#wats_maktrak .point01_block .text p span:nth-of-type(1) {
  margin-left: -12px;
}
#wats_maktrak .point01_block .text p span:nth-of-type(2) {
  margin-left: -22px;
}
#wats_maktrak .point01_block .text p span:nth-of-type(3) {
  margin-left: -22px;
}
#wats_maktrak .point01_block .text p span:nth-of-type(4) {
  margin-left: -5px;
}
#wats_maktrak .point01_block .text .link_btn {
  display: block;
  width: 76%;
  border: 1px solid #fff;
  border-radius: 10px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 700;
  text-align: center;
  padding: 13px 0;
  margin-top: 35px;
  position: relative;
}
#wats_maktrak .point01_block .text .link_btn:before, #wats_maktrak .point01_block .text .link_btn:after {
  content: ""; /* 疑似要素に指定必須 */
  width: 15px; /* 線の長さを指定 */
  height: 1px; /* 線の幅を指定 */
  display: inline-block; /* インラインブロックにする */
  background: #FFF; /* 線の色を指定 */
  position: absolute; /* 相対位置に指定 */
  right: 15px; /* 右から10pxの位置に配置 */
}
#wats_maktrak .point01_block .text .link_btn:before {
  top: calc(50% - 4px); /* 数値は微調整してください */
  transform: rotate(30deg); /* 45度回転させる */
}
#wats_maktrak .point01_block .text .link_btn:after {
  bottom: calc(50% - 4px); /* 数値は微調整してください */
  transform: rotate(-30deg); /* -45度回転させる */
}
#wats_maktrak .point01_block .text .link_btn {
  transition: opacity 0.3s linear;
}
#wats_maktrak .point01_block .text .link_btn.hover {
  opacity: 0.6;
}
#wats_maktrak .point01_block .ph {
  width: 44.3%;
  position: relative;
}
#wats_maktrak .point01_block .ph img {
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
  animation: ph-switch 5s infinite steps(1);
}
#wats_maktrak .point01_block .ph img:nth-of-type(1) {
  position: relative;
}
#wats_maktrak .point01_block .ph img:nth-of-type(1) {
  animation-delay: 0s;
}
#wats_maktrak .point01_block .ph img:nth-of-type(2) {
  animation-delay: 1s;
}
#wats_maktrak .point01_block .ph img:nth-of-type(3) {
  animation-delay: 2s;
}
#wats_maktrak .point01_block .ph img:nth-of-type(4) {
  animation-delay: 3s;
}
#wats_maktrak .point01_block .ph img:nth-of-type(5) {
  animation-delay: 4s;
}
@keyframes ph-switch {
  0% {
    visibility: visible;
  }
  20% {
    visibility: hidden;
  }
  100% {
    visibility: hidden;
  }
}
#wats_maktrak .point02_block {
  max-width: 1180px;
  width: 100%;
  margin: 80px auto 70px auto;
  display: flex;
  justify-content: space-between;
}
#wats_maktrak .point02_block .swiper-slide {
  display: flex;
  justify-content: space-between;
}
#wats_maktrak .point02_block .swiper {
  padding: 0 90px 90px 90px;
}
#wats_maktrak .point02_block .swiper-button-next, #wats_maktrak .point02_block .swiper-button-prev {
  height: 35px;
  width: 30px;
}
#wats_maktrak .point02_block .swiper-button-next .swiper-navigation-icon, #wats_maktrak .point02_block .swiper-button-prev .swiper-navigation-icon {
  display: none;
}
#wats_maktrak .point02_block .swiper-pagination-bullet-active {
  background: #FFF !important;
  opacity: 1 !important;
}
#wats_maktrak .point02_block .swiper-pagination-bullet-active:after {
  content: "";
  width: 31px;
  height: 31px;
  border: 1px solid #FFF;
  border-radius: 50%;
  position: absolute;
  top: -8px;
  left: -8px;
}
#wats_maktrak .point02_block .swiper-pagination-bullet {
  background: #666;
  width: 15px;
  height: 15px;
  margin: 0 12.5px;
  opacity: 1;
  position: relative;
}
#wats_maktrak .point02_block .text {
  width: 38%;
}
#wats_maktrak .point02_block .text h3 {
  margin: 0 0 36px 0;
  width: 46.05%;
}
#wats_maktrak .point02_block .text h4 {
  margin-bottom: 32px;
}
#wats_maktrak .point02_block .text h5 {
  margin-bottom: 20px;
}
#wats_maktrak .point02_block .text h5.p1 {
  width: 77.36%;
}
#wats_maktrak .point02_block .text h5.p2 {
  width: 88.15%;
}
#wats_maktrak .point02_block .text h5.p3 {
  width: 52.63%;
}
#wats_maktrak .point02_block .text h5.p4 {
  width: 86.57%;
}
#wats_maktrak .point02_block .text h5.p5 {
  width: 91.57%;
}
#wats_maktrak .point02_block .text p {
  text-align: justify;
  text-justify: inter-ideograph; /* 日本語向け */
  line-break: strict; /* 禁則処理を厳格に */
  word-break: normal;
  -ms-text-justify: inter-ideograph;
}
#wats_maktrak .point02_block .text .link_btn {
  display: block;
  width: 100%;
  border: 1px solid #fff;
  border-radius: 10px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 700;
  text-align: center;
  padding: 13px 0;
  margin-top: 35px;
  position: relative;
}
#wats_maktrak .point02_block .text .link_btn:before, #wats_maktrak .point02_block .text .link_btn:after {
  content: ""; /* 疑似要素に指定必須 */
  width: 15px; /* 線の長さを指定 */
  height: 1px; /* 線の幅を指定 */
  display: inline-block; /* インラインブロックにする */
  background: #FFF; /* 線の色を指定 */
  position: absolute; /* 相対位置に指定 */
  right: 15px; /* 右から10pxの位置に配置 */
}
#wats_maktrak .point02_block .text .link_btn:before {
  top: calc(50% - 4px); /* 数値は微調整してください */
  transform: rotate(30deg); /* 45度回転させる */
}
#wats_maktrak .point02_block .text .link_btn:after {
  bottom: calc(50% - 4px); /* 数値は微調整してください */
  transform: rotate(-30deg); /* -45度回転させる */
}
#wats_maktrak .point02_block .text .link_btn {
  transition: opacity 0.3s linear;
}
#wats_maktrak .point02_block .text .link_btn.hover {
  opacity: 0.6;
}
#wats_maktrak .point02_block .ph {
  width: 55%;
}
#wats_maktrak .point02_block .ph .ph_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
#wats_maktrak .pr {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #FFF;
}
#wats_maktrak .pr li {
  width: 20%;
  display: block;
  position: relative;
  padding: 2.8vw 0 1.3vw 0;
  border-right: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
}
#wats_maktrak .pr li:nth-of-type(5) {
  border-right: 0;
}
#wats_maktrak .pr li:nth-of-type(3) .pr_img, #wats_maktrak .pr li:nth-of-type(4) .pr_img, #wats_maktrak .pr li:nth-of-type(5) .pr_img {
  position: relative;
  bottom: -10px;
}
#wats_maktrak .pr li:nth-of-type(6), #wats_maktrak .pr li:nth-of-type(7), #wats_maktrak .pr li:nth-of-type(8), #wats_maktrak .pr li:nth-of-type(9), #wats_maktrak .pr li:nth-of-type(10) {
  padding: 0 0 1.3vw 0;
}
#wats_maktrak .pr li:nth-of-type(6) .pr_img, #wats_maktrak .pr li:nth-of-type(7) .pr_img, #wats_maktrak .pr li:nth-of-type(8) .pr_img, #wats_maktrak .pr li:nth-of-type(9) .pr_img, #wats_maktrak .pr li:nth-of-type(10) .pr_img {
  width: 40.95%;
  margin: 0 auto;
  position: relative;
  bottom: -10px;
}
#wats_maktrak .pr li:nth-of-type(6) .link_btn, #wats_maktrak .pr li:nth-of-type(7) .link_btn, #wats_maktrak .pr li:nth-of-type(8) .link_btn, #wats_maktrak .pr li:nth-of-type(9) .link_btn, #wats_maktrak .pr li:nth-of-type(10) .link_btn {
  margin: -7.7% auto 0 auto;
}
#wats_maktrak .pr li:last-of-type {
  border-right: 0;
}
#wats_maktrak .pr li .name {
  font-size: clamp(11px, 0.79vw, 0.79vw);
  line-height: clamp(14px, 0.93vw, 0.93vw);
  position: absolute;
  top: 0.6vw;
  left: 0.75vw;
  width: 100%;
}
#wats_maktrak .pr li .coming {
  font-size: clamp(11px, 0.79vw, 0.79vw);
  line-height: 1;
  position: absolute;
  top: 0.1vw;
  right: 1.5vw;
  background: #e60011;
  padding: 0.2vw;
  border-radius: 3px;
}
#wats_maktrak .pr li .pr_img {
  width: 40.95%;
  margin: 0 auto;
}
#wats_maktrak .pr li .link_btn {
  display: block;
  width: clamp(90px, 54.79%, 54.79%);
  background: #008ca2;
  border-radius: 10px;
  font-family: "Poppins", sans-serif;
  font-size: clamp(10px, 0.75vw, 0.75vw);
  line-height: clamp(10px, 0.75vw, 0.75vw);
  font-weight: 600;
  text-align: center;
  padding: 2.2% 0;
  margin: 3% auto 0 auto;
  position: relative;
}
#wats_maktrak .pr li .link_btn:before, #wats_maktrak .pr li .link_btn:after {
  content: ""; /* 疑似要素に指定必須 */
  width: 0.8vw; /* 線の長さを指定 */
  height: 1px; /* 線の幅を指定 */
  display: inline-block; /* インラインブロックにする */
  background: #FFF; /* 線の色を指定 */
  position: absolute; /* 相対位置に指定 */
  right: 5%;
}
#wats_maktrak .pr li .link_btn:before {
  top: 37%; /* 数値は微調整してください */
  transform: rotate(30deg); /* 45度回転させる */
}
#wats_maktrak .pr li .link_btn:after {
  bottom: 37%; /* 数値は微調整してください */
  transform: rotate(-30deg); /* -45度回転させる */
}
#wats_maktrak .pr li .link_btn {
  transition: opacity 0.3s linear;
}
#wats_maktrak .pr li .link_btn.hover {
  opacity: 0.6;
}
#wats_maktrak .sns_block {
  width: 100%;
  padding: 20px 0 0 0;
}
#wats_maktrak .sns_block .sns {
  width: 306px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#wats_maktrak .sns_block .sns li:nth-of-type(1) {
  width: 10.404%;
}
#wats_maktrak .sns_block .sns li:nth-of-type(2) {
  width: 9.8%;
}
#wats_maktrak .sns_block .sns li:nth-of-type(3) {
  width: 11.43%;
}
#wats_maktrak .sns_block .sns li:nth-of-type(4) {
  width: 9.8%;
}
#wats_maktrak .sns_block .sns li:nth-of-type(5) {
  width: 12.09%;
}
#wats_maktrak .sns_block .sns li a {
  display: flex;
  width: 100%;
  transition: opacity 0.3s linear;
}
#wats_maktrak .sns_block .sns li a.hover {
  opacity: 0.6;
}

/********************************************
PC
*********************************************/
@media only screen and (max-width: 1935px ) {
  .left_obi {
    background: #008ca2;
    position: fixed;
    top: 0;
    left: 0;
    width: 2.6%;
    height: 100%;
    overflow: hidden;
    z-index: 11;
    padding-top: 0.25vw;
  }
  .left_obi .item {
    width: 76%;
    height: 100%;
    background-image: url("../images/left_obi_text.png");
    background-repeat: repeat-y;
    background-position: 0 0, calc(100% - 1px) 0;
    background-size: 100% auto;
    margin: 0 0 0 auto;
  }
  .right_obi {
    background: #008ca2;
    position: fixed;
    top: 0;
    right: 0;
    width: 2.6%;
    height: 100%;
    overflow: hidden;
    z-index: 11;
    padding-top: 0.25vw;
  }
  .right_obi .item {
    width: 76%;
    height: 100%;
    background-image: url("../images/right_obi_text.png");
    background-repeat: repeat-y;
    background-position: 0 0, calc(100% - 1px) 0;
    background-size: 100% auto;
    background-color: #008ca2;
  }
  .modal_navi .modal_navi_inner {
    left: 2.6%;
    right: 2.6%;
  }
  .modal_navi .close_btn {
    right: 4.2vw;
  }
  header {
    left: 2.6%;
    width: 94.8%;
    padding: 0;
  }
  header nav {
    width: 100%;
    pointer-events: all;
  }
  header nav ul {
    display: flex;
    height: 70px;
    padding-left: 20px;
    border-bottom: 1px solid #FFF;
  }
  header nav ul li {
    margin-right: 55px;
  }
  header nav ul li:last-of-type {
    margin-right: 0;
  }
  header nav ul li a {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 18px;
    line-height: 18px;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  header nav ul li a .makita {
    width: 131px;
    display: block;
  }
  header nav ul li a {
    transition: opacity 0.3s linear;
  }
  header nav ul li a.hover {
    opacity: 0.6;
  }
  header .btn_trigger {
    right: 0;
  }
  #kv_2nd {
    padding: 70px 2.6% 0 2.6%;
  }
  #cm {
    padding: 55px 2.6% 100px 2.6%;
  }
  #wats_maktrak .sec_inner {
    padding: 0 2.6%;
  }
  #wats_maktrak .pr li {
    padding: 2.8vw 0 1.3vw 0;
  }
  #wats_maktrak .pr li:nth-of-type(3) .pr_img, #wats_maktrak .pr li:nth-of-type(4) .pr_img, #wats_maktrak .pr li:nth-of-type(5) .pr_img {
    position: relative;
    bottom: -3.3%;
  }
  #wats_maktrak .pr li:nth-of-type(6), #wats_maktrak .pr li:nth-of-type(7), #wats_maktrak .pr li:nth-of-type(8), #wats_maktrak .pr li:nth-of-type(9), #wats_maktrak .pr li:nth-of-type(10) {
    padding: 0 0 1.3vw 0;
  }
  #wats_maktrak .pr li:nth-of-type(6) .pr_img, #wats_maktrak .pr li:nth-of-type(7) .pr_img, #wats_maktrak .pr li:nth-of-type(8) .pr_img, #wats_maktrak .pr li:nth-of-type(9) .pr_img, #wats_maktrak .pr li:nth-of-type(10) .pr_img {
    position: relative;
    bottom: -3.8%;
  }
}
@media only screen and (max-width: 1500px ) {
  #philosophy_2nd .sec_inner {
    padding: 10.65vw 0 14.3vw 0;
    position: relative;
    overflow: hidden;
  }
  #philosophy_2nd .eff {
    width: 37.2vw;
    position: absolute;
    right: 13.2%;
    top: -3.8%;
  }
  #philosophy_2nd .philosophy_2nd_copy {
    width: 468px;
    margin: 0 auto 0 auto;
  }
  #cm {
    width: 100%;
    padding: 3.9vw 2.6% 7.2vw 2.6%;
  }
  #cm .sec_inner {
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 1410px;
    margin: 0 auto;
  }
  #cm h3.ttl_gallery {
    width: 74.75%;
    margin: 0 auto;
  }
  #cm h3.ttl_products {
    width: 60.92%;
    margin: 22.2% auto 0 7.51%;
  }
  #cm h3.ttl_challenge {
    width: 71.13%;
    position: relative;
    margin: 0 auto 0 6.7%;
  }
  #cm .cm_person {
    width: 75.31%;
    margin: -2.3% 0 0 11.78%;
  }
  #cm .num1 {
    width: 22.19%;
    margin: -16.77% 0 0 auto;
  }
  #cm .num2 {
    width: 25.39%;
    margin: -20.5% 0 0 auto;
  }
  #cm .num3 {
    width: 25.39%;
    position: absolute;
    right: 0;
    bottom: -13.2%;
    z-index: 1;
  }
  #cm .cm_eff {
    width: 34.75%;
    margin: -3.68% auto 0 3.12%;
  }
  #cm .cm_list {
    width: 85.1%;
    margin: 2.9% auto 0 auto;
    display: flex;
    justify-content: space-between;
  }
  #cm .cm_list li {
    width: 31.66%;
  }
  #cm .cm_list li a {
    display: flex;
    transition: opacity 0.3s linear;
    border: 1px solid #FFF;
  }
  #cm .cm_list li p {
    text-align: center;
    font-size: 1.57vw;
    line-height: 2.36vw;
    font-weight: 800;
    margin-top: 3.5%;
    letter-spacing: -0.15vw;
  }
  #cm .cm_list li p span {
    font-weight: 500;
  }
  #cm .maktrack_pr {
    width: 85.1%;
    margin: 2.9% auto 0 auto;
    border: 1px solid #FFF;
  }
  #cm .maktrack_pr h4 {
    text-align: center;
    font-size: 2.14vw;
    line-height: 1;
    padding: 2.95% 0;
  }
  #cm .maktrack_pr dl {
    width: 100%;
    display: flex;
    border-top: 1px solid #FFF;
  }
  #cm .maktrack_pr dl dt {
    width: 37.5%;
    border-right: 1px solid #FFF;
    padding: 4.2% 4% 5% 4%;
  }
  #cm .maktrack_pr dl dt h5 {
    font-size: 2.14vw;
    line-height: 1;
    margin-bottom: 6.5%;
  }
  #cm .maktrack_pr dl dt p {
    font-size: 1.47vw;
    line-height: 2.66vw;
  }
  #cm .maktrack_pr dl dt p span {
    margin-left: -1.3vw;
  }
  #cm .maktrack_pr dl dt p .last {
    margin-left: -0.1vw;
  }
  #cm .maktrack_pr dl dt .link_btn {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 10px;
    font-size: 0.95vw;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    padding: 0.85vw 0;
    margin-top: 15%;
    position: relative;
  }
  #cm .maktrack_pr dl dt .link_btn:before, #cm .maktrack_pr dl dt .link_btn:after {
    content: "";
    width: 4%;
    height: 1px;
    display: inline-block;
    background: #FFF;
    position: absolute;
    right: 1vw;
    top: 50%;
  }
  #cm .maktrack_pr dl dt .link_btn:before {
    top: 51%;
    transform: rotate(60deg);
  }
  #cm .maktrack_pr dl dt .link_btn:after {
    bottom: 36%;
    transform: rotate(-60deg);
    right: 0.55vw;
  }
  #cm .maktrack_pr dl dt .link_btn {
    transition: opacity 0.3s linear;
  }
  #cm .maktrack_pr dl dt .link_btn.hover {
    opacity: 0.6;
  }
  #cm .maktrack_pr dl dd {
    width: 62.5%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #cm .maktrack_pr dl dd .pr {
    width: 52.4%;
  }
  #cm .more_pr {
    width: 85.1%;
    margin: 5% auto 0 auto;
    border: 1px solid #FFF;
  }
  #cm .more_pr h4 {
    text-align: center;
    font-size: 2.14vw;
    line-height: 1;
    padding: 2.95% 0;
  }
  #cm .more_pr dl {
    width: 100%;
    display: flex;
    border-top: 1px solid #FFF;
  }
  #cm .more_pr dl dt {
    width: 37.5%;
    border-right: 1px solid #FFF;
    padding: 4.2% 3vw 5% 3vw;
  }
  #cm .more_pr dl dt h5 {
    font-size: 2.14vw;
    line-height: 1;
    margin-bottom: 6.5%;
  }
  #cm .more_pr dl dt p {
    font-size: 1.46vw;
    line-height: 2.66vw;
  }
  #cm .more_pr dl dt p span {
    margin-left: -0.7vw;
  }
  #cm .more_pr dl dt .link_btn {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 10px;
    font-size: 0.95vw;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    padding: 0.85vw 0;
    margin-top: 15%;
    position: relative;
  }
  #cm .more_pr dl dt .link_btn:before, #cm .more_pr dl dt .link_btn:after {
    content: ""; /* 疑似要素に指定必須 */
    width: 4%; /* 線の長さを指定 */
    height: 1px; /* 線の幅を指定 */
    display: inline-block; /* インラインブロックにする */
    background: #FFF; /* 線の色を指定 */
    position: absolute; /* 相対位置に指定 */
    right: 4%; /* 右から10pxの位置に配置 */
  }
  #cm .more_pr dl dt .link_btn:before {
    top: 42%; /* 数値は微調整してください */
    transform: rotate(30deg); /* 45度回転させる */
  }
  #cm .more_pr dl dt .link_btn:after {
    bottom: 39%; /* 数値は微調整してください */
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #cm .more_pr dl dt .link_btn {
    transition: opacity 0.3s linear;
  }
  #cm .more_pr dl dt .link_btn.hover {
    opacity: 0.6;
  }
  #cm .more_pr dl dd {
    width: 62.5%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #cm .more_pr dl dd .swiper-wrapper {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    height: 33.4vw;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide {
    width: 33.33%;
    padding: 1.5% 3.3% 3vw 3.3%;
    height: 50%;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(1), #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(2), #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(3) {
    border-bottom: 1px solid #FFF;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(2), #cm .more_pr dl dd .swiper-wrapper .swiper-slide:nth-of-type(5) {
    border-left: 1px solid #FFF;
    border-right: 1px solid #FFF;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .name {
    font-size: max(0.8vw, 8px);
    line-height: max(1.1vw, 10px);
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .pr_img {
    height: 11.7vw;
    width: auto;
    display: flex;
    justify-content: center;
    margin-top: -9%;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .pr_img img {
    width: auto;
    height: 100%;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn {
    display: block;
    width: 100%;
    background: #008ca2;
    border-radius: 10px;
    font-family: "Poppins", sans-serif;
    font-size: max(0.95vw, 9px);
    line-height: 1;
    font-weight: 600;
    text-align: center;
    padding: 0.65vw 0;
    margin: -0.3vw auto 0 auto;
    position: relative;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:before, #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:after {
    content: ""; /* 疑似要素に指定必須 */
    width: 8%; /* 線の長さを指定 */
    height: 1px; /* 線の幅を指定 */
    display: inline-block; /* インラインブロックにする */
    background: #FFF; /* 線の色を指定 */
    position: absolute; /* 相対位置に指定 */
    right: 5%;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:before {
    top: 37%;
    transform: rotate(30deg); /* 45度回転させる */
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn:after {
    bottom: 37%;
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn {
    transition: opacity 0.3s linear;
  }
  #cm .more_pr dl dd .swiper-wrapper .swiper-slide .link_btn.hover {
    opacity: 0.6;
  }
  #cm .special {
    margin-top: 15.3%;
    margin-bottom: 8.7%;
    padding-top: 3%;
    position: relative;
  }
  #cm .special .copy {
    width: 52.05%;
    position: relative;
    margin: 2.6% auto 0 7.5%;
    z-index: 2;
  }
  #cm .list {
    width: 85.1%;
    margin: 0 auto 10.2% auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #cm .list li {
    width: 31.66%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #cm .list li:nth-of-type(1), #cm .list li:nth-of-type(2), #cm .list li:nth-of-type(3) {
    margin-bottom: 3.5%;
  }
  #cm .list li a {
    display: block;
    width: 100%;
    border: 1px solid #FFF;
  }
  #cm .list li a img {
    display: block;
  }
  #cm .list li .text {
    display: flex;
    align-items: center;
    margin-top: 4.5%;
  }
  #cm .list li .text .vol {
    font-size: 1.45vw;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.2vw;
  }
  #cm .list li .text .coming {
    font-size: max(0.85vw, 9px);
    line-height: 1;
    padding: 0.3vw 0.5vw;
    border: 1px solid #FFF;
    border-radius: 10px;
    margin-left: 0.5vw;
    top: 0.08vw;
  }
  #cm .title {
    width: 100%;
  }
  #cm .title ol {
    display: flex;
    height: 115px;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    justify-content: center;
  }
  #cm .title ol li {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #cm .title ol li:nth-of-type(1) {
    justify-content: right;
  }
  #cm .title ol li:nth-of-type(1) p {
    font-family: "Poppins", sans-serif;
    font-size: 63px;
    font-weight: 700;
    color: #008ca2;
  }
  #cm .title ol li:nth-of-type(1) p span {
    letter-spacing: -5px;
  }
  #cm .title ol li:nth-of-type(2) {
    width: 378px;
    border-left: 1px solid #FFF;
    border-right: 1px solid #FFF;
  }
  #cm .title ol li:nth-of-type(2) a {
    color: #008ca2;
    position: relative;
    padding-right: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
  }
  #cm .title ol li:nth-of-type(2) a span {
    letter-spacing: -4px;
  }
  #cm .title ol li:nth-of-type(2) a:after {
    content: "";
    width: 14px;
    height: 14px;
    border: 0;
    border-top: solid 2px #008ca2;
    border-right: solid 2px #008ca2;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 12%;
    right: 16%;
    bottom: 0;
    margin: auto;
  }
  #cm .title ol li .new {
    width: 190px;
    margin-left: 60px;
  }
  #cm .title ol li .maktrak {
    width: 303px;
    margin: 0 0 0 25px;
  }
  #wats_maktrak .sec_inner {
    padding: 0 2.6%;
  }
  #wats_maktrak .point01_block {
    max-width: 1180px;
    padding: 0px 6.5vw;
    width: 100%;
    margin: 0 auto 0 auto;
    display: flex;
    justify-content: space-between;
  }
  #wats_maktrak .point01_block .text {
    width: 50%;
  }
  #wats_maktrak .point01_block .text h3 {
    width: 34.8%;
  }
  #wats_maktrak .point01_block .text h4 {
    margin-bottom: 2.1vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(1) {
    margin-left: -0.9vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(2) {
    margin-left: -1.6vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(3) {
    margin-left: -1.6vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(4) {
    margin-left: -0.3vw;
  }
  #wats_maktrak .point01_block .text .link_btn {
    display: block;
    width: 76%;
    border: 1px solid #fff;
    border-radius: 10px;
    font-size: 14px;
    line-height: 14px;
    font-weight: 700;
    text-align: center;
    padding: 13px 0;
    margin-top: 2.5vw;
    position: relative;
  }
  #wats_maktrak .point01_block .text .link_btn:before, #wats_maktrak .point01_block .text .link_btn:after {
    content: ""; /* 疑似要素に指定必須 */
    width: 15px; /* 線の長さを指定 */
    height: 1px; /* 線の幅を指定 */
    display: inline-block; /* インラインブロックにする */
    background: #FFF; /* 線の色を指定 */
    position: absolute; /* 相対位置に指定 */
    right: 15px; /* 右から10pxの位置に配置 */
  }
  #wats_maktrak .point01_block .text .link_btn:before {
    top: calc(50% - 4px); /* 数値は微調整してください */
    transform: rotate(30deg); /* 45度回転させる */
  }
  #wats_maktrak .point01_block .text .link_btn:after {
    bottom: calc(50% - 4px); /* 数値は微調整してください */
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #wats_maktrak .point01_block .ph {
    width: 44.3%;
  }
  #wats_maktrak .point02_block {
    max-width: 1180px;
    width: 100%;
    margin: 5.7vw auto 5vw auto;
    display: flex;
    justify-content: space-between;
  }
  #wats_maktrak .point02_block .swiper-slide {
    display: flex;
    justify-content: space-between;
  }
  #wats_maktrak .point02_block .swiper {
    padding: 0 6.5vw 6.5vw 6.5vw;
  }
  #wats_maktrak .point02_block .swiper-button-next, #wats_maktrak .point02_block .swiper-button-prev {
    height: 2.5vw;
    width: 2.1vw;
  }
  #wats_maktrak .point02_block .swiper-button-next .swiper-navigation-icon, #wats_maktrak .point02_block .swiper-button-prev .swiper-navigation-icon {
    display: none;
  }
  #wats_maktrak .point02_block .swiper-button-prev {
    left: 2vw;
  }
  #wats_maktrak .point02_block .swiper-button-next {
    right: 2vw;
  }
  #wats_maktrak .point02_block .swiper-pagination-bullet-active {
    background: #FFF !important;
    opacity: 1 !important;
  }
  #wats_maktrak .point02_block .swiper-pagination-bullet-active:after {
    content: "";
    width: 31px;
    height: 31px;
    border: 1px solid #FFF;
    border-radius: 50%;
    position: absolute;
    top: -8px;
    left: -8px;
  }
  #wats_maktrak .point02_block .swiper-pagination-bullet {
    background: #666;
    width: 15px;
    height: 15px;
    margin: 0 12.5px;
    opacity: 1;
    position: relative;
  }
  #wats_maktrak .point02_block .text {
    width: 38%;
  }
  #wats_maktrak .point02_block .text h3 {
    margin: 0 0 2.55vw 0;
    width: 46.05%;
  }
  #wats_maktrak .point02_block .text h4 {
    margin-bottom: 2.3vw;
  }
  #wats_maktrak .point02_block .text h5 {
    margin-bottom: 1.45vw;
  }
  #wats_maktrak .point02_block .text h5.p1 {
    width: 77.36%;
  }
  #wats_maktrak .point02_block .text h5.p2 {
    width: 88.15%;
  }
  #wats_maktrak .point02_block .text h5.p3 {
    width: 52.63%;
  }
  #wats_maktrak .point02_block .text h5.p4 {
    width: 86.57%;
  }
  #wats_maktrak .point02_block .text h5.p5 {
    width: 91.57%;
  }
  #wats_maktrak .point02_block .text p {
    font-size: 1.57vw;
    line-height: 2.87vw;
  }
  #wats_maktrak .point02_block .text .link_btn {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 10px;
    font-size: 14px;
    line-height: 14px;
    font-weight: 700;
    text-align: center;
    padding: 13px 0;
    margin-top: 2.5vw;
    position: relative;
  }
  #wats_maktrak .point02_block .text .link_btn:before, #wats_maktrak .point02_block .text .link_btn:after {
    content: ""; /* 疑似要素に指定必須 */
    width: 15px; /* 線の長さを指定 */
    height: 1px; /* 線の幅を指定 */
    display: inline-block; /* インラインブロックにする */
    background: #FFF; /* 線の色を指定 */
    position: absolute; /* 相対位置に指定 */
    right: 15px; /* 右から10pxの位置に配置 */
  }
  #wats_maktrak .point02_block .text .link_btn:before {
    top: calc(50% - 4px); /* 数値は微調整してください */
    transform: rotate(30deg); /* 45度回転させる */
  }
  #wats_maktrak .point02_block .text .link_btn:after {
    bottom: calc(50% - 4px); /* 数値は微調整してください */
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #wats_maktrak .point02_block .ph {
    margin-top: 3.2vw;
    width: 55%;
  }
}
/********************************************
TAB
*********************************************/
@media only screen and (max-width: 1200px ) {
  header {
    position: fixed;
    z-index: 10;
    left: 2.6%;
    pointer-events: none;
    width: 94.8%;
    height: 70px;
    padding: 0;
    background: #000;
  }
  header nav {
    width: 100%;
    pointer-events: all;
  }
  header nav ul {
    display: flex;
    height: 70px;
    padding-left: 20px;
    border-bottom: 1px solid #FFF;
  }
  header nav ul li {
    margin-right: 4.68%;
  }
  header nav ul li:first-of-type {
    width: 11.2%;
  }
  header nav ul li:last-of-type {
    margin-right: 0;
  }
  header nav ul li a {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 18px;
    line-height: 18px;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  header nav ul li a .makita {
    width: 100%;
    display: block;
  }
  header nav ul li a {
    transition: opacity 0.3s linear;
  }
  header nav ul li a.hover {
    opacity: 0.6;
  }
  #wats_maktrak .point01_block {
    max-width: 1180px;
    padding: 0px 6.5vw;
    width: 100%;
    margin: 0 auto 0 auto;
    display: flex;
    justify-content: space-between;
  }
  #wats_maktrak .point01_block .text {
    width: 50%;
  }
  #wats_maktrak .point01_block .text h3 {
    margin: 10.15vw 0 1.83vw 0;
    width: 34.8%;
  }
  #wats_maktrak .point01_block .text h4 {
    margin-bottom: 2.1vw;
  }
  #wats_maktrak .point01_block .text p {
    font-size: 1.815vw;
    line-height: 3.3vw;
  }
}
@media only screen and (max-width: 1000px ) {
  #kv1 .kv_copy02, #kv2 .kv_copy02, #kv3 .kv_copy02 {
    width: 81.82%;
  }
  #kv1 .kv_copy03, #kv2 .kv_copy03, #kv3 .kv_copy03 {
    width: 81.32%;
  }
  #kv1 .kv_copy06, #kv2 .kv_copy06, #kv3 .kv_copy06 {
    width: 81.32%;
  }
  #wats_maktrak .pr li {
    padding: 2.8vw 0 1.3vw 0;
  }
  #wats_maktrak .pr li:nth-of-type(6), #wats_maktrak .pr li:nth-of-type(7), #wats_maktrak .pr li:nth-of-type(8), #wats_maktrak .pr li:nth-of-type(9), #wats_maktrak .pr li:nth-of-type(10) {
    padding: 1.8vw 0 1.3vw 0;
  }
  #wats_maktrak .pr li .coming {
    font-size: clamp(11px, 0.79vw, 0.79vw);
    line-height: 1;
    position: absolute;
    top: 60%;
    right: 1.5vw;
    background: #e60011;
    padding: 0.2vw;
    border-radius: 3px;
  }
}
/********************************************
SP
*********************************************/
@media only screen and (max-width: 765px ) {
  .pc, .pc-in, .pc-flex {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
  .sp-in {
    display: inline-block !important;
  }
  .sp-flex {
    display: flex !important;
  }
  body, html {
    font-size: 13px;
    line-height: 150%;
  }
  .loading {
    width: 100%;
    width: 100vw;
    height: 100%;
    background-color: #000;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
  }
  .loading .loading_icon {
    position: absolute;
    max-width: 63.6%;
    width: 63.6%;
    top: 50%;
    left: 50%;
  }
  .left_obi {
    background: #008ca2;
    position: fixed;
    top: 0;
    left: 0;
    width: 5.33%;
    height: 100%;
    height: 100vh;
    overflow: hidden;
    z-index: 11;
    padding-top: 1%;
    padding-right: 2px;
  }
  .left_obi .item {
    width: 77.5%;
    height: 100%;
    background-image: url("../images/left_obi_text.png");
    background-repeat: repeat-y;
    background-position: 0 0, calc(100% - 1px) 0;
    background-size: 100% auto;
    margin: 0 0 0 auto;
  }
  .right_obi {
    background: #008ca2;
    position: fixed;
    top: 0;
    right: 0;
    width: 5.33%;
    height: 100%;
    height: 100vh;
    overflow: hidden;
    z-index: 11;
    padding-top: 1%;
    padding-left: 2px;
  }
  .right_obi .item {
    width: 77.5%;
    height: 100%;
    background-image: url("../images/right_obi_text.png");
    background-repeat: repeat-y;
    background-position: 0 0, calc(100% - 1px) 0;
    background-size: 100% auto;
  }
  #ytModal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.9);
    justify-content: center;
    z-index: 10;
    opacity: 0;
    transition: opacity 0.3s ease;
    padding-bottom: 15px;
    padding-left: 5%;
    padding-right: 5%;
  }
  #ytModal.is-show {
    display: flex;
    align-items: flex-start;
    padding: 15px 10.33%;
  }
  #ytModal.is-active {
    opacity: 1;
  }
  #ytModal .yt-close {
    width: 7.5vw;
    height: 5vw;
    display: block;
    position: relative;
    margin: 0 0 3vw auto;
  }
  #ytModal .yt-close:before, #ytModal .yt-close:after {
    content: "";
    width: 100%;
    height: 2px;
    display: inline-block;
    background: #FFF;
    position: absolute;
    top: 50%;
    left: 0;
  }
  #ytModal .yt-close:before {
    transform: rotate(35deg);
  }
  #ytModal .yt-close:after {
    transform: rotate(-35deg);
  }
  #ytModal .yt-modal-inner {
    position: relative;
    width: min(1200px, 90vw, 160vh);
    aspect-ratio: 16/9;
    margin: auto 0;
  }
  #ytModal .yt-modal-inner iframe {
    width: 100%;
    height: 100%;
    border: 0;
  }
  .modal_navi {
    position: fixed;
    top: 0;
    left: 100%;
    z-index: 12;
    background: #000;
    width: 100%;
    height: 100dvh;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  }
  .modal_navi.view {
    left: 0;
  }
  .modal_navi .close_btn {
    width: 7.5vw;
    height: 5vw;
    display: block;
    /* border-left: 1px solid #FFF; */
    /* margin: 0 0 0 auto; */
    position: absolute;
    top: 5vw;
    right: 4.1vw;
    z-index: 1;
  }
  .modal_navi .close_btn:before, .modal_navi .close_btn:after {
    content: "";
    width: 100%;
    height: 2px;
    display: inline-block;
    background: #FFF;
    border-radius: 0;
    position: absolute;
    top: 50%;
    left: 0;
  }
  .modal_navi .close_btn:before {
    transform: rotate(35deg);
  }
  .modal_navi .close_btn:after {
    transform: rotate(-35deg);
  }
  .modal_navi .modal_navi_inner {
    left: 0;
    right: 0;
  }
  .modal_navi .navi {
    width: 100%;
    padding: 10vw 0;
  }
  .modal_navi .navi li {
    padding-bottom: 13vw;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .modal_navi .navi li:nth-of-type(4) {
    padding-bottom: 18vw;
  }
  .modal_navi .navi li:last-of-type {
    padding-bottom: 0;
  }
  .modal_navi .navi li a {
    display: flex;
    font-family: "Poppins", sans-serif;
    text-align: center;
    font-size: 6.5vw;
    line-height: 6.5vw;
    font-weight: 700;
    transition: opacity 0.3s linear;
  }
  .modal_navi .navi li a.hover {
    opacity: 0.6;
  }
  .modal_navi .sns {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 62.26%;
    margin: 0 auto;
  }
  .modal_navi .sns li {
    padding-bottom: 0;
  }
  .modal_navi .sns li:nth-of-type(1) {
    width: 10.404%;
  }
  .modal_navi .sns li:nth-of-type(2) {
    width: 9.8%;
  }
  .modal_navi .sns li:nth-of-type(3) {
    width: 11.43%;
  }
  .modal_navi .sns li:nth-of-type(4) {
    width: 9.8%;
    padding-bottom: 0;
  }
  .modal_navi .sns li:nth-of-type(5) {
    width: 12.09%;
  }
  .modal_navi .sns li a {
    display: flex;
    width: 100%;
    transition: opacity 0.3s linear;
  }
  .modal_navi .sns li a.hover {
    opacity: 0.6;
  }
  header {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 5.33%;
    pointer-events: none;
    width: 89.34%;
    height: auto;
    padding: 0;
    background: #000;
  }
  header .sns {
    display: none;
  }
  header nav {
    width: 100%;
    pointer-events: all;
    position: relative;
  }
  header nav ul {
    display: flex;
    height: auto;
    padding-left: 4.17%;
    border-bottom: 1px solid #FFF;
  }
  header nav ul li {
    margin-right: 0;
  }
  header nav ul li:nth-of-type(1) {
    width: 27.86%;
  }
  header nav ul li:nth-of-type(2) {
    width: 18.4%;
    display: none;
  }
  header nav ul li:nth-of-type(3) {
    width: 29.35%;
    display: none;
  }
  header nav ul li:nth-of-type(4) {
    width: 24.37%;
    display: none;
  }
  header nav ul li:nth-of-type(5) {
    width: 24.37%;
    display: none;
  }
  header nav ul li a {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 1.97vw;
    font-weight: 700;
    font-family: "Poppins", sans-serif;
    display: flex;
    align-items: center;
    justify-content: left;
    padding: 3.78vw 0;
  }
  header nav ul li a .makita {
    width: 100%;
    display: block;
  }
  header .btn_trigger {
    position: absolute;
    top: 0;
    right: 0;
    width: 18.66%;
    height: 100%;
    cursor: pointer;
  }
  header .btn_trigger span {
    position: absolute;
    display: inline-block;
    left: 32%;
    width: 36%;
    height: 2px;
    background: #FFF;
  }
  header .btn_trigger span {
    transition: all 0.3s ease-out;
    box-sizing: border-box;
  }
  header .btn_trigger span:nth-of-type(1) {
    top: 35%;
  }
  header .btn_trigger span:nth-of-type(2) {
    top: 50%;
  }
  header .btn_trigger span:nth-of-type(3) {
    bottom: 34%;
  }
  footer {
    padding: 2.8vw 0;
  }
  footer .copyright {
    text-align: center;
    font-size: 2.5vw;
    line-height: 2.5vw;
    color: #727171;
  }
  #kv_2nd {
    width: 100%;
    height: auto;
    padding: 15.4vw 0 0 0;
    position: relative;
  }
  #kv_2nd .bg img {
    display: block;
  }
  #kv_2nd h2 {
    width: 89.6%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1.65%;
  }
  #kv_2nd h2 img {
    display: block;
  }
  #philosophy_2nd img {
    display: block;
  }
  #philosophy_2nd .sec_inner {
    padding: 21.2vw 0 22.9vw 0;
    position: relative;
    overflow: hidden;
  }
  #philosophy_2nd .eff {
    width: 58.8%;
    position: absolute;
    right: 3.2%;
    top: -3%;
  }
  #philosophy_2nd .philosophy_2nd_copy {
    width: 67.06%;
    margin: 0 auto 0 auto;
  }
  #cm {
    width: 100%;
    padding: 5vw 5.33% 7.2vw 5.33%;
  }
  #cm .sec_inner {
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 1410px;
    margin: 0 auto;
  }
  #cm .sec_inner img {
    display: block;
  }
  #cm h3.ttl_gallery {
    width: 83.43%;
    margin: 0 auto;
    right: 0;
  }
  #cm h3.ttl_products {
    width: 85.37%;
    margin: 30.8% auto 0 6.4%;
    position: relative;
    z-index: 1;
  }
  #cm h3.ttl_challenge {
    width: 79.05%;
    margin: 0 auto;
    position: relative;
    top: 0;
    right: 0;
    order: 1;
  }
  #cm .cm_person {
    width: 84.02%;
    margin: -1.8% 0 0 6.9%;
  }
  #cm .num1 {
    width: 22.08%;
    margin: -16.5% -0.5% 0 auto;
  }
  #cm .num2 {
    width: 23.88%;
    margin: -22.5% -1.2% 8.6% auto;
  }
  #cm .num3 {
    width: 22.68%;
    right: -0.3%;
    bottom: -15.2%;
    z-index: 0;
  }
  #cm .cm_eff {
    width: 69.4%;
    margin: -6.3% auto 0 -3.6%;
  }
  #cm .cm_list {
    width: 82.08%;
    margin: 10.3% auto 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #cm .cm_list li {
    width: 100%;
    margin-bottom: 8vw;
  }
  #cm .cm_list li:last-of-type {
    margin-bottom: 0;
  }
  #cm .cm_list li a {
    display: flex;
    transition: opacity 0.3s linear;
    border: 1px solid #FFF;
  }
  #cm .cm_list li p {
    text-align: center;
    font-size: 3.7vw;
    line-height: 5vw;
    font-weight: 800;
    margin-top: 1.8vw;
    letter-spacing: -0.3vw;
  }
  #cm .cm_list li p span {
    font-weight: 500;
  }
  #cm .maktrack_pr {
    width: 100%;
    margin: -2.8% auto 0 auto;
    border: 1px solid #FFF;
    border-left: none;
    border-right: none;
    background: #000;
    z-index: 1;
    position: relative;
  }
  #cm .maktrack_pr h4 {
    text-align: center;
    font-size: 5.5vw;
    font-weight: 700;
    padding: 5.1vw 0 5.5vw 0;
  }
  #cm .maktrack_pr dl {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #FFF;
  }
  #cm .maktrack_pr dl dt {
    width: 100%;
    border-right: none;
    padding: 8.6vw 7vw 8vw 7vw;
    border-bottom: 1px solid #FFF;
  }
  #cm .maktrack_pr dl dt h5 {
    font-size: 4.6vw;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 3vw;
  }
  #cm .maktrack_pr dl dt p {
    font-size: 3.3vw;
    line-height: 6.5vw;
    letter-spacing: -0.1vw;
  }
  #cm .maktrack_pr dl dt p span {
    margin-left: -3vw;
  }
  #cm .maktrack_pr dl dt p span:nth-of-type(2) {
    margin-left: -2vw;
  }
  #cm .maktrack_pr dl dt p .last {
    margin-left: -0.4vw;
  }
  #cm .maktrack_pr dl dt .link_btn {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 2vw;
    font-size: 3.3vw;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    padding: 2.9vw 0;
    margin-top: 4.2vw;
    position: relative;
  }
  #cm .maktrack_pr dl dt .link_btn:before, #cm .maktrack_pr dl dt .link_btn:after {
    content: "";
    width: 3vw;
    height: 1px;
    display: inline-block;
    background: #FFF;
    position: absolute;
    right: 3vw;
    top: 50%;
  }
  #cm .maktrack_pr dl dt .link_btn:before {
    top: 4.6vw;
    transform: rotate(60deg);
  }
  #cm .maktrack_pr dl dt .link_btn:after {
    bottom: 3vw;
    transform: rotate(-60deg);
    right: 1.5vw;
  }
  #cm .maktrack_pr dl dt .link_btn {
    transition: opacity 0.3s linear;
  }
  #cm .maktrack_pr dl dt .link_btn.hover {
    opacity: 0.6;
  }
  #cm .maktrack_pr dl dd {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 9.2vw 0;
  }
  #cm .maktrack_pr dl dd .pr {
    width: 67.16%;
  }
  #cm .more_pr {
    width: 100%;
    margin: 0 auto 0 auto;
    border: 1px solid #FFF;
    border-left: none;
    border-right: none;
    border-top: none;
  }
  #cm .more_pr h4 {
    text-align: center;
    font-size: 5.5vw;
    font-weight: 700;
    padding: 5.1vw 0 5.5vw 0;
  }
  #cm .more_pr dl {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #FFF;
  }
  #cm .more_pr dl dt {
    width: 100%;
    border-right: none;
    padding: 8.6vw 7vw 8vw 7vw;
    border-bottom: 1px solid #FFF;
  }
  #cm .more_pr dl dt h5 {
    font-size: 4.6vw;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 3vw;
  }
  #cm .more_pr dl dt p {
    font-size: 3.3vw;
    line-height: 6.5vw;
    letter-spacing: -0.1vw;
  }
  #cm .more_pr dl dt p span {
    margin-left: -0.7vw;
  }
  #cm .more_pr dl dt .link_btn {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 2vw;
    font-size: 3.3vw;
    line-height: 1;
    font-weight: 700;
    text-align: center;
    padding: 2.9vw 0;
    margin-top: 4.2vw;
    position: relative;
  }
  #cm .more_pr dl dt .link_btn:before, #cm .more_pr dl dt .link_btn:after {
    content: ""; /* 疑似要素に指定必須 */
    width: 4%; /* 線の長さを指定 */
    height: 1px; /* 線の幅を指定 */
    display: inline-block; /* インラインブロックにする */
    background: #FFF; /* 線の色を指定 */
    position: absolute; /* 相対位置に指定 */
    right: 4%; /* 右から10pxの位置に配置 */
  }
  #cm .more_pr dl dt .link_btn:before {
    top: 44%; /* 数値は微調整してください */
    transform: rotate(30deg); /* 45度回転させる */
  }
  #cm .more_pr dl dt .link_btn:after {
    bottom: 39%; /* 数値は微調整してください */
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #cm .more_pr dl dt .link_btn {
    transition: opacity 0.3s linear;
  }
  #cm .more_pr dl dt .link_btn.hover {
    opacity: 0.6;
  }
  #cm .more_pr dl dd {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #cm .more_pr dl dd .swiper2 {
    width: 100%;
    overflow: hidden;
    position: relative;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    height: 62.5vw;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide {
    padding: 3.2vw 5vw 0 5vw;
    border-right: 1px solid #FFF;
    height: 100%;
    box-sizing: border-box;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide:nth-of-type(1), #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide:nth-of-type(2), #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide:nth-of-type(3) {
    border-bottom: none;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide:nth-of-type(2), #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide:nth-of-type(5) {
    border-left: none;
    border-right: 1px solid #FFF;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .name {
    font-size: 3.2vw;
    line-height: 4vw;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .pr_img {
    height: 40.2vw;
    width: auto;
    display: flex;
    justify-content: center;
    margin-top: -2.5vw;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .pr_img img {
    width: auto;
    height: 100%;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .link_btn {
    display: block;
    width: 100%;
    background: #008ca2;
    border-radius: 2.5vw;
    font-family: "Poppins", sans-serif;
    font-size: 3vw;
    line-height: 1;
    font-weight: 600;
    text-align: center;
    padding: 2.5vw 0;
    margin: 2vw auto 0 auto;
    position: relative;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .link_btn:before, #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .link_btn:after {
    content: "";
    width: 3.5vw;
    height: 1px;
    display: inline-block;
    background: #FFF;
    position: absolute;
    right: 3vw;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .link_btn:before {
    top: 38%;
    transform: rotate(30deg);
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .link_btn:after {
    bottom: 38%;
    transform: rotate(-30deg);
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .link_btn {
    transition: opacity 0.3s linear;
  }
  #cm .more_pr dl dd .swiper2 .swiper-wrapper .swiper-slide .link_btn.hover {
    opacity: 0.6;
  }
  #cm .special {
    margin-top: 0;
    margin-bottom: 13.9%;
    padding-top: 17.3%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
  }
  #cm .special .copy {
    width: 79.05%;
    margin: 7.5% auto 0 auto;
    position: relative;
    top: 0;
    right: 0;
    order: 2;
  }
  #cm .list {
    width: 82%;
    margin: 0 auto 10.2% auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #cm .list li {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 6.8vw;
  }
  #cm .list li:nth-of-type(1), #cm .list li:nth-of-type(2), #cm .list li:nth-of-type(3) {
    margin-bottom: 6.8vw;
  }
  #cm .list li:last-of-type {
    margin-bottom: 0;
  }
  #cm .list li a {
    display: block;
    width: 100%;
    border: 1px solid #FFF;
  }
  #cm .list li a img {
    display: block;
  }
  #cm .list li .text {
    display: flex;
    align-items: center;
    margin-top: 3vw;
  }
  #cm .list li .text .vol {
    font-size: 4vw;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.5vw;
  }
  #cm .list li .text .coming {
    font-size: 2.5vw;
    line-height: 1;
    padding: 0.5vw 1.5vw;
    border: 1px solid #FFF;
    border-radius: 2vw;
    margin-left: 1.5vw;
    top: 0.3vw;
  }
  #cm .title {
    width: 100%;
    margin-top: 6.5vw;
  }
  #cm .title ol {
    display: flex;
    flex-wrap: wrap;
    height: auto;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    justify-content: center;
    padding: 0;
  }
  #cm .title ol li {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3.9vw 0;
  }
  #cm .title ol li:nth-of-type(1) {
    width: 100%;
    justify-content: center;
    border-bottom: none;
  }
  #cm .title ol li:nth-of-type(1) p {
    font-family: "Poppins", sans-serif;
    font-size: 7.7vw;
    line-height: 7.7vw;
    font-weight: 700;
    color: #008ca2;
  }
  #cm .title ol li:nth-of-type(1) p span {
    letter-spacing: -0.35vw;
  }
  #cm .title ol li:nth-of-type(2) {
    width: 50%;
    border-left: none;
    border-right: 1px solid #FFF;
    padding: 0;
  }
  #cm .title ol li:nth-of-type(2) a {
    color: #008ca2;
    position: relative;
    padding-right: 3.5vw;
    font-size: 3.2vw;
    line-height: 4.5vw;
    padding: 3.25vw 4vw 3.25vw 0;
  }
  #cm .title ol li:nth-of-type(2) a span {
    letter-spacing: -0.6vw;
    display: contents;
  }
  #cm .title ol li:nth-of-type(2) a:after {
    content: "";
    width: 2.2vw;
    height: 2.2vw;
    border: 0;
    border-top: solid 1px #008ca2;
    border-right: solid 1px #008ca2;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 8%;
    right: 6vw;
    bottom: 0;
    margin: auto;
  }
  #cm .title ol li:nth-of-type(3) {
    width: 50%;
    padding: 3.25vw 0;
  }
  #cm .title ol li .new {
    width: 69.25%;
    margin: 0 auto;
  }
  #cm .title ol li .maktrak {
    width: 44.76%;
    margin: 0 0 0 2.5vw;
  }
  #kv1, #kv2, #kv3 {
    width: 100%;
    height: 100svh !important;
    max-height: 100svh !important;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #kv1 .scroll_attention, #kv2 .scroll_attention, #kv3 .scroll_attention {
    display: block;
    position: absolute;
    bottom: 26.2vw;
    left: 50%;
    width: 10.66%;
    transform: translateX(-50%);
  }
  #kv1 .scroll_attention .text, #kv2 .scroll_attention .text, #kv3 .scroll_attention .text {
    font-size: 3vw;
    line-height: 3vw;
    text-align: center;
    display: flex;
  }
  #kv1 .scroll_attention .arrow, #kv2 .scroll_attention .arrow, #kv3 .scroll_attention .arrow {
    display: flex;
    width: 36.25%;
    margin: 1vw auto 0 auto;
    animation: bounce 1s infinite;
  }
  #kv1 .kv_copy01, #kv2 .kv_copy01, #kv3 .kv_copy01 {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 45.86%;
    width: 45.86%;
    z-index: 1;
  }
  #kv1 .kv_copy02, #kv2 .kv_copy02, #kv3 .kv_copy02 {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 77.73%;
    width: 77.73%;
    z-index: 1;
  }
  #kv1 .kv_copy03, #kv2 .kv_copy03, #kv3 .kv_copy03 {
    position: absolute;
    left: 50%;
    bottom: 15.65vw;
    top: auto;
    transform: translateX(-50%);
    max-width: 65.3%;
    width: 65.3%;
    z-index: 1;
  }
  #kv1 .kv_copy06, #kv2 .kv_copy06, #kv3 .kv_copy06 {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 769px;
    width: 72%;
    z-index: 1;
  }
  #kv1 .kv_img01, #kv2 .kv_img01, #kv3 .kv_img01 {
    position: absolute;
    left: 50%;
    bottom: 0;
    max-width: 1272px;
    width: 113%;
  }
  #kv1 .kv_img02, #kv1 .kv_img03, #kv1 .kv_img04, #kv1 .kv_img05, #kv2 .kv_img02, #kv2 .kv_img03, #kv2 .kv_img04, #kv2 .kv_img05, #kv3 .kv_img02, #kv3 .kv_img03, #kv3 .kv_img04, #kv3 .kv_img05 {
    position: absolute;
    left: 50%;
    bottom: auto;
    top: 46%;
    width: 100%;
    height: auto; /* 親の高さも明示 */
  }
  #kv1 .kv_img02 img, #kv1 .kv_img03 img, #kv1 .kv_img04 img, #kv1 .kv_img05 img, #kv2 .kv_img02 img, #kv2 .kv_img03 img, #kv2 .kv_img04 img, #kv2 .kv_img05 img, #kv3 .kv_img02 img, #kv3 .kv_img03 img, #kv3 .kv_img04 img, #kv3 .kv_img05 img {
    width: 100% !important; /* 一旦、確実に上書きするため */
    height: auto !important;
    max-width: none; /* リセット側にmax-width:100%等があると効くのでこちらも解除 */
  }
  #kv1 .kv_img05, #kv2 .kv_img05, #kv3 .kv_img05 {
    bottom: auto;
    top: 50%;
  }
  #kv1 {
    width: 100%;
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #philosophy {
    width: 89.34%;
    margin: 0 auto;
  }
  #philosophy .sec_inner {
    padding: 14.4vw 0 13.8vw 0;
  }
  #philosophy h2 {
    width: 76.26%;
    margin: 0 auto;
  }
  #philosophy .philosophy_copy {
    width: 77.16%;
    margin: 12vw auto 6.1vw auto;
  }
  #philosophy .timer_txt {
    padding-top: 6.1vw;
    font-size: 4vw;
    line-height: 4vw;
    text-align: center;
    font-weight: 900;
    margin-bottom: 2.2vw;
  }
  #philosophy .timer {
    font-family: "Poppins", sans-serif;
    font-size: 7.7vw;
    line-height: 7.7vw;
    font-weight: 700;
    text-align: center;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 1.5vw;
  }
  #philosophy .timer .num {
    display: inline-flex;
  }
  #philosophy .timer .d {
    display: inline-block;
    width: 1ch;
    text-align: center;
  }
  #philosophy .timer_after {
    display: flex;
    justify-content: center;
    gap: 5vw;
    margin-top: 0.4vw;
  }
  #philosophy .timer_after span {
    font-weight: 700;
    font-size: 3vw;
    line-height: 3vw;
    text-align: center;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    width: 10vw;
    display: inline-block;
  }
  #wats_maktrak {
    width: 89.34%;
    margin: 0 auto;
  }
  #wats_maktrak .sec_inner {
    padding: 0;
  }
  #wats_maktrak .title {
    width: 100%;
  }
  #wats_maktrak .title ol {
    display: flex;
    flex-wrap: wrap;
    height: auto;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    justify-content: center;
    padding: 0;
  }
  #wats_maktrak .title ol li {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3.9vw 0;
  }
  #wats_maktrak .title ol li:nth-of-type(1) {
    width: 100%;
    justify-content: center;
    border-bottom: 1px solid #FFF;
  }
  #wats_maktrak .title ol li:nth-of-type(1) p {
    font-family: "Poppins", sans-serif;
    font-size: 7.7vw;
    line-height: 7.7vw;
    font-weight: 700;
    color: #008ca2;
  }
  #wats_maktrak .title ol li:nth-of-type(1) p span {
    letter-spacing: -0.35vw;
  }
  #wats_maktrak .title ol li:nth-of-type(2) {
    width: 50%;
    border-left: none;
    border-right: 1px solid #FFF;
    padding: 0;
  }
  #wats_maktrak .title ol li:nth-of-type(2) a {
    color: #008ca2;
    position: relative;
    padding-right: 3.5vw;
    font-size: 3.2vw;
    line-height: 4.5vw;
    padding: 3.25vw 4vw 3.25vw 0;
  }
  #wats_maktrak .title ol li:nth-of-type(2) a span {
    letter-spacing: -0.6vw;
    display: contents;
  }
  #wats_maktrak .title ol li:nth-of-type(2) a:after {
    content: "";
    width: 2.2vw;
    height: 2.2vw;
    border: 0;
    border-top: solid 1px #008ca2;
    border-right: solid 1px #008ca2;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 8%;
    right: 6vw;
    bottom: 0;
    margin: auto;
  }
  #wats_maktrak .title ol li:nth-of-type(3) {
    width: 50%;
    padding: 3.25vw 0;
  }
  #wats_maktrak .title ol li .new {
    width: 69.25%;
    margin: 0 auto;
  }
  #wats_maktrak .title ol li .maktrak {
    width: 44.76%;
    margin: 0 0 0 4vw;
  }
  #wats_maktrak .point01_block {
    max-width: 1180px;
    padding: 0;
    width: 81.34%;
    margin: 9.5vw auto 9.5vw auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #wats_maktrak .point01_block .text {
    width: 100%;
  }
  #wats_maktrak .point01_block .text h3 {
    margin: 0 0 3.86vw 0;
    width: 32.11%;
  }
  #wats_maktrak .point01_block .text h4 {
    margin-bottom: 2.1vw;
  }
  #wats_maktrak .point01_block .text p {
    font-size: 3.3vw;
    line-height: 6.3vw;
    margin-top: -3.3vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(1) {
    margin-left: -2vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(2) {
    margin-left: -3vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(3) {
    margin-left: -3vw;
  }
  #wats_maktrak .point01_block .text p span:nth-of-type(4) {
    margin-left: -0.8vw;
  }
  #wats_maktrak .point01_block .text .link_btn {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 10px;
    font-size: 3.3vw;
    line-height: 3.3vw;
    font-weight: 700;
    text-align: center;
    padding: 2.9vw 0;
    margin-top: 4.5vw;
    margin-bottom: 10.5vw;
    position: relative;
  }
  #wats_maktrak .point01_block .text .link_btn:before, #wats_maktrak .point01_block .text .link_btn:after {
    content: ""; /* 疑似要素に指定必須 */
    width: 3.2vw; /* 線の長さを指定 */
    height: 1px; /* 線の幅を指定 */
    display: inline-block; /* インラインブロックにする */
    background: #FFF; /* 線の色を指定 */
    position: absolute; /* 相対位置に指定 */
    right: 4%; /* 右から10pxの位置に配置 */
  }
  #wats_maktrak .point01_block .text .link_btn:before {
    top: calc(50% - 0.8vw); /* 数値は微調整してください */
    transform: rotate(30deg); /* 45度回転させる */
  }
  #wats_maktrak .point01_block .text .link_btn:after {
    bottom: calc(50% - 0.8vw); /* 数値は微調整してください */
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #wats_maktrak .point01_block .ph {
    width: 82%;
    margin: -3.8vw auto 0 auto;
  }
  #wats_maktrak .point02_block {
    max-width: 1180px;
    width: 95.34%;
    margin: 11vw auto 5vw auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #wats_maktrak .point02_block .swiper-slide {
    display: flex;
    justify-content: space-between;
  }
  #wats_maktrak .point02_block .swiper {
    padding: 0 6.25vw 6.5vw 6.25vw;
  }
  #wats_maktrak .point02_block .swiper-button-next, #wats_maktrak .point02_block .swiper-button-prev {
    height: 4vw;
    width: 4vw;
    margin-top: -32vw;
  }
  #wats_maktrak .point02_block .swiper-button-next .swiper-navigation-icon, #wats_maktrak .point02_block .swiper-button-prev .swiper-navigation-icon {
    display: none;
  }
  #wats_maktrak .point02_block .swiper-button-prev {
    left: 0;
  }
  #wats_maktrak .point02_block .swiper-button-next {
    right: 0;
  }
  #wats_maktrak .point02_block .swiper-pagination-bullet-active {
    background: #FFF !important;
    opacity: 1 !important;
  }
  #wats_maktrak .point02_block .swiper-pagination-bullet-active:after {
    content: "";
    width: 5.3vw;
    height: 5vw;
    border: 1px solid #FFF;
    border-radius: 50%;
    position: absolute;
    top: -0.95vw;
    left: -1.2vw;
  }
  #wats_maktrak .point02_block .swiper-pagination-bullet {
    background: #666;
    width: 3vw;
    height: 3vw;
    margin: 0 2.2vw;
    opacity: 1;
    position: relative;
  }
  #wats_maktrak .point02_block .text {
    width: 100%;
  }
  #wats_maktrak .point02_block .text h3 {
    margin: 0 0 3.86vw 0;
    width: 32.11%;
  }
  #wats_maktrak .point02_block .text h4 {
    width: 85.68%;
    margin-bottom: 2.1vw;
  }
  #wats_maktrak .point02_block .text h5 {
    margin: 5vw 0 4vw 0;
  }
  #wats_maktrak .point02_block .text h5.p1 {
    width: 65.13%;
  }
  #wats_maktrak .point02_block .text h5.p2 {
    width: 73.94%;
  }
  #wats_maktrak .point02_block .text h5.p3 {
    width: 44.4%;
  }
  #wats_maktrak .point02_block .text h5.p4 {
    width: 72.66%;
  }
  #wats_maktrak .point02_block .text h5.p5 {
    width: 76.69%;
  }
  #wats_maktrak .point02_block .text p {
    font-size: 3.3vw;
    line-height: 6.3vw;
  }
  #wats_maktrak .point02_block .text .link_btn {
    display: block;
    width: 100%;
    border: 1px solid #fff;
    border-radius: 10px;
    font-size: 3.3vw;
    line-height: 3.3vw;
    font-weight: 700;
    text-align: center;
    padding: 2.9vw 0;
    margin-top: 4.5vw;
    margin-bottom: 10.5vw;
    position: relative;
  }
  #wats_maktrak .point02_block .text .link_btn:before, #wats_maktrak .point02_block .text .link_btn:after {
    content: ""; /* 疑似要素に指定必須 */
    width: 3.2vw; /* 線の長さを指定 */
    height: 1px; /* 線の幅を指定 */
    display: inline-block; /* インラインブロックにする */
    background: #FFF; /* 線の色を指定 */
    position: absolute; /* 相対位置に指定 */
    right: 4%; /* 右から10pxの位置に配置 */
  }
  #wats_maktrak .point02_block .text .link_btn:before {
    top: calc(50% - 0.8vw); /* 数値は微調整してください */
    transform: rotate(30deg); /* 45度回転させる */
  }
  #wats_maktrak .point02_block .text .link_btn:after {
    bottom: calc(50% - 0.8vw); /* 数値は微調整してください */
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #wats_maktrak .point02_block .ph {
    margin-top: 3.2vw;
    width: 100%;
  }
  #wats_maktrak .pr {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #FFF;
  }
  #wats_maktrak .pr li {
    width: 50%;
    display: block;
    position: relative;
    padding: 7vw 0 3.3vw 0;
    border-right: none;
    border-bottom: 1px solid #FFF;
  }
  #wats_maktrak .pr li:nth-of-type(odd) {
    border-right: 1px solid #FFF !important;
  }
  #wats_maktrak .pr li:nth-of-type(1), #wats_maktrak .pr li:nth-of-type(2) {
    padding-top: 15.3vw !important;
  }
  #wats_maktrak .pr li:nth-of-type(1) .pr_img, #wats_maktrak .pr li:nth-of-type(2) .pr_img {
    width: 70.8% !important;
  }
  #wats_maktrak .pr li:nth-of-type(1) .link_btn, #wats_maktrak .pr li:nth-of-type(2) .link_btn {
    margin: 7.3vw auto 0 auto !important;
  }
  #wats_maktrak .pr li:nth-of-type(3) .pr_img, #wats_maktrak .pr li:nth-of-type(4) .pr_img, #wats_maktrak .pr li:nth-of-type(5) .pr_img {
    bottom: 0;
  }
  #wats_maktrak .pr li:nth-of-type(9), #wats_maktrak .pr li:nth-of-type(10) {
    padding-top: 7vw !important;
  }
  #wats_maktrak .pr li:nth-of-type(9) .pr_img, #wats_maktrak .pr li:nth-of-type(10) .pr_img {
    width: 59% !important;
  }
  #wats_maktrak .pr li:nth-of-type(9) .link_btn, #wats_maktrak .pr li:nth-of-type(10) .link_btn {
    margin: -4vw auto 0 auto !important;
  }
  #wats_maktrak .pr li:nth-of-type(6), #wats_maktrak .pr li:nth-of-type(7), #wats_maktrak .pr li:nth-of-type(8), #wats_maktrak .pr li:nth-of-type(9), #wats_maktrak .pr li:nth-of-type(10) {
    width: 50%;
    display: block;
    position: relative;
    padding: 7vw 0 3.3vw 0;
    border-right: none;
  }
  #wats_maktrak .pr li:nth-of-type(6):last-of-type, #wats_maktrak .pr li:nth-of-type(7):last-of-type, #wats_maktrak .pr li:nth-of-type(8):last-of-type, #wats_maktrak .pr li:nth-of-type(9):last-of-type, #wats_maktrak .pr li:nth-of-type(10):last-of-type {
    border-right: 0;
  }
  #wats_maktrak .pr li:nth-of-type(6) .pr_img, #wats_maktrak .pr li:nth-of-type(7) .pr_img, #wats_maktrak .pr li:nth-of-type(8) .pr_img, #wats_maktrak .pr li:nth-of-type(9) .pr_img, #wats_maktrak .pr li:nth-of-type(10) .pr_img {
    width: 59%;
    margin: 0 auto;
    bottom: 0;
  }
  #wats_maktrak .pr li:nth-of-type(6) .link_btn, #wats_maktrak .pr li:nth-of-type(7) .link_btn, #wats_maktrak .pr li:nth-of-type(8) .link_btn, #wats_maktrak .pr li:nth-of-type(9) .link_btn, #wats_maktrak .pr li:nth-of-type(10) .link_btn {
    margin: -4vw auto 0 auto;
    position: relative;
  }
  #wats_maktrak .pr li:last-of-type {
    border-right: 0;
  }
  #wats_maktrak .pr li .name {
    font-size: 3vw;
    line-height: 4.2vw;
    position: absolute;
    top: 2.2vw;
    left: 3vw;
  }
  #wats_maktrak .pr li .coming {
    font-size: 2.5vw;
    line-height: 1;
    position: relative;
    right: auto;
    background: #e60011;
    padding: 0.1vw 0.7vw;
    border-radius: 3px;
    margin-left: 2.5vw;
  }
  #wats_maktrak .pr li .pr_img {
    width: 59%;
    margin: 0 auto;
  }
  #wats_maktrak .pr li .link_btn {
    display: block;
    width: 80.59%;
    background: #008ca2;
    border-radius: 1.5vw;
    font-family: "Poppins", sans-serif;
    font-size: 3vw;
    line-height: 3vw;
    font-weight: 600;
    text-align: center;
    padding: 2.1vw 0;
    margin: -4vw auto 0 auto;
    position: relative;
  }
  #wats_maktrak .pr li .link_btn:before, #wats_maktrak .pr li .link_btn:after {
    content: "";
    width: 3vw;
    height: 1px;
    display: inline-block;
    background: #FFF;
    position: absolute;
    right: 1.5vw;
  }
  #wats_maktrak .pr li .link_btn:before {
    top: 2.8vw; /* 数値は微調整してください */
    transform: rotate(30deg); /* 45度回転させる */
  }
  #wats_maktrak .pr li .link_btn:after {
    bottom: 2.8vw; /* 数値は微調整してください */
    transform: rotate(-30deg); /* -45度回転させる */
  }
  #wats_maktrak .sns_block {
    width: 100%;
    padding: 4.3vw 0 0 0;
  }
  #wats_maktrak .sns_block .sns {
    width: 69.7%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  #wats_maktrak .sns_block .sns li:nth-of-type(1) {
    width: 10.404%;
  }
  #wats_maktrak .sns_block .sns li:nth-of-type(2) {
    width: 9.8%;
  }
  #wats_maktrak .sns_block .sns li:nth-of-type(3) {
    width: 11.43%;
  }
  #wats_maktrak .sns_block .sns li:nth-of-type(4) {
    width: 9.8%;
  }
  #wats_maktrak .sns_block .sns li:nth-of-type(5) {
    width: 12.09%;
  }
  #wats_maktrak .sns_block .sns li a {
    display: flex;
    width: 100%;
    transition: opacity 0.3s linear;
  }
  #wats_maktrak .sns_block .sns li a.hover {
    opacity: 0.6;
  }
}/*# sourceMappingURL=common.css.map */