* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.img img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 0.5s;
  aspect-ratio: inherit;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_banner {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  aspect-ratio: 1920 / 883;
}
.ut5_banner .wrap {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
}
.ut5_banner .content {
  height: 100%;
  display: flex;
  align-items: center;
  max-width: 162.2rem;
}
.ut5_banner .ut5_head {
  margin-left: auto;
}
.ut5_banner .ut5_head h1 {
  width: 1px;
  height: 1px;
  overflow: hidden;
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
}
.ut5_banner .ut5_head .img {
  height: 10.9rem;
}
.ut5_banner .ut5_head .img img {
  display: block;
  width: auto;
  height: 100%;
  object-fit: contain;
}
.ut5_banner .ut5_head .desc {
  font-size: 3.2rem;
  font-weight: 600;
  padding: 0px 1rem;
  margin-top: 4.7rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_banner {
    aspect-ratio: unset;
  }
  .ut5_banner .ut5_head {
    text-align: center;
    margin-left: unset;
    width: 100%;
  }
  .ut5_banner .ut5_head .img {
    height: 54px;
    margin: 0px auto;
    width: max-content;
  }
  .ut5_banner .ut5_head .desc {
    font-size: 23px;
    margin-top: 16px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_banner .ut5_head .img {
    height: 35px;
  }
  .ut5_banner .ut5_head .desc {
    font-size: 12px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
a {
  color: inherit;
  cursor: pointer;
  font-size: inherit;
  text-decoration: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
.center {
  text-align: center;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.img.img_cv {
  overflow: hidden;
}
.img.img_cv img {
  object-fit: cover;
}
.img img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 0.5s;
  aspect-ratio: inherit;
}
.btn {
  display: inline-block;
  vertical-align: top;
  border-radius: 100px;
  transition: 0.4s;
  text-align: center;
  cursor: pointer;
  padding: 0px 2.4rem;
  font-size: 1.5rem;
  color: rgb(0, 0, 0);
  border: 1px solid rgb(255, 255, 255);
  background-color: rgb(255, 255, 255);
  line-height: 3.6rem;
  font-weight: 500;
}
.btn:hover {
  color: rgb(255, 255, 255);
  border-color: rgb(0, 0, 0);
  background-color: rgb(0, 0, 0);
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_features {
  overflow: hidden;
  padding: 14.3rem 0px 10.7rem;
}
.ut5_features .content {
  max-width: 129.6rem;
}
.ut5_features .items>div {
  position: relative;
  padding-bottom: 102.701%;
}
.ut5_features .item {
  position: absolute;
  border-radius: 1.5rem;
  overflow: hidden;
  width: 57.6389%;
  height: 32.6822%;
}
.ut5_features .item:hover img {
  transform: scale(1.02);
}
.ut5_features .item .img {
  width: 100%;
  height: 100%;
}
.ut5_features .item .img video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.ut5_features .item .info {
  position: absolute;
  inset: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  z-index: 2;
  padding: 1rem;
}
.ut5_features .item .info strong {
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5_features .item .info p {
  font-size: 2rem;
  color: rgb(161, 161, 161);
}
.ut5_features .item:nth-child(1) {
  left: 0px;
  top: 0px;
}
.ut5_features .item:nth-child(2) {
  width: 41.0494%;
  right: 0px;
  top: 0px;
}
.ut5_features .item:nth-child(3) {
  width: 41.0494%;
  height: 66.3411%;
  left: 0px;
  bottom: 0px;
}
.ut5_features .item:nth-child(4) {
  right: 0px;
  top: 33.6589%;
}
.ut5_features .item:nth-child(5) {
  right: 0px;
  bottom: 0px;
}
.ut5_features p.center:has(.btn) {
  display: none;
  margin-top: 9.3rem;
}
.ut5_features p.center:has(.btn) .btn {
  font-size: 2rem;
  color: rgb(161, 161, 161);
  line-height: 4rem;
  border-color: rgb(141, 141, 141);
  background-color: transparent;
  border-radius: 5px;
  min-width: 20rem;
}
.ut5_features p.center:has(.btn) .btn:hover {
  background-color: rgb(255, 255, 255);
  border-color: rgb(255, 255, 255);
  color: rgb(0, 0, 0);
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .btn {
    font-size: 14px;
    line-height: 34px;
    padding: 0px 20px;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_features {
    padding: 50px 0px;
  }
  .ut5_features .content {
    padding: 0px 32px;
  }
  .ut5_features .item {
    border-radius: 5px;
  }
  .ut5_features .item .info strong {
    font-size: 21px;
    line-height: 1.5;
  }
  .ut5_features .item .info p {
    font-size: 12px;
  }
  .ut5_features p.center:has(.btn) {
    margin-top: 68px;
  }
  .ut5_features p.center:has(.btn) .btn {
    font-size: 14px;
    line-height: 30px;
    min-width: 142px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .ut5_features {
    padding: 30px 0px;
  }
  .ut5_features .content {
    padding: 0px 16px;
  }
  .ut5_features .item .info strong {
    font-size: 14px;
  }
  .ut5_features p.center:has(.btn) {
    margin-top: 33px;
  }
  .ut5_features p.center:has(.btn) .btn {
    font-size: 12px;
    min-width: 69px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5_video {
  position: relative;
  overflow: hidden;
}
.ut5_video .video {
  position: relative;
}
.ut5_video .video video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ut5_video .video .btn_play {
  position: absolute;
  right: 10%;
  bottom: 10%;
  z-index: 2;
  cursor: pointer;
  color: rgb(255, 255, 255);
  font-size: 1.8rem;
  font-weight: 700;
  gap: 1rem;
  display: flex;
  align-items: center;
}
.ut5_video .video .btn_play::after {
  content: "";
  display: block;
  width: 3rem;
  height: 3rem;
  filter: contrast(0) brightness(2);
  background: url("https://navee.sytech.site/wp-content/plugins/sytech-fronteditor/sytpl/ut5-ultra3-ut5_video/assets/img/ut5-play.svg") center center / contain no-repeat;
}
.ut5_video .desc {
  font-size: 2rem;
  line-height: 1.85;
  min-height: 7.4rem;
  color: rgb(161, 161, 161);
  max-width: 59.9rem;
  position: absolute;
  text-align: center;
  left: 50%;
  bottom: 11.5rem;
  transform: translateX(-50%);
  z-index: 5;
}
.ut5_video .mask {
  position: absolute;
  inset: 0px;
  z-index: 3;
  pointer-events: none;
  background: url("https://navee.sytech.site/wp-content/plugins/sytech-fronteditor/sytpl/ut5-ultra3-ut5_video/assets/img/ut5-video-mask.svg") center center / cover no-repeat;
}
@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5_video .video .btn_play {
    z-index: 5;
    gap: 0px;
    text-indent: -999px;
    overflow: hidden;
    right: 28px;
    top: 30px;
    width: 34px;
    height: 34px;
    white-space: nowrap;
    color: transparent;
  }
  .ut5_video .video .btn_play::after {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
  }
  .ut5_video .mask {
    background-size: 130%;
  }
  .ut5_video .desc {
    display: none;
  }
}

@media screen and (max-width: 576px) {
  .ut5_video .video .btn_play {
    width: 17px;
    height: 17px;
    right: 14px;
    top: 16px;
  }
}

.ut5_video input {
  position: absolute;
  z-index: 9;
  right: 1rem;
  top: 1rem;
  padding: 8px;
  width: 80%;
  display: none;
  border: 1px solid rgba(0, 0, 0, 0.5);
}
.toplevel_page_sytech_fronteditor .ut5_video input {
  display: block;
}
.ut5_video input + input {
  margin-top: 4rem;
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_head p {
  font-size: 2rem;
  line-height: 1.25;
}
.ut5_intro1 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro1::after {
  position: absolute;
  width: 59.1667%;
  height: 100%;
  left: -14.0625%;
  top: 0px;
  content: "";
  background-image: linear-gradient(to right, rgb(0, 0, 0), transparent);
  pointer-events: none;
}
.ut5_intro1 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 5rem 0px;
}
.ut5_intro1 .content {
  max-width: 175.2rem;
  display: flex;
  align-items: center;
  height: 100%;
}
.ut5_intro1 .ut5_head {
  width: 45%;
  max-width: 57rem;
}
.ut5_intro1 .ut5_head h2 {
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5_intro1 .ut5_head p {
  line-height: 1.85;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_head p {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 10px;
  }
  .ut5_intro1 .con {
    padding: 30px 63px;
  }
  .ut5_intro1 .content {
    align-items: flex-end;
  }
  .ut5_intro1 .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_head p {
    font-size: 12px;
    line-height: 1.5;
  }
  .ut5_intro1 .con {
    padding: 15px 31px;
  }
  .ut5_intro1 .ut5_head {
    width: 80%;
  }
  .ut5_intro1 .ut5_head h2 {
    font-size: 17px;
    max-width: 200px;
  }
  .ut5_intro1 .ut5_head p {
    line-height: 1.5;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_head p {
  font-size: 2rem;
  line-height: 1.25;
}
.ut5-body .nums strong {
  white-space: nowrap;
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5-body .nums .label {
  font-size: 2rem;
  line-height: 1.05;
  color: rgb(161, 161, 161);
}
.ut5_intro2 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro2 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 15.6rem 0px 11.4rem;
}
.ut5_intro2 .content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.ut5_intro2 .ut5_head h2 {
  max-width: 61.3rem;
}
.ut5_intro2 .ut5_head p {
  color: rgb(161, 161, 161);
}
.ut5_intro2 .nums {
  margin-top: 3rem;
}
.ut5_intro2 .nums ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}
.ut5_intro2 .nums li {
  display: flex;
  align-items: flex-end;
}
.ut5_intro2 .nums .label {
  margin-bottom: 1rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5-body .nums strong {
    font-size: 4rem;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
  .ut5-body .nums strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_head p {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 10px;
  }
  .ut5-body .nums strong {
    font-size: 26px;
    line-height: 1.66667;
  }
  .ut5-body .nums .label {
    font-size: 12px;
  }
  .ut5_intro2 {
    background-color: rgb(63, 63, 63);
    padding: 20px 26px;
  }
  .ut5_intro2 .con {
    padding: 20px 26px;
  }
  .ut5_intro2 .content {
    padding: 33px 37px;
  }
  .ut5_intro2 picture {
    border-radius: 4px;
    overflow: hidden;
  }
  .ut5_intro2 .nums {
    margin-top: 20px;
  }
  .ut5_intro2 .nums ul {
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .ut5_intro2 .nums li {
    display: block;
  }
  .ut5_intro2 .nums .label {
    margin-bottom: 0px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_head p {
    font-size: 12px;
    line-height: 1.5;
  }
  .ut5-body .nums strong {
    font-size: 14px;
  }
  .ut5_intro2 {
    padding: 13px 17px;
  }
  .ut5_intro2 .con {
    padding: 13px 17px;
  }
  .ut5_intro2 .content {
    padding: 22px 24px;
  }
  .ut5_intro2 .ut5_head {
    width: 60%;
  }
  .ut5_intro2 .nums ul {
    gap: 17px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_head p {
  font-size: 2rem;
  line-height: 1.25;
}
.ut5-body .nums strong {
  white-space: nowrap;
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5-body .nums .label {
  font-size: 2rem;
  line-height: 1.05;
  color: rgb(161, 161, 161);
}
.ut5_intro3 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro3 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 5.15625% 0px;
}
.ut5_intro3 .content {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.ut5_intro3 .ut5_head {
  width: 50.71%;
}
.ut5_intro3 .ut5_head p {
  color: rgb(161, 161, 161);
  max-width: 73.5rem;
}
.ut5_intro3 .ut5_head .title {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
}
.ut5_intro3 .rt {
  text-align: right;
  position: absolute;
  z-index: 3;
  bottom: 22.5%;
  right: 0px;
}
.ut5_intro3 .rt p {
  margin-left: auto;
}
.ut5_intro3 p {
  margin-top: 5rem;
}
.ut5_intro3 .nums {
  margin-top: 12.15%;
}
.ut5_intro3 .nums li+li {
  margin-top: 6.1321%;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
  .ut5_intro3 .ut5_head .title {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_intro3 .nums {
    margin-top: 3rem;
  }
  .ut5_intro3 p {
    margin-top: 1rem;
  }
  .ut5-body .nums strong {
    font-size: 4rem;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
  .ut5_intro3 .ut5_head .title {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
  .ut5_intro3 .ut5_head .title {
    font-size: 4rem;
  }
  .ut5-body .nums strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_head p {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 10px;
  }
  .ut5-body .nums strong {
    font-size: 26px;
    line-height: 1.66667;
  }
  .ut5-body .nums .label {
    font-size: 12px;
  }
  .ut5_intro3 .con {
    padding: 53px 60px;
  }
  .ut5_intro3 .ut5_head .title {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_intro3 .nums {
    margin-top: 20px;
    margin-bottom: unset;
  }
  .ut5_intro3 .nums li+li {
    margin-top: 17px;
  }
  .ut5_intro3 .rt {
    right: 0px;
    bottom: 15%;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_head p {
    font-size: 12px;
    line-height: 1.5;
  }
  .ut5-body .nums strong {
    font-size: 14px;
  }
  .ut5_intro3 .ut5_head {
    width: 60%;
  }
  .ut5_intro3 .ut5_head .title {
    font-size: 17px;
  }
  .ut5_intro3 .con {
    padding: 34px 17px 35px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}

@media screen and (max-width: 1440px) {
  .ut5_intro3 .rt {
    right: 3rem;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5-body .nums strong {
  white-space: nowrap;
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5-body .nums .label {
  font-size: 2rem;
  line-height: 1.05;
  color: rgb(161, 161, 161);
}
.ut5_intro4 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro4 .wrap {
  position: relative;
}
.ut5_intro4 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 5rem 0px;
  pointer-events: none;
}
.ut5_intro4 .content {
  display: flex;
  align-items: center;
  height: 100%;
}
.ut5_intro4 .ut5_head {
  width: 66.512%;
  pointer-events: all;
}
.ut5_intro4 .nums {
  margin-left: auto;
  min-width: 17.5%;
  max-width: 30%;
  padding-bottom: 4%;
  pointer-events: all;
}
.ut5_intro4 .nums li+li {
  margin-top: 7.2rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5-body .nums strong {
    font-size: 4rem;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
  .ut5-body .nums strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5-body .nums strong {
    font-size: 26px;
    line-height: 1.66667;
  }
  .ut5-body .nums .label {
    font-size: 12px;
  }
  .ut5_intro4 {
    background-color: rgb(23, 23, 23);
    padding: 0px 30px;
  }
  .ut5_intro4 .ut5_head {
    width: 100%;
  }
  .ut5_intro4 .con:has(.ut5_head) {
    position: static;
    padding: 60px 37px 47px;
  }
  .ut5_intro4 .con {
    padding: 35px 20px;
  }
  .ut5_intro4 .nums {
    margin-top: auto;
    padding: 0px;
    max-width: unset;
  }
  .ut5_intro4 .nums li+li {
    margin-top: 16px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5-body .nums strong {
    font-size: 14px;
  }
  .ut5_intro4 {
    padding: 0px 15px;
  }
  .ut5_intro4 .con:has(.ut5_head) {
    padding: 29px 18px 23px;
  }
  .ut5_intro4 .con {
    padding: 23px 16px;
  }
  .ut5_intro4 .ut5_head {
    width: 80%;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5-body .nums strong {
  white-space: nowrap;
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5-body .nums .label {
  font-size: 2rem;
  line-height: 1.05;
  color: rgb(161, 161, 161);
}
.ut5_intro5 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
  background-color: rgb(0, 0, 0);
}
.ut5_intro5 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 5.6rem 0px 14.5rem;
}
.ut5_intro5 .content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.ut5_intro5 .nums {
  margin-top: 3rem;
}
.ut5_intro5 .nums ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}
.ut5_intro5 .nums li {
  text-align: center;
}
.ut5_intro5 .nums .label {
  margin-top: 1.8rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
  .ut5_intro5 .con {
    padding-bottom: 5rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5-body .nums strong {
    font-size: 4rem;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
  .ut5-body .nums strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5-body .nums strong {
    font-size: 26px;
    line-height: 1.66667;
  }
  .ut5-body .nums .label {
    font-size: 12px;
  }
  .ut5_intro5 {
    background-color: rgb(23, 23, 23);
  }
  .ut5_intro5 .con {
    padding: 60px 50px;
  }
  .ut5_intro5 .nums {
    margin-top: 20px;
  }
  .ut5_intro5 .nums ul {
    gap: 10px;
  }
  .ut5_intro5 .nums .label {
    margin-top: 6px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5-body .nums strong {
    font-size: 14px;
  }
  .ut5_intro5 .con {
    padding: 39px 33px 35px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_intro6 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
  background-color: rgb(0, 0, 0);
}
.ut5_intro6 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 14rem 0px 15.2rem;
}
.ut5_intro6 .content {
  display: flex;
  height: 100%;
}
.ut5_intro6 .infos {
  flex: 1 1 0%;
  padding-left: 3.6rem;
}
.ut5_intro6 .infos ul {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  gap: 3rem;
}
.ut5_intro6 .infos li strong {
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5_intro6 .infos li p {
  font-size: 2rem;
  line-height: 1.05;
  color: rgb(161, 161, 161);
  max-width: 52.9rem;
  margin-top: 2.6rem;
}
.ut5_intro6 .infos li:nth-child(2) {
  max-width: 52.3rem;
  margin-left: auto;
}
.ut5_intro6 .infos li:nth-child(3) p {
  max-width: 43rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_intro6 .con {
    padding: 5rem 0px;
  }
  .ut5_intro6 .infos li strong {
    font-size: 4rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_intro6 .infos li strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_intro6 picture {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    height: auto;
  }
  .ut5_intro6 .con {
    position: static;
    padding: 49px 25px 29px 44px;
  }
  .ut5_intro6 .infos {
    padding: 0px;
  }
  .ut5_intro6 .infos ul {
    gap: 14px;
  }
  .ut5_intro6 .infos li strong {
    font-size: 26px;
  }
  .ut5_intro6 .infos li p {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 8px;
    max-width: 350px;
  }
  .ut5_intro6 .infos li:nth-child(3) p {
    max-width: 350px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_intro6 .con {
    padding: 32px 16px 19px 29px;
  }
  .ut5_intro6 .infos ul {
    gap: 50px;
  }
  .ut5_intro6 .infos li strong {
    font-size: 17px;
  }
  .ut5_intro6 .infos li p {
    font-size: 12px;
    max-width: 220px;
  }
  .ut5_intro6 .infos li:nth-child(3) p {
    max-width: 180px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5-body .nums strong {
  white-space: nowrap;
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5-body .nums .label {
  font-size: 2rem;
  line-height: 1.05;
  color: rgb(161, 161, 161);
}
.ut5_intro7 {
  max-width: 2560px;
  margin: -1px auto;
  overflow: hidden;
  position: relative;
  padding: 5.1rem 0px;
}
.ut5_intro7 .wrap {
  position: relative;
  margin-top: 3.5rem;
}
.ut5_intro7 .con {
  position: absolute;
  inset: 0px;
  z-index: 2;
  padding: 5.46875% 0px;
}
.ut5_intro7 .con .content {
  height: 100%;
  display: flex;
  align-items: flex-end;
  max-width: 142.4rem;
}
.ut5_intro7 picture {
  overflow: hidden;
}
.ut5_intro7 .nums {
  width: 100%;
  padding-bottom: 8.6rem;
}
.ut5_intro7 .nums ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5-body .nums strong {
    font-size: 4rem;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
  .ut5_intro7 .nums {
    padding-bottom: 0px;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
  .ut5-body .nums strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5-body .nums strong {
    font-size: 26px;
    line-height: 1.66667;
  }
  .ut5-body .nums .label {
    font-size: 12px;
  }
  .ut5_intro7 {
    padding: 35px 0px 58px;
  }
  .ut5_intro7 .content {
    padding: 0px 35px;
  }
  .ut5_intro7 .con {
    padding: 0px;
  }
  .ut5_intro7 .wrap {
    margin-top: 20px;
  }
  .ut5_intro7 .nums {
    padding: 0px;
  }
  .ut5_intro7 .nums ul {
    gap: 14px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5-body .nums strong {
    font-size: 14px;
  }
  .ut5_intro7 {
    padding: 23px 0px 38px;
  }
  .ut5_intro7 .content {
    padding: 0px 23px;
  }
  .ut5_intro7 .con {
    position: static;
  }
  .ut5_intro7 .nums {
    margin-top: 9px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.img.img_ct img {
  object-fit: contain;
}
.img img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 0.5s;
  aspect-ratio: inherit;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_head p {
  font-size: 2rem;
  line-height: 1.25;
}
.ut5_intro8 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro8 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 5.1rem 0px 8rem;
}
.ut5_intro8 .content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  gap: 3rem;
}
.ut5_intro8 .ut5_head {
  max-width: 97.4rem;
}
.ut5_intro8 .ut5_head p {
  max-width: 90.5rem;
  line-height: 1.6;
}
.ut5_intro8 p {
  margin-top: 2.1rem;
}
.ut5_intro8 .bt .logo {
  width: max-content;
  height: 7.9rem;
}
.ut5_intro8 .speeds {
  margin-top: 3.8rem;
  min-height: 20rem;
  max-width: 71.9rem;
}
.ut5_intro8 .speeds ul {
  display: grid;
  gap: 1.7rem;
}
.ut5_intro8 .speeds li {
  display: grid;
  grid-template-columns: auto 1fr;
  font-size: 2.4rem;
  font-weight: 700;
  white-space: nowrap;
  color: rgb(255, 255, 255);
  line-height: 5.5rem;
  gap: 1.7rem;
}
.ut5_intro8 .speeds span {
  display: inline-block;
  border-radius: 0.5rem;
}
.ut5_intro8 .speeds .label {
  background-color: rgba(116, 116, 116, 0.33);
  min-width: 17.6rem;
  text-align: center;
  padding: 0px 1rem;
}
.ut5_intro8 .speeds .num {
  background-color: rgba(0, 0, 0, 0.5);
  text-align: right;
  overflow: hidden;
  padding: 0px 2.4rem;
  width: 0px;
  color: transparent;
  transition: width 0.3s ease-out;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_head p {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 10px;
  }
  .ut5_intro8 .ut5_head p {
    color: rgb(161, 161, 161);
  }
  .ut5_intro8 .con {
    padding: 25px 42px 47px;
  }
  .ut5_intro8 .bt .logo {
    height: 26px;
  }
  .ut5_intro8 .speeds {
    margin-top: 20px;
    max-width: 268px;
    min-height: unset;
  }
  .ut5_intro8 .speeds ul {
    gap: 6px;
  }
  .ut5_intro8 .speeds li {
    line-height: 20px;
    font-size: 12px;
    gap: 6px;
  }
  .ut5_intro8 .speeds span {
    border-radius: 2px;
  }
  .ut5_intro8 .speeds .label {
    min-width: 66px;
    padding: 0px 5px;
  }
  .ut5_intro8 .speeds .num {
    padding: 0px 9px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_head p {
    font-size: 12px;
    line-height: 1.5;
  }
  .ut5_intro8 .ut5_head h2 {
    width: 60%;
  }
  .ut5_intro8 .con {
    padding: 16px 27px 31px;
  }
  .ut5_intro8 .bt .logo {
    height: 27px;
  }
  .ut5_intro8 .speeds {
    margin-top: 13px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5-body .nums strong {
  white-space: nowrap;
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5-body .nums .label {
  font-size: 2rem;
  line-height: 1.05;
  color: rgb(161, 161, 161);
}
.ut5_intro9 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro9 .wrap {
  position: relative;
}
.ut5_intro9 .wrap .content {
  position: static;
}
.ut5_intro9 .wrap video {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.ut5_intro9 .wrap picture {
  overflow: hidden;
}
.ut5_intro9 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 4.7rem 0px;
  pointer-events: none;
}
.ut5_intro9 .con .content {
  max-width: 171.2rem;
  display: flex;
  height: 100%;
}
.ut5_intro9 .ut5_head {
  position: absolute;
  top: 3.6rem;
  width: 55%;
  z-index: 3;
}
.ut5_intro9 .nums {
  width: 34%;
  pointer-events: all;
  margin-left: auto;
  opacity: 0;
  transition: opacity 0.3s;
}
.ut5_intro9 .nums ul {
  display: grid;
  gap: 3.9rem;
}
.ut5_intro9 .nums strong {
  display: block;
  position: relative;
}
.ut5_intro9 .nums .line {
  display: block;
  width: 0px;
  height: 0.9rem;
  border-radius: 10px;
  content: "";
  background-image: linear-gradient(to right,
      rgb(221, 203, 182),
      rgb(119, 109, 98));
  transition: width 0.5s linear;
  margin: 1.4rem 0px;
}
.ut5_intro9 .nums .label {
  line-height: 1.95;
  color: rgb(255, 255, 255);
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5-body .nums strong {
    font-size: 4rem;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
  .ut5-body .nums strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5-body .nums strong {
    font-size: 26px;
    line-height: 1.66667;
  }
  .ut5-body .nums .label {
    font-size: 12px;
  }
  .ut5_intro9 .content {
    padding: 0px 41px;
  }
  .ut5_intro9 .con {
    padding: 36px 0px;
  }
  .ut5_intro9 .ut5_head {
    top: 36px;
  }
  .ut5_intro9 .nums ul {
    gap: 21px;
  }
  .ut5_intro9 .nums .line {
    height: 3px;
    margin: 5px 0px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5-body .nums strong {
    font-size: 14px;
  }
  .ut5_intro9 .content {
    padding: 0px 34px 0px 24px;
  }
  .ut5_intro9 .ut5_head {
    top: 24px;
  }
  .ut5_intro9 .con {
    position: static;
    padding: 0px 0px 24px;
  }
  .ut5_intro9 .nums {
    width: 100%;
    opacity: 1;
  }
  .ut5_intro9 .nums ul {
    gap: 14px;
  }
  .ut5_intro9 .nums strong {
    font-size: 18px;
  }
  .ut5_intro9 .btn_video {
    position: relative;
  }
  .ut5_intro9 .btn_video::after {
    position: absolute;
    width: 30px;
    height: 30px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    content: "";
    background: url("https://navee.sytech.site/wp-content/plugins/sytech-fronteditor/sytpl/ut5-ultra12-ut5_intro9/assets/img/ut5-play.svg") center center / contain no-repeat;
    z-index: 2;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_intro10 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro10 video {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.ut5_intro10 picture {
  overflow: hidden;
}
.ut5_intro10 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 7.3rem 0px;
}
.ut5_intro10 .content {
  display: flex;
  align-items: flex-end;
  height: 100%;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_intro10 .con {
    padding: 23px 51px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_intro10 .btn_video {
    position: relative;
  }
  .ut5_intro10 .btn_video::after {
    position: absolute;
    width: 30px;
    height: 30px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    content: "";
    background: url("https://navee.sytech.site/wp-content/plugins/sytech-fronteditor/sytpl/ut5-ultra13-ut5_intro10/assets/img/ut5-play.svg") center center / contain no-repeat;
    z-index: 2;
  }
  .ut5_intro10 .con {
    padding: 15px 33px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.img.img_cv {
  overflow: hidden;
}
.img.img_cv img {
  object-fit: cover;
}
.img img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 0.5s;
  aspect-ratio: inherit;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_intro11 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
  background-color: rgb(19, 18, 21);
  padding: 4rem 0px;
}
.ut5_intro11 .content {
  max-width: 180.2rem;
}
.ut5_intro11 .items {
  position: relative;
  padding-bottom: 60.5993%;
}
.ut5_intro11 .items>div {
  position: absolute;
  display: flex;
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px;
  gap: 2rem 1.38735%;
}
.ut5_intro11 .item {
  position: relative;
  flex: 1 1 0%;
  overflow: hidden;
  border-radius: 1rem;
  will-change: transform, opacity;
}
.ut5_intro11 .item:hover img {
  transform: scale(1.02);
}
.ut5_intro11 .item .img {
  height: 100%;
  width: 100%;
}
.ut5_intro11 .item .info {
  position: absolute;
  inset: 0px;
  z-index: 2;
  padding: 7.19178% 10.274%;
}
.ut5_intro11 .item .info strong {
  display: inline-block;
  background-image: var(--text_bg);
  background-clip: text;
  color: transparent;
  font-size: 4.8rem;
  line-height: 1.25;
  font-weight: 500;
}
.ut5_intro11 .item .info p {
  font-size: 2rem;
  line-height: 1.95;
  color: rgb(161, 161, 161);
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_intro11 .item .info strong {
    font-size: 4rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_intro11 .item .info strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_intro11 {
    padding: 10px 15px 12px 14px;
  }
  .ut5_intro11 .item {
    border-radius: 3px;
  }
  .ut5_intro11 .item .info {
    padding: 16px 8px;
  }
  .ut5_intro11 .item .info strong {
    font-size: 19px;
  }
  .ut5_intro11 .item .info p {
    font-size: 14px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .ut5_intro11 {
    padding: 7px 10px 8px 9px;
  }
  .ut5_intro11 .item .info strong {
    font-size: 13px;
  }
  .ut5_intro11 .item .info p {
    font-size: 12px;
    line-height: 1.5;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_head p {
  font-size: 2rem;
  line-height: 1.25;
}
.ut5_intro12 {
  max-width: 2560px;
  margin: -1px auto;
  position: relative;
  overflow: hidden;
}
.ut5_intro12 .con {
  position: absolute;
  inset: 0px;
  z-index: 3;
  padding: 8.5rem 0px;
}
.ut5_intro12 .content {
  display: flex;
  align-items: flex-end;
  height: 100%;
}
.ut5_intro12 .ut5_head p {
  color: rgb(161, 161, 161);
  max-width: 73.5rem;
}
.ut5_intro12 p {
  margin-top: 1rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_head p {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 10px;
  }
  .ut5_intro12 .con {
    padding: 30px 47px;
  }
  .ut5_intro12 .ut5_head {
    max-width: 282px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_head p {
    font-size: 12px;
    line-height: 1.5;
  }
  .ut5_intro12 .con {
    padding: 19px 31px;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
ul {
  list-style: none;
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
li.swiper-slide {
  height: auto;
}
.img.img_cv {
  overflow: hidden;
}
.img.img_cv img {
  object-fit: cover;
}
.img.img_ct img {
  object-fit: contain;
}
.img.img_ab {
  position: relative;
}
.img.img_ab img {
  position: absolute;
  left: 0px;
  top: 0px;
}
.img img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 0.5s;
  aspect-ratio: inherit;
}
.bg_pc,
.bg_mobile {
  width: 100%;
  height: auto;
}
.bg_pc img,
.bg_mobile img {
  width: 100%;
  height: auto;
  display: block;
}
.bg_pc {
  display: block;
}
.bg_mobile {
  display: none;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_essential {
  max-width: 2560px;
  margin: 0px auto;
  position: relative;
  padding-top: 6rem;
}
.ut5_essential .content {
  max-width: 173rem;
}
.ut5_essential .ut5_head h2 {
  font-size: 6.4rem;
}
.ut5_essential .items {
  margin-top: 2.9rem;
}
.ut5_essential .items>div {
  display: grid;
  grid-template-columns: 48.8542% 51.1458%;
}
.ut5_essential .item {
  position: relative;
  overflow: hidden;
}
.ut5_essential .item:nth-child(2n + 1) .info {
  padding: 2.1322% 10.0213%;
}
.ut5_essential .item .img:not(.logo) {
  width: 100%;
  height: 100%;
}
.ut5_essential .item .ut5_essential_swiper,
.ut5_essential .item .swiper-pagination {
  display: none;
}
.ut5_essential .item .info {
  position: absolute;
  color: rgb(255, 255, 255);
  z-index: 2;
  inset: 0px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 2.03666% 6.51731%;
}
.ut5_essential .item .info .logo {
  height: 6.6rem;
  width: auto;
}
.ut5_essential .item .info strong {
  display: block;
  font-size: 4.6rem;
  line-height: 1.41304;
  font-weight: 600;
  max-width: 350px;
}
.ut5_essential .item .info p {
  font-size: 2rem;
  line-height: 1.35;
  margin-top: 1rem;
  max-width: 300px;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
  .ut5_essential .item .info strong {
    font-size: 4rem;
  }
  .ut5_essential .item .info .logo {
    height: 4.5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
  .ut5_essential .item .info strong {
    font-size: 3rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_essential {
    padding-top: 37px;
  }
  .ut5_essential .ut5_head h2 {
    font-size: 26px;
  }
  .ut5_essential .content {
    padding: 0px 49px;
  }
  .ut5_essential .items {
    margin-top: 17px;
  }
  .ut5_essential .item .info {
    padding: 23px 24px;
  }
  .ut5_essential .item .info .logo {
    height: 26px;
  }
  .ut5_essential .item .info strong {
    font-size: 25px;
    line-height: 1.41304;
  }
  .ut5_essential .item .info p {
    font-size: 14px;
    line-height: 1.35;
    margin-top: 9px;
  }
  .ut5_essential .item:nth-child(2n + 1) .info {
    padding: 24px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .bg_pc {
    display: none;
  }
  .bg_mobile {
    display: block;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_essential {
    padding-top: 24px;
  }
  .ut5_essential .content {
    padding: 0px 32px;
  }
  .ut5_essential .items {
    margin-top: 11px;
  }
  .ut5_essential .items .item:nth-child(1),
  .ut5_essential .items .item:nth-child(2),
  .ut5_essential .items .item:nth-child(4) {
    grid-column: 1 / -1;
  }
  .ut5_essential .only_pc {
    display: none;
  }
  .ut5_essential .item .info strong {
    font-size: 16px;
  }
  .ut5_essential .item .info p {
    font-size: 12px;
    max-width: 210px;
  }
  .ut5_essential .item:nth-child(4) {
    padding: 18px 17px 17px;
  }
  .ut5_essential .item:nth-child(4)>.img {
    display: none;
  }
  .ut5_essential .item:nth-child(4) .info {
    position: static;
    padding: 0px;
    height: auto;
  }
  .ut5_essential .item:nth-child(4) .ut5_essential_swiper {
    display: block;
    overflow: hidden;
    border-radius: 11px;
    margin-top: 20px;
  }
  .ut5_essential .item:nth-child(4) .ut5_essential_swiper .img {
    padding-bottom: 56.0204%;
  }
  .ut5_essential .item:nth-child(4) .ut5_essential_swiper .img:hover img {
    transform: scale(1.02);
  }
  .ut5_essential .item:nth-child(5) .info,
  .ut5_essential .item:nth-child(6) .info {
    justify-content: flex-start;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
.center {
  text-align: center;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.img.img_ct img {
  object-fit: contain;
}
.img.img_ab {
  position: relative;
}
.img.img_ab img {
  position: absolute;
  left: 0px;
  top: 0px;
}
.img img {
  width: 100%;
  height: 100%;
  display: block;
  transition: 0.5s;
  aspect-ratio: inherit;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_head p {
  font-size: 2rem;
  line-height: 1.25;
}
.ut5_accessories {
  background-image: linear-gradient(to right bottom,
      rgb(24, 24, 24),
      rgb(41, 41, 41));
  padding: 8.7rem 0px 11.7rem;
}
.ut5_accessories .content {
  max-width: 140.8rem;
}
.ut5_accessories .ut5_head h2 {
  font-size: 4rem;
  color: rgb(255, 255, 255);
}
.ut5_accessories .ut5_head p {
  font-size: 2.4rem;
  margin-top: 2.8rem;
}
.ut5_accessories .items {
  margin-top: 7.9rem;
}
.ut5_accessories .items>div {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.9rem 2rem;
}
.ut5_accessories .items .col2 {
  grid-column: span 2;
}
.ut5_accessories .items .row2 {
  grid-row: span 2;
}
.ut5_accessories .items .col2 .img {
  padding-bottom: 47.2622%;
}
.ut5_accessories .items .col2.row2 .img {
  padding-bottom: 100%;
}
.ut5_accessories .item {
  background-color: rgb(255, 255, 255);
  overflow: hidden;
  position: relative;
}
.ut5_accessories .item:hover img {
  transform: scale(1.02);
}
.ut5_accessories .item .img {
  height: 100%;
  padding-bottom: 102.967%;
}
.ut5_accessories .item .title {
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 0px;
  font-size: 2.4rem;
  font-weight: 500;
  z-index: 2;
  padding: 2rem 1rem 3.5rem 3.4rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
  .ut5_accessories .item .title {
    padding: 1rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_head p {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 10px;
  }
  .ut5_accessories {
    padding: 38px 36px 63px;
  }
  .ut5_accessories .ut5_head h2 {
    font-size: 21px;
  }
  .ut5_accessories .ut5_head p {
    font-size: 13px;
    margin-top: 17px;
  }
  .ut5_accessories .items {
    margin-top: 29px;
  }
  .ut5_accessories .items>div {
    gap: 7px 8px;
  }
  .ut5_accessories .items .title {
    font-size: 12px;
    padding: 12px 10px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_head p {
    font-size: 12px;
    line-height: 1.5;
  }
  .ut5_accessories {
    padding: 25px 17px 41px;
  }
  .ut5_accessories .ut5_head p {
    margin-top: 10px;
  }
  .ut5_accessories .items {
    margin-top: 19px;
  }
  .ut5_accessories .items>div {
    grid-template-columns: 1fr 1fr;
  }
  .ut5_accessories .items .item:nth-child(4),
  .ut5_accessories .items .item:nth-child(5) {
    order: -1;
  }
  .ut5_accessories .items .item:nth-child(1) {
    order: -1;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
:root {
  --primary: #000;
  --secondary: #000;
  --title: #141414;
  --text: #000;
}
html {
  font-size: clamp(7.5px, 0.522vw, 10px);
}
.content {
  max-width: 152.4rem;
  margin: 0px auto;
  position: relative;
}
body {
  color: rgb(0, 0, 0);
  font-size: 1.6rem;
  word-break: break-word;
}
.ut5-body {
  background-color: rgb(0, 0, 0);
  --text_bg: linear-gradient(to bottom, #d9d9d9, #ddc8b0);
}
.ut5-body .content {
  max-width: 169.6rem;
}
.ut5_head {
  color: rgb(255, 255, 255);
}
.ut5_head h2 {
  font-size: 7.2rem;
  line-height: 1.34722;
  display: inline-block;
  background-image: linear-gradient(rgb(255, 255, 255), rgb(221, 200, 176));
  background-clip: text;
  color: transparent;
  font-weight: 500;
}
.ut5_specs {
  color: rgb(255, 255, 255);
  padding: 11.2rem 0px;
  background-color: rgb(23, 23, 23);
}
.ut5_specs .content {
  max-width: 168.4rem;
}
.ut5_specs .ut5_head h2 {
  color: rgb(255, 255, 255);
  font-weight: 700;
  font-size: 3.6rem;
}
.ut5_specs .table {
  overflow: auto;
  margin-top: 7rem;
}
.ut5_specs .table table {
  display: block;
}
.ut5_specs .table table tbody {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.ut5_specs .table table tr {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.ut5_specs .table table tr:nth-child(1),
.ut5_specs .table table tr:nth-child(2) {
  grid-column: span 2;
}
.ut5_specs .table table tr:nth-child(1) td,
.ut5_specs .table table tr:nth-child(2) td {
  font-size: 2.4rem;
  padding: 3rem 0px 3rem 7.12589%;
}
.ut5_specs .table table tr:nth-child(4n + 3),
.ut5_specs .table table tr:nth-child(4n + 4) {
  background-color: rgb(78, 78, 78);
}
.ut5_specs .table table td {
  font-size: 2rem;
  display: flex;
  align-items: center;
  padding: 3.1rem 0px 3.1rem 14.2518%;
}
.ut5_specs .table table td:first-child {
  font-weight: 500;
}
.ut5_specs .note {
  color: rgb(120, 120, 120);
  line-height: 1.5;
  font-size: 1.7rem;
  margin-top: 2rem;
}
@media screen and (max-width: 1220px) {
  .content {
    padding: 0px 30px;
  }
  .ut5_head h2 {
    font-size: 6rem;
  }
}

@media screen and (max-width: 1172px) {
  .content,
  .swiper_content {
    max-width: 1024px;
  }
}

@media screen and (max-width: 1024px) {
  .content,
  .swiper_content {
    max-width: 896px;
  }
  .ut5_head h2 {
    font-size: 5rem;
  }
}

@media screen and (max-width: 896px) {
  .content,
  .swiper_content {
    max-width: 768px;
  }
  .ut5_head h2 {
    font-size: 4rem;
  }
}

@media screen and (min-width: 769px) {
  div::-webkit-scrollbar {
    width: 4px;
  }
  div::-webkit-scrollbar-thumb {
    background: rgb(193, 193, 193);
    border-radius: 10px;
  }
  div::-webkit-scrollbar-track {
    background: rgb(229, 229, 229);
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem;
  }
  .ut5-body .content {
    padding: 0px;
  }
  .ut5_head h2 {
    font-size: 26px;
    line-height: 1.25;
  }
  .ut5_specs {
    padding: 30px 0px;
    background-color: rgb(0, 0, 0);
  }
  .ut5_specs .content {
    padding: 0px 36px;
  }
  .ut5_specs .ut5_head h2 {
    font-size: 22px;
  }
  .ut5_specs .table {
    margin-top: 10px;
  }
  .ut5_specs .table table tr:nth-child(1) td,
  .ut5_specs .table table tr:nth-child(2) td {
    font-size: 14px;
    padding: 10px 0px 10px 20px;
  }
  .ut5_specs .table table td {
    font-size: 12px;
    letter-spacing: 0px;
    padding: 10px 0px 10px 20px;
  }
  .ut5_specs .note {
    font-size: 12px;
    margin-top: 20px;
  }
}

@media screen and (max-width: 576px) {
  .content {
    padding: 0px 20px;
  }
  .ut5_head h2 {
    font-size: 17px;
  }
  .ut5_specs .content {
    padding: 0px 17px;
  }
  .ut5_specs .table table tbody {
    grid-template-columns: 1fr;
  }
  .ut5_specs .table table tr:nth-child(2n + 1) {
    background-color: rgb(78, 78, 78);
  }
  .ut5_specs .table table tr:nth-child(2n) {
    background-color: transparent;
  }
  .ut5_specs .table table tr:nth-child(1),
  .ut5_specs .table table tr:nth-child(2) {
    grid-column: unset;
    background-color: transparent;
  }
}

@media screen and (max-width: 480px) {
  .content {
    padding: 0px 15px;
  }
}