/*================================================
 *  inside共通
 ================================================*/
.inside_outside {
  padding-top: 50px;
  padding-bottom: 100px;
  background-image: url(../img/index_img/con1_bg.png);
  background-repeat: repeat-x;
  background-position: center top;
}
/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.inside_outside {
  padding-top: 30px;
  padding-bottom: 50px;
background-size: 50%;
}
}
/* -------------end------------- */




/* 共通box ------------------------------*/
/* ----------------------------------------- */

.box{margin-bottom: 70px;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.box{margin-bottom: 40px;}

}
/* -------------end------------- */


.title_bar{
  border-bottom: solid 3px #B9E8E6;
  position: relative;
	font-size: 138%;
	color: #4BC0BE;
	margin-bottom: 30px;
	font-weight: 500;
}

.title_bar:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #4BC0BE;
  bottom: -3px;
  width: 20%;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.title_bar{
	margin-bottom: 15px;
}
}
/* -------------end------------- */


.common_list > li::before{
font-family: "Font Awesome 5 Free";
content: "\f111";
font-weight: 900;
color: #4BC0BE;
margin-right: 5px;}


/* 共通common_flex_box ------------------------------*/
/* ---------------------------------------------------- */

.common_flex_box{display:flex;
justify-content: space-between;
flex-wrap: wrap;}

.common_flex_box > li{width: 48%;}

.common_flex_box_73 li:first-child{width: 68%;}
.common_flex_box_73 li:last-child{width: 28%;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.common_flex_box > li{width: 100%;}
    
.common_flex_box > li:first-child{margin-bottom: 20px;}
.common_flex_box_73 li:first-child{width: 100%;}
.common_flex_box_73 li:last-child{width: 100%;}
	
.charming_menu_flex > li:first-child{margin-bottom: 0px;}

}
/* -------------end------------- */


/* ページ内リンク -----------------------------------------*/
/* ---------------------------------------------------- */

.pagenav {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;

}

.pagenav li {
padding-left: 10px;
padding-right: 10px;
font-size: 107%;
padding: 10px;
}

.pagenav li a {
    display: block;
    padding-top: 3px;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 3px;
    color: #4BC0BE;
	border-radius: 6px;
}

.pagenav li a::after {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f078";
margin-left: .3em;
}


.pagenav li a:hover {
background-color: #4BC0BE;
color: #ffffff;
opacity: 1.0;
filter: alpha(opacity=100);
-ms-filter: "alpha(opacity=100)";
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.pagenav {
flex-wrap: wrap;
margin-bottom: 10px;
}

.pagenav li {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 100%;
    padding-top: 1px;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 1px;
}

.pagenav li a {
    display: block;
    padding-top: 1px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 1px;
}
}
/* -------------end------------- */

.kame_title{font-size: 125%;
	margin-bottom: 10px;
	color: #4BC0BE;
	background-image: url(../img/privacy_img/dl_icon.png);
	background-position: left center;
	background-size: 36px;
	background-repeat: no-repeat;
padding-left: 2.5em;
	font-weight: 500;
}

/* ========================================

  CONCEPT

======================================== */
.concept_title{font-size: 150%;
color:#4BC0BE;
margin-bottom: 30px;
line-height: 1.4;
font-weight: 500;}

/* ========================================

  MENU

======================================== */

.menu_title_box{
	background-image: url(../img/lomilomi_img/lomillomi_title_bg.png);
	background-position: right center;
	background-repeat: no-repeat;
background-size: 50% auto; /* 横幅50%、高さは自動調整 */
padding-top:40px;
	padding-bottom: 40px;
	margin-bottom: 30px;
}

.menu_title_box_bridal{
	background-image: url(../img/bridal_img/bridal_title_bg.png);
	background-size: 60% auto; /* 横幅50%、高さは自動調整 */
}

.menu_title_box_facial{
	background-image: url(../img/facial_img/facial_title_bg.png);
	background-size: 50% auto; /* 横幅50%、高さは自動調整 */
}



.menu_title{font-size: 150%;
color:#4BC0BE;
margin-bottom: 30px;
font-weight: 500;}

.menu_lead{font-size: 113%;
color:#604C3F;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.menu_title_box{
	background-image: none;

padding-top:0px;
padding-bottom: 0px;
}
	
	.menu_title{
line-height: 1.4;
	margin-bottom: 20px;}
}
/* -------------end------------- */

/* 価格表 */
.tb_menu  {
	border-spacing: 0;
	border-collapse:collapse;
	width: 100%;
}

.tb_menu th {
	vertical-align: top;
	padding-bottom: 5px;
	padding-top: 5px;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: rgba(224,213,200,1.00);
	padding-left: 5px;
	padding-left: 1em;
}

.tb_menu td {
	vertical-align: top;
	padding-bottom: 5px;
	padding-top: 5px;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: rgba(224,213,200,1.00);
	padding-left: 5px;
	padding-left: 1em;
}

.tb_menu th.menu_name {
	font-size: 113%;
	font-weight: 500;
}

.tb_menu td.menu_price {
	font-size: 113%;

font-family: 'Rubik', sans-serif;
font-weight: 500;
	text-align: right;
	padding-right: 1em;
	color: #604C3F;
}

.tb_menu th.hasen, 
.tb_menu td.hasen{
border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: rgba(224,213,200,0.50);
}
	


/* 価格表 */
.tb_course {
  border-spacing: 0;
  border-collapse: collapse;
  width: 100%;
}
.tb_course th {
  vertical-align: middle;
  padding-bottom: 5px;
  padding-top: 5px;
  border-bottom-width: 2px;
  border-bottom-style: solid;
  border-bottom-color: rgba(224, 213, 200, 1.00);
  padding-left: 1em;
}
.tb_course td {
  vertical-align: middle;
  padding-bottom: 5px;
  padding-top: 5px;
  border-bottom-width: 2px;
  border-bottom-style: solid;
  border-bottom-color: rgba(224, 213, 200, 1.00);
  padding-left: 1em;
}
.tb_course th.course_name {
  font-size: 113%;
  font-weight: 500;
  text-align: left;
  width: 65%;
}
.tb_course td.course_min {
  width: 10%;
  min-width: 3em;
}
.tb_course td.course_price {
  width: 15%;
  min-width: 4em;
  font-size: 113%;
  font-family: 'Rubik', sans-serif;
  font-weight: 500;
  text-align: right;
  padding-right: 1em;
  color: #604C3F;
}
.tb_course th.hasen, .tb_course td.hasen {
  border-bottom-width: 1px;
  border-bottom-style: dashed;
  border-bottom-color: rgba(224, 213, 200, 0.50);
}
.tb_course td.border_none {
  border-bottom-style: none;
  padding-bottom: 0px;
  padding-top: 15px;
}
/* 小さい画面用の設定-------------- */
@media (max-width:767px) {
  .tb_course th {
    padding-left: 0.5em;
  }
  .tb_course td {
    padding-left: 0.5em;
  }
  .tb_course td.course_price {
    padding-right: 0.5em;
  }
}
/* -------------end------------- */



/* ========================================

  LOMILOMI

======================================== */
/* ポイント */
.lomi_point_flex{display: flex;
justify-content: space-between;
margin-bottom: 30px;}

.lomi_point_flex li{width: 32%;
background-color: rgba(224,213,200,0.20);
padding: 20px;
box-sizing: border-box;
border-radius: 10px;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.lomi_point_flex{flex-wrap: wrap;}

.lomi_point_flex li{width: 100%;
margin-bottom: 20px;}
	
.lomi_point_flex li:last-child{
margin-bottom: 0px;}
}
/* -------------end------------- */



.lomi_point_dl dt {
  display: flex;               /* 疑似要素とテキストを横並び */
  justify-content: center;     /* 全体を中央揃え */
  align-items: center;         /* 高さを中央揃え */
  font-size: 125%;
  color: #4BC0BE;
  margin-bottom: 10px;
}

.lomi_point_dl dt::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 5px;           /* テキストとの間隔 */
  background-image: url(../img/lomilomi_img/plumeria_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}


.lomi_result{font-size: 138%;
color:#4BC0BE;
text-align: center;
font-weight: 500;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.lomi_point_dl dt {
  margin-bottom: 5px;
}
	
.lomi_result{font-size: 125%;
	text-align: left;}

}
/* -------------end------------- */

/* 効果 */
.lomi_effect_box{
	background-color: rgba(224,213,200,0.20);
padding: 20px;
box-sizing: border-box;
border-radius: 10px;
}


/* ========================================

  STAFF

======================================== */
.staff_box{
padding: 30px;
margin-bottom: 50px;
border-radius: 10px; /*角の丸み*/
background-color: rgba(224,213,200,0.20);
}

.staff_flex_box{
display: flex;
justify-content: space-between;}

.staff_flex_box > li:first-child{width: 58%;}

.staff_flex_box > li:last-child{width: 38%;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.staff_box{
padding: 20px;
margin-bottom: 30px;
}
	
.staff_flex_box{
flex-wrap: wrap;;}

.staff_flex_box > li:first-child{width: 100%;
margin-bottom: 20px;}

.staff_flex_box > li:last-child{width: 100%;}
}
/* -------------end------------- */

/* 略歴 */

/* STEPここから*---------------*/
/*.timeline-list {padding-top: 10px;
background-color: aqua;}*/

.timeline-list-item {display: flex;
font-size: 88%;}

.timeline-list-item .timeline_time {
    width: 15%;
    line-height: 1.0;
    margin-left: 5px;
	text-align: right;
	padding-right: 2em;
}


.timeline-list-item .timeline_content {
    position: relative;
    width: 85%;
    padding-top: 0;
    padding-left: 30px;
    padding-bottom: 30px;
    border-left: 1px solid rgba(224,213,200,0.80);

	 line-height: 1.0;
}

.timeline-list-item .timeline_content p {
	 line-height: 1.4;
}

.timeline-list-item_last .timeline_content{
border-left: none;
padding-top: 0;
padding-left: 30px;
padding-bottom: 0px;
}

.timeline-list-item .timeline_content::before {
    content: "";
    position: absolute;
    top: 0px;
    left: -7.5px;
    width: 14px;
    height: 14px;
    background-color:  #4BC0BE;
    border-radius: 7px;}

.timeline-list-item_marunashi .timeline_content::before {
    content: none;}


/* 小さい画面用の設定-------------- */
@media (max-width:767px){
    
.timeline-list-item .timeline_time {
width: 35%;
    font-size: 107%;

}



    
.timeline-list-item .timeline_content {
    width: 65%;
    padding-top: 0;
    padding-left: 15px;
    padding-bottom: 20px;
    border-left: 2px solid #cccccc;
}


.timeline-list-item_last .timeline_content{
border-left: none;
padding-top: 0;
padding-bottom: 0px;
  
}

.timeline-list-item .timeline_content::before {
    content: "";
    position: absolute;
    top: 1px;
    left: -6px;
    width: 10px;
    height: 10px;
    background-color:  #00B26E;
    border-radius: 5px;
    
}
    
.timeline-list-item_last .timeline_content::before {
top: 0px;
    left: -5px;

    
}
    
.flow_title span{
 font-size: 113%;
}

 .flow_sub_title{
    font-size: 107%;
    color: #199d3c;
}
   

}
/* -------------end------------- */



/* ========================================

  salon

======================================== */
.salon_box{/*background-color: rgba(75, 192, 190, 0.10);*/
padding: 30px;
	margin-bottom: 50px;
border-radius: 10px; /*角の丸み*/
	background-color: rgba(224,213,200,0.20);
}

.salon_flex_box{display: flex;
justify-content: space-between;
margin-bottom: 30px;}

.salon_flex_box li:first-child{width: 58%;}
.salon_flex_box li:last-child{
	width: 38%;
	background-image: url(../img/salon_img/chigasaki_img.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.salon_flex_box_fujisawa li:last-child{
	width: 38%;
	background-image: url(../img/salon_img/fujisawa_img.png);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: cover;
}

.salon_flex_box_yokohama li:last-child{
	width: 38%;
	background-image: url(../img/salon_img/yokohama_img.png);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: cover;
}

.salon_box_name{
width: 70%;
margin-bottom: 20px;}



/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.salon_box{/*background-color: rgba(75, 192, 190, 0.10);*/
padding: 20px;
margin-bottom: 30px;

}

.salon_flex_box{flex-wrap: wrap;}

.salon_flex_box li:first-child{width: 100%;
	margin-bottom: 20px;}
	
.salon_flex_box li:last-child{
width: 100%;
  height: 0;
  padding-top: 75%; /* 2048×1536 のアスペクト比 */
  background-image: url(../img/salon_img/chigasaki_img.png);
  background-position: center center;
  background-size: contain; 
	
}

.salon_flex_box_fujisawa li:last-child{
	width: 100%;
	background-image: url(../img/salon_img/fujisawa_img.png);
	background-position: left center;
	background-size: contain; 
}

.salon_flex_box_yokohama li:last-child{
	width: 100%;
	background-image: url(../img/salon_img/yokohama_img.png);
	background-position: left center;
	background-size: contain; 
}
	
.salon_box_name{
width: 100%;}
	
}
/* -------------end------------- */

.salon_dl dt {
	background-image: url(../img/privacy_img/dl_icon.png);
	background-position: left center;
	background-size: 20px;
	background-repeat: no-repeat;
padding-left: 2em;
	clear: left;
	float: left;
	width: 5em;
}

.salon_dl dd {
	padding-left: 8em;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #CCC;
}

.salon_dl dd:last-child {
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom-style: none;
}
/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.salon_dl dt {
padding-left: 2em;
	clear: none;
	float: none;
	width: 100%;
}

.salon_dl dd {
	padding-left: 2em;
}
}
/* -------------end------------- */

/* ========================================

   チャーミング

======================================== */

.charming_dl dt{
padding-left: 1em;
	clear: left;
	float: left;
	width: 20em;
}

.charming_dl dd {
	padding-left: 20em;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #CCC;
	font-size: 113%;

font-family: 'Rubik', sans-serif;
font-weight: 500;
	text-align: right;
	padding-right: 1em;
	color: #604C3F;
}

.charming_dl2 dt{
	width: 30em;
}

.charming_dl2 dd {
	padding-left: 30em;}

.charming_img_flex_box{display: flex;
justify-content: space-between;}

.charming_img_flex_box li{width: 25%;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.charming_dl dt{
	clear: none;
	float: none;
	width: 100%;
}
	
.charming_dl dd {
	padding-left:  1em;

}

.charming_dl2 dt{
	width:  100%;
	padding-right: 1em;
	box-sizing: border-box;
}

.charming_dl2 dd {
	padding-left: 1em;}
	
.charming_img_flex_box{flex-wrap: wrap;}
	
.charming_img_flex_box li{width: 50%;}
	
}
/* -------------end------------- */

/* ========================================

   プライバシーポリシー

======================================== */


.privacy_dl dt {
	font-size: 113%;
	font-weight: 500;
	margin-bottom: 5px;
	color: #4BC0BE;
	background-image: url(../img/privacy_img/dl_icon.png);
	background-position: left center;
	background-size: 36px;
	background-repeat: no-repeat;
padding-left: 2.5em;}

.privacy_dl dd{
margin-bottom: 30px;}


.ordinary_ol {
margin-bottom: 50px;}

.ordinary_ol > li{

}

.ordinary_ol,
.ordinary_ol2, 
.ordinary_ol3 {
counter-reset:item; /* 数字のカウントをリセットする */
padding-left: 1em;}


.ordinary_ol > ol,
.ordinary_ol2 > ol,
.ordinary_ol3 > ol{
  padding-left: 2em;
}
.ordinary_ol > li,
.ordinary_ol2 > li,
.ordinary_ol3 > li{
  text-indent: -1.3em;
  padding-left: 1.3em;
}

.ordinary_ol > li:before,
.ordinary_ol2 > li:before,
.ordinary_ol3 > li:before{
/* カウンタ（数字になる部分） */
counter-increment: item; /* 任意の名前を付けて！ */
content: counter(item); /* 名前を付けたカウンターを呼び出し */
/* 色を変えたり、背景画像を敷いたり！自由自在！ */
counter-increment: item;/* 任意の名前を付ける（もちろん英語で） */
content: counter(item)'.';/* 名前を付けたカウンターをcontentで発動！ */
/* 以下は自由に装飾... */
padding-right: .5em;
}

/************************************
送信完了
*************************************/

.contact_box{
margin-bottom: 30px;}

.contact_lead{text-align: center;
margin-bottom: 10px;}

.contact_tel {
  font-size: 180%;
  font-family: 'Rubik', sans-serif;
  font-weight: 500;
  color: #E83F2A;
  text-align: center; /* 中央寄せ */
}

.contact_tel::before {
  content: "\f095"; /* 電話アイコン */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 0.2em; /* アイコンと文字の間隔 */
  display: inline-block; /* 横並びにする */
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.contact_lead{text-align: left;}
}
/* -------------end------------- */


/************************************
送信完了
*************************************/

.thanks_img{width:30%;
margin-left: auto;
margin-right: auto;
padding-top: 50px;}


/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.thanks_img{width: 50%;
margin-left: auto;
margin-right: auto;
padding-top: 50px;}
	}
/* -------------end------------- */

/************************************
サイトマップ
*************************************/
.sitemap {
width: 50%;
	margin-left: auto;
	margin-right: auto;
}


.sitemap ul li ul {
  margin-top: .5em;
  margin-bottom: .75em;
  margin-left: 48px;
}
 
.sitemap ul li ul li {
  margin-bottom: .25em;
  position: relative;
}
 
.sitemap ul li ul li::before {
  content: "";
  position: absolute;
  top: -0.5em;
  left: -16px;
  width: 10px;
  height: calc(100% + .75em);
  border-left: 1px solid #4BC0BE;
}
 
.sitemap ul li ul li:last-child::before {
  height: calc(1em + .25em);
}
 
.sitemap ul li ul li::after {
  content: "";
  position: absolute;
  top: .75em;
  left: -16px;
  width: 10px;
  border-bottom: 1px solid #4BC0BE;
}

.sitemap a {
color: #3a3a3a;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.sitemap {
width: 100%;}
}
/* -------------end------------- */


