@charset "UTF-8";

#banner + .composite_box01 .inner_item>a:hover * {
  opacity: 1;
}
#banner + .composite_box01 .inner_item_img img {
  object-fit: contain;
}
#banner + .composite_box01.block_images_1 a+.inner_item_txt {
  margin-top: initial !important;
}
@media screen and (max-width: 768px){
#banner + .composite_box01 .inner_item {
  width: 100% !important;
  margin-left: initial !important;
}
#banner + .composite_box01 .inner_item:nth-child(1) {
  margin-bottom: 2rem !important;
}
}

/*--お悩みから探す--*/
.menu_item_child{
  display:none;
}

.menu_item_child.-active{
  display:block;
}

#main.-active{
    position: fixed;
    width: 100%;
    height: 100vh;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 99999;
}

#menu_list + section.-active{
    position: fixed;
    width: 100%;
    height: 100vh;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 99999;
    padding-top: 0;
}

#menu_list + section .menu_wrap.-active{
    display: block;
    position: fixed;
    width: 100%;
    height: 100vh;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: #000;
}


/*--施術メニューから探す--*/
#tab_item + section .area {
  width: 100%;
  margin: auto;
  flex-wrap: wrap;
  display: flex;
}
 
#tab_item + section .tab_class {
    width: calc(100% / 3 - 2%);
    min-height: 100px;
    background-color: rgb(242, 242, 242);
    line-height: 3rem;
    font-size: 15px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    order: -1;
    padding: 1rem;
    box-sizing: border-box;
    margin: 1% 1%;
    transition:0.3s all;
}
 
#tab_item + section .tab_class:hover{
  opacity: 0.7;
}

#tab_item + section input[name="tab_name"] {
  display: none;
}
 
#tab_item + section  input:checked + .tab_class {
  background-color: var(--i_btn_color);
  color: aliceblue;
}
 
#tab_item + section .content_class {
  display: none;
  width: 100%;
  /* gap:2rem; */
}

#tab_item + section .content_class a{
  width: calc(94% / 3 - 2%);
  margin: 1%;
  min-width: inherit;
}
#tab_item + section input:checked + .tab_class {
     background-color: #c591df;
     background-color: #FFE5E5;
     color: #575757;
}
#tab_item + section input:checked + .tab_class + .content_class {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#tab_item + section .contents_btn01 a {
     /*background-color: #D5A8EB;*/
     background-color: #FFE5E5;
     /*border-color: #d19ceb ;*/
     border-color: #FFE5E5;
     display: flex;
     justify-content: center;
     align-items: center;
}
#tab_item + section .contents_btn01 a::before {
    border-top: 1px solid #575757;
    border-right: 1px solid #575757;
}
#tab_item + section .contents_btn01 a:hover::before {
    border-top: 1px solid #575757;
    border-right: 1px solid #575757;
}
#tab_item + section .contents_btn01 a span {
  color: #575757;
}
#tab_item + section .contents_btn01 a:hover span {
  color: #575757 !important;
}
@media screen and (max-width:500px){
  #tab_item + section .tab_class {
    width: calc(100% / 2 - 2%);
  }
  #tab_item + section input:checked + .tab_class + .content_class {
    gap :0;
  }
  #tab_item + section .content_class a {
    width: calc(84% / 2 - 2%);
    width: calc(100% / 2 - 11%);
    margin: 1%!important;
  }
}


/*--お悩みから探すパーツ修正--*/
#top_anchor + div .content_wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

#top_anchor + div .content_wrapper a {
    width: calc(25% - 10px / 4)!important;
}

#top #menu_list + section .menu_item_child.-active {
    justify-content: flex-start;
}

@media screen and (max-width: 768px) {
    #top #menu_list + section .menu_item_child a span {
    text-align: left;
}
}

/*------------------ギャラリー------------------------*/
#top_gallery+div .wrapper_item{
    position: relative;
}
#top_gallery+div .wrapper_item::after{
    content: "";
    display: block;
    background: linear-gradient(-40deg,#eae098,#d383cd,#a2b5dc,#cbd6ae);
    animation: movingGradient 15s ease infinite;
    background-size: 150% 150%;
    position: absolute;
    width: 80%;
    right: calc(-2vw + -20px);
    bottom: -15px;
    opacity: .5;
    z-index: -1;
    height: calc(50% + 35px);
}

@media screen and (min-width: 1300px){
    #top_gallery+div .wrapper_item::after{
        height: calc(50% + 20px + 1.7vw);
    }
    #top_gallery+div .wrapper_item .slick-list{
        max-width: 1800px!important;
        margin: 0 auto;
    }
    #top_gallery+div .content_wrapper{
        max-width: 100%!important;
    }
}

@media screen and (max-width: 500px){
    #top_gallery+div .wrapper_item::after{
        height: calc(50% + 50px);
        right: calc(-2vw + -30px);
    }
}

/*------------------代表挨拶------------------------*/
[id^=top_title_big] +section .inner_item_img{
    position: relative;
}
[id^=top_title_big] +section .inner_item_img::after{
    content: "";
    display: block;
    animation: movingGradient 15s ease infinite;
    position: absolute;
    z-index: 0;
    width: 99%;
    height: 68%;
    top: 41%;
    left: 6.5%;
    background: -webkit-linear-gradient(130deg,rgba(254,245,178,.5),rgba(219,148,214,.5),rgba(191,206,236,.5),rgba(230,238,207,.5)) #fff;
    background: linear-gradient(-40deg,rgba(254,245,178,.5),rgba(219,148,214,.5),rgba(191,206,236,.5),rgba(230,238,207,.5)) #fff;
    background-size: 150% 150%;
    z-index: -1;
}
[id^=top_title_big] +section .inner_item_txt p:nth-last-of-type(1){
    font-family: 'Noto Serif JP',sans-serif;
}
@media screen and (max-width: 900px){
    [id^=top_title_big] +section .inner_item_img{
        width: 93%;
    }
    [id^=top_title_big] +section .inner_item_img::after{
        background: linear-gradient(-40deg,#FEF5B2,#DB94D6,#BFCEEC,#E6EECF);
        background-size: 150% 150%;
        -webkit-animation: movingGradient 15s ease infinite;
        animation: movingGradient 15s ease infinite;
        position: absolute;    width: 100%;
        height: 71%;
        opacity: .8;
        top: auto;
        bottom: -11%;
        right: -8%;
        left: auto;
    }
    [id^=top_title_big] + section .inner_item_txt{
        margin-top: 11%;
    }
}

@keyframes movingGradient{
    0%, 100% {
        background-position: 0 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

/*非表示*/
i.material-icons{
  display:none;
}

/*バナー*/
#top_banner + div .wrapper_item {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    justify-content: center;
}

#top_banner + div .inner_item {
    margin-left: 0;
}

#top_banner + div .inner_item_img img {
  object-fit: contain;
}
#tab_item + section .contents_btn01 a span, 
#f_no + div.contents_btn01 a span  {
    font-family: inherit;
    font-weight: 500;
}
#btn1 + .contents_btn01 a span {
    font-family: inherit;
    font-weight: 500;
}

[id^=top_title_big] + section .inner_item_txt span.name_en {
  font-family: "Cormorant", serif;
}
/*--代表、院長画像後ろの背景色の削除--*/
[id^=top_title_big] +section .inner_item_img::after {
  display: none;
}
#top_title_big1 + section {
  overflow: initial;
  margin-top: min(15rem, -9vw);
}
@media screen and (max-width: 900px) {
    #top_title_big1 + section {
      margin-top: 0;
    }
}
/*余白調整*/
@media screen and (max-width: 900px) {
    #top_title_big1 + section {
        margin-top: 11%;
        margin-bottom: 100px;
    }
}


/*----- TOP_GALLERY 背景削除
------------------------------------------*/
#top_gallery+div .wrapper_item::after{
    display: none;
}

/*フォントサイズ調整*/
#top_about_org + section .f_en{
  font-size: 20px;
  color: #B28575;
}
#top_about_org + section .f_01{
  font-size: 36px;
}
#top_about_org + section .f_02{
  font-size: 26px;
}
#top_about_org + section .f_03{
  font-size: 16px;
}
#top_about_org + section .inline_block{
  display: inline-block;
}
@media screen and (max-width: 900px){
  #top_about_org + section .f_en{
    font-size: min(20px,4.2vw);
  }
  #top_about_org + section .f_01{
    font-size: min(36px,6vw);
  }
#top_about_org + section .f_02{
    font-size: min(26px,5vw);
  }
#top_about_org + section .f_03{
    font-size: min(16px,4vw);
  }
  #top_about_org + section .inner_item_txt p{
    margin-bottom: 0;
  }
}

/* 永続スライダーの動き等速 */
.swiper_about .swiper-wrapper {
  transition-timing-function: linear;
}

.swiper_about .swiper-wrapper .swiper-slide{
  position: relative;
  /*aspect-ratio: 3 / 2;*/
  aspect-ratio: 555 / 358;
}

.swiper_about .swiper-wrapper .swiper-slide img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  object-fit: cover;
  width: 100%;
  height: 100%;
  object-position: center;
}
.widget_instagram01 a[href="#"] {
    display: none;
}

/*キャンペーンスライダー*/
.swiper.swiper_camp {
  width: 100%;
  height: 100%;
  padding-bottom: 40px;
}
.swiper.swiper_camp .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.swiper.swiper_camp .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.swiper.swiper_camp .swiper-pagination-bullet{
  width: 7px;
  height: 7px;
} 
.swiper.swiper_camp.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  margin: 0 3px;
}
.swiper.swiper_camp .swiper-pagination-bullet-active{
  background: var(--i_btn_color);
}
#top_slide_org + .width_fixed>.content_wrapper{
  max-width: 100% !important;
  padding: 0;
}
/*TOPインスタグラムボタン*/
#top_instagram + .widget_instagram01 .contents_btn01 a span{
  color: transparent;
}
#top_instagram + .widget_instagram01 .contents_btn01 a:after{
  position: absolute;
  content: "READ MORE";
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  color: #fff;
}
#top_instagram + .widget_instagram01 .contents_btn01 a:hover:after{
  color: var(--i_btn_color);
}

/*-------------------ギャラリー下のHTMLパーツ------------------------*/
/* このスライダーだけ等速にする */
a#top_slide_org + section .swiper_camp .swiper-wrapper {
  transition-timing-function: linear !important;
  will-change: transform;
}

a#top_slide_org + section .swiper_camp .swiper-slide {
  backface-visibility: hidden;
  aspect-ratio: 555 / 358;
}

a#top_slide_org + section .swiper_camp .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
