﻿@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500&display=swap');
body{
  font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
  
}
#catch .txt_color_nomal,#contents .font_2dw,#contents2 .font_2dw,p,.box_txt1{font-weight:400;}

#global-nav ul li a{display: inline-block;}
/*全ページ*/
#body{
   overflow:hidden;
}
html{
    font-size:120%;
}
.header_contact_link{
  display:none;
}
.index_header #global-nav li a span{
  color:white;
}
#bottom_menu li a{
   font-size:22px;
}
.nav_contents .fat-nav li a{
  font-size:25px;
}
.fat-nav li:last-child a{
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
}
#copyright{
  background-image:url(dup/img/item3.png);
  background-repeat:no-repeat;
  background-position:center left 20%;
}
#logo2 {max-width: 300px;}
.map{display:none;}
#global-nav li a span{text-align:left;}
/*.page_title_img{display:none;}*/

/*トップページ*/
.contact_box{
  z-index:51;
  right: 75px;
}
.bnr{
  right:0;
  bottom:80px;
  z-index:51;
}
.video{position:relative;}
.video:before{
  content:'';
  position:absolute;
  width:100%;
  height:2px;
  background-color:white;
  top:0;
  left:0;
  z-index:2;
}
.index_header .logo{
  background-color: rgba(255,255,255,0.5);
}
.index_header #global-nav li{
  text-align:left;
}

.index_header #global-nav ul li{
   margin: 0 0 10px;
}
#global-nav li a span{
   font-size:23px;
}
#global-nav ul li a .after{background-color:white!important;}
#catch{
   border-bottom:0;
}
#catch .intro_p{
   font-size:22px;
}
#catch h2{
   font-size:calc(2rem - 5px)!important;
}
#catch h2 span{
   height:1px!important;
   opacity:1;
   background-color:#584f48!important;   
}
#contents{
   background-image:url(dup/img/item2.png);
   background-repeat:no-repeat;
   background-position:top 60% left 30%;

}
#contents h2 span{
  background-color:#584f48!important;
}
#contents .contents_txt,#contents .contents_txt p{
    background-color:transparent;
}
#contents .contents_inner .contents_txt p{
   margin-right: 0;
   padding:30px;
}
#contents2{
   position:relative;
    margin-top:150px;
}

#contents2 .contents_txt h2 span{
   background-color:white;
}
#top_cms h2{margin-bottom:0!important;
}

#top_cms .more a,#info .more a{
  font-size:25px;
}
.more a{background-color:#846b52;}
.more a:hover{
  background-color:#83ac76;
  transition:all 0.3s;
}

/*下層ページ*/
#header .nav_box{
  background-color:transparent;
}
.page_title_img{width:100%!important;}
#page_title h2{
  font-size:40px;
  margin-bottom:0;
  color: #6d5039;
}
#page_title p{
  font-size:1rem!important;
}
#page_title .page_title_inner span{
  background-color:#83ac76!important;
  top: 160px;
}
.cate_list li{width:300px;}
.cate_list li a{
  border-radius:12px;
  background-color:#83ac76;
  padding:20px;
}
.cate_list li a:hover{
  transition:all 0.3s;
  background-color:#846b52;
}
#cms_3-a .cate .cate_box:last-of-type {
   border-bottom: 1px dotted #697A84!important;
}
#cms_5-a #cate2 .box_wrap{display:block;}
#cms_5-a .cate_img_box{width:40%;}

.bnr_sp{display:none;}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.logo{width:100%!important;}
.all_header #global-nav ul li {padding: 0 0%;}
.contact_box{
  width:100%;
  right:10%;
}
#global-nav ul{justify-content:space-betweeen;}
#global-nav li a span{
   text-align:center;
   font-size: 14px;
}

#contents{
   background-position: center bottom;
}
#catch h2 span,#contents2 .contents_txt h2 span{
  display:none!important;
}
#contents .contents_inner .contents_txt p{
   margin-right:0;
}
.cate_list li {width: 300px;}
.cate_list li {margin: 0 20px 20px;}
.cate_list li a {padding: 25px 30px;}
#page_title .page_title_inner span {
    top: 160px;
}
.nav_box{
   background-image:none;
   z-index:2;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.index_header #logo {
    max-width: 150px;
}
#logo{
  width:60%!important;
  max-width:210px;
}
#contents{
    background-position: center center;
    background-size: 80%;
}
#main_img .inner{
   padding-bottom:0!important;
}
#contents .contents_inner .contents_txt p{
  margin-right:0;
}
.hamburger{
   top: 20px;
}
.hamburger__icon{
   margin-top: 13px;
}
.nav_contents .fat-nav li a{
   font-size: 20px;
   line-height:1.3;
}
#catch h2 {
    font-size: calc(1rem + 7px)!important;
    letter-spacing:0;
}
#top_cms .cms_title_inner span{
  display:none!important;
}
#page_title{
  padding-top: 0!important;
}
#page_title .page_title_inner span {
    top: 140px;
}
#copyright{
    background-size: 50%;
}
.cate_list li{
  width:90%!important;
}

.cms_3-a .cate {margin-bottom: 40px;}
.more-btn p{width: 50%;}
#cms_5-a .cate_img_box{width:100%;}
#page_title .page03_title h2{
  font-size: 26px;
  letter-spacing:1px;
}
#page_title h2{
  font-size: 28px;
  letter-spacing:2px;
}

}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
#contact_tel a{
   padding-top:35px;
   padding-bottom:25px;
}
.more a{
   padding:12px 10px 13px;
}
#cms_6-a .bnr a{
   padding:25px 20px 18px;
}
#page4 .cate_title{padding:15px 10px 5px!important;}
.more a{padding:16px 10px 7px;}
.more-btn p{padding:12px 20px 5px;}
}

/*------------20210412以降-----------------------------*/
#contents2 .box{margin-bottom:100px;}
.merit h3{
  font-size:calc(2rem - 5px);
  font-weight:bold;
}
.merit1_img,.merit2_img,.merit3_img{margin-top:-20px;}
h2,h3{font-weight:bold;}
#contents .contents_inner h2,#contents .contents_txt h2{font-size:calc(2rem - 5px);}
#contents2 .contents_txt h2{font-size:calc(2rem - 7px);}

/* ----- top cms ----- */
.cms_2-b{
	position: relative;
}
.cms_2-b .swiper-button-prev,.cms_2-b .swiper-button-next{
	top: 50%;
	transform: translate(0,-50%);
	width: auto!important;
	height: auto!important;
	font-size: 30px;
}
.cms_2-b .swiper-button-prev{
	left: 10px;
}
.cms_2-b .swiper-button-next{
	right: 10px;
}
.cms_2-b .swiper-button-next,.swiper-button-prev{display:block;}

/*--modal--*/
.modal_erea{border-color:#ccc;}
.modal_bg{
     top: 0;
     left: 0;
     background-color: rgba(0,0,0,0.8);
     z-index: 9;
}
.modal_box{
     max-height: 80%;
     overflow-y: auto;
     z-index: 10;
}
.modal_btn{cursor:pointer;}
.modal_btn,.close_bt,.close_bt a,.sanka a{border-radius:12px;}
.modal_erea .box_item2{
display:flex;
flex-direction:column;
flex-grow:1;
}
/*.modal_btn{margin-top:auto;}*/
.modal_btn{margin-top:0;}

.close_bt{cursor: pointer;}
#cms_2-b .cate_wrap{justify-content:center;}
.main_box{
  /*height:88vh;*/
    height: calc(100vh - 110px);
    max-height: calc(100vh - 110px);
    align-items: stretch;
  padding:0 2%;
  overflow:hidden;
}
#global-nav ul li a span{letter-spacing:1px!important;}
#header{padding:0 2%;height: 105px;}
#logo{
  max-width:400px;
  padding:10px;
}
.merit .m1 img,.merit .m2 img,.merit .m3 img{border-radius:15px;}
.index_nav{
    background-color: #83ac76;
    border-radius: 12px 0 0 12px!important;
}
#video{
height: calc(100vh - 110px);
}

.hamburger{
  width:75px;
  height:80px;
  top:0;
  right:0;
  padding:25px 43px 12px 23px;
  border-radius:0 0 0 10px;
}

.more a{border-radius:12px;}
#global-nav{border-radius:12px 0 0 12px!important;}
.contact_box .line a .img{
  width:136px;
  height:80px;
  background:url(./Dup/img/line2.png);
}
.contact_box .line a .img:hover{
  transition:all 0.3s;
  background-image:url(./Dup/img/line_hvr.png);
}
.contact_box .con_tel a .img{
  width:250px;
  height:80px;
  background:url(./Dup/img/tel2.png);
}
.contact_box .con_tel a .img:hover{
  transition:all 0.3s;
  background-image:url(./Dup/img/tel_hvr.png);
}
p.gotop{border-radius:5px;}
.cms_title h2{font-size:calc(2rem - 5px);}
#info .more{margin-bottom:50px;}
.cms_1-f h3{font-weight:normal;}
.fat-nav.active li a .after{background-color:white;}
#top_cms .cms_title .cms_title_inner span{background-color:#83ac76!important;}
#global-nav ul li a span{line-height:1.5;}
.fa-phone-alt:before {content: "\f095";}

/*--------------お問合せページ---------------------------------*/
.bnr_box1{justify-content:space-between ;}
.bnr_box1 a{width:200px;}
.bnr_box1 .telbnr a{line-height: 1.9;}

/*---------イベントスクール情報----------------------*/
.modal_erea .box_title1{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height:4em;

    /*IE対策*/
    line-height: 1.5em;
    max-height: 4em;

}
.eve_data,.eve_data + div{
     border-bottom:2px dashed  #83ac76;
     padding:10px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height:4.2em;

    /*IE対策*/
    line-height: 1.5em;
    /*max-height: 4em;*/
}
.eve_data + div{margin-bottom:30px;}

/*空白処理*/
/*#page5 .eve_data:empty{display:block!important;}*/



/* ---------- responsive ---------- */
@media screen and (max-width: 1300px){
#global-nav{display:none;}
#main_img{width:100%!important;}
.sp_line{
  display:block;
  top: 8px;
  right: 80px;
  z-index:999;
}
header .all_header{padding-bottom:0!important;}
.contact_box{display:none;}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
header{padding-bottom:0;}
#logo {max-width: 300px;}
.index_header #logo{width:40%!important;}
.main_box{height:45vh;}
.sp_line{
  top: 20px;
  right: 70px;
  z-index:999;
}
#contents2{margin-top:0;}
.hamburger{
  width:30px;
  height:50px;
  top:20px;
  right:10px;
  padding:12px 42px 12px 12px;
  border-radius:8px;
}
#header{height:90px;}
#video{height:initial;}
.cate_list li a {padding: 12px 30px;}
#copyright{padding-bottom:70px;}
#contents2 .tb_h2{padding:0 10px;}
#contents2 .contents_img{width:95%!important;}
.merit h3{font-size:calc(1rem + 8px);}
.cms_title h2{font-size:calc(1rem + 8px);}
.cms_3-a .cate_title{font-size:calc(1rem + 3px);}
/*---------bnr_sp---------*/
.bnr_sp {
  display:block;
  position: fixed;
  right: 80px;
  bottom: 10px;
  z-index: 99;
}
.bnr_sp img {
  width: auto;
  height: 50px;
}
/*---サロンメニュー---*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes slideDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes slideDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.slide-down {
  -webkit-animation-name: slideDown;
  animation-name: slideDown;
}
@-webkit-keyframes slideUp {
  0% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes slideUp {
  0% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
.slide-up {
  -webkit-animation-name: slideUp;
  animation-name: slideUp;
}
.content-wrap {
  /*height: 270px;*/
  overflow: hidden;
  position: relative;
  margin: 0;
}
/*test*/
.cms_3-a .cate_txt1 {
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;

    /*IE対策*/
    line-height: 1.5em;
    max-height: 10.5em;
}


/*--サロンメニューここまで--*/
#page_title h2 {font-size: 30px;}
.bnr_box1 .img{margin:10px auto;}
}


/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.merit h3{
  margin-bottom:20px;
  font-size:calc(1rem + 6px);
}
.sp_line{
  top: 20px;
}
#main_img{margin-top:0;}
.main_box{height:35vh;}
.index_header #logo{
  width:60%!important;
  max-width:210px;
  padding:0;
  padding-top:20px;
}
#contents .contents_inner .contents_txt p{padding:0;}
#contents2{margin-top:20px;}
#contents2 .contents_txt{padding:30px 10px 30px;}
#contents .contents_inner h2{font-size:calc(1rem + 6px);}
.all_header #logo{margin-top:10px;}
.hamburger{
  width:50px;
  height:50px;
  top:20px;
  right:10px;
  padding:10px 38px 30px 13px;
}
.catch_txt .txt_color_nomal,.contents_txt p{line-height:1.7;}
.merit{margin-bottom:0;}
#top_cms .more a, #info .more a {font-size: 20px;}
#top_cms .cms_title .cms_title_inner {padding-bottom: 25px;}
#top_cms .more{margin-top:0!important;}
.top_cms_box {margin-bottom: 120px;}
#info > p{font-size:calc(1rem - 3px);}
#info .more{margin-bottom:30px;}
#contents2 .contents_img{width:85%!important;}
.bnr_sp { right: 70px;}
.bnr_sp a {
  width: 100%;
  height: auto;
}
/*.content-wrap,.slide-up {height: 260px;}*/

/*-----お問合せページ-----*/
.bnr_box1 a{width:100px;}
.bnr_box1 .telbnr a{line-height: 1.8;}
}



/*20210519*/
.page_title_img{display:none;}
#page5 .eve[data-show=""]{display:none;}