/*
Theme Name:鈴木皮フ科クリニック
Theme URI:
Author: takami
Author URI: https://yoshida-designbu.com
License: takami
*/


/*--------------
  loading
--------------*/
.loading{
  background-color:var(--kaisei-green);
  bottom: 0;
  display: block;
  height: 100vh;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  transform: scaleY(1);
  transform-origin: center top;
  width: 100vw;
  z-index: 999;
}


/*--------------
loading
--------------*/
.loadingBg{
  width: 100%;
  height: 100vh;
  display: block;
  position: absolute;
  z-index: 4;
  top: 0;
  left: 0;
  background: url(img/bg.png) repeat center;
  background-size: 90%;
  opacity: 1;
  -webkit-transition: opacity 0.8s ease;
  transition: opacity 0.8s ease;
  animation: loadingBg-fadeIn .75s ease-in-out 5s normal forwards;
  filter: 0;
}

@keyframes loadingBg-fadeIn {
  0%{
    opacity: 1;
    visibility: visible;
    filter: blur(0px);
  }
  100%{
    opacity: 0;
    visibility: hidden;
    filter: var(--blur10px);
  }
}

/*--------------
KVf
--------------*/
.KV{
  position: relative;
  padding-top: 28vw;
  padding-bottom: 14vw;
  overflow: hidden;
}

.KV-textWrap{
  position: absolute;
  z-index: 1;
  right: 34vw;
  top: min(5vw);
}

.KV-textWrap>.starDeco-large{
  width: min(6vw);
  top: -23%;
  right: 2%;
}

.KV-textWrap>.starDeco-items{
  bottom: -49%;
  width: min(3.4vw);
  left: -6%;
}
.starDeco-items>.starDeco-dia{
  position: absolute;
  width: min(46%);
  top: -40%;
  right: 128%;
}

h2.KV-copy{
  font-size: min(5.6vw);
  line-height: 1.5;
}

h2.KV-copy span{
  display: block;
}

.KV-image{
  display: block;
  overflow: hidden;
  position: relative;
  margin-left: -10vw;
  width: min(125vw);

}

.KV-image .swiper-wrapper{
  top: 0;
  left: 0;
  height: 100%;
  -webkit-mask-image: url(img/KV-imageBg.svg);
  mask-image: url(img/KV-imageBg.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  will-change: mask-image;
}

.KV-image .swiper-pagination{
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(37rem,52vw)!important;
  transform: translate(0, 0);
}

.KV-image .swiper-pagination-bullet{
  background: #ade5ed;
  opacity: 1;
  width: min(.6rem, 1.4vw);
  height: min(.6rem, 1.4vw);
  transition: all .3s;
}

.KV-image .swiper-pagination-bullet-active{
  background: url(img/star-dia.svg) no-repeat center;
  background-size: 100%;
  width: min(1.6rem, 3.6vw);
  height: min(1.6rem, 3.6vw);
  transition: all .3s;
}

.KV-copyBg{
  position: absolute;
  width: min(29%);
  top: -18%;
  right: 0;
  z-index: -1;
}

.KV-sns{
  position: absolute;
  top: 2vw;
  right: 2vw;
  width: min(1rem, 3vw);
  transform: rotate(180deg);
}

.KV-sns a{
  display: block;
}


/*--- scroll ---*/
.scroll {
  position: absolute;
  font-weight: 600;
  font-size: min(.8rem, 2.6vw);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: min(.6rem);
  top: 68vw;
  right: 2vw;
  z-index: 1;
}

.scroll-image{
  width: min(.08rem,.2vw);
  display: block;
}

.scroll-text{
  writing-mode: sideways-rl;
  text-transform: uppercase;
}


.intro{
  max-width: 1440px;
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--flex-gap) * 4);
  justify-content: space-between;
  padding: var(--section-margin) 0 0;
}

h2.intro_title{
  margin-bottom: min(1.4rem, 4vw);
  font-size: min(1.24rem, 4vw);
}

h2.intro_title .scroll-svg{
  height: min(3rem, 8vw);
  display: block;
  margin-bottom: min(1.24rem, 3vw);
}

h2.intro_title span.title-deco{
  font-weight: 400;
  position: relative;
  padding-left: min(1.6rem, 4vw);
}
h2.intro_title span.title-deco::before{
  position: absolute;
  content: "";
  background: url(img/s-contentsTitle_deco.svg) no-repeat center;
  background-size: 100%;
  width: min(1.2rem, 3vw);
  height: min(2rem, 6vw);
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
}

.intro .news,.intro .ch{
  width: 100%;
  background: var(--color-white);
  padding: var(--bg-padding);
  border-radius: var(--b-radius);
  position: relative;
}

.intro_titleEn{
  position: absolute;
  top: -8%;
  left: 5%;
  overflow: hidden;
}
.intro_titleEn img{
  height: min(2.24rem, 6.24vw);
}

.intro .news-list{
  margin-top: min(2rem,2vw);
}

@media screen and (min-width:768px) {
  .KV{
    padding-top: 0;
    padding-bottom: 0;
  }

  h2.KV-copy{
    writing-mode: tb;
    font-size: min(2.8vw);
  }

  .KV-image{
    margin-left: -10vw;
    width: min(80vw);
  }

  .KV-textWrap{
    right: 16vw;
    top: min(9vw);
  }

  .KV-textWrap>.starDeco-large{
    width: min(3vw);
    top: -23%;
    right: -48%;
  }

  .KV-textWrap>.starDeco-items{
    width: min(2.4vw);
    bottom: -21%;
    left: -38%;
    top: auto;
  }

  .KV-textWrap>.starDeco-items>.starDeco-dia{
    width: min(45%);
    top: -40%;
    right: 90%;
  }

  .KV-copyBg{
    width: min(113%);
    top: -25%;
    right: auto;
  }

  .intro{
  gap: calc(var(--flex-gap) * 1.5);
  }
  .intro .ch{
    width: calc((100% - calc(var(--flex-gap) * 1.5)) / 2);
  }

  .intro .news{
    width: calc((100% - calc(var(--flex-gap) * 1.5)) / 2);
  }

  .intro_titleEn{
    top: -7%;
  }
}

/*--------------
post
--------------*/
/*----- common -----*/
.new-text{
  text-transform: uppercase;
  color: var(--color-red);
}

.news-list_item a{
  display: flex;
  flex-wrap: wrap;
  border-bottom: dashed 1px var(--color-gray);
  padding: min(1.4rem, 4vw);
  gap: min(2rem, 1vw);
  transition: var(--transition);
}
.news-list_item:nth-of-type(1) a{
  padding: 0 min(1.4rem, 4vw) min(1.4rem, 4vw);
}

.news .link-contents{
  margin-top: min(2.4rem,6vw);
  text-align: left;
}

.news .link-contents a.linkBtn{
  margin: 0 0 0 auto;
  display: block;
  font-size: min(1rem, 3.83vw);
  width: min(16rem,100%);
}

p.news-title{
  width: 100%;
}


@media screen and (min-width:768px) {
  .news-list_item a .date{
    width: min(5rem);
  }

  .news-list_item a:hover{
    opacity: .6;
  }

  p.news-title{
    width: calc(calc(100% - min(2rem, 2vw)) - min(5rem));
  }
}

/*--------------
Treatment
--------------*/
.treatment{
  background: var(--color-white);
  margin-top: var(--section-margin);
  padding: var(--section-margin) 0 22vw;
  z-index: 1;
  position: relative;
}

.treatment-title{
  width: var(--contents-width);
  margin: 0 auto;
  position: relative;
  margin-bottom: min(11rem,23vw);
}
.treatment-title::before{
  position: absolute;
  content: "";
  background: url(img/title-wave.svg) no-repeat center;
  background-size: 100%;
  bottom: -24%;
  left: 0;
  width: min(10rem, 28vw);
  height: 9px;
}

.treatment-title h2{
  width: min(30rem, 78vw);
  margin-bottom: min(2rem, 4vw);
}

.treatment-title p{
  font-size: min(1.24rem,3.6vw);
}

.treatment-wrapper{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--flex-gap) * 2.5);
}

.treatment-contents{
  position: relative;
  padding: var(--bg-padding);
  border-radius: var(--b-radius);
}

.treatment-contents>h3{
  position: absolute;
}

.treatment-contents h4{
  font-size: min(2rem,4.254vw);
  padding-bottom: min(1rem);
  line-height: 1.5;
}
.treatment-contents h4 span{
  font-size: 72%;
}

.treatment-contents p{
  font-size: min(1.12rem,3.4vw);
  padding-bottom: min(1rem);
}

.treatment-contents.--mesonaJ{
  width: 100%;
  background: #f5f5f9;
  padding: var(--bg-padding);
  margin-bottom: min(12vw, 5rem);
}

.treatment-contents.--mesonaJ>h3{
  width: min(22rem, 43vw);
  top: -14%;
  left: min(2rem, 4vw);
}

.treatment-contents.--mesonaJ h4{
  color: var(--color-purple);
}

.treatment-mesonaJImage{
  width: min(11rem, 31vw);
  position: absolute;
  top: -41%;
  right: 3%;
}

.treatment-mesonaJImage img{
  border-radius: 50%;
}

.treatment-contents.--cc{
background: #f9f8f5;
}

.treatment-contents.--cc>h3{
  width: min(23rem, 37vw);
  top: -13vw;
  left: min(2rem, 4vw);
}

.treatment-contents.--cc>h4{
  color: var(--color-orange);
}

.treatment-ccImage{
  position: absolute;
  width: min(11rem,33vw);
  top: -26%;
  right: 3%;
}

.treatment-ccImage>img{
  border-radius: 50%;
}

.treatment-contents.--other{
background: #f5f7f9;
}

.treatment-contents.--other>h3{
  width: min(10rem, 22vw);
  top: -13%;
}

.treatment-contents.--other>h4{
  color: var(--color-blue);
}

.moreLink{
  position: relative;
  width: min(7rem,18vw);
  display: block;
  margin: 0 0 0 auto;
  line-height: 1.5;
}
.moreLink .moreText{
  width: 47%;
  margin-bottom: -7%;
}


.starDeco-items{
  position: absolute;
  width: min(2rem, 4vw);
  top: -13%;
  right: 33%;
}

.treatment .starDeco-bubble{
  top: -20%;
  right: min(22rem, 14vw);
  width: min(7rem, 15vw);
  z-index: -1;
}

/*--------------
Message
--------------*/
.message-contents{
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--flex-gap) * 2);
}

.message-contents_imageArea{
  width: 100%;
}

.message-contents_imageArea>picture{
  display: block;
  overflow: hidden;
  border-radius: 50%;
  height: 68vw;
}
.message-contents_imageArea>picture img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.message-contents_textArea{
  position: relative;
}

.message-contents_textArea h2{
  width: min(22rem, 38vw);
  padding-bottom: min(2rem, 4vw);
}

.message-contents_textArea .starDeco-large{
  top: -5%;
  right: 0;
}
.message-contents_textArea .starDeco-items{
  right: min(106%, 83vw);
  top: auto;
  bottom: -6%;
}
.message-contents_textArea .starDeco-bubble{
  right: min(3rem, 6vw);
  top: 6%;
  width: min(6rem, 14vw);
  z-index: -1;
}

.title-wave{
  width: min(15rem, 41vw);
  padding-bottom: min(3rem, 6vw);
}
.title-wave img{
  display: block;
}

.message-contents_textArea p{
  font-size: min(1.24rem, 3.6vw);
  line-height: 2;
  padding-bottom: min(2rem,4vw);
}


@media screen and (min-width:768px) {
  .message-contents_textArea p{
    line-height: 2.4;
  }

  .moreLink:hover{
    opacity: .4;
  }

}

@media screen and (min-width:1024px) {
  .treatment{
    padding: var(--section-margin) 0 16vw;
  }

  .treatment .starDeco-large{
    top: -33%;
  }
  .treatment .starDeco-items{
    top: -22%;
    right: 33%;
  }

  .treatment-title{
    margin-bottom: calc(var(--section-margin) * 1);
  }

  .treatment-wrapper{
    gap: var(--flex-gap);
  }

  .message-contents{
    gap: calc(var(--flex-gap) * 1.5);
  }

  .treatment-contents.--cc>h3{
    width: min(18rem, 37vw);
    top: -31%;
  }

  .treatment-contents.--mesonaJ{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--flex-gap);
    margin-bottom: calc(var(--section-margin) / 2);
    padding: var(--bg-padding) calc(var(--bg-padding) * 2);
  }

  .treatment .starDeco-bubble{
    top: -37%;
  }

  .message-contents_imageArea>picture{
    height: auto;
  }

  .message-contents_imageArea{
    width: calc((100% - calc(var(--flex-gap) * 1.5)) / 2);
  }
  .message-contents_textArea{
    width: calc((100% - calc(var(--flex-gap) * 1.5)) / 2);
  }

  /*--------------
  Treatment
  --------------*/
  .treatment-mesonaJImage{
    width: min(34rem);
    margin-top: -10%;
    position: relative;
    top: 0;
    right: 0;
  }
  .treatment-contents.--cc{
    width: calc((100% - var(--flex-gap)) / 2);
  }
  .treatment-contents.--other{
    width: calc((100% - var(--flex-gap)) / 2);
  }
}

/*--------------
First time
--------------*/
.FirstTime .treatment-title{
  margin-bottom: calc(var(--section-margin) * .6);
  width: 100%;
}
.FirstTime .treatment-title>h2{
  width: min(21rem, 45vw);
}

ul.FirstTime-links{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(var(--flex-gap));
}

ul.FirstTime-links li{
  width: calc(calc(100% - var(--flex-gap)) / 2);
}

a.FirstTime-links_item{
  background: var(--bg);
  border-radius: 50%;
  display: flex;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  padding: var(--bg-padding);
  aspect-ratio: 1 / 1;
}

a.FirstTime-links_item img{
  display: block;
  height: min(6rem, 13vw);
  margin: 0 auto;
  transition: var(--transition);
}

a.FirstTime-links_item p{
  padding-top: min(2rem,3vw);
  margin-top: min(2rem,3vw);
  font-size: min(1.2rem,3.4vw);
  position: relative;
}
a.FirstTime-links_item p::before{
  position: absolute;
  content: "";
  background: url(img/title-wave.svg) no-repeat center;
  background-size: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  height: 9px;
}

.FirstTime .starDeco-items{
  top: 0;
  right: 0;
}

@media screen and (min-width:768px) {
  .FirstTime .starDeco-items{
    top: 20%;
    right: 0;
  }

  ul.FirstTime-links li{
    width: calc(calc(100% - calc(var(--flex-gap) * 2) ) / 3);
  }

  a.FirstTime-links_item:hover{
    box-shadow: 0 0 2rem rgba(0, 175, 199, .4);
    transform: scale(1.02);
  }
  a.FirstTime-links_item:hover img{
    transform: scale(1.04);
  }
}


/*--------------
CardMenu
--------------*/
.cardMenu{
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}

.cardLink{
  display: block;
  position: relative;
  color: var(--color-white);
  width: 100%;
}

.cardLink>picture{
  display: block;
  position: relative;
  overflow: hidden;
    height: 65vw;
}
.cardLink>picture::before{
  position: absolute;
  content: "";
  background: var(--g-black);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

.cardLink>picture img{
  transition: var(--transition);
  width: 130%;
  height: 130%;
  object-position: center;
  object-fit: cover;
}

p.cardLink-title{
  position: absolute;
  left: 50%;
  bottom: 4%;
  transform: translate(-50%, -4%);
  text-align: center;
  font-size: min(1.2rem);
  width: 90%;
  z-index: 2;
}

p.cardLink-title span{
  position: relative;
  padding-right: 2rem;
}

p.cardLink-title span::before{
  position: absolute;
  content: "";
  background: url(img/icon-arrow_bk.svg) no-repeat center;
  background-size: 100%;
  width: min(1.6rem);
  height: min(1.6rem);
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
}


@media screen and (min-width:768px) {
  .cardLink{
    width: calc((100% - .4rem) / 2);
  }

  .cardLink>picture{
    height: min(38rem, 65vw);
  }

  .cardLink.cardLink-consultation picture{
    border-radius: 0 calc(var(--b-radius) / 2) calc(var(--b-radius) / 2) 0;
  }

  .cardLink.cardLink-facility picture{
    border-radius:calc(var(--b-radius) / 2) 0 0 calc(var(--b-radius) / 2);
  }
}

/*--------------
About Us
--------------*/
.aboutUS{
  position: relative;
}

.aboutUS.bgWave{
  padding: min(28vw) 0px 24vw;
}

.aboutUS-main{
  position: relative;
}

.aboutUS-main .starDeco-large{
  left: 5vw;
  top: -34%;
}
.aboutUS-main .starDeco-bubble{
  right: 8vw;
  top: -20%;
  width: min(8rem,20vw);
}

.aboutUS-title{
  width: min(33rem, 57%);
  z-index: 1;
  position: absolute;
  top: -8%;
  left: 6vw;
}

.aboutUS-bgImage{
  overflow: hidden;
  height: 58vw;
  margin-top: -7.24%;
}
.aboutUS-bgImage img{
  object-position: center;
  object-fit:cover;
  width: 120%;
  height: 120%;
}

.aboutUS-main_wrapper{
  width: var(--contents-width);
  margin: -8% auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  flex-wrap: wrap;
  width: var(--contents-width);
  gap: min(6vw,6rem);
}

.aboutUS-greeting{
  width: min(30rem, 73%);
}

.linkBtn.-greeting{
  background: var(--color-blue);
  font-size: min(1.4rem, 4.24vw);
  display: block;
  padding: min(2rem) min(2rem) min(3rem);
  line-height: 1.5;
}
.linkBtn.-greeting span{
  padding: 0 0 min(2rem,6vw);
}
.linkBtn.-greeting span::before{
  background: url(img/arrow2.svg) no-repeat center;
  background-size: 100%;
  right: 50%;
  top: 84%;
}

.aboutUS-links{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--flex-gap);
  justify-content: space-between;
  width: 100%;
}

.aboutUS-links h3{
  color: var(--color-blue);
  text-decoration: underline;
  font-size: min(1.24rem, 5vw);
  width: 100%;
  text-align: center;
}

.linkBox-list ul{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(var(--flex-gap) / 2);
  width: 100%;
}

.linkBox-list ul li{
  width: 100%;
}

.linkBox-list ul li a{
  font-size: min(1.3rem, 4.24vw);
  display: block;
}

.aboutUS-menuPrice{
  margin: var(--section-margin) 0 0;
}

.aboutUS-menuPrice h2,
.instagram h2{
  margin: 0 auto min(3rem, 6vw);
}
.aboutUS-menuPrice h2 img{
  display: block;
  height: min(3rem, 7vw);
  margin: 0 auto;
}

.aboutUS-menuPrice a.FirstTime-links_item{
  background: var(--color-white);
}

.instagram h2 img{
  display: block;
  height: min(4rem, 12vw);
  margin: 0 auto;
}

@media screen and (min-width:768px) {
  .aboutUS-title{
    width: 31vw;
    top: -12%;
    left: 6vw;
  }

  .aboutUS-bgImage{
    height: 32vw;
  }

  .linkBox-list ul li a:hover{
    box-shadow: var(--b-shadow-blue);
    transform: scale(1.05);
  }

  .aboutUS-links h3{
    width: 24%;
  }
  .linkBox-list ul{
    width: calc((100% - calc(var(--flex-gap))) - 24%);
  }
  .linkBox-list ul li{
    width: calc((100% - calc(var(--flex-gap) / 2)) / 2);
  }
}

@media screen and (min-width:1024px) {
  .bgWave.aboutUS{
    padding: min(24vw) 0px 16vw;
  }

  .aboutUS-main_wrapper{
    margin: -1% auto 0;
    gap: var(--flex-gap);
    justify-content: space-between;
  }

  .aboutUS-main .starDeco-large{
    left: 5vw;
    top: -35%;
  }

  .aboutUS-main .starDeco-bubble{
    right: 23vw;
    top: -35%;
  }

  .aboutUS-greeting{
    width: 23%;
  }

  .aboutUS-links{
    width: min(70%);
    gap: unset;
  }

  .linkBox-list ul{
    width: calc((100% - calc(var(--flex-gap) / 2)) - 24%);
  }
  .linkBox-list ul li{
    width: calc((100% - calc(var(--flex-gap) / 2)) / 2);
  }

}

/*--------------
Contact
--------------*/
.contact{
  margin-top: var(--section-margin);
}

.contact>.contents{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: var(--flex-gap);
}

.contact>.contents .treatment-title{
  margin:0 0 min(7rem, 10vw);
}

.contact-textArea,.contact-links{
  width: 100%;
}

.contact h2{
  margin-bottom: min(4vw,2rem);
  width: min(30rem, 57vw);
}

.contact h2 svg.scroll-svg{
  width: min(44rem, 86vw);
  margin: 0 auto;
  display: block;
  fill: #e0f6e8;
  opacity: .7;
}

p.contact-intro{
  font-size: min(1.24rem, 4vw);
}

.contact-links{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  flex-direction: column;
  gap: var(--flex-gap);
}

.contact-links>li{
  width: 100%;
}

.linkContact{
  display: flex;
  background: var(--color-white);
  border-radius: 9999px;
  align-items: center;
  justify-content: center;
  font-size: min(2rem, 4.83vw);
  line-height: 1.5;
  padding: min(1.83rem, 4vw) 0;
}

.linkContact p{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(.8rem);
}

.linkContact span{
  position: relative;
}

.linkContact.linkContact-tel{
  color: var(--color-green);
}

.linkContact-icon img{
  display: block;
}

.linkContact-tel .linkContact-icon{
    width: min(3rem, 7vw);
}

.linkContact-web .linkContact-icon{
  width: min(1.4rem, 4vw);
}

.contact>.contents .starDeco-bubble{
  top: -29%;
  right: 0;
}

@media screen and (min-width:768px) {
  .linkContact:hover{
    box-shadow: 0 0 min(2rem, 5vw) rgba(0, 175, 199, .4);
    transform: scale(1.02);
  }

  .contact>.contents .starDeco-bubble{
    top: -60%;
    right: 0;
  }
}
@media screen and (min-width:1024px) {
  .contact-textArea{
    width: calc((100% - var(--flex-gap)) / 2);
  }
  .contact-links{
    width: calc((100% - var(--flex-gap)) / 2);
  }
}


/*--------------
Instagram
--------------*/
.instagram-contents{
  padding-bottom: calc(var(--section-margin) / 3);
}

.link-contents {
  margin: 0 auto;
  text-align: center;
}

.instagram .starDeco-wave{
  top: -6%;
  left: 10vw;
}

.instagram .starDeco-large{
  top: -9%;
}


/*--------------
otherLink
--------------*/
.otherLink{
  padding-bottom:min(10rem,20vw);
  background: var(--color-white);
}

.otherLink-contents{
  text-align: center;
}

.otherLink-contents>h4{
  margin-bottom: min(2rem, 4vw);
  font-size: min(1.24rem, 4vw);
}

.otherLink-contents a{
  display: block;
  width: min(19rem, 60vw);
  margin: 0 auto;
}

@media screen and (min-width:768px) {
  .instagram .starDeco-wave{
    top: -8%;
    left: 10vw;
  }

  .otherLink-contents a:hover{
    opacity: .6;
  }
}


/*--------------
top pickUp
--------------*/
/*----- pickUp slide -----*/
.swiper-controller{
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 107%;
}

.swiper-button-prev::after,
.swiper-button-next::after {
  content: "";
  background: url(img/slider-arrow.svg) no-repeat center;
  background-size: 100%;
  width: min(.8rem, 2vw);
  height: min(.8rem, 2vw);
}

.swiper-button-next::after {
  margin-right: 0.4rem;
}

.swiper-button-prev::after {
  margin-left: 0.4rem;
}

.swiper-button-next{
  right: -2%!important;
}

.swiper-button-prev{
  left: -2%!important;
}

/*--------------
responsive
--------------*/
nav.globalMenuSp {
  display: none;
}