@charset "utf-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Roboto&subset=latin,cyrillic-ext,latin-ext,cyrillic,greek-ext,greek,vietnamese);

html {
	font-size:100%;
 }

 * {
   /* box-sizing: border-box;  */
   box-sizing: inherit;
}
body {
   margin: 0;
   padding: 0;
   /* font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif; */
   font-family: 'Bellefair', 'ZCOOL XiaoWei','Noto Serif SC',serif,'M PLUS 1p', sans-serif;
   line-height:1.7;
   color:black;
   background-color: white;
}

  img {
	 max-width:100%;
 }
 
 h2 {
	font-family: 'Noto Serif SC', serif;
}
 
 .wrapper {
	 /*max-width:1100px; */
	 max-width:1000px;
	 margin:0 auto;  /* 要素自体を中央右寄せ */
	 padding:0 4%;
 }
 
  /* 大きな背景画像 */
  .big-bg {
	  background-size:cover;
	  background-position:center top;
	  background-repeat:no-repeat;
 }

h1 {
   margin: 0; padding: 0;
   font-size: 20px;
}
a {	
   text-decoration: none;
   color: black;
}
nav {
   margin: 0 0 0 auto;
}
.header_ul {
   list-style: none;
   margin: 0;
   display: flex;
   text-align:center;
}

/* subs */
ul.header_ul_sub {
  position: relative;
  /*position:absolute;*/
  /*z-index: 200;*/
  /*box-shadow: 2px 2px 0 #BEBEBE;
  width: 35%;*/
  display:none;
  list-style-type: none!important;/*ポチ消す*/
}

ul.header_ul_sub li {
  float: none;
  margin: 0;
  height:40px;
  text-align: left;
}

ul.header_ul_sub li a {
  border-bottom: 1px dotted #ccc;
  border-right: none;
  color: #000;
  padding: 15px 20px;
}

ul.header_ul_sub li:last-child a {
  border-bottom: none;
}

ul.header_ul_sub li a:hover {
  color: #000;
 /* background:  rgba(240,240,240,0.3);  */
}

/* sub display*/
ul.header_ul li:hover ul {
  display: block;
/*  background:  rgba(240,240,240,0.3);  */
}

/* keeps the tab background white */
ul.header_ul li:hover a {
 /* background:  rgba(240,240,240,0.3);  */
  color: #000;
  text-shadow: none;
}

ul.header_ul li:hover > a{
 /* color: #000; */
  color: #F09;
  font-weight:bold;
  text-shadow: 2px 2px 2px #CCC;
  
 } 

 .aroma_nav li.current {
	font-weight: bold;
	border-top: 3px solid #0CF; /*#00B0F0;*/
}
  /*.aroma_nav ul li.current a { */
  .aroma_nav li.current a {
	color: #00B0F0;
}
  /*.aroma_nav ul li a:hover { */
  .aroma_nav li a:hover {
	color: #0CF; /*#0089BB; */
	background-color: #EAF6FD; /*#FBFBDD; */
}
 /* .aroma_nav ul li:hover { */
    .aroma_nav li:hover { 
	border-top: 3px solid #BAD4EE; /*#F8E750; */
}




.header_salonschool {
   padding: 30px 4% 10px;
   position: fixed;  /* ヘッダー固定 */
   z-index:20;
   top: 0;
   width: 100%;
  /* background: rgba(240,240,240,0.5);     /*#f1f8ff; /*背景色*/
   background: rgba(240,240,240,0.6);     /*#f1f8ff; /*背景色*/
   display: flex;
   align-items: center;
   /* overflow:hidden; */
}
.header_salonschool  li{
   margin: 0 0 0 15px;
   font-size: 14px;
}


.header_nav_h1{
   margin: 0; padding: 0;
   font-size: 20px;
}







/* 標題
------------------------------------------------------*/
.atitle {
  position: relative;
  padding: 0.5em;
  background: #b0dcfa; /*背景色*/
  /*background: #a6d3c8;*/
  font-family: 'Noto Serif SC', serif;
  color: white;
  text-shadow: 2px 2px 2px #CCC;
}

.atitle::before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 20px rgb(149, 158, 155);
}

/* 線
---------------------------------------------*/
.solid_line1 {
  /*上にグレイの1pxの線を引きます*/
  display: inline-block;
  border-top: solid 1px gray;
  padding: 10px;
}
.solid_line2 {
  /*下にグレイの1pxの線を引きます*/
  display: inline-block;
  border-bottom: solid 1px gray;
  padding: 10px;
}

/*　flexbox 横並びにする　
-------------------------------------------------*/
.flex_box_0 {
    padding:  0 ;             /* 余白指定 */
	display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
}
.flex_test-box_0d {
    padding:  0 ;             /* 余白指定 */
	display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
	text-justify: distribute;    /* 両端揃えの調節方法    単語の間隔と文字の間隔を調整する  */
}
.flex_box_0back {
    padding:  0 ;             /* 余白指定 */
	display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
	background: rgba(255,255,255,0.6); /*背景色*/
}
.flex_box_10 {
    padding:  10px;             /* 余白指定 */
	display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
}

.flex_item_0 {
	padding: 0;              /* 内側の余白 */
	margin:   0;              /* 外側の余白 */
    color:#000;               /* 文字色 */    
    border-radius:  5px;        /* 角丸指定 */
}
.flex_item {
    padding: 10px;              /* 内側の余白 */
	margin:  10px;              /* 外側の余白 */
    color:#000;               /* 文字色 */
    border-radius:  5px;        /* 角丸指定 */
}





    /* footer
  --------------------------------------------------------*/ 
    footer {
	   background:#9CF;
	   text-align:center;
       /* padding:9px; */
	   padding:10px;
	   margin-top:30px;
 }
    footer p {
		color:#fff;
		font-size:0.875rem;
	}


 /* pagetop
------------------------------------------- */ 
#page_top{
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.6;
}
#page_top a{
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f102';
  font-size: 25px;
  color: #3f98ef;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top a::after{
  content: 'PAGE TOP';
  font-size: 13px;
  color: #fff;
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  color: #3f98ef;
}


/* スライダー
-------------------------------------------------------*/
.slider{
   margin: 0; 
   padding-right:10%;
}