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

/**　サロンTOP 一覧　**/
div.page_title h1 {text-align: center;}
.page_box h2, .page_box h3 {border: none!important; padding: 2% 0 0;}
.page_box h2 img, .page_box h3 img {width: 100%;}
.Check_p {margin-bottom: 10%;}
.Check_p li {
	font-size: 15px; padding: 3% 3% 3% 8%; margin-bottom: 3%;
	background: url("https://www.brightlele.jp/img/salon/check.webp") no-repeat 30px 27px;
	background-color: #f8efe6;
	background-size: 18px 18px;
}	
.col_a {color: #fc5d83; font-weight: bold;}
div.page_title h1 {text-align: center;}
.page_box h2, .page_box h3 {border: none!important; padding: 2% 0 0;}
.page_box h2 img, .page_box h3 img {width: 100%;}
.Check_p {margin-bottom: 10%;}
.Check_p li {
	font-size: 15px; padding: 3% 3% 3% 8%; margin-bottom: 3%;
	background: url("https://www.brightlele.jp/img/salon/check.webp") no-repeat 30px 27px;
	background-color: #f8efe6;
	background-size: 18px 18px;
}	
.col_a {color: #fc5d83; font-weight: bold;}
.Salon_index {padding: 0 3%; margin-bottom: 15%;}
.page_box .Salon_index h3,
.page_box .Salon_index h4 {text-align: center; margin: 3% 0 1%;}
.Salon_index dl dt, .Salon_index dl dd {text-align: center}
.Salon_index dl dt {max-width: 520px; margin: 0 auto 3%;}

/*====================================================================
.s_02 .accordion_one
====================================================================*/
.s_02 .accordion_one {max-width: 760px; margin: 0 auto 15px;}
.s_02 .accordion_one .accordion_header {
	background-color: #f8efe6;
	color: #333;
	font-size: 16px;
	font-weight: bold;
	padding: 20px 5% 20px 5%;
	text-align: center;
	position: relative;
	/** z-index: +1; **/
	/** cursor: pointer; **/
	transition-duration: 0.2s;
	border: #999 1px solid;
}
.s_02 .accordion_one:nth-of-type(2) .accordion_header {
    background-color: #f8efe6;
}
.s_02 .accordion_one:nth-of-type(3) .accordion_header {
    background-color: #f8efe6;
}
	
/** .s_02 .accordion_one .accordion_header:hover {opacity: .8;} **/
	
.s_02 .accordion_one .accordion_header .i_box {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	right: 3%;
	width: 40px;
	height: 40px;
	/** border: 2px solid #333; **/
	margin-top: -20px;
	box-sizing: border-box;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
	/** border-radius: 50%; **/
}
.s_02 .accordion_one .accordion_header .i_box .one_i {
	display: block;
	width: 18px;
	height: 18px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
	position: relative;
}

.s_02 .accordion_one .accordion_header.open .i_box {
	-webkit-transform: rotate(-360deg);
	transform: rotate(-360deg);
}
.s_02 .accordion_one .accordion_header .i_box .one_i:before, .s_02 .accordion_one .accordion_header .i_box .one_i:after {
	/**
	content: '';
	margin-top: -10px;
	top: 50%;
	right: 0;
	width: 12px;
	height: 12px;
	font-size: 1em;
	font-weight: bold;
	line-height: 1.2em;
	display: block;
	position: absolute;
	border-top: 3px solid #999;
	border-right: 3px solid #999;
	-moz-transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
	**/
}

/**
.s_02 .accordion_one .accordion_header .i_box .one_i:before {
	width: 4px;	height: 18px; top: 0; left: 7px;
}
**/
	
.s_02 .accordion_one .accordion_header.open .i_box .one_i:before {
  content: none;
}
.s_02 .accordion_one .accordion_header.open .i_box .one_i:after {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.s_02 .accordion_one .accordion_inner {
	/** display: none; **/
	padding: 20px 10px;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	box-sizing: border-box;
	background-color: #efefef;
}
.s_02 .accordion_one .accordion_inner .box_one {
  height: 100%;
}
.s_02 .accordion_one .accordion_inner p.txt_a_ac {
  margin: 0;
}
@media screen and (max-width: 1024px) {
  .s_02 .accordion_one .accordion_header {
    font-size: 14px;
  }
  .s_02 .accordion_one .accordion_header .i_box {
    width: 30px;
    height: 30px;
    margin-top: -15px;
  }
}
@media screen and (max-width: 767px) {
  .s_02 .accordion_one .accordion_header {
    font-size: 16px;
    text-align: left;
    padding: 15px 60px 15px 15px;
  }
}
	
.tenpo_list h4 {text-align: center; font-size: 18px; font-weight: bold;}
.tenpo_list h4 span {font-size: 30px; font-weight: bold;}	
.tenpo_list {margin: 5% auto; background-color: #efefef; padding: 5% 2%;}
.tenpo_list ul {display: flex; flex-wrap: wrap; width: 100%; margin: 4% auto;}
.tenpo_list ul li {margin: 1.5% 1%; width: 22.9%;}
.tenpo_list ul li a {
	display: block;
	padding: 5% 1%;
	border: 1px solid #e0bb59;
	border-radius: ;
	background-color: #e4d2a2;
	text-align: center;
	color: #333;
	font-size: 15px;
	font-weight: bold;
	border-radius: 6px;
}	

.salon_list {display: flex; flex-wrap: wrap; position: relative; box-sizing: border-box; width: 100%;}
.salon_list dl {border: 1px solid #999; margin: 1%; padding: 3%; box-sizing: border-box; width: calc(95.9% / 2); background-color: #fff;}
.salon_list dl dt {text-align: center;}
.salon_list dl dt span {display: block;}
.salon_list dl dt img {width: 100%; max-width: 310px; margin: 15px auto;}
.salon_list dl dd {margin: 0;}
.salon_list dl::after {
	clear: both;
	content: ".";
	display: block;
	font-size: 0;
	height: 0;
	visibility: hidden;
}
.salon_list dt a {font-size: 16px; font-size: bold; text-align: center;}
.salon_list dd {font-size: 14px;}
.salon_list dd ul.icon {display: flex; flex-wrap: wrap;	width: 100%;}
.salon_list dd ul.icon li {margin: 0.3rem; font-size: 12px; font-weight: bold; text-align: center;}
.salon_list dd ul.icon li span {background-color: #f8efe6; padding: 1rem; color: #666; border-radius: 5px; display: block;}
.salon_list dd .common_btn {margin: 20px auto 20px;}
.tenpo_list li a:hover {opacity: 0.6;}
div.section {margin: 5% auto 10%;}

/**　以下詳細ページ　**/
.sysItemCategoryPankuzu {margin: 1% 0 2%;}
.ga_area {margin-bottom: 10%;}
.flickity-prev-next-button {width: 30px!important; height: 30px!important;}
.TableArea {margin-bottom: 5%;}
.TableArea table {width: 100%; margin-bottom: 10px;}
.TableArea table th {
	padding: 10px;
	text-align: center;
	vertical-align: top;
	width: 22%;
	border: 1px solid #cebb81;
	background-color: #f8efe6;
	color: #333333;
	white-space: nowrap;
}
.TableArea table td {
	text-align: left;
	padding: 10px;
	border: 1px solid #cebb81;
}
.ttl_salon_ft_a {font-size: 24px!important; margin-bottom: 5%!important;}
.ttl_salon_ft_b {font-size: 24px!important;}
.Und_line {border-bottom: 5px solid #f8efe6; padding: 0px 3% 10px;}
.Salon_index .salon_ft dl {margin-bottom: 8%;}
.Salon_index .salon_ft dl dt {color: #fd5e84; text-align: left; font-weight: bold; max-width: 100%;}
.Salon_index .salon_ft dl dd.img_one {max-width: 710px; margin: 0 auto 3%;}
.Salon_index .salon_ft dl dd {text-align: left;}
.Salon_index .salon_ft dl dd.img_two {margin-bottom: 3%;}
.Salon_index .salon_ft dl dd.img_two ul {display: flex;}
.Salon_index .salon_ft dl dd ul li {margin-bottom: 15px;}
ul.prod_hl {display: flex; flex-wrap: wrap; width: 100%;}
ul.prod_hl li {margin: 0.3rem; font-size: 12px; font-weight: bold; text-align: center;}
ul.prod_hl li span {background-color: #f8efe6; padding: 1rem; color: #666; border-radius: 5px; display: block;}

.res_t {background-color: #f8efe6; padding: 5px 0 15px 0; margin-bottom: 10%;}

.Salon_index .ttl_salon_menu {color: #fd5e84; text-align: left!important; font-weight: bold; max-width: 100%;}

.Menu_TableArea {margin-bottom: 10%;}
.Menu_TableArea table {width: 100%; margin-bottom: 10px;}
.Menu_TableArea table th {
	padding: 10px;
	text-align: left;
	vertical-align: top;
	width: 53%;
	border: 1px solid #cebb81;
	background-color: #f8efe6;
	color: #333333;
	padding: 10px 3%;
}
.Menu_TableArea table td {
	text-align: center;
	padding: 10px;
	border: 1px solid #cebb81;
	font-weight: bold;
}
.Menu_TableArea .ttl {
	width: 100%;
	background-color: #cebb81;
	text-align: center;
	padding: 10px 0;
	vertical-align: middle;
	color: #fff;
	font-weight: bold;
}
.res_btn {padding: 2%;}
.res_btn li {
	float: left;
	width: 50%;
	padding: 1%;
	text-align: center;
	font-size: 18px;
}
.res_btn li a {
	display: block;
	background-color: #ceb980;
	padding: 10% 0;
	color: #fff;
	font-weight: bold;
}
.res_btn li a:hover {
	background-color: #fb9db5;
}
.ctn_note li {font-size: 100%;}
.prds_hded_area {
	padding: 3% 2%;
	margin: 20px auto 10px;
	border: 1px solid #ceb980;
	border-radius: 3px;
}
.prds_hded_ttl {
	text-align: center;
	font-weight: bold;
	margin-bottom: 10px;
}

/*================================================
 *  PC向けデザイン (ワイド)
 ================================================*/
@media print, screen and (min-width:1280px) {
}
	
/*================================================
 *  PC向けデザイン
 ================================================*/
@media print, screen and (min-width:1121px) {
	.page_box h2 {max-width: 760px; margin: auto; width: 100%;}
	.page_area p {padding: 2% 3% 3%; font-size: 15px; line-height: 1.8; margin-bottom: 15px;}
	.page_box .Salon_index h3,
	.page_box .Salon_index h4 {font-size: 26px;}
	.page_box .Salon_index dl dd {font-size: 16px;}
	
	/**　以下詳細ページ　**/
	div.flickity-viewport {min-height: 250px!important;}
	.gallery-cell {height: 333px!important;}
	.TableArea table {font-size: 14px;}
	.salon_ft dl dt {font-size: 18px;}
	.Salon_index .salon_ft dl dd {font-size: 14px; margin-bottom: 15px;}
	.page_box .Salon_index h4.ttl_salon_menu {font-size: 18px;}
	.Menu_TableArea table {font-size: 15px;}
	.Menu_TableArea .ttl {font-size: 18px;}
	.Menu_TableArea table th, .Menu_TableArea table td {
		overflow-wrap: break-word;
		word-wrap: break-word;
		white-space: normal;
	}
	.Menu_TableArea ul li {font-size: 110%;}
	.boder_line {border: 1px solid #333; margin: 2% 5% 4% 5%;}
	ul.res_txtlist {padding: 3% 5%;}		
	ul.res_txtlist li {list-style-type: disc; font-size: 14px;}
	.font_s {font-size: 12px;}
}
/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (min-width:768px) and ( max-width:1120px) {
	.page_area p {padding: 3%; font-size: 16px; line-height: 1.8; margin-bottom: 15px;}
	.Check_p {padding: 0 2%;}
	
	/**　以下詳細ページ　**/
	.gallery-cell {height: 333px!important;}
	.TableArea table {font-size: 15px;}
	.salon_ft dl dt {font-size: 18px;}
	.Salon_index .salon_ft dl dd {font-size: 14px; margin-bottom: 5%;}
	.page_box .Salon_index h4.ttl_salon_menu {font-size: 18px;}
	.Menu_TableArea table {font-size: 15px;}
	.Menu_TableArea .ttl {font-size: 16px;}
	.Menu_TableArea ul li {font-size: 110%;}
	.boder_line {border: 1px solid #333; margin: 2% 5% 4% 5%;}
	ul.res_txtlist {padding: 3% 5%;}		
	ul.res_txtlist li {list-style-type: disc; font-size: 14px;}
	.font_s {font-size: 12px;}
}
/*================================================
 *  スマートフォン向けデザイン
 ================================================*/
@media screen and (max-width:767px) {
	.page_area p {padding: 2% 3% 3%; font-size: 13px; line-height: 1.8; margin-bottom: 15px;}
	.Check_p {padding: 0 1%;}
	.Check_p li {font-size: 13px; background-position: 3% 15px;	background-size: 14px 14px;}
	.page_box .Salon_index h4 {font-size: 18px;}
	.Salon_index dl dt {padding: 0 3%;}
	.Salon_index dl dd {font-size: 14px; margin-bottom: 3%;}
	
	.salon_list {display: inherit; width: 100%; margin: auto;}
	.tenpo_list h4 {font-size: 13px;}
	.tenpo_list h4 span {font-size: 20px;}	
	.tenpo_list ul li {margin: 1.5% 0.5%; width: 32.3%;}
	.tenpo_list ul li a {font-size: 12px;}
	.s_02 .accordion_one .accordion_header {font-size: 14px; padding: 12px 15px; text-align: center;}	
	.s_02 .accordion_one .accordion_inner {padding: 20px 3%;}
	.s_02 .accordion_one .accordion_inner .box_one {width: 100%; margin: auto;}
	.salon_list dl {margin-bottom: 5%; width: 98%;}
	.salon_list dd {font-size: 12px;}
	.salon_list dd ul.icon li {font-size: 11px;}
	.salon_list dd ul.icon li span {padding: 0.5rem;}
	.salon_list dd ul.icon {margin-bottom: 6%;}
	
	/**　以下詳細ページ　**/
	div.flickity-viewport {min-height: 250px!important;}
	.page_box .Salon_index h3 {font-size: 16px;}
	.page_box .Salon_index h4 {font-size: 14px;}
	.ga_area {margin-bottom: 14%;}
	.flickity-page-dots {bottom: -20px!important;}
	.TableArea {margin-bottom: 12%;}
	.ttl_salon_ft_a, .ttl_salon_ft_b {font-size: 16px!important; margin-bottom: 3%!important;}
	.salon_ft {margin-top: 8%;}
	.salon_ft dl dt {font-size: 14px; margin-bottom: 5%;}
	.Salon_index dl dt {padding-left: 0; font-size: 14px;}
	ul.prod_hl {margin-bottom: 6%;}
	ul.prod_hl li {font-size: 11px;}
	ul.prod_hl li span {padding: 0.5rem;}
	.Menu_TableArea .ttl {font-size: 14px;}
	.Menu_TableArea table th {padding: 10px 2%;}
	.res_btn li {float: none; width: 100%; padding: 2%;	text-align: center;	font-size: 14px;}
	.res_btn li a {padding: 6% 0;}
	.boder_line {border: 1px solid #333; margin: 2% 5% 4% 5%;}
	ul.res_txtlist {padding: 3% 8%;}		
	ul.res_txtlist li {list-style-type: disc; font-size: 12px;}
	.ctn_note li {font-size: 75%;}
	.prds_hded_area ul.prod_hl {margin-bottom: 3%;}
	.font_s {font-size: 11px;}
}
/*================================================
 *  汎用
 ================================================*/
.clearfix::after {
	clear: both;
	content: ".";
	display: block;
	font-size: 0;
	height: 0;
	visibility: hidden;
}
.Left {text-align: left!important;}
.padg_2p4p {padding: 2% 4%!important;}
.bold {font-weight: bold!important;}

