@charset "UTF-8";

/*	reset
-----------------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, embed {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-weight: normal;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

blockquote, q {
  quotes: none;
}

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

input, textarea {
  margin: 0;
  padding: 0;
}

ol, ul {
  list-style: none;
}

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

.video-js {
  overflow-wrap: normal;
}

/*	base
-----------------------------------------*/
body {
  font-size: 88%;
  line-height: 167%;
  color: #222;
  font-family: source-han-sans-japanese, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  min-width: 970px;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
}

button {
  transition: all 0.3s;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  cursor: pointer;
}
button:hover, button:focus {
  opacity: .7;
}

a {
  transition: all 0.3s;
  text-decoration: none;
  color: #06c;
}
a:link, a:visited {
  color: #06c;
}
a:hover, a:focus {
  opacity: .7;
  color: #f00;
}

body {
  min-width: auto;
  min-height: 100vh;
}
#main_content_wrap {
  position: relative;
  overflow: hidden;
  height: 100vh;
}

#main_content_wrap img {
  max-width: 100%;
  vertical-align: middle;
}

#main_content_wrap {
  transition: background-color 1s ease 0s;
}

#main_content_wrap.bg-black {
  background: #000;
}
#main_content_wrap.bg-black .lp_header {
  background-color: #000;
  transition: background-color 0.5s ease 0.8s;
}
#main_content_wrap.bg-black .lp_footer {
  background-color: #000;
  transition: background-color 0.5s ease 0.8s;
}

.of-iconColor-primary {
  fill: #00a23f;
}

@keyframes slide {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* -------------------- lp_header -------------------- */
.lp_header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 30;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  width: 100%;
  height: 77px;
}
.lp_header .logo {
  width: 127px;
}
.lp_header .logo img {
  width: 100%;
}
.lp_header .tel_box {
  z-index: 15;
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: currentColor;
}
.lp_header .tel_box_inner {
  display: flex;
  align-items: center;
  gap: 12px;
}
.lp_header .tel_icon {
  width: 36px;
  min-width: 36px;
  height: 20px;
  min-height: 20px;
}
.lp_header .tel_box .tel_no {
  font-weight: 700;
  font-size: 24px;
}
.lp_header .tel_box .tel_lead {
  font-size: 12px;
  line-height: 1;
}
.bg-black .lp_header .tel_box .tel_no,
.bg-black .lp_header .tel_box .tel_lead {
  color: #fff;
  transition: color 0.5s ease 0.8s;
}

.logo {
  position: relative;
}

.logo a {
  display: block;
}

.logo_img {
  position: absolute;
  top: -50%;
transform: translateY(-50%);
}

.logo_img-white {
  opacity: 0;
  visibility: hidden;
}

.bg-black .logo_img-white {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.5s ease-in-out 0.8s, visibility 0.5s ease-in-out 0.8s;
}
.bg-black .logo_img--black {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-in-out 0.8s, visibility 0.5s ease-in-out 0.8s;
}

/* -------------------- lp_footer -------------------- */
.lp_footer {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 30;
  padding: 10px 20px 13px;
  width: 100%;
  height: 47px;
}
.lp_footer .link {
  display: flex;
  justify-content: center;
  gap: 8px 20px;
  line-height: 1.2;
}
.lp_footer .link li {
  position: relative;
}
.lp_footer .link li,
.lp_footer .link li a {
  color: #333;
  font-size: 13px;
}
.bg-black .lp_footer .link li,
.bg-black .lp_footer .link li a {
  color: #fff;
  transition: color 0.5s ease 0.8s;
}
.lp_footer .link li + li::before {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: -10px;
  width: 1px;
  height: 100%;
  transform: translateY(-50%);
  background-color: currentColor;
  content: "";
}
.lp_footer .link li a:hover {
  text-decoration: underline;
}

/* -------------------- content -------------------- */
.section_wrap {
  position: relative;
  left: -50px;
  z-index: 5;
  visibility: hidden;
  margin: 77px auto 0;
  width: 100%;
  opacity: 0;
  transition: transform 0s ease 0s, opacity 1s ease 0s, visibility 1s ease 0s, left 1s ease 0s;
}
.section_wrap.show {
  left: 0px;
  visibility: visible;
  opacity: 1;
  transition: transform 1s ease 0s, opacity 1s ease 0s, visibility 1s ease 0s, left 1s ease 0s;
}
.lp-figureVideo-video {
  width: 100%;
  max-width: 760px;
  vertical-align: top;
}

/* -------------------- slide_img -------------------- */
.slide_img {
  position: relative;
  width: 100%;
  height: 100%;
}
.slide_img_item {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  opacity: 0;
}
.slide_img_item:not(:first-child) {
  position: absolute;
}
.slide_img_item > img {
  width: 100%;
}
.slide_img.is-show .slide_img_item {
  animation: slide 0.8s ease-out both;
}
.slide_img.is-show .slide_img_item:nth-of-type(1) {
  animation-delay: 1s;
} 
.slide_img.is-show .slide_img_item:nth-of-type(2) {
  animation-delay: 3s;
}
.slide_img.is-show .slide_img_item:nth-of-type(3) {
  animation-delay: 5s;
}
.slide_img.is-show .slide_img_item:nth-of-type(4) {
  animation-delay: 7s;
}

/* -------------------- lp-buttonConversion -------------------- */
.lp-buttonConversion {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 10px 10px 10px 20px;
  background: #dc012f;
  line-height: 1em;
}

.lp-buttonConversion--green {
  padding: 10px 26px;
  background: #137790;
}

.lp-buttonConversion--green::before {
  content: "";
  width: 19px;
  height: 12px;
  border-width: 7px 0 7px 13px;
  margin-right: 5px;
  border-style: solid;
  border-color: transparent transparent transparent #fff;
}

.lp-buttonConversion__icon {
  width: 32px;
  height: 32px;
  fill: #fff;
}

.lp-buttonConversion__txt {
  color: #fff;
  font-size: 20px;
  line-height: 1.5;
  margin-right: 10px;
}

.lp-buttonConversion__img {
  margin: -22px 0;
  
  & img {
    border: 1px solid #ccc;
    min-width: 42px;
    max-width: 60px;
  }
}

/* -------------------- control -------------------- */
.section_control {
  position: fixed;
  top: 0;
  right: -100px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100vh;
  transition: right 0.7s ease 0s;
}
.section_wrap.show + .section_control {
  right: 10px;
}
.section_control .control_list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  margin: 8px 0;
}
.section_control .control_list .list .txt {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: #606565;
  cursor: pointer;
  transition: background-color 0.3s ease 0s;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  color: #fff;
}
.section_control .control_list .list:first-child .txt,
.section_control .control_list .list:last-child .txt {
  height: 47px;
}
.section_control .control_list .list:first-child .txt {
  padding: 20px 0 12px;
  background: linear-gradient(180deg, rgba(96, 101, 101, 0.00) 0%, #606565 100%);
}
.section_control .control_list .list:first-child .txt.ac {
  background: linear-gradient(180deg, rgba(0, 157, 168, 0.00) 0%, #009da8 100%);
}
.section_control .control_list .list:last-child .txt {
  padding: 12px 0 20px;
  background: linear-gradient(180deg, #606565 0%, rgba(96, 101, 101, 0.00) 100%);
}
.section_control .control_list .list:last-child .txt.ac {
  background: linear-gradient(180deg, #009da8 0%, rgba(0, 157, 168, 0.00) 100%);
}
.section_control .control_list .list .txt.ac {
  background: #009da8;
}
.section_control .section_pager {
  position: relative;
  margin: 0 auto;
  width: 38px;
  height: 38px;
  opacity: 1;
  cursor: pointer;
  transition: opacity 1s ease 0s, visibility 1s ease 0s;
}
.section_control .section_pager.hidden {
  visibility: hidden;
  opacity: 0;
}
.section_control .section_pager .btn {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  visibility: visible;
  margin: auto;
  width: 17px;
  height: 10px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='10' viewBox='0 0 17 10' fill='none'%3E%3Cpath d='M0.353516 0.353516L8.35352 8.35352L16.3535 0.353516' stroke='white'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.section_control .section_pager.prev .btn {
  transform: rotate(180deg);
}
.section_control .show_top {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 24px;
  width: 44px;
  padding: 12px 0;
  border: 1px solid #ccc;
  cursor: pointer;
}
.section_control .show_top .txt {
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  color: #fff;
}

/* -------------------- scroll_icon -------------------- */
.scroll_icon {
  position: fixed;
  right: -100px;
  bottom: 50px;
  z-index: 5;
  display: flex;
  visibility: visible;
  align-items: center;
  opacity: 1;
  transition: right 0.7s ease 0s, opacity 1s ease 0s, visibility 1s ease 0s;
  transform: rotate(90deg);
  transform-origin: right;
}
.scroll_icon.hidden {
  visibility: hidden;
  opacity: 0;
}
.section_wrap.show + .section_control + .scroll_icon {
  right: 40px;
}
.scroll_icon .txt {
  margin: 0 15px 3px auto;
  color: #fff;
  text-align: center;
  font-size: 16px;
  line-height: 1em;
}
.scroll_icon .mark {
  position: relative;
  display: block;
  width: 10px;
  height: 20px;
}
.scroll_icon .mark::before,
.scroll_icon .mark::after {
  position: absolute;
  right: 4px;
  display: block;
  width: 2px;
  height: 14px;
  background: #fff;
  content: "";
}
.scroll_icon .mark::before {
  top: -2px;
  transform: rotate(30deg);
}
.scroll_icon .mark::after {
  bottom: -2px;
  transform: rotate(-30deg);
}
.fade_animation {
  transform: scale(-1, 1);
  animation: fade_animation_scroll 0.8s ease-in-out infinite alternate 0s;
}
.fade_animation + .fade_animation {
  animation: fade_animation_scroll 0.8s ease-in-out infinite alternate 0.2s;
}
@keyframes fade_animation_scroll {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* -------------------- js-page-top (PC: hidden) -------------------- */
#js-page-top {
  display: none;
}

/* -------------------- section -------------------- */
.sections {
  position: relative;
  z-index: 0;
  display: flex;
  visibility: visible;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0 min(100vw / (1920 / 60), 60px);
  width: 100%;
  height: calc(100vh - 77px - 47px);
  opacity: 1;
  transition: opacity 0.3s ease 0s, visibility 0.3s ease 0s, left 0.5s ease 0.8s;
}
.sections.ac {
  left: 0%;
  visibility: visible;
  opacity: 1;
  transition: opacity 0.5s ease 0.8s, visibility 0.5s ease 0.8s, left 0.5s ease 0.8s;
}

.section_inner {
  display: grid;
  grid-template-columns: calc(100vw / (1920 / 780)) auto;
  justify-content: center;
  align-items: center;
  gap: 32px min(100vw / (1920 / 48), 48px);
  width: 100%;
}
.section_lead01 {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-size: clamp(1.125rem, 0.115rem + 1.154vw, 1.5rem);
  font-weight: 400;
  margin-bottom: min(100vw / (1920 / 24), 24px); 
  line-height: 1.3;
}
.section_lead01_icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  padding: 8px;
  flex-direction: column;
  flex-shrink: 0;
  border-radius: 40px;
  background: #00636a;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}
.section_title {
  color: #fff;
  font-size: clamp(2.125rem, -0.231rem + 2.692vw, 3rem);
  font-weight: 400;
  line-height: 1.3;
  font-family: source-han-serif-japanese, serif;
}
.section_title--wide {
  margin-bottom: 20px;
}
.section_label_wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 16px;
  max-width: 610px;
  margin-bottom: min(100vw / (1920 / 56), 56px); 
}
.section_label_wrap .section_label {
  border-radius: 4px;
  border: 1px solid #00e8f1;
  padding: 8px 16px;
  color: #00e8f1; 
  font-size:clamp(0.75rem, 0.077rem + 0.769vw, 1rem);
  font-weight: 400;
  line-height: 1.2;
}

.section_lead_wrap_inner {
  align-self: flex-end;
}

.section_lead_wrap {
  align-self: flex-start;
}

.section_btn {
  margin-bottom: min(100vw / (1920 / 32), 32px);
}
.section_cv_area .cv_lead {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: min(100vw / (1920 / 16), 16px);
  font-size: 16px;
  color: #fff;
}
.section_cv_area .cv_lead::after {
  content: '';
  display: block;
  width: 328px;
  height: 1px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='328' height='1' viewBox='0 0 328 1' fill='none'%3E%3Cpath d='M0 0.5H328' stroke='url(%23paint0_linear_1_381)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_1_381' x1='9.14931e-06' y1='1' x2='328' y2='1' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='white'/%3E%3Cstop offset='1' stop-color='white' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}
.section_cv_area .cv_area_inner {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.5rem, 0.000rem + 2.133vw, 1rem);
}

@media (min-width: 1921px) {
  .section_wrap .section_inner {
    grid-template-columns: 780px auto
  }
}
/* -------------------- section_top -------------------- */
.section_top {
  position: absolute;
  top: 0;
  left: 50px;
  z-index: 10;
  visibility: hidden;
  margin-top: 77px;
  width: 100vw;
  height: calc(100vh - 77px - 47px);
  background: url("/img/products/bz-x1000/200188001/200188001_bg_01.png") no-repeat top left #fff;
  background-size: min(100vw / (1920 / 1152), 1152px) auto;
  opacity: 0;
  transition: opacity 1s ease 0s, visibility 1s ease 0s, left 1s ease 0s;
}
.section_top.ac {
  left: 0px;
  visibility: visible;
  opacity: 1;
}
.section_top::before {
  position: absolute;
  top: 0;
  right: 0%;
  z-index: 1;
  display: block;
  width: 150%;
  height: 100%;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 33%, rgba(255, 255, 255, 1) 100%);
  content: "";
  transition: right 1s ease 0.7s;
}
.section_top.ac::before {
  right: -150%;
}
.section_top .mv_content_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
.section_top .mv_content {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 60px;
}
.section_top .mv_img {
  position: relative;
  z-index: 10;
  margin-top: calc(100vw / (1920 / 14));
  margin-right: calc(100vw / (1920 / 32));
}
.product_img {
  margin: 0 auto;
  width: min(100vw / (1920 / 752), 752px);
  text-align: center;
}
.product_name {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1em;
}
.product_name .new_icon {
  display: inline-block;
  margin-right: 15px;
  padding: 7px 20px;
  border: 1px solid #dc002f;
  background: #fff;
  color: #dc002f;
  border-radius: 4px;
  font-size: 20px;
  line-height: 1;
}
.product_name .name {
  display: inline-block;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
}
.section_top .mv_lead {
  position: relative;
  z-index: 10;
  margin-right: calc(100vw / (1920 / 216));
}
.lead {
  font-family: source-han-serif-japanese, serif;
  margin: 0 0 clamp(0.75rem, 0.077rem + 0.769vw, 1rem);
  font-weight: 700;
  font-size: clamp(2.188rem, -1.346rem + 4.038vw, 3.5rem);
  line-height: 1.3;
}
.lead .lead_strong {
  color: #009da8;
  font-weight: 700;
}
.lead_sub {
  margin-bottom: clamp(1.75rem, 1.077rem + 0.769vw, 2rem);
  font-family: source-han-serif-japanese, serif;
  font-size: clamp(1.25rem, 0.577rem + 0.769vw, 1.5rem);
  font-weight: 700;
  line-height: 1.3;
}
.mv_navigation .list {
  position: relative;
  z-index: 0;
}
.mv_navigation .list + .list {
  margin-top: 12px;
}
.mv_navigation .list .txt {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 24px;
  background:  linear-gradient(91deg, #009da8 0%, #00636a 100%);
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  cursor: pointer;
}
@media (hover: hover) {
  .mv_navigation .list .txt:hover {
    background: #00636a;
  }
  .mv_navigation .list .txt:hover .list_num {
    background: #009DA8;
  }
}
.mv_navigation .list .list_num {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  padding: 8px;
  flex-direction: column;
  flex-shrink: 0;
  border-radius: 40px;
  background: #00636a;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  transition: background-color 0.3s ease;
}
.mv_navigation .list .txt::after {
  content: "";
  display: inline-block;
  margin-left: auto;
  width: 15px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='12' viewBox='0 0 15 12' fill='none'%3E%3Cpath d='M7.5 12L13.9952 3L1.00481 3L7.5 12Z' fill='white'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.section_top .mv_btn {
  position: relative;
  z-index: 10;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}
.section_top .mv_btn_sp {
  display: none;
}
.section_visual {
  grid-area: 1 / 1 / span 2;
}
/* -------------------- section_media -------------------- */
.section_media_wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(0.75rem, -0.227rem + 1.23vw, 1.25rem);
  width: 100%;
}

.section_media {
  background-color: #333333;
  border-radius: 4px;
  padding: clamp(0.625rem, -0.108rem + 0.92vw, 1rem);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}
.section_media_heading {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  width: 100%;
  max-width: 368px;
}
.section_media_title {
  font-size: clamp(1.5rem, 0.154rem + 1.538vw, 2rem);
  font-family: source-han-serif-japanese, serif;
  line-height: 1.4;
  color: #fff;
  text-align: center;
  white-space: pre-wrap;
  font-weight: 400;
}
.section_media_tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  align-items: stretch;
  padding: 0 clamp(0.125rem, -0.363rem + 0.62vw, 0.375rem);
}
.section_media_tag {
  display: flex;
  align-items: center;
  border: 1px solid #00e8f1;
  border-radius: 4px;
  padding: clamp(0.125rem, -0.363rem + 0.62vw, 0.375rem) 10px;
  color: #00e8f1;
  font-size: clamp(0.75rem, 0.245rem + 0.577vw, 0.938rem);
  line-height: 1.4;
  font-weight: 400;
  white-space: nowrap;
}
.section_media_content {
  background-color: #5a5a5a;
  border-radius: 4px;
  padding: clamp(0.375rem, -0.358rem + 0.923vw, 0.75rem);
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: stretch;
  width: 100%;
  box-sizing: border-box;
}
.section_media_content_title {
  font-size: clamp(0.625rem, -0.108rem + 0.923vw, 1rem);
  line-height: 1.4;
  color: #fff;
  text-align: center;
  white-space: pre-wrap;
  font-weight: 400;
  width: 100%;
}
.section_media_image {
  width: 100%;
  aspect-ratio: 610 / 200;
  position: relative;
}
.section_media_image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  display: block;
}

.footer-textPhone {
  display: none;
}

/* -------------------- media -------------------- */
@media screen and (min-width: 1921px) {
  .section_lead01 {
    font-size: 28px;
  }
  .section_lead02 {
    margin: 50px 0;
    font-size: 54px;
  }
  .section_cv_area .cv_lead {
    margin-bottom: 25px;
  }

  /* -------------------- section_top -------------------- */
  .section_top {
    background-size: 1152px auto;
  }
  .section_top .mv_img {
    margin-top: 40px;
    margin-right: 30px;
  }
  .section_top .mv_lead {
    margin-right: 100px;
  }
  .section_top .mv_content {
    justify-content: center;
  }
  .lead {
    margin: 0 30px 50px;
    font-size: 62px;
  }
  .mv_navigation .list .txt {
    font-size: 25px;
  }
  .mv_navigation .list .txt::before {
    margin-top: -16px;
    width: 32px;
    height: 32px;
  }
  .section_visual {
    max-width: 760px;
  }
}
@media screen and (min-width: 1270px) and (max-height: 712px) {
  .section_wrap {
    min-height: 700px;
  }
}
@media screen and (min-width: 1271px) and (max-width: 1400px) {
  .section_cv_area .cv_lead {
    margin-bottom: calc(100vw / (1400 / 20));
    font-size: 16px;
  }

  /* -------------------- sections -------------------- */
  .section_lead02 {
    margin: calc(100vw / (1400 / 30)) 0;
    font-size: calc(100vw / (1400 / 38));
    line-height: 1.4em;
  }
  .section_cv_area {
    margin-top: calc(100vw / (1400 / 25));
    padding: 15px 0 25px;
  }
  /* -------------------- section_top -------------------- */
  .section_top {
    background-size: calc(100vw / (1400 / 800)) auto;
  }
  .section_top .mv_img {
    margin-top: 0;
    margin-right: calc(100vw / (1400 / 30));
  }
  .product_img {
    margin: 0 auto;
  }
  .section_top .mv_lead {
    margin-right: calc(100vw / (1400 / 90));
  }
  .lead {
    margin: 0 0 20px;
    font-size: calc(100vw / (1400 / 35));
  }
  .lead_sub {
    font-size: calc(100vw / (1400 / 20));
    margin-bottom: 20px;
  }
  .mv_navigation {
    margin-bottom: calc(100vw / (1400 / 20));
  }
  .mv_navigation .list .txt {
    padding: 16px 24px;
    font-size: calc(100vw / (1400 / 18));
  }
}

@media screen and (max-width: 1270px), screen and (max-height: 690px) {
  body {
    min-height: auto;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  body, html {
    scroll-behavior: auto;
  }
  #main_content_wrap {
    overflow: visible;
    width: auto;
    height: auto;
    transition: none;
  }
  .section_wrap .sections {
    transition: none;
  }
  .section_wrap .sections.ac {
    transition: none;
  }
  .lp_header {
    position: relative;
  }
  .lp_footer {
    position: relative;
    height: auto;
    background-color: #000;
  }
  .lp_footer .link li, .lp_footer .link li a {
    color: #fff;
  }
  .lp_footer .link li + li::before {
    background-color: #fff;
  }
  .section_top {
    position: relative;
    left: 0;
    visibility: visible;
    margin-top: 0;
    padding-bottom: 20px;
    width: auto;
    height: auto;
    opacity: 1;
    transition: opacity 0s ease 0s, visibility 0s ease 0s, left 0s ease 0s;
    padding-bottom: 0;
  }
  .section_top::before {
    display: none;
  }
  .section_top .mv_content {
    padding-top: 60px;
  }
  .section_top .mv_img {
    margin-top: 40px;
    margin-right: 20px;
  }
  .section_top .mv_lead {
    margin-right: clamp(1.25rem, -8.280rem + 19.881vw, 7.5rem);
  }
  .mv_navigation .list .txt {
    font-size: 18px;
    padding: clamp(0.5rem, -0.262rem + 1.59vw, 1rem) clamp(0.75rem, -0.394rem + 2.386vw, 1.5rem);;
  }
  .product_name {
    gap: 15px;
    align-items: center;
    flex-wrap: wrap;
  }
  .product_name .new_icon {
    padding: 6px;
    font-size: 14px;
    margin-right: 0;
  }
  .product_name {
    font-size: 18px;
    padding-left: 12px;
  }
  .lead {
    font-size: clamp(2rem, 1.047rem + 1.988vw, 2.625rem);
  }
  .lead_sub {
    font-size: 18px
  }
  .section_wrap .sections:not(.section_top) {
    background-color: #000;
  }
  .section_top .mv_btn {
    gap: 20px;
    padding: 0 16px;
  }
  .section_lead01 {
    flex-direction: column;
    justify-content: center;
    margin-bottom: 22px;
  }
  .section_title {
    text-align: center;
    margin-bottom: 22px;
  }
  .section_label_wrap {
    justify-content: center;
    margin-inline: auto;
    margin-bottom: 40px;
  }
  .section_label_wrap .section_label {
    font-size: 18px;
  }
  .section_btn {
    text-align: center;
  }
  .section_cv_area .cv_lead {
    justify-content: center;
  }
  .section_cv_area .cv_area_inner {
    justify-content: center;
  }
  .section_media_content_title {
    font-size: 16px;
  }
  .section_media_tag {
    font-size: 16px;
  }
  .section_media_title {
    font-size: clamp(1.625rem, 1.244rem + 0.795vw, 1.875rem);
  }
  .section_wrap {
    left: 0px;
    visibility: visible;
    min-height: auto;
    opacity: 1;
    transition: none;
    transform: none !important;
    will-change: auto;
  }
  .section_wrap.show {
    transition: none;
    transform: none !important;
  }
  .section_wrap .sections {
    padding: 40px 16px;
    min-height: auto;
    height: auto;
    transform: none !important;
    will-change: auto;
  }
  .section_inner {
    display: block;
    width: 100%;
  }
  .section_lead_wrap {
    display: block;
  }
  .section_visual {
    margin: 0 auto;
    margin-bottom: 32px;
    max-width: 760px;
  }
  .section_control,
  .scroll_icon {
    display: none;
  }
}

@media (min-width: 751px) {
  .sp_view {
    display: none;
  }
  .footerTextPhone {
    display: none
  }
}

@media screen and (max-width: 750px) {
  .pc_view {
    display: none;
  }
  /* -------------------- lp_header -------------------- */
  .lp_header .tel_box {
    display: none;
  }

  .lp_header {
    padding: 40px 20px 16px;
  }

  /* -------------------- lp_footer -------------------- */
  .lp_footer {
    padding: 2vw 0;
  }
  .lp_footer .link {
    flex-wrap: wrap;
    text-align: center;
  }
  .lp_footer .link li {
    display: inline-block;
  }
  .lp_footer .link li.copy {
    display: block;
    width: 100%;
    font-size: 13px;
  }
  .lp_footer .link li.copy:before {
    content: none;
  }
  .lp_footer .link li:nth-child(2)::after {
    display: none;
  }
  .tel_box {
    display: none;
  }



  /* sections */
  .section_wrap {
    min-height: 100vh;
    margin-top: 0;
  }
  .sections.ac {
    padding-bottom: 10vw;
  }
  .sections.ac:not(.section_top) {
    padding: 20px 16px 20px;
  }
  .sections.ac {
    transition: none; 
  }
  .section_cv_area {
    margin-top: 24px;
  }
  .section_cv_area .cv_area_inner {
    align-items: center;
    flex-direction: column;
  }
  .section_cv_area .cv_lead {
    margin-bottom: clamp(1rem, 0.000rem + 4.267vw, 2rem);
    justify-content: center;
  }
  .section_btn {
    width: 100%;
    margin-top: 0;
  }

  /* -------------------- section_top -------------------- */
  .section_top {
    padding-bottom: 40px;
    height: auto;
    background: none;
  }
  .section_top .mv_img {
    margin: 0 0 16px;
    width: 100%;
  }
  .product_img {
    width: 100%;
    margin-bottom: 12px;
  }
  .product_name {
    padding: 0 16px;
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
  .product_name .new_icon {
    padding: 5px 16px;
    font-size: clamp(0.875rem, 0.625rem + 1.067vw, 1.125rem);
  }
  .product_name .name {
    display: inline-block;
    font-size: clamp(1rem, 0.750rem + 1.067vw, 1.25rem);
  }
  .section_top .mv_lead {
    margin-right: 0;
    padding: 0 16px;
    width: 100%;
  }
  .lead {
    margin-bottom: clamp(0.5rem, 0.000rem + 2.133vw, 1rem);;
    font-size: clamp(2.375rem, 0.875rem + 6.4vw, 3.875rem);
  }
  .lead_sub {
    font-size: clamp(1.25rem, 0.500rem + 3.2vw, 2rem);
    margin-bottom: 40px;

  }
  .section_top .mv_content {
    flex-direction: column;
    margin-bottom: 0;
    padding-top: 0;
  }
  .mv_navigation .list .txt {
    padding: clamp(0.5rem, 0.000rem + 2.133vw, 1rem) 16px;
    font-size: 4.6vw;
  }
  .mv_navigation .list .txt::before {
    left: 4vw;
    margin-top: -2vw;
    width: 4vw;
    height: 4vw;
  }
  .mv_navigation .list .list_num {
    width: clamp(2rem, 1.500rem + 2.133vw, 2.5rem);
    padding: clamp(0.375rem, 0.250rem + 0.533vw, 0.5rem);
    font-size: clamp(0.875rem, 0.625rem + 1.067vw, 1.125rem);
  }
  .mv_navigation .list .txt {
    font-size: clamp(1rem, 0.500rem + 2.133vw, 1.5rem);
  }
  .section_top .mv_btn_sp {
    display: flex;
  }
  .section_top .mv_btn_pc {
    display: none;
  }
  .section_top .mv_btn {
    gap: 16px;
    flex-direction: column;
    align-items: center;
    margin-bottom: 40px;
    padding: 0;
  }

  .lp-buttonConversion {
    min-width: 343px;
  }

  .lp-buttonConversion__txt {
    margin-right: 16px;
    font-size: clamp(1.125rem, 1.000rem + 0.533vw, 1.25rem);
  }
  .section_lead01_icon {
    width: clamp(2rem, 1.500rem + 2.133vw, 2.5rem);
    padding: clamp(0.375rem, 0.250rem + 0.533vw, 0.5rem);
    font-size: clamp(0.875rem, 0.625rem + 1.067vw, 1.125rem);
  }
  .section_lead01 {
    margin-bottom: clamp(1rem, 0.000rem + 4.267vw, 2rem);
    font-size: clamp(1rem, 0.500rem + 2.133vw, 1.5rem);
  }

  .section_title {
    font-size: clamp(1.5rem, 1.000rem + 2.133vw, 2rem);
    margin-bottom: clamp(1rem, 0.000rem + 4.267vw, 2rem);
  }

  .section_title--small {
    font-size: clamp(1.25rem, 0.750rem + 2.133vw, 1.75rem);
  }

  .section_label_wrap {
    flex-direction: column;
    align-items: center;
    margin-bottom: clamp(2rem, 0.750rem + 5.333vw, 3.25rem);
    max-width: none;
  }

  .section_label_wrap .section_label {
    font-size: clamp(1rem, 0.625rem + 1.6vw, 1.375rem);
  }

  .section_cv_area .cv_lead::after {
    width: 191px;
  }

  .section_media_wrap {
    grid-template-columns: 1fr;
  }

  /* -------------------- section_well_plate -------------------- */
  .section_wrap .sections.section_well_plate .section_inner .section_visual {
    margin-bottom: clamp(1rem, 0.000rem + 4.267vw, 2rem);
    margin-left: 0;
    width: 100%;
  }

  /* section_time_lapse */
  .section_wrap .sections.section_time_lapse .section_inner .section_visual {
    margin-bottom: clamp(1rem, 0.000rem + 4.267vw, 2rem);
  }
  .section_wrap .sections.section_time_lapse .section_inner .section_visual .movie_wrap {
    width: 100%;
    height: calc(100vw / (750 / 382));
  }

  /* section_wide_range */
  .section_wrap .sections.section_wide_range .section_inner .section_visual {
    width: 100%;
  }

  /* -------------------- section_optical_sectioning -------------------- */
  .section_wrap .sections.section_optical_sectioning .section_inner .section_visual {
    margin-bottom: 32px;
    width: 100%;
  }
  .section_media_heading {
    max-width: none;
  }
  .section_media_title {
    font-size: clamp(1.25rem, 0.875rem + 1.6vw, 1.625rem);
  }
  .section_media_tag {
    font-size: 15px;
    padding: 4px 8px;
  }
  .section_media_content_title {
    font-size: clamp(1rem, 0.500rem + 2.133vw, 1.5rem);
  }
  .section_media_content {
    padding: 12px;
  }
  
  .footerTextPhone {
    display: block;
    padding: 16px;
    background-color: #000;
  }
  
  a.footerTextPhone-body {
    text-decoration: none;
    cursor: default;
    color: #fff;
    max-width: 343px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin-inline: auto;
  }
  
  .footerTextPhone-body > *:last-child {
    margin-bottom: 0;
  }
  
  .footerTextPhone-numberGroup {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  
  .footerTextPhone-number {
    font-size: 32px;
    font-weight: bold;
    line-height: 1.45;
    letter-spacing: 0.34px;
  }
  .footerTextPhone-note {
    display: block;
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.41;
  }
  
  .footerTextPhone-icon {
    width: 66px;
    min-width: 66px;
    height: 38px;
    min-height: 38px;
  }
  
  /* -------------------- js-page-top (SP only) -------------------- */
  #js-page-top {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background-color: #fff;
    border-radius: 50px;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  }
  
  #js-page-top.show {
    opacity: 1;
    visibility: visible;
  }
  
  #js-page-top .txt {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    color: #00636a;
    text-align: center;
  }
}