@charset "utf-8";
/* @group reset */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border:0;
	outline: 0;
}
html {
	overflow: inherit;
	height: 100%;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display:block;
}
a {
	display:inline;
}

body {
	letter-spacing:0;
	-webkit-text-size-adjust: 100%;
}
h1, h2, h3, h4, h5, h6, p, td, th, address {
	font-size:100%;
	font-weight:normal;
}
ol,ul {
	list-style: none;
}

fieldset,img { 
	border: 0;
}
img {
	vertical-align:top;
}
table {
	width:100%;
	border: 0;
	border-collapse: collapse;
	border-spacing: 0;
}
th, td {
	text-align:left;
	vertical-align:top;
}
caption,th {
	text-align: left;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal;
	font-weight: normal;
}
sup {
	font-size:62.5%;
	vertical-align: text-top;
}
* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

html { font-size: 62.5%; }

/* @end */

body {
    font-family: 'Zen Maru Gothic', sans-serif;
    font-weight: 400;
	font-size: 1.8rem;
	line-height: 2;
    color: #6a3906;
    background-color:#fcf5f0;
    }    
    
img{
max-width: 100%;
height: auto;
}

#wrapper {
	width: auto;

}
#conteiner {
	height: 100%;
	margin: 0 0 0 0;
	width:100%;
    margin:0 auto;
    

}

.image-vw {
  width : 100vw ; 
}
strong {
  font-weight: 700;
}
p {
  margin-bottom: 5%;
}
#pageTop{
	position: fixed;
	bottom:5%;
	right: 5%;
	width:5%;
    z-index: 999;
	}
    
.center{
  display: block;
  text-align: center;
}
.right{
  display: block;
  text-align: right;
}
.sm { display: none; }  /* miniを非表示 */
.pc  { display: block; } /* bigを表示 */
.br_sp  { display: none; }
.shadow{
    text-shadow: 2px 2px 10px #f9ede4 ,
    -2px 2px 10px #f9ede4 ,
    2px -2px 10px #f9ede4 ,
    -2px -2px 10px #f9ede4;}


/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
 body {
	font-size: 1.6rem;
    font-weight: 500;

    } 
#pageTop{
	position: fixed;
	bottom:10%;
	right: 5%;
	width:20%;
	}
    
.sm { display: block; }  /* miniを表示 */
.pc  { display: none; } /* 非bigを表示 */
.br_sp  { display: block; }
}


/*　タブレット　*/
@media screen and (min-width:600px) and (max-width:1389px) {
body {
	font-size: 1.5em;
}
#pageTop{
	position: fixed;
	bottom:5%;
	right: 5%;
	width:12%;
	}

}

/*フォント*/


.font_65 {
  font-size: 6.5rem;
}
.font_55 {
  font-size: 5.5rem;
}
.font_45{
  font-size: 4.5rem;
}
.font_30{
  font-size: 3.0rem;
}
.font_25{
  font-size: 2.5rem;
}
.font_22{
  font-size: 2.2rem;
}
.font_18{
  font-size: 1.8rem;
}
.font_15{
  font-size: 1.5rem;
}
.font_12{
  font-size: 1.2rem;
}
.light   { font-weight: 300; }
.normal  { font-weight: 400; }
.medium  { font-weight: 500; }
.bold    { font-weight: 700; }
.black   { font-weight: 900; }

.font_en {
  font-family: "Delius", cursive;
  font-weight: 400;
  font-style: normal;
}
.font_w{
  color: #fff;
}
.font_g{
  color: #52b7b8;
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.font_65 {
  font-size: 2.0rem;
}
.font_55 {
  font-size: 2.0rem;
}
.font_45{
  font-size: 2.0rem;
}
.font_30{
  font-size: 1.8rem;
}
.font_25{
  font-size: 1.8rem;
}
.font_22{
  font-size: 1.8rem;
}
.font_18{
  font-size: 1.7rem;
}
.font_15{
  font-size: 1.4rem;
}
.font_12{
  font-size: 1.2rem;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.font_65 {
  font-size: 1.9rem;
}
.font_55 {
  font-size: 1.9rem;
}
.font_45{
  font-size: 1.9rem;
}
.font_30{
  font-size: 1.9rem;
}
.font_25{
  font-size: 1.9rem;
}
.font_22{
  font-size: 1.7rem;
}
.font_18{
  font-size: 1.6rem;
}
.font_15{
  font-size: 1.1rem;
}
}

/*フォントおわり*/


/*トップコンテンツ*/

.top_contents{
  background: url("../img/top_bg.png") no-repeat top;
  background-size: contain;
}
.rogo_con{
  text-align: center;
  padding: 0.5% 0 2%;
}
.rogo_con h1{
  text-align: center;
  padding: 0 0 2%;
  font-size: 1.3rem;
}
.rogo_con img{
  width:9%;
}
.contents{
  width: 90%;
  max-width: 1920px;
  margin: 0 auto;
}
.top_menu{
  width: 36.6%;
  margin-top: 18%;
  padding-bottom: 18%;
}
.top_menu ul{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
li.top_menu_border{
  flex-basis: 32%;
  aspect-ratio: 1 / 1;    /* 正円を維持 */
  background: #fff;
  border-radius: 50%;
  position: relative;
  margin: 3px 0;
  background: linear-gradient(-120deg, #52b7b8, #45b144); /* 縁の色 */
  padding: 6px;  /* 縁の太さ */
  
}
.top_menu_inner{
  width: 100%;
  height: 100%;
  background: #fff;   /* 中の色 */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  
}
.top_menu_text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 80%;             /* 円の中での横幅を％指定 */
}

.line1 {
  display: block;
}

.line2 {
  display: block;
  font-size: 100%;        /* 円サイズに対して％指定 */
  margin-top: 4%;
  line-height: 1.5;
}


/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.top_contents{
  background-size: contain;
}
.contents{
    width: 95%;
    margin: 0 auto;
}
.top_menu{
  width: 55%;
    padding-bottom: 1%;
}
.rogo_con img{
  width: 15%;
}
.rogo_con h1{
  font-size: 1.0rem;
}
li.top_menu_border{
  padding: 4px;  /* 縁の太さ */
  
}
.line1 img {
  width: 30%;
}
.line2 {
  font-size: 90%;        /* 円サイズに対して％指定 */
  margin-top: 4%;
  line-height: 1.5;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.top_contents{
  background: url("../img/sp_top_bg.png") no-repeat top;
    background-size: contain;

}
.rogo_con h1{
  text-align: center;
  padding: 0 0 2%;
  font-size: 1.0rem;
}
.rogo_con{
  line-height: 1.5;
}
.rogo_con img{
  width: 30%;
}
.contents{
    width: 90%;
    margin: 0 auto;
}
.top_menu{
  width: 100%;
  margin-top: 350px;
  padding-bottom: 20px;
}
li.top_menu_border{
  padding: 4px;  /* 縁の太さ */
  
}
.line1 img {
  width: 30%;
}
.line2 {
  font-size: 85%;        /* 円サイズに対して％指定 */
  margin-top: 4%;
  line-height: 1.5;
}
}

/*トップコンテンツおわり*/


/*ナビゲーション*/

/*========= 上部固定させるためのCSS ===============*/

.sp_nav{
  display: none;
}

#header{
	height: 70px;/*高さ指定*/
    width:100%;
    margin: 0 auto;
    text-align: center;

}

/*JSを使いfixedクラスが付与された際の設定*/
#header.fixed{
    position: fixed;/*fixedを設定して固定*/
  z-index: 999;/*最前面へ*/
  top:30px;/*位置指定*/
  left:0;/*位置指定*/
}
nav ul{
list-style: none;
display: flex;
justify-content: center;
font-weight: 500;
}

nav ul li a{
text-decoration: none;
padding:10px;
}

.nav_tel{
　display: inline-block;
  background-color: #6a3906;
  color: #fff;
  padding: 0 15px 0;
  border-radius: 30px;   /* 角丸 */
    font-size: 2.2rem;
  transition: 0.3s;
    line-height: 1.5;
    margin: 0 5px;
}
.nav_gra{
　display: inline-block;
  background: linear-gradient(-120deg, #52b7b8, #45b144);
  transition: 0.3s ease;
  color: #fff;
  padding: 4px 30px 0;
  border-radius: 30px;   /* 角丸 */
  transition: 0.3s;
    line-height: 1.5;
    margin: 0 5px;
    justify-content: center;
}
.nav_tel:hover {
  opacity: 0.7;
  transform: translateY(-2px);
}
.nav_gra:hover {
  opacity: 0.7;
  transform: translateY(-2px);
}


/*　スマホ・タブレット　*/
@media screen and (max-width : 1389px ){ 
 
.pc_nav{
  display: none;
}
.sp_nav{
  display: block;
}
/*========= ナビゲーションのためのCSS ===============*/

#g-nav{
    /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
    position:fixed;
    z-index: 999;
    /*ナビのスタート位置と形状*/
	top:0;
    left: -120%;
	width:100%;
    height: 100vh;/*ナビの高さ*/
	background-color: rgba(82,183,184,0.9);
    /*動き*/
	transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive{
    left: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    /*ナビの数が増えた場合縦スクロール*/
    position: fixed;
    z-index: 999; 
    width:100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
    /*ナビゲーション天地中央揃え*/
    position: absolute;
    z-index: 999;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    flex-direction: column;
}

/*リストのレイアウト設定*/

#g-nav li{
	list-style: none;
    text-align: center; 
}

#g-nav li a{
	color: #fff;
	text-decoration: none;
	padding:15px;
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: bold;
}

/*========= ボタンのためのCSS ===============*/
.openbtn{
	position:fixed;
    z-index: 9999;/*ボタンを最前面に*/
	top:50px;
	right: 10px;
	cursor: pointer;
    width: 50px;
    height:50px;
}
	
/*×に変化*/	
.openbtn span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
	background-color: #6a3906;
  	width: 45%;
  }

.openbtn span:nth-of-type(1) {
	top:15px;	
}

.openbtn span:nth-of-type(2) {
	top:23px;
}

.openbtn span:nth-of-type(3) {
	top:31px;
}

.openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;
}
}

/*ナビゲーションおわり*/

/*メイン*/

section{
  margin: 0 auto 15px;
  width: 80%;
  padding-bottom: 3%;
  max-width: 1920px;
  
}
.con_70{
  margin: 0 auto;
  width: 87.5%;
  
}
h5{
  font-family: "Delius", cursive;
  font-weight: 700;
  font-style: normal;
  color: #52b7b8;
  font-size: 5.5rem;
}
h2{
  font-size: 2.2rem;
  font-weight: 700;
}
h3{
  line-height: 2;
}
h4{
  font-size: 3.0rem;
  font-weight: 700;
  margin: 5px 0;
}
.se_cal{
  display: flex;
  margin: 5px 0;
  justify-content: space-between;
  flex-wrap: wrap;
}
.naka_tit{
  line-height: 1.5;
}
.naka_tit_con{
  line-height: 1.5;
  margin-bottom: 20px;
}
.naka_tit_con ul{
  display: flex;
}
.naka_tit_line{
  margin-top: 1.5%;
}


/*==================================================
ふわっ
===================================*/


/* fadeUp */

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:0.9s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.fadeUpTrigger{
    opacity: 0;
}

/*========= 一文字づつ流れるテキスト ===============*/

.eachTextAnime span{opacity: 0;}
.eachTextAnime.appeartext span{ animation:text_anime_on 1s ease-out forwards; }
@keyframes text_anime_on {
	0% {opacity:0;}
	100% {opacity:1;}
}


/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {
 
section{
  margin: 0 auto 3%;
  width: 90%;
  
}
.con_70{
  margin: 0 auto;
  width: 95%;
}
h5{
  font-family: "Delius", cursive;
  font-weight: 700;
  font-style: normal;
  color: #52b7b8;
  font-size: 4.0rem;
}
h2{
  font-size: 2.0rem;
  font-weight: 700;
}
h3{
  line-height: 2;
}
h4{
  font-size: 2.0rem;
  font-weight: 700;
  margin: 5px 0;
}
.naka_tit{
  line-height: 1;
}
.naka_tit_con{
  line-height: 1.5;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
section{
  margin: 0 auto 3%;
  width: 92%;
}
.con_70{
  margin: 0 auto 3%;
  width: 95%;
}
h5{
  font-family: "Delius", cursive;
  font-weight: 700;
  font-style: normal;
  color: #52b7b8;
  font-size: 4.0rem;
}
h2{
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 2;
}
h3{
  line-height: 2;
}
h4{
  font-size: 1.7rem;
  font-weight: 700;
  margin: 5px 0;
}
.se_cal{
  display: flex;
  margin: 5px 0;
  flex-direction: column;
  justify-content: space-around;

}
.naka_tit{
  text-align: center;
  line-height: 1;
}
.naka_tit_con{
  line-height: 1;
}
}

/*メインおわり*/

/*冒頭文*/

.main_top{
  margin: 5% 0;
  width: 100%;
}
.main_top_topimg{
 background: url("../img/nami02.png") no-repeat center;
  background-size: cover;
  height: 24vh;
}
.main_top_bottomimg{
 background: url("../img/nami01.png") no-repeat center;
  background-size: cover;
  height: 26vh;
}
.main_top_center{
  background-color: #52b7b8;
}
.main_top_80{
  width: 80%;
  margin: 0 auto;
  display: flex;
  max-width: 1920px;
}

ul.main_top_con_left{
  display: flex;
  padding: 3% 0;
  width: 50%;
  justify-content: space-around;
  margin: 0 auto;
}
ul.main_top_con_right{
  display: flex;
  padding: 3% 0;
  width: 50%;
  justify-content: space-around;
  margin: 0 auto;
}
li.main_top_text{
  writing-mode: vertical-rl;   /* 右から左へ縦書き */
  text-orientation: upright;   /* 文字を正立 */
  font-size: 3.0rem;
  font-weight: 700;
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.main_top_topimg{
 background: url("../img/nami02.png") no-repeat center;
  background-size: cover;
  height: 9vh;
}
.main_top_bottomimg{
 background: url("../img/nami01.png") no-repeat center;
  background-size: cover;
  height: 9vh;
}
.main_top_80{
  width: 90%;
  margin: 0 auto;
  display: flex;
}
li.main_top_text{
  writing-mode: vertical-rl;   /* 右から左へ縦書き */
  text-orientation: upright;   /* 文字を正立 */
  font-size: 2.0rem;
  font-weight: 700;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.main_top_topimg{
 background: url("../img/sp_nami01.png") no-repeat center;
  background-size: cover;
  height: 16.5vh;
}
.main_top_bottomimg{
 background: url("../img/sp_nami02.png") no-repeat center;
  background-size: cover;
  height: 16.5vh;
}
.main_top_80{
  width: 80%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  }
  ul.main_top_con_left{
  display: flex;
  padding: 3% 0;
  width: 100%;
  justify-content: space-around;
  margin: 0 auto;
  order: 2;
}
ul.main_top_con_right{
  display: flex;
  padding: 3% 0;
  width: 100%;
  justify-content: space-around;
  margin: 0 auto;
}
li.main_top_text{
  writing-mode: vertical-rl;   /* 右から左へ縦書き */
  text-orientation: upright;   /* 文字を正立 */
  font-size: 1.7rem;
  font-weight: 700;
}
}

/*冒頭文おわり*/

/*お知らせ*/
.news_left{
  display: flex;
  justify-content: center; /* 横中央 */
  align-items: center;     /* 縦中央 */
  height: 400px;
  width: 50%;
}
.news_right{
  width: 50%;
  padding-top: 7%;
}
.news_date{
    flex-basis: 20%;
}
.news_text{
    flex: 1;
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.news_left{
  display: flex;
  justify-content: center; /* 横中央 */
  align-items: center;     /* 縦中央 */
  height: 300px;
  width: 30%;
}
.news_right{
  width: 70%;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.news_left{
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: center; 
  align-items: top; 
  height: 100px;
}
.news_right{
  width: 100%;
}
}

/*お知らせおわり*/

/*こんな方が通院されています。*/

.sym{
    width: 100%;
    background-color: #fff;
    border-radius: 50px; /* 角を丸くする */
    padding: 5% 0;
    margin: 15px 0;
}
ul.sym_tit{
    display: flex;
    justify-content: center; /* 横中央 */
    margin-bottom: 3%;
}
ul.sym_tit li{
    text-align: center;
}

ul.sym_tit li.sym_tit_line{
    width: 30px;
    margin: 6px 2px 0 2px;
}


ul.sym_com{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
ul.sym_com li{
    width: 29.7%;
    border: solid 1px #6a3906;
    border-radius: 30px; /* 角を丸くする */
    padding: 1% 2%;
    display: flex;
    margin-bottom: 1%;
    height: 150px;
    align-items: center;     /* 縦中央 */
}
.sym_img{
    width: 30%;
    text-align: center;
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

ul.sym_com li{
    width: 32%;
    height: 130px;
    margin-bottom: 2%;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.sym{
    margin: 35px 0 15px;
}
ul.sym_com{
    flex-direction: column;
}
ul.sym_com li{
    width: 100%;
    margin-bottom: 2%;
    height: 120px;
}
}
/*こんな方が通院されています。おわり*/

/*おすぎ。整骨院・鍼灸院ってこんなところ。*/

.img_bg01{
 background: url("../img/img_bg01.png") no-repeat center;
  background-size: contain;
  height: 22vh;
}
.img_bg02{
 background: url("../img/img_bg02.png") no-repeat center;
  background-size: contain;
  height: 22vh;
}
.ad_se_cal{
  display: flex;
  margin: 5px 0;
  justify-content: space-between;
}
.sub_tit_tateline{
  padding-left: 20%;
  margin-bottom: 1%;
}
ul.ad_se_cal li{
  width: 50%;
  margin-bottom: 10%;
}
.ad_img_r{
  text-align: center;
}
.ab_text_detail{
  margin-left: 14.8%;
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.img_bg01{
 background: url("../img/img_bg01.png") no-repeat center;
  background-size: cover;
  height: 8vh;
}
.img_bg02{
 background: url("../img/img_bg02.png") no-repeat center;
  background-size: cover;
  height: 8vh;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.img_bg01{
 background: url("../img/sp_img_bg01.png") no-repeat center;
  background-size: cover;
  height: 10vh;
}
.img_bg02{
 background: url("../img/sp_img_bg02.png") no-repeat center;
  background-size: cover;
  height: 10vh;
}
.ad_se_cal{
  display: flex;
  margin: 8% 0;
  justify-content:space-around;
  flex-direction: column;
}
ul.ad_se_cal li{
  width: 95%;
  margin:0 auto 10%;
}
.ad_img_l{
  order: 1;
}
.ab_text_detail{
  margin: 5% 0;
}
}

/*お客様の声*/

.voi_con{
  width: 47%;
  padding: 3%;
  border: solid 1px #6a3906;
  border-radius: 30px; /* 角を丸くする */
  background-color: #fff;
  margin: 0 0 2%;
  height: 650px;
}
.voi_con p{
  font-size: 1.5rem;
}
.voi_tit{
  display: flex;
  align-items: center;
  margin-bottom: 2%;
}
.voi_tit li.face{
  flex-basis: 30%;
}
.voi_tit li{
  margin-right: 2%;
}
.voi_btn{
　display: inline-block;
  background: linear-gradient(-120deg, #52b7b8, #45b144);
  transition: 0.3s ease;
  color: #fff;
  padding: 4px 0;
  border-radius: 30px;   /* 角丸 */
  transition: 0.3s;
    line-height: 1.5;
    margin: 5% auto;
    width: 20%;
    text-align: center;
    font-weight: 500;
}
.voi_btn:hover {
  opacity: 0.7;
  transform: translateY(-2px);
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.voi_con{
  width: 100%;
  padding: 3%;
  border: solid 2px #6a3906;
  border-radius: 30px; /* 角を丸くする */
  background-color: #fff;
  margin: 0 0 2%;
  height: 100%;
}
.voi_btn{
    width: 50%;
    padding: 6px 0;

}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.voi_con{
  width: 100%;
  padding: 3%;
  border: solid 2px #6a3906;
  border-radius: 30px; /* 角を丸くする */
  background-color: #fff;
  margin: 0 0 2%;
  height: 100%;
}
.voi_btn{
    width: 80%;
    padding: 10px 0;
}
.voi_con p{
  font-size: 1.5rem;
  font-weight: 500;
}
}

/*お客様の声おわり*/

/*施術メニュー。*/

.menu_waku{
    width: 100%;
    background-color: #fff;
    border-radius: 50px; /* 角を丸くする */
    padding:5%;
}
li.menu_con{
    width: 47%;
}
.under_line{
    width: 100%;
    border-bottom: solid 1px #6a3906;
}
.under_line ul{
    display: flex;
    align-items: center;
    height: 80px;

}
.under_line ul li{
    width: 33.3%;
}
.menu_kakumaru{
    width: 60%;
    margin: 0 auto;
    border-radius: 50px; /* 角を丸くする */
    background-color: #6a3906;
    color: #fff;
    text-align: center;
}
.menu_pay{
    text-align: right;
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.menu_waku{
    border-radius: 20px; /* 角を丸くする */
}
li.menu_con{
    width: 100%;
    margin-bottom: 10%;
}
.under_line ul{
    height: 60px;
}
.menu_kakumaru{
    width: 80%;
}
}

/*施術メニュー。おわり*/

/*ご挨拶。*/

li.greeting_text{
    width: 47%;
    padding-left: 1%;
    color: #fff;
}
li.greeting_img{
    width: 47%;
    text-align: right;
}
.gree_main_top_bottomimg{
 background: url("../img/nami01.png") no-repeat center;
  background-size: cover;
  height: 25vh;
  margin-top: -2%;
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

li.greeting_text{
    width: 100%;
    color: #fff;
}
li.greeting_img{
    width: 60%;
    margin: 2% auto;
}
.gree_main_top_bottomimg{
 background: url("../img/nami01.png") no-repeat center;
  background-size: cover;
  height: 9vh;
  margin-top: -4%;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
li.greeting_text{
    width: 100%;
    color: #fff;
}
li.greeting_text p{
    font-weight: 500;
}
li.greeting_img{
    width: 90%;
    margin: 5% auto;
}
.gree_main_top_bottomimg{
 background: url("../img/sp_nami02.png") no-repeat center;
  background-size: cover;
  height: 20vh;
  margin-top: -4%;
}
}

/*ご挨拶。おわり*/

/*ご案内。*/

.info_under_line{
    width: 100%;
    border-bottom: solid 1px #6a3906;
}
.info_under_line ul{
    display: flex;
    align-items: center;
    height: 150px;
}
.info_se_cal{
  display: flex;
  margin: 5px 0 20px;
  align-items: flex-end;
}
.info_se_cal li{
  margin-right: 1%;
}
.info_tel_btn{
　display: inline-block;
  background-color: #6a3906;
  color: #fff;
  padding: 2px 15px 2px;
  border-radius: 30px;   /* 角丸 */
  transition: 0.3s;
}
.info_tel_btn:hover {
  opacity: 0.7;
  transform: translateY(-2px);
}
.info_line_btn{
  background: linear-gradient(-120deg, #52b7b8, #45b144);
　display: inline-block;
  background-color: #6a3906;
  color: #fff;
  padding: 3px 15px 2px;
  border-radius: 30px;   /* 角丸 */
  transition: 0.3s;
}
.info_line_btn:hover {
  opacity: 0.7;
  transform: translateY(-2px);
}
.info_con {
  flex-basis: 20%;
  margin-right: 2%;
  border-right: 1px solid #6a3906;
}
.info_text {
  flex: 1;
  padding-left: 1%;
}
.info_kakumaru{
    margin: 0 auto 2%;
    padding: 4px 10px;
    background-color: #6a3906;
    color: #fff;
    text-align: center;
    display: inline-block;
}
li.info_map{
    width: 47%;
    height: 500px;
}

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.info_under_line ul{
    height: 105px;
}
li.info_map{
    height: 300px;
}
.info_se_cal img{
  width: 70%;
}
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.info_se_cal{
  flex-direction:column;
  justify-content: center;
  margin: 5% 0;
}
.info_name{
  text-align: center;
}
.info_se_cal img{
  width: 60%;
}
.info_se_cal li{
  margin: 0 auto 1%;;
  text-align: center;
  width: 80%;
}
.info_tel_btn{
　display: inline-block;
  background-color: #6a3906;
  color: #fff;
  padding: 8px 0;
  border-radius: 30px;   /* 角丸 */
  transition: 0.3s;
  font-size: 2.2rem;
}
.info_tel_btn:hover {
  opacity: 0.7;
  transform: translateY(-2px);
}
.info_line_btn{
  background: linear-gradient(-120deg, #52b7b8, #45b144);
　display: inline-block;
  background-color: #6a3906;
  color: #fff;
  padding: 8px 0;
  border-radius: 30px;   /* 角丸 */
  transition: 0.3s;
  font-size: 2.2rem;
}
.info_under_line ul{
    height: 110px;
}
li.info_map{
    width: 100%;
    height: 300px;
}
}

/*ご案内。おわり*/

/*流れる画像*/

/*==================================================
画像プレビュースライダーのためのcss
===================================*/
.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
   width:94%;
    margin:0 auto;
    
}

.slider img {
    width:100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider .slick-slide {
    margin:0 10px;
}

/*流れる画像おわり*/

/*フッター*/

#footer {
    width: 100%;
}
#footer img {
    width: 3.5%;
}
.fotter_text {
      text-align: center;
      padding-bottom: 5%;
} 
.fotter_cr {
      text-align: center;
      color: #fff;
      padding-bottom : 15%;
} 

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 
 
.fotter_cr {
      padding-bottom : 45%;
}
.fotter_text {
      line-height: 1.5;
}
.fotter_text p {
      margin-top: 10%;
      font-weight: 700;
}
#footer img {
    width: 10%;
}
}

/*フッターおわり*/

/*ボトムスメニュー*/

.menu_sp {
      display: none;
       } 
.menu {
      width: 100%;
      background: #52b7b8;
      position: fixed;
      bottom: 0;
      z-index:999;
      border-top: #fcf5f0 solid 1px;
       } 
 .menu ul {
    display:flex;
       } 
 .menu ul li {
    width: 33.3%;
    text-align: center;
    line-height: 1.5;
    padding: 3% 0;
       } 

.menu ul li.bottoms_menu_left {
    border-right: #fcf5f0 solid 1px;
       }

/*　タブレット　*/
@media screen and (min-width:768px) and (max-width:1389px) {

.menu_sp {
      display: none;
} 
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 

.menu_pc {
      display: block;
} 
}

/*ボトムスメニューおわり*/


/*==================================================
個別ページ
===================================*/

#sub_con {
	height: 100%;
	margin: 0 0 0 0;
	width:100%;
    margin: 0 auto;
    background-color:#fcf5f0;
    background-image: url("../img/sub_top_bg.png");
    background-size: contain;
    background-repeat: no-repeat;
}
.sub_menu_waku{
    width: 100%;
    background-color: #fff;
    border-radius: 50px; /* 角を丸くする */
    padding:5%;
    margin-top: 10%;
}
.kobetu_tit {
    padding: 2% 0;
    border-top: 1px solid #6a3906;
    border-bottom: 1px solid #6a3906;
}
.kobetu_con {
    margin-top: 3%;
}

/*　スマホ　*/
@media screen and (min-width:375px) and (max-width:767px){ 

#sub_con {
    background-image: url("../img/sp_sub_top_bg.png");
    background-size: contain;
}
.sub_menu_waku{
    border-radius: 20px; /* 角を丸くする */

}
}






