@charset "UTF-8";
/*----------------------------------------------------------------------------

 fonts

----------------------------------------------------------------------------*/
@font-face {
    font-family: 'Noto Serif JP';
    font-style: normal;
    font-weight: 400;
    src: url('../font/NotoSerifJP-Regular.woff2') format('woff2');
    font-display: swap;
}
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 400;
    src: url('../font/NotoSansJP-Regular.woff2') format('woff2');
    font-display: swap;
}
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 500;
    src: url('../font/NotoSansJP-Medium.woff2') format('woff2');
    font-display: swap;
}
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 700;
    src: url('../font/NotoSansJP-Bold.woff2') format('woff2');
    font-display: swap;
}
@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 400;
    src: url('../font/oswald-v53-latin-regular.woff2') format('woff2');
    font-display: swap;
}
/*----------------------------------------------------------------------------

 reset

----------------------------------------------------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
}
ul, ol {
  list-style-type: none;
}
em, strong, th, address {
  font-style: normal;
  font-weight: normal;
  text-align: left;
}
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  font-size: 100%;
}
img,
object,
embed {
  border: 0;
  vertical-align: top;
}
img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
hr {
  display: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 100%;
}
li {
  list-style-type: none;
}
strong {
  font-weight: bold;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
/*----------------------------------------------------------------------------

 CSS Custom Properties 

----------------------------------------------------------------------------*/
:root {

}
/*----------------------------------------------------------------------------

 base

----------------------------------------------------------------------------*/
html {
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%;
}
body {
  position: relative;
  color: #000;
  font-family: 'Noto Sans JP', sans-serif;
  line-height: 1;
  font-size: 1.6rem;
  background: #fff;
}
.serif {
  font-family: 'Noto Serif JP', serif;
}
.font_1 {
  font-family: 'Oswald', sans-serif;
}
.sp,
.sp_inline {
  display: none;
}
.pc {
  display: block;
}
@media screen and (max-width: 640px) {
  .sp {
    display: block;
  }
  .sp_inline {
    display: inline;
  }
  .pc {
    display: none;
  }
}
/*----------------------------------------------------------------------------

 fadein

----------------------------------------------------------------------------*/
.fadein {
  opacity : 0;
  transition : opacity 1.5s cubic-bezier(0.33, 1, 0.68, 1);
}
.fadein.scrollin {
  opacity : 1;
}
.fadein_y {
  opacity : 0;
  transform : translate3d(0, 40px, 0);
  transition : transform 1s cubic-bezier(0.33, 1, 0.68, 1), opacity 1s cubic-bezier(0.33, 1, 0.68, 1);
}
.fadein_y.scrollin {
  opacity : 1;
  transform : translate3d(0, 0, 0);
}
.fadein_y02 {
  opacity : 0;
  transform : translate3d(0, -40px, 0);
  transition : transform 1s cubic-bezier(0.33, 1, 0.68, 1), opacity 1s cubic-bezier(0.33, 1, 0.68, 1);
}
.fadein_y02.scrollin {
  opacity : 1;
  transform : translate3d(0, 0, 0);
}
.fadein_up {
  opacity : 0;
  margin-bottom: -5%;
  transition: margin-bottom 1s cubic-bezier(0.33, 1, 0.68, 1), opacity 1s cubic-bezier(0.33, 1, 0.68, 1);
}
.fadein_up.scrollin {
  opacity: 1;
  margin-bottom: 0;
}
.fadein_x {
  opacity : 0;
  transform : translate3d(50px, 0, 0);
  transition : transform 1s cubic-bezier(0.33, 1, 0.68, 1),opacity 1s cubic-bezier(0.33, 1, 0.68, 1);
}
.fadein_x.scrollin {
  opacity : 1;
  transform : translate3d(0, 0, 0);
}
.fadein_x02 {
  opacity : 0;
  transform : translate3d(-50px, 0, 0);
  transition : transform 1s cubic-bezier(0.33, 1, 0.68, 1) ,opacity 1s cubic-bezier(0.33, 1, 0.68, 1);
}
.fadein_x02.scrollin {
  opacity : 1;
  transform : translate3d(0, 0, 0);
}
.fadein_scale {
  opacity : 0;
  transform : scale(1.2);
  transition : transform 1s cubic-bezier(0.33, 1, 0.68, 1), opacity 1s cubic-bezier(0.33, 1, 0.68, 1);
}
.fadein_scale.scrollin {
  opacity : 1;
  transform : scale(1);
}
/*-------------------------------------------------

img animation

--------------------------------------------------*/
.wipe_img {
  position: relative;
  overflow: hidden;
}
.wipe_img::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ede2cc;
  clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
  transition: clip-path 1.4s cubic-bezier(0,.85,.15,1) 0s;
}
.wipe_img.scrollin::before {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
.wipe_img img {
  position: relative;
  clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
  transition: clip-path 1.2s cubic-bezier(0,.85,.15,1) .4s;
}
.wipe_img.scrollin img {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
.wipe_img.a2::before {
  clip-path: none;
}
.wipe_img.a2 img {
  clip-path: none;
  transform: scale(1.05);
  opacity: 0;
  transition: transform 3.5s cubic-bezier(0,.85,.15,1) 0s, opacity 1.5s cubic-bezier(0,.85,.15,1) 0s;
}
.wipe_img.a2.scrollin img {
  opacity: 1;
  transform: scale(1.00);
}
/*-------------------------------------------------

mfp

--------------------------------------------------*/
/* mfp-bg（overlay） */
.mfp-bg {
  opacity: 0;
  transition: all 0.2s ease-out;
}
.mfp-bg.mfp-ready {
  opacity: 0.8;
}
.mfp-bg.mfp-removing {
  opacity: 0;
}
/* mfp-content */
.mfp-wrap .mfp-content {
  opacity: 0;
  transition: all 0.2s ease-out;
}
.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}
/*-------------------------------------------------

slick

--------------------------------------------------*/
.slick-list,
.slick-track {
  height: 100%;
}
.slick-dotted.slick-slider {
  margin-bottom: 0;
}

/*-------------------------------------------------

main

--------------------------------------------------*/
.main {
  display: block;
  overflow: hidden;
}
/*-------------------------------------------------

.common_btn

--------------------------------------------------*/
a.common_btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: min(17.4vw,335px);
  height: 2.5em;
  color: #fff;
  font-size: 2.4rem;
  font-size: clamp(1.4rem,1.4vw,2.4rem);
  background: #000;
  line-height: 1;
  text-decoration: none;
  text-align: left;
  letter-spacing: 0.15em;
}
a.common_btn > span[data-label] {
  position: relative;
  display: block;
  padding-left: 1em;
  /*
  overflow: hidden;
  */
}
a.common_btn span[data-label] span {
  display: block;
  transition: opacity .2s ease-in-out, transform .2s ease-in-out;
}
a.common_btn:hover span[data-label] span {
  opacity: 0;
  transform: translateY(-100%);
  transition: opacity .2s ease-in-out .1s, transform .2s ease-in-out .1s;
}
a.common_btn > span[data-label]::after {
  content: attr(data-label);
  display: block;
  position: absolute;
  bottom: 0;
  top: 0;
  width: 100%;
  opacity: 0;
  transform: translateY(100%);
  transition: opacity .2s ease-in-out, transform .2s ease-in-out;
}
a.common_btn:hover span[data-label]:after {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .2s ease-in-out .1s, transform .2s ease-in-out .1s;
}
a.common_btn::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 7.5%;
  width: 3.5%;
  aspect-ratio: 13 / 23;
  background: url(../img/icon_right.svg) center center no-repeat;
  background-size: contain;
  transform: translateY(-50%);
}
a.common_btn::before {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 0%;
  background: rgba(255, 255, 255, .4);
  transition: height .2s ease-in-out;
}
a.common_btn:hover::before {
  height: 100%;
  transition: height .2s ease-in-out .1s;
}
@media screen and (max-width: 640px) {
  a.common_btn {
    width: max(53.333vw,200px);
    height: 2.65em;
    font-size: max(3.733vw,1.4rem);
  }
}
/*-------------------------------------------------

about_btn

--------------------------------------------------*/
#about_btn {
  position: fixed;
  bottom: 135px;
  left: 0;
  line-height: 1;
  z-index: 5;
  transform: rotate(90deg) translateX(-100%);
  transform-origin: left bottom;
}
#about_btn .btn {
  position: relative;
}
#about_btn .btn a {
  display: inline-block;
  padding: 1.25em 1.75em;
  color: #fff;
  font-size: 2.0rem;
  font-size: clamp(1.0rem,1vw,2.0rem);
  letter-spacing: .05em;
  text-decoration: none;
  text-align: center;
  background: #000;
  transition: opacity .1s ease-in-out;
}
#about_btn .btn a > span[data-label] {
  position: relative;
  display: block;
  /*
  overflow: hidden;
  */
}
#about_btn .btn a span[data-label] span {
  display: block;
  transition: opacity .2s ease-in-out, transform .2s ease-in-out;
}
#about_btn .btn a:hover span[data-label] span {
  opacity: 0;
  transform: translateY(-100%);
  transition: opacity .2s ease-in-out .1s, transform .2s ease-in-out .1s;
}
#about_btn .btn a > span[data-label]::after {
  content: attr(data-label);
  display: block;
  position: absolute;
  bottom: 0;
  top: 0;
  width: 100%;
  opacity: 0;
  transform: translateY(100%);
  transition: opacity .2s ease-in-out, transform .2s ease-in-out;
}
#about_btn .btn a:hover span[data-label]:after {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .2s ease-in-out .1s, transform .2s ease-in-out .1s;
}
#about_btn .btn a::before {
  content: '';
  position: absolute;
  /*
  top: 0;
  */
  bottom: 0;
  right: 0;
  width: 100%;
  height: 0%;
  background: rgba(255, 255, 255, .4);
  transition: height .2s ease-in-out;
}
#about_btn .btn a:hover::before {
  /*
  top: auto;
  bottom: 0;
  */
  height: 100%;
  transition: height .2s ease-in-out .1s;
}
/*
@media screen and (max-width: 640px) {
  #about_btn {
    bottom: 0;
    left: 0;
    transform: none;
  }
  #about_btn .btn a {
    font-size: max(2.66vw,1.0rem);
  }
}
*/
/*-------------------------------------------------

 kv

--------------------------------------------------*/
#kv {
  position: relative;
  width: 100%;
  padding: 0;
  line-height: 1;
  aspect-ratio: 1920 / 1080;
  background: #f5f5f5;
  z-index: 3;
  height: 100vh;
  height: 100svh;
}
#kv .bg {

}
#kv.scrollin .bg {
  opacity: 1;
}
#kv .wrapper,
#kv .outer,
#kv .inner {
  position: relative;
  width: 100%;
  height: 100%;
}
#kv .kv_slide_list {
  height: 100%;
}
.slick-prev,
.slick-next {
  top: auto;
  right: auto;
  bottom: 4%;
  width: 50px;
  height: 50px;
  transform: none;
  background: #000 url(../img/kv_slide_nav_left.svg) 46% center no-repeat !important;
  background-size: 11px auto !important;
  border-radius: 50%;
  transition: opacity .1s ease-in-out;
  z-index: 1;
}
.slick-prev {
  left: 5%;
}
.slick-next {
  left: calc(5% + 60px);
  z-index: 1;
}
@media (hover: hover) {
  .slick-prev:hover,
  .slick-next:hover {
    opacity: 0.5;
    transition: opacity .1s ease-in-out .1s;
  }
}
.slick-next {
  transform: rotate(180deg);
}
.slick-prev:before,
.slick-next:before {
  display: none;
}
.slick-prev.slick-disabled,
.slick-next.slick-disabled {
  opacity: 0.5;
  cursor: default;
}
@media screen and (max-width: 1024px) and (orientation: portrait) {
  .slick-prev {
    left: 6%;
  }
  .slick-next {
    left: calc(6% + 60px);
  }
}
@media screen and (max-width: 640px) {
  .slick-prev,
  .slick-next {
    bottom: auto;
    top: 20px;
    width: 30px;
    height: 30px;
    background: #000 url(../img/kv_slide_nav_left.svg) 46% center no-repeat !important;
    background-size: 6px auto !important;
  }
  .slick-prev {
    left: auto;
    right: calc(20px + 40px);
  }
  .slick-next {
    left: auto;
    right: 20px;
  }
}

/* --
  prospex, king seiko
-- */
#kv .kv_slide_list .ohtani-slide {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
#kv .kv_slide_list .ohtani-slide.ks202506 {
  background-color: #111732;
}
#kv .kv_slide_list .ohtani-slide.psx202506 {
  background-color: #959595;
}
#kv .kv_slide_list .ohtani-slide .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
}
#kv .kv_slide_list .ohtani-slide.psx202506 .bg {
  background: url(../img/kv_slide_psx202506_bg.webp) 50% 15% no-repeat;
  background-size: cover;
}
#kv .kv_slide_list .ohtani-slide.ks202506 .bg {
  background: url(../img/kv_slide_ks202506_bg.webp) 30% 30% no-repeat;
  background-size: cover;
}
#kv .kv_slide_list .ohtani-slide.slick-animation .bg {
  animation: showTimeBg 5s forwards 0.2s;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes showTimeBg {
  0% { opacity: 0; }
	100% { opacity: 1;}
}
#kv .kv_slide_list .ohtani-slide .watch {
  display: flex;
  align-items: center;
  position: absolute;
  opacity: 0;
}
#kv .kv_slide_list .ohtani-slide.ks202506 .watch {
  width: calc(335 / 1920 * 100vw);
  height: 100%;
  bottom: 0;
  top: 0;
  left: calc(860 / 1920 * 100vw);
}
#kv .kv_slide_list .ohtani-slide.psx202506 .watch {
  width: calc(371 / 1920 * 100vw);
  height: 100%;
  bottom: 0;
  top: 0;
  left: calc(134 / 1920 * 100vw);
}
#kv .kv_slide_list .ohtani-slide.slick-animation .watch {
  animation: showTimeWatch 2s forwards 1.5s;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes showTimeWatch {
  0% { opacity: 0; }
	100% { opacity: 1;}
}
#kv .kv_slide_list .ohtani-slide .copy {
  display: flex;
  align-items: center;
  position: absolute;
  opacity: 0;
}
#kv .kv_slide_list .ohtani-slide .copy img {
	max-width: initial;
	width: 100%;
}
#kv .kv_slide_list .ohtani-slide.ks202506 .copy {
  width: calc(470 / 1920 * 100vw);
  height: 100%;
  top: 0;
  left: calc(1280 / 1920 * 100vw);
  padding-bottom: 1vw;
}
#kv .kv_slide_list .ohtani-slide.psx202506 .copy {
  width: calc(480 / 1920 * 100vw);
  height: 100%;
  bottom: 0;
  left: calc(550 / 1920 * 100vw);
  padding-top: 5.25vw;
}
#kv .kv_slide_list .ohtani-slide.slick-animation .copy {
  animation: showTimeCopy 2s forwards 2.25s;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes showTimeCopy {
  0% { opacity: 0; }
	100% { opacity: 1;}
}
@media screen and (max-width: 1024px) and (orientation: portrait) {
  #kv .kv_slide_list .ohtani-slide.ks202506 .bg {
    background: url(../img/kv_slide_ks202506_bg.webp) 15% 70% no-repeat;
    background-size: cover;
  }
  #kv .kv_slide_list .ohtani-slide.psx202506 .bg {
    background: url(../img/kv_slide_psx202506_bg.webp) 70% 70% no-repeat;
    background-size: cover;
  }
  #kv .kv_slide_list .ohtani-slide .watch {
    width: 34%;
  }
  #kv .kv_slide_list .ohtani-slide .copy {
    width: 34%;
    padding-top: 35vw;
  }
  #kv .kv_slide_list .ohtani-slide.ks202506 .kv_wrapper {
	  display: flex;
	  flex-direction: column-reverse;
		align-items: center;
		justify-content: center;
		position: absolute;
    left: 61vw;
    top: 0;
		width: 28vw;
    height: 100%;
  }
  #kv .kv_slide_list .ohtani-slide.psx202506 .kv_wrapper {
	  display: flex;
	  flex-direction: column-reverse;
		align-items: center;
		justify-content: center;
		position: absolute;
    top: 0;
    left: 8vw;
		width: 28vw;
    height: 100%;
  }
  #kv .kv_slide_list .ohtani-slide.ks202506 .watch {
    width: 85%;
    height: auto;
    position: relative;
    left: 0;
    top: 0;
    padding-top: 5vw;
    padding-left: 2vw;
  }
  #kv .kv_slide_list .ohtani-slide.ks202506 .copy,
  #kv .kv_slide_list .ohtani-slide.psx202506 .copy {
    width: 100%;
    height: auto;
		position: relative;
		left: 0;
		top: 0;
		padding: 0;
  }
  #kv .kv_slide_list .ohtani-slide.psx202506 .watch {
    width: 85%;
    height: auto;
    position: relative;
    left: 0;
    top: 0;
    padding-top: 5vw;
    padding-left: 2vw;
  }
}
@media screen and (max-width: 640px) {
  #kv .kv_slide_list .ohtani-slide.psx202506 .bg {
    background: url(../img/kv_slide_psx202506_bg_sp.webp) 0 center no-repeat;
    background-size: cover;
  }
  #kv .kv_slide_list .ohtani-slide.ks202506 .bg {
    background: url(../img/kv_slide_ks202506_bg_sp.webp) 0 center no-repeat;
    background-size: cover;
  }
  #kv .kv_slide_list .ohtani-slide .kv_wrapper {
	  display: none !important;
	}
}

/* --
  brand
-- */
#kv .kv_slide_list .brand {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: url(../img/kv_slide_bland_bg.webp) center top no-repeat;
  background-size: cover;
  opacity: 0;
  overflow: hidden;
}
#kv .kv_slide_list .brand.slick-animation {
  opacity: 1;
}
#kv .kv_slide_list .brand .lines {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#kv .kv_slide_list .brand .lines::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom,rgba(255,255,255,1) 0%, rgba(255,255,255,0) 45%);
}
#kv .kv_slide_list .brand .lines .line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: translateZ(0);
}
#kv .kv_slide_list .brand .lines .line.line1 {
  left: -100%;
  background: linear-gradient(to left,rgba(236,240,247,.5) 0%, rgba(236,240,247,0) 25%);
}
#kv .kv_slide_list .brand.slick-animation .lines .line.line1 {
  animation: line1 8s infinite;
  animation-timing-function: linear;
  animation-delay: 5s;
}
#kv.pause .kv_slide_list .brand.slick-animation .lines .line.line1 {
  animation-play-state: paused ;
}
@keyframes line1 {
  0% { left: -100%; }
	80% { left: 50%; }
	100% { left: 50%; }
}
#kv .kv_slide_list .brand .lines .line.line2 {
  top: auto;
  bottom: -100%;
  background: linear-gradient(to bottom,rgba(236,240,247,.5) 0%, rgba(236,240,247,0) 25%);
}
#kv .kv_slide_list .brand.slick-animation .lines .line.line2 {
  animation: line2 6s infinite;
  animation-timing-function: linear;
  animation-delay: 6.5s;
}
#kv.pause .kv_slide_list .brand.slick-animation .lines .line.line2 {
  animation-play-state: paused ;
}
@keyframes line2 {
  0% { bottom: -100%; }
	100% { bottom: 50%; }
}
#kv .kv_slide_list .brand .lines .line.line3 {
  left: auto;
  right: -100%;
  background: linear-gradient(to right,rgba(236,240,247,.5) 0%, rgba(236,240,247,0) 25%);
}
#kv .kv_slide_list .brand.slick-animation .lines .line.line3 {
  animation: line3 8s infinite;
  animation-timing-function: linear;
  animation-delay: 8s;
}
#kv.pause .kv_slide_list .brand.slick-animation .lines .line.line3 {
  animation-play-state: paused ;
}
@keyframes line3 {
  0% { right: -100%; }
	70% { right: 50%; }
	100% { right: 50%; }
}
#kv .kv_slide_list .brand .lines .line.line4 {
  background: linear-gradient(to top,rgba(236,240,247,.5) 0%, rgba(236,240,247,0) 25%);
}
#kv .kv_slide_list .brand.slick-animation .lines .line.line4 {
  animation: line4 8s infinite;
  animation-timing-function: linear;
  animation-delay: 6s;
}
#kv.pause .kv_slide_list .brand.slick-animation .lines .line.line4 {
  animation-play-state: paused ;
}
@keyframes line4 {
  0% { top: -100%; }
	100% { top: 50%; }
}

#kv .kv_slide_list .brand .bg_map {
  position: absolute;
  top: 0;
  left: 5.5vw;
  width: 41.875%;
  height: 100%;
  background: url(../img/bg_map.webp) center 60% no-repeat;
  background-size: 100% auto;
}
#kv .kv_slide_list .brand .li_inner {
  position: relative;
  display: flex;
  align-items: center;
  width: 65.3125vw;
}
#kv .kv_slide_list .brand .li_inner .ttl_box {
  position: relative;
  width: 26.458vw;
}
#kv .kv_slide_list .brand .ttl_box .txt {
  position: relative;
  margin-bottom: 2.6vw;
  font-size: min(1.25vw,24px);
  font-weight: bold;
  line-height: 2;
  letter-spacing: 0.1em;
  opacity: 0;
}
#kv .kv_slide_list .brand .ttl_box .logo {
  position: relative;
  width: 18.23vw;
  margin-bottom: 1.56vw;
  opacity: 0;
}
#kv .kv_slide_list .brand .li_inner .brand_box {
  position: relative;
  flex: 1;
  height: 36.458vw;
}
#kv .kv_slide_list .brand .brand_box .panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  opacity: 0;
}
#kv .kv_slide_list .brand .brand_box .panel .logo {
  width: 15.625vw;
  margin-bottom: 1vw;
  opacity: 0;
  transform: translateX(20%);
}
#kv .kv_slide_list .brand .brand_box .panel .watch {
  position: relative;
  opacity: 0;
  transform: translateX(-20%);
}
#kv .kv_slide_list .brand .brand_box .panel.panel_presage .watch {
  width: calc(405 / 1920 * 100vw);
}
#kv .kv_slide_list .brand .brand_box .panel.panel_astron .watch {
  width: calc(430 / 1920 * 100vw);
  margin-right: -4%;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_prospex .watch {
  width: calc(403 / 1920 * 100vw);
}
#kv .kv_slide_list .brand .brand_box .panel.panel_king_seiko .watch {
  width: calc(393 / 1920 * 100vw);
}
#kv .kv_slide_list .brand .brand_box .panel .watch img {
  position: relative;
  width: 100%;
}
#kv .kv_slide_list .brand .brand_box .panel .watch::before {
  content: '';
  position: absolute;
  opacity: 0;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_presage .watch::before {
  top: 1.5%;
  left: 3%;
  width: 113.333%;
  aspect-ratio: 918 / 1362;
  background: url(../img/kv_slide_watch_presage_sh_202506.webp) right center no-repeat;
  background-size: cover;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_astron .watch::before {
  top: -1.95%;
  left: 4%;
  width: 111.860%;
  aspect-ratio: 962 / 1410;
  background: url(../img/kv_slide_watch_astron_sh_202506.webp) right center no-repeat;
  background-size: cover;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_prospex .watch::before {
  top: -4%;
  left: -11%;
  width: 129.032%;
  aspect-ratio: 1040 / 1638;
  background: url(../img/kv_slide_watch_prospex_sh_202506.webp) right center no-repeat;
  background-size: cover;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_king_seiko .watch::before {
  top: -1.65%;
  left: 4.5%;
  width: 113.486%;
  aspect-ratio: 892 / 1276;
  background: url(../img/kv_slide_watch_kingseiko_sh_202506.webp) right center no-repeat;
  background-size: cover;
}

#kv .kv_slide_list .brand.slick-animation .ttl_box .txt  {
  animation: txtFadein 1.5s forwards 2.5s;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
#kv .kv_slide_list .brand.slick-animation .ttl_box .logo  {
  animation: txtFadein 1.5s forwards 3.5s;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes txtFadein {
  0% { opacity: 0; }
	100% { opacity: 1;}
}

/* panel animation */
#kv .kv_slide_list .brand.slick-animation .brand_box .panel {
  animation: panelTrans 24s infinite;
}
#kv.pause .kv_slide_list .brand.slick-animation .brand_box .panel {
  animation-play-state: paused;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_king_seiko {
  animation-delay: 5s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_prospex {
  animation-delay: 11s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_astron {
  animation-delay: 17s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_presage {
  animation-delay: 23s;
}
@keyframes panelTrans {
  0% { opacity: 1; }
	21% { opacity: 1;}
  26% { opacity: 0;}
  100% { opacity: 0;}
}

/* panel logo animation */
#kv .kv_slide_list .brand.slick-animation .brand_box .panel .logo {
  animation: panelLogoTrans 24s infinite;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
#kv.pause .kv_slide_list .brand.slick-animation .brand_box .panel .logo {
  animation-play-state: paused;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_king_seiko .logo {
  animation-delay: 5s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_prospex .logo {
  animation-delay: 11s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_astron .logo {
  animation-delay: 17s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_presage .logo {
  animation-delay: 23s;
}
@keyframes panelLogoTrans {
  0% { opacity: 0; transform: translateX(20%);}
  2% { opacity: 0; transform: translateX(20%);}
  12% { opacity: 1; transform: translateX(0%);}
  100% { opacity: 1; transform: translateX(0%);}
}

/* panel watch animation */
#kv .kv_slide_list .brand.slick-animation .brand_box .panel .watch {
  animation: panelWatchTrans 24s infinite;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
#kv.pause .kv_slide_list .brand.slick-animation .brand_box .panel .watch {
  animation-play-state: paused;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_king_seiko .watch {
  animation-delay: 5s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_prospex .watch {
  animation-delay: 11s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_astron .watch {
  animation-delay: 17s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_presage .watch {
  animation-delay: 23s;
}
@keyframes panelWatchTrans {
  0% { opacity: 0; transform: translateX(-20%);}
  10% { opacity: 1; transform: translateX(0%);}
  100% { opacity: 1; transform: translateX(0%);}
}

/* panel watch shadow animation */
#kv .kv_slide_list .brand.slick-animation .brand_box .panel .watch::before {
  animation: panelWatchShadowTrans 24s infinite;
}
#kv.pause .kv_slide_list .brand.slick-animation .brand_box .panel .watch::before {
  animation-play-state: paused;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_king_seiko .watch::before {
  animation-delay: 5s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_prospex .watch::before {
  animation-delay: 11s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_astron .watch::before {
  animation-delay: 17s;
}
#kv .kv_slide_list .brand .brand_box .panel.panel_presage .watch::before {
  animation-delay: 23s;
}
@keyframes panelWatchShadowTrans {
  0% { opacity: 0;}
  8% { opacity: 0;}
  18% { opacity: 1;}
  100% { opacity: 1;}
}

@media screen and (max-width: 640px) {
  #kv {
    aspect-ratio: 750 / 1250;
    height: auto;
  }
  #kv .kv_slide_list .brand {
    align-items: flex-end;
    padding-bottom: max(4vw,15px);
    background: url(../img/kv_slide_bland_bg_sp.webp) center top no-repeat;
    background-size: cover;
  }
  #kv .kv_slide_list .brand .bg_map {
    top: 12vw;
    left: 4vw;
    width: 92%;
    height: 100%;
    background: url(../img/bg_map.webp) center -4% no-repeat;
    background-size: 100% auto;
  }
  #kv .kv_slide_list .brand .li_inner {
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
  }
  #kv .kv_slide_list .brand .li_inner .ttl_box {
    width: 100%;
    margin-bottom: max(13.33vw,50px);
  }
  #kv .kv_slide_list .brand .ttl_box .txt {
    margin-bottom: max(6vw,23px);
    font-size: max(3.73vw,1.4rem);
    text-align: center;
    line-height: 1.4;
  }
  #kv .kv_slide_list .brand .ttl_box .logo {
    width: max(44.53vw,167px);
    margin: 0 auto;
  }
  #kv .kv_slide_list .brand .li_inner .brand_box {
    width: 100%;
    height: 83.333vw;
    flex: none;
  }
  #kv .kv_slide_list .brand .brand_box .panel {
    flex-direction: column-reverse;
    justify-content: flex-end;
  }
  #kv .kv_slide_list .brand .brand_box .panel .logo {
    width: max(26.66vw,100px);
    margin: 5vw 0 0;
  }
  #kv .kv_slide_list .brand .brand_box .panel.panel_king_seiko .watch {
    width: max(34.66vw,130px);
  }
  #kv .kv_slide_list .brand .brand_box .panel.panel_prospex .watch {
    width: max(34.66vw,130px);
  }
  #kv .kv_slide_list .brand .brand_box .panel.panel_astron .watch {
    width: max(34.66vw,130px);
    margin-right: 0;
  }
  #kv .kv_slide_list .brand .brand_box .panel.panel_presage .watch {
    width: max(34.66vw,130px);
  }
}
/*-------------------------------------------------

campaign

--------------------------------------------------*/
#campaign {
  position: relative;
  padding: 60px 0;
  background: #000;
  overflow: hidden;
}
#campaign .outer {
  padding: 0 60px;
}
#campaign .inner {
  max-width: 1802px;
  margin: auto;
}
#campaign .inner a {
  display: block;
  transition: opacity .1s ease-in-out;
}
#campaign .inner a:hover {
  opacity: 0.75;
  transition: opacity .1s ease-in-out .1s;
}
@media screen and (max-width: 1200px) {
  #campaign {
    padding: 5vw 0;
  }
  #campaign .outer {
    padding: 0 5vw;
  }
}
@media screen and (max-width: 640px) {
  #campaign {
    padding: max(5.33vw,20px) 0;
  }
  #campaign .outer {
    padding: 0 max(5.33vw,20px);
  }

}
/*-------------------------------------------------

lead

--------------------------------------------------*/
#lead {
  position: relative;
  padding: min(5.21vw,100px) 0;
  color: #fff;
  background: #000 url(../img/lead_bg.webp) center center repeat-y fixed;
  background-size: 100% auto;
  overflow: hidden;
  z-index: 2;
}
#lead .bg {

}
#lead .outer {
  position: relative;
}
#lead .inner {
  position: relative;
}
#lead .main_ttl {
  margin-bottom: min(3.8vw,80px);
  text-align: center;
}
#lead .main_ttl img {
  width: min(11.1vw,214px);
  height: auto;
}
#lead .txt_box {
  margin-bottom: min(5.21vw,100px);
  font-size: 2.0rem;
  font-size: clamp(1.2rem,1.3vw,2.0rem);
  line-height: 3;
  text-align: center;
  letter-spacing: 0.1em;
}
#lead .sub_ttl {
  margin-bottom: min(3.1vw,60px);
  font-size: min(1.25vw,2.4rem);
  letter-spacing: 0.15em;
  text-align: center;
}
#lead .brand_list {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
}
#lead .brand_list li {
  margin: 0 min(2.1vw,40px);
}
#lead .brand_list li.king_seiko {
  width: min(12.3vw,237px);
  height: auto;
}
#lead .brand_list li.prospex {
  width: min(12.5vw,240px);
  height: auto;
}
#lead .brand_list li.astron {
  width: min(8.54vw,164px);
  height: auto;
}
#lead .brand_list li.presage {
  width: min(10.9vw,210px);
  height: auto;
}
#lead .brand_list li a {
  transition: opacity .1s ease-in-out;
}
#lead .brand_list li a:hover {
  opacity: 0.75;
  transition: opacity .1s ease-in-out .1s;
}
#lead .brand_list li img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 991px) {

}
@media screen and (max-width: 640px) {
  #lead {
    padding: max(16vw,60px) 0;
    background: #000 url(../img/lead_bg_sp.webp) center center repeat-y fixed;
    background-size: 100% auto;
  }
  #lead .main_ttl {
    margin-bottom: max(10vw,40px);
  }
  #lead .main_ttl img {
    width: max(30.66vw,115px);
  }
  #lead .txt_box {
    margin-bottom: max(10.7vw,40px);
    font-size: max(3.733vw,1.4rem);
    line-height: 2.5;
    letter-spacing: 0.075em;
  }
  #lead .sub_ttl {
    margin-bottom: max(8vw,30px);
    font-size: max(3.2vw,1.2rem);
  } 
  #lead .brand_list {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  #lead .brand_list li {
    width: max(38.7vw,150px) !important;
    margin: 0;
    text-align: center;
  }
  #lead .brand_list li.king_seiko,
  #lead .brand_list li.prospex {
    margin-bottom: max(4vw,15px);
  }
  #lead .brand_list li img {
    width: auto;
    height: max(4vw,15px);
  }
  #lead .brand_list li.king_seiko img {
    height: max(4.8vw,18px);
  }
}
/*-------------------------------------------------

products

--------------------------------------------------*/
#products {
  position: relative;
}
#products .product {
  position: relative;
}
#products .product_img {
  position: relative;
  width: 100%;
  max-height: 900px;
  aspect-ratio: 1920 / 900;
  background: #000;
  overflow: hidden;
  clip-path: inset(0 0 0 0);
}
#products .product_img .product_img_wrap {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  transform: scale(1.1);
}
#products .product_img .product_img_slide_list {
  width: 100%;
  height: 100%;
}
#products .product_img .product_img_slide_list .slick-animation {
  animation: fadezoom 5s 0s forwards;
}
@keyframes fadezoom {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
#products .product_img .product_img_slide_list img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 38%;
}
#product_king_seiko .product_img .product_img_slide_list .upperpos img {
  object-fit: cover;
  object-position: 50% 50%;
}
#product_prospex .product_img .product_img_slide_list .upperpos img {
  object-fit: cover;
  object-position: 50% 42%;
}
#products .product_img .img_inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  perspective: 1000;
  transform-style: preserve-3d;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  overflow: hidden;
  width: 100%;
	aspect-ratio: 1/1;
}
#products .product_img .img_inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#products #product_prospex.product .product_img.full .img_inner {
  z-index: -1;
}
#products #product_prospex.product .product_img.full .img_inner.off {
  z-index: 0;
}
#products .product_img.full .img_inner .img_slide_list {
  position: absolute;
  width: 100%;
  height: 100%;
}
#products .product_img.full .img_inner .img_slide_list div {
  height: 100%;
}
#products .product_img.full .img_inner .img_slide_list li {
  position: relative;
  width: 100%;
  height: 100%;
}
#products .product_img.full .img_inner .img_slide_list li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#products .product .outer {
  position: relative;
  padding: min(7.81vw,150px) 0 min(4.16vw,80px);
  background: #fff url(../img/product_bg.webp) center top no-repeat;
  background-size: cover;
}
#products .main_ttl {
  margin-bottom: min(2.1vw,40px);
  text-align: center;
}
#products #product_astron .main_ttl,
#products #product_presage .main_ttl {
  margin-bottom: min(3.1vw,60px);
}
#products .main_ttl img  {
  width: min(15.6vw,300px);
}
#products .sub_ttl {
  margin-bottom: min(3.1vw,60px);
  font-size: min(1.25vw,2.4rem);
  letter-spacing: 0.15em;
  text-align: center;
}
#products .txt_box {
  margin-bottom: min(3.4vw,65px);
  color: #5f6161;
  font-size: 2.4rem;
  font-size: clamp(1.4rem,1.4vw,2.4rem);
  line-height: 2;
  text-align: center;
  letter-spacing: 0.1em;
}
#products .item_slide {
  margin-bottom: min(4.2vw,80px);
  padding: 0;
  min-height: 34vw;
  position: relative;
}
#products .item_slide::before {
	content: '';
	position: absolute;
	width: 60px;
	height: 60px;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	background: url(../img/icon_loading.svg) no-repeat;
	background-size: contain;
	padding-bottom: 16%;
}
#products .item_slide.show::before {
	display: none;
}
#products .item_slide .slick-list {
  padding-top: 1.5%;
}
#products .item_slide .item_slide_list {
	opacity: 0;
	transition: opacity .5s ease-out .1s;
}
#products .item_slide.show .item_slide_list {
	opacity: 1;
}
#products .item_slide .item_slide_list li.slick-slide {
  padding: 0 min(0.78vw,15px);
}
#products .item_slide .item_slide_list li.slick-slide a {
  color: #000;
  text-decoration: none;
}
#products .item_slide .item_slide_list li.slick-slide .list_img_box {
  position: relative;
  margin-bottom: min(1.5vw,30px);
  padding: min(1.042vw,20px);
  background-color: #fafafa;
  border-radius: 10px;
  transition: background-color .3s ease-in-out, box-shadow .3s ease-in-out, transform .3s ease-in-out;
}
#products .item_slide .item_slide_list li.slick-slide a:hover .list_img_box {
  background-color: linear-gradient(to right, #f9f9f9, #f7f7f7);
  box-shadow: 0.2vw 0.35vw 1vw 0.5vw rgba(0, 0, 0, .1);
  transform: translateY(-1.5%);
  transition: background-color .1s ease-in .0s, box-shadow .1s ease-in .0s, transform .1s ease-in .0s;
}

#products .item_slide .item_slide_list li.slick-slide .list_img_box .new {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: min(0,52vw,10px);
  left: min(0,52vw,10px);
  width: 3.625em;
  aspect-ratio: 1 / 1;
  color: #fff;
  font-size: 1.6rem;
  font-size: clamp(1.1rem,1vw,1.6rem);
  background: #000;
  border-radius: 50%;
}
#products .item_slide .item_slide_list li.slick-slide .list_img_box .limited {
  position: absolute;
  top: min(2.08vw,40px);
  right: min(1.04vw,20px);
  font-size: 1.6rem;
  font-size: clamp(1.1rem,1vw,1.6rem);
}
#products .item_slide .item_slide_list li.slick-slide .list_txt_box {
  padding: 0 2%;
  font-size: 1.6rem;
  font-size: clamp(1.2rem,1vw,1.6rem);
  font-weight: bold;
}
#products .item_slide .item_slide_list li.slick-slide .list_txt_box .ref {
  margin-bottom: .85em;
}
#products .item_slide .item_slide_list li.slick-slide .list_txt_box .price {
  margin-bottom: .85em;
}
#products .item_slide .item_slide_list li.slick-slide .list_txt_box .price .min {
  font-size: .75em;
  font-weight: normal;
}
#products .item_slide .item_slide_list li.slick-slide .list_txt_box .sup {
  font-size: .75em;
  font-weight: normal;
  line-height: 1.4;
}
#products .item_slide .slide_nav {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: min(3.6vw,60px);
}
#products .item_slide .slide_nav .selector {
  width: 40px;
  aspect-ratio: 1 / 1;
  background: #000 url(../img/icon_right.svg) 55% center no-repeat;
  background-size: 24% auto;
  border-radius: 50%;
  cursor: pointer;
  transform: translate(0);
  transition: background-color .1s ease-in-out;
}
#products .item_slide .slide_nav .selector:hover {
  background-color: #666;
  transition: background-color .1s ease-in-out .1s;
}
#products .item_slide .slide_nav .selector.left_selector {
  transform: rotate(180deg);
}
#products .item_slide .slide_nav .slick-dots {
  position: relative;
  display: flex;
  width: min(52.08vw,1000px);
  margin: 0 20px;
  bottom: 0px;
}
#products .item_slide .slide_nav .slick-dots li {
  flex: 1;
  position: relative;
  width: auto;
  height: 4px;
  margin: 0;
}
#products .item_slide .slide_nav .slick-dots li button {
  width: 100%;
  height: 100%;
  padding: 0;
  background-color: #dfdfdf;
  transition: background-color .1s ease-in-out;
}
#products .item_slide .slide_nav .slick-dots li.slick-active button {
  background: #000;
  transition: background-color .1s ease-in-out .1s;
}
#products .item_slide .slide_nav .slick-dots li button:before {
  display: none;
}
#products .btn {
  text-align: center;
}
/* ASTRON and PRESAGE */
#products #product_astron.product,
#products #product_presage.product {
  display: flex;
}
#products #product_presage.product {
  flex-direction: row-reverse;
}
#products #product_astron.product .product_img,
#products #product_presage.product .product_img {
  width: 50%;
  aspect-ratio: 960 / 900;
}
#products #product_astron.product .outer,
#products #product_presage.product .outer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  width: 50%;
  min-height: inherit;
}
#products #product_astron.product .outer {
  background: #fff url(../img/prodact_bg_right.webp) right top no-repeat;
  background-size: auto 100%;
}
#products #product_presage.product .outer {
  background: #fff url(../img/prodact_bg_left.webp) 0 top no-repeat;
  background-size: auto 100%;
}

@media screen and (max-width: 640px) {
  #products .product_img {
    max-height: inherit;
    aspect-ratio: 750 / 750;
  }
  #products .product .outer {
    position: relative;
    padding: max(17.5vw,65px) 0;
    background: #fff url(../img/product_bg_sp.webp) center top no-repeat;
    background-size: cover;
  }
  #products .product_img .product_img_wrap {
    top: -5vh;
    min-height: 110vh;
	  transform: scale(1);
	 }
  #products .main_ttl {
    margin-bottom: max(5.33vw,20px);
  }
  #products .main_ttl img {
    width: max(40vw,150px);
  }
  #products .sub_ttl {
    margin-bottom: max(9.33vw,35px);
    font-size: max(3.466vw,1.3rem);
  }
  #products .txt_box {
    margin-bottom: max(8vw,30px);
    font-size: max(3.733vw,1.4rem);
    line-height: 2;
  }
  #products .item_slide {
    margin-bottom: max(12vw,45px);
  }
  #products .item_slide::before {
	 	width: 30px;
	 	height: 30px; 
	}
  #products .item_slide .item_slide_list li.slick-slide {
    padding: 0 max(2.666vw,10px);
  }
  #products .item_slide .item_slide_list li.slick-slide .list_img_box .new {
    top: max(1.333vw,5px);
    left: max(1.333vw,5px);
    font-size: max(2.666vw,1.0rem);
  }
  #products .item_slide .item_slide_list li.slick-slide .list_img_box .limited {
    top: max(4vw,15px);
    right: max(2.666vw,10px);
    font-size: max(2.666vw,1.0rem);
  }
  #products .item_slide .item_slide_list li.slick-slide .list_txt_box {
    padding: 5% 5% 0;
    font-size: max(3.2vw,1.2rem);
  }
  #products .item_slide .slide_nav {
    margin-top: 20px;
  }
  #products .item_slide .slide_nav .selector {
    width: min(10.66vw,40px);
  }
  /* ASTRON and PRESAGE */
  #products #product_astron.product,
  #products #product_presage.product {
    flex-direction: column;
  }
  #products #product_astron.product .product_img,
  #products #product_presage.product .product_img {
    width: 100%;
    aspect-ratio: 1 / 1;
  }
  #products #product_astron.product .outer,
  #products #product_presage.product .outer {
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #fff url(../img/prodact_bg_right_sp.webp) center center no-repeat fixed;
    background-size: cover;
  }
  #products #product_astron .main_ttl,
  #products #product_presage .main_ttl {
    margin-bottom: max(5.33vw,20px);
  }
}
/*-------------------------------------------------

about

--------------------------------------------------*/
#about .ttl_wrap {
  position: relative;
  padding: min(6.77vw,130px) 0;
  color: #fff;
  background: #000 url(../img/lead_bg.webp) center center repeat-y fixed;
  background-size: 100% auto;
  overflow: hidden;
}
#about .ttl_wrap .main_ttl {
  position: relative;
  text-align: center;
}
#about .ttl_wrap .main_ttl .upper_txt {
  position: relative;
  display: block;
  margin-bottom: min(2.6vw,50px);
  font-size: min(1.25vw,2.4rem);
  letter-spacing: 0.15em;
}
#about .ttl_wrap .main_ttl img {
  width: min(11.1vw,214px);
  height: auto;
}
#about .outer {
  position: relative;
  padding-bottom: min(7vw,140px);
  background: #fff;
}
#about .inner {
  position: relative;
  max-width: 1290px;
  width: 66.666vw;
  margin: auto;
}
#about .about_list {
  position: relative;
  padding: min(6vw,120px) 0;
}
#about .about_list::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 5%;
  background: url(../img/about_line.png) center top no-repeat;
  background-size: 100% auto;
}
#about .about_list dt {
  position: relative;
  width: 50%;
}
#about .about_list.about02 dt {
  margin-left: auto;
}
#about .about_list dd.txt_box {
  position: relative;
  width: 50%;
}
#about .about_list.about02 dd.txt_box {
  margin-left: auto;
}
#about .about_list dt {
  position: relative;
  margin-bottom: 3vw;
  text-align: center;
}
#about .about_list dt .num {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 2.24em;
  aspect-ratio: 1 / 1;
  margin-bottom: 0.6em;
  color: #999;
  font-size: 6.6rem;
  font-size: min(3.4vw,6.6rem);
  border: 2px solid #999;
  border-radius: 50%;
}
#about .about_list dt .ttl {
  font-size: 3.6rem;
  font-size: clamp(1.9rem,2.0vw,3.6rem);
  font-weight: 500;
}
#about .about_list.about02 dt .ttl,
#about .about_list.about03 dt .ttl {
  line-height: 1.4;
}
#about .about_list.about02 dt .ttl .ctl1,
#about .about_list.about03 dt .ttl .ctl1 {
  display: none;
}
#about .about_list dd.txt_box {
  font-size: 1.6rem;
  font-size: clamp(1.2rem,1vw,1.6rem);
  text-align: center;
  line-height: 2;
  z-index: 1;
}
#about .about_list.about01 dd.txt_box .txt{
  margin: 0 -3em;
}
#about .about_list.about01 dd.txt_box .txt .ctl  {
  display: none;
}
#about .about_list dd.txt_box .notice {
  margin-top: 2em;
  font-size: .875em
}
#about .about_list dd.img_box {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
  text-align: center;
}
#about .about_list.about02 dd.img_box {
  right: auto;
  left: 0;
}
#about .about_list.about01 dd.img_box img {
  width: 25.22vw;
  max-width: 488px;
}
#about .about_list.about02 dd.img_box img {
  width: 25.84vw;
  max-width: 500px;
}
@media screen and (max-width: 991px) {
  #about .about_list.about02 dt .ttl .ctl1 {
    display: inline;
  }
  #about .about_list.about02 dt .ttl .ctl2 {
    display: none;
  }
  #about .about_list.about01 dd.txt_box .txt{
    margin: 0;
}
  #about .about_list.about01 dd.txt_box .txt .ctl  {
    display: inline;
  }
}
@media screen and (max-width: 640px) {
  #about .ttl_wrap {
    padding: max(13.33vw,50px) 0;
    background: #000 url(../img/lead_bg_sp.webp) center center repeat-y fixed;
    background-size: 100% auto;
  }
  #about .ttl_wrap .main_ttl .upper_txt {
    margin-bottom: max(5.33vw,20px);
    font-size: max(3.466vw,1.3rem);
  }
  #about .ttl_wrap .main_ttl img {
    width: max(31.2vw,117px);
    height: auto;
  }
  #about .inner {
    max-width: inherit;
    width: 100%;
  }
  #about .about_list {
    display: flex;
    flex-direction: column;
    padding: max(10.66vw,40px) 0;
  }
  #about .about_list dt {
    width: 100%;
    margin-bottom: max(5.33vw,20px);
  }
  #about .about_list dd {
    width: 100% !important;
  }
  #about .about_list dd.img_box {
    display: block;
    position: relative;
    top: auto;
    right: auto;
  }
  #about .about_list dt .num {
    width: max(13.33vw,50px);
    margin-bottom: max(6.66vw,25px);
    font-size: max(5.866vw,2.2rem);
  }
  #about .about_list dt .ttl {
    font-size: max(3.733vw,1.4rem);
    font-weight: bold;
    line-height: 1.8 !important;
  }
  #about .about_list dd.txt_box {
    margin-bottom: max(8vw,30px);
    font-size: max(3.2vw,1.2rem);
  }
  #about .about_list.about01 dd.img_box img {
    width: max(53.33vw,200px);
    max-width: inherit;
  }
  #about .about_list.about02 dd.img_box img {
    width: max(70.66vw,265px);
    max-width: inherit;
  }
}
/*-------------------------------------------------

shop_list

--------------------------------------------------*/
#shop_list {
  position: relative;
  background: #fff url(../img/shop_list_bg.webp) right center no-repeat;
  background-size: auto 100%;
}
#shop_list .wrap {
  position: relative;
  display: flex;
}
#shop_list .shop_list_img {
  position: relative;
  width: 36.4%;
  aspect-ratio: 700 / 1000;
  background: #000;
}
#shop_list .shop_list_img .img_inner {
  position: relative;
  width: 100%;
  height: 100%;
}
#shop_list .shop_list_img .img_inner .slick-slider {
	height: 100%;
}
#shop_list .shop_list_img .img_inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#shop_list .outer {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 48.96%;
  background: url(../img/bg_map.webp) center center no-repeat;
  background-size: 95% auto;
}
#shop_list .main_ttl {
  margin-bottom: 1.25em;
  font-size: 3.6rem;
  font-size: clamp(2.0rem,2.0vw,3.6rem);
  font-weight: 500;
  text-align: center;
}
#shop_list .txt_box {
  font-size: 1.6rem;
  font-size: clamp(1.2rem,1vw,1.6rem);
  text-align: center;
  line-height: 2;
}
#shop_list .img_box {
  margin-top: min(4.2vw,80px);
  margin-bottom: min(7.5vw,140px);
  text-align: center;
}
#shop_list .img_box img {
  width: min(37.03vw,711px);
}
#shop_list .btn {
  text-align: center;
}
#shop_list .btn a.common_btn {
  width: auto;
  height: 3.5em;
  padding: 0 3em 0 0;
  font-size: 1.8em;
  font-size: clamp(1.0rem,1vw,1.8rem);
  letter-spacing: -0.05em;
}
@media screen and (max-width: 991px) {

}
@media screen and (max-width: 640px) {
  #shop_list {
    background-image: none;
  }
  #shop_list .wrap {
    flex-direction: column;
  }
  #shop_list .shop_list_img {
    width: 100%;
    aspect-ratio: inherit;
  }
  #shop_list .shop_list_img .img_inner img {
    width: 100%;
    height: auto;
    object-fit: inherit;
  }
  #shop_list .outer {
    display: flex;
    width: 100%;
    background: #fff url(../img/shop_list_bg.webp) right bottom repeat-y;
    background-size: cover;
  }
  #shop_list .outer .inner {
    width: 100%;
    padding: max(13.33vw,50px) 0;
    background: url(../img/bg_map.webp) center 0 no-repeat;
    background-size: 95% auto;
  }
  #shop_list .main_ttl {
    margin-bottom: max(5.33vw,20px);
    font-size: max(3.73vw,1.4rem);
    font-weight: bold;
  }
  #shop_list .txt_box {
    font-size: max(3.2vw,1.2rem);
  }
  #shop_list .img_box {
    margin: max(13.33vw,50px) 0;
  }
  #shop_list .img_box img {
    width: max(84vw,315px);
  }
  #shop_list .btn a.common_btn {
    width: max(53.333vw,200px);
    height: 3.7em;
    font-size: max(2.933vw,1.1rem);
    padding: 0;
    letter-spacing: -0.05em;
  }
}
/*-------------------------------------------------

topics

--------------------------------------------------*/
#topics {
  position: relative;
  padding: min(7.8vw,150px) 0;
  color: #fff;
  background: #323232;
}
#topics .main_ttl {
  margin-bottom: 2em;
  font-size: 3.6rem;
  font-size: clamp(2.0rem,2.0vw,3.6rem);
  text-align: center;
  letter-spacing: .15em;
}
#topics .inner {
  width: min(75.26vw,1445px);
  margin: auto;
}
#topics .topics_list {
  position: relative;
}
#topics .topics_list .slick-list {
  padding-top: 1.5%;
}

#topics .topics_list li.slick-slide {
  padding: 0 min(2.34vw,45px);
}
#topics .topics_list li.slick-slide a {
  color: #fff;
  text-decoration: none;
}
#topics .topics_list li .topics_img {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  z-index: 1;
}
#topics .topics_list li a .topics_img img {
  transition: .6s transform ease;
}
#topics .topics_list li a:hover .topics_img img {
  transform: scale(1.05);
}
#topics .topics_list li .topics_txt {
  margin-top: 2em;
  font-size: 1.6rem;
  font-size: clamp(1.2rem,1vw,1.6rem);
  line-height: 2;
}
#topics .topics_list .slide_nav {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: min(3.6vw,60px);
}
#topics .topics_list .slide_nav .selector {
  width: 40px;
  aspect-ratio: 1 / 1;
  background: #000 url(../img/icon_right.svg) 55% center no-repeat;
  background-size: 24% auto;
  border-radius: 50%;
  cursor: pointer;
  transition: opacity .1s ease-in-out;
}
#topics .topics_list .slide_nav .selector.left_selector {
  transform: rotate(180deg);
}
#topics .topics_list .slide_nav .slick-dots {
  position: relative;
  display: flex;
  width: min(26.04vw,500px);
  margin: 0 20px;
  bottom: 0px;
}
#topics .topics_list .slide_nav .slick-dots li {
  flex: 1;
  position: relative;
  width: auto;
  height: 4px;
  margin: 0;
}
#topics .topics_list .slick-dots li:only-child {
  display: none;
}
#topics .topics_list .slide_nav .slick-dots li button {
  width: 100%;
  height: 100%;
  padding: 0;
  background-color: #dfdfdf;
  transition: background-color .1s ease-in-out;
}
#topics .topics_list .slide_nav .slick-dots li button {
  width: 100%;
  height: 100%;
  padding: 0;
  background-color: #dfdfdf;
  transition: background-color .1s ease-in-out;
}
#topics .topics_list .slide_nav .slick-dots li.slick-active button {
  background: #000;
  transition: background-color .1s ease-in-out .1s;
}
#topics .topics_list .slide_nav .slick-dots li button:before {
  display: none;
}
@media screen and (max-width: 640px) {
  #topics {
    padding: max(10.666vw,40px) 0;
  }
  #topics .main_ttl {
    margin-bottom: max(8vw,30px);
    font-size: max(3.73vw,1.4rem);
  }
  #topics .inner {
    width: 100%;
    padding: 0;
  }
  #topics .topics_list .slide_nav {
    margin-top: 20px;
  }
  #topics .topics_list .slide_nav .selector {
    width: min(10.66vw,40px);
  }
  #topics .topics_list li.slick-slide {
    padding: 0 max(2.666vw,10px);
  }
  #topics .topics_list li .topics_txt {
    margin-top: max(4vw,15px);
    font-size: max(2.6662vw,1.0rem);
  }
}
/*-------------------------------------------------

 footer

--------------------------------------------------*/
footer {
  position: relative;
  width: 100%;
  height: auto;
  padding-top: min(4.2vw,80px);
  background: #fff;
}
footer .btn_top .wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: #000;
  cursor: pointer;
  transition: opacity .1s ease-in-out;
}
footer .btn_top .wrap:hover {
  opacity: 0.75;
  transition: opacity .1s ease-in-out .1s;
}
footer .btn_top .wrap span {
  display: block;
  width: 20%;
  aspect-ratio: 1 / 1;
  background: #fff;
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}
footer .inner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 110px 0;
  background: #000;
}
footer .btn_top {
  display: none;
  position: fixed;
  bottom: 0;
  right: 0;
  width: min(4vw,70px);
  aspect-ratio: 70 / 60;
  z-index: 10;
}
footer .btn_top.absolute {
  position: absolute;
  top: 0;
  bottom: auto;
  transform: translateY(-99%);
}
footer .foot_logo img {
  width: 131px;
  transition: 0.2s;
}
footer .foot_logo a:hover img {
  opacity: 0.6;
}
footer .copyright {
  margin: 13px 0 0 0;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 1px;
  color: #fff;
  font-family: 'Noto Sans JP';
  font-weight: 400;
}
@media screen and (max-width: 640px) {
  footer {
    padding-top: max(10.66vw,40px);
  }
  footer .btn_top {
    width: max(8vw,30px);
	} 
}




  