@charset "utf-8";

/*----------------------------*/
/* archive-salon              */
/*----------------------------*/
.section_salon {
	margin-top: 140px;
}
.section_salon_category {
    font-size: 15px;
	letter-spacing: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2em;
	margin-bottom: 6em;
}
.section_salon_category_item {
	color: var(--main-color);
}
.section_salon_category_item.active {
	color: var(--sub-color);
	position: relative;
	&::before{
		content: "";
		position: absolute;
		width: 10px;
		height: 10px;
		background: var(--sub-color);
		border-radius: 50%;
		top: -1em;
		left: 50%;
		transform: translateX(-50%);
	}
	&::after{
		content: "";
		position: absolute;
		bottom: -5px;
		left: 0;
		width: 100%;
		height: 1px;
		background: var(--main-color);
		}
}
.section_salon_list {
}
.section_salon_list_cont {
}
.section_salon_list_cont:not(:first-of-type) {
    margin-top: 8em;
}
.section_salon_list_cont_area {
	font-family: "roboto", sans-serif;
	font-size: 14px;
	font-weight: 100;
	padding-left: 5%;
	margin-bottom: 2em;
}
.section_salon_list_cont_item {
}
.section_salon_list_cont_item .detail {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 3%;
}
.section_salon_list_cont_item .detail:not(:first-of-type) {
    margin-top: 6em;
}
.section_salon_list_cont_item .detail_picbox {
}
.section_salon_list_cont_item .detail_picbox_link {
}
.section_salon_list_cont_item .detail_picbox_link_img {
	border-radius: 0 20px 20px 0;
	height: 100%;
	max-height: 400px;
    aspect-ratio: 3 / 2;
    object-fit: cover;
}
.section_salon_list_cont_item .detail_txtbox {
	width: 95%;
	max-width: 650px;
	border-top: 1px solid var(--main-color);
	padding-top: 5%;
	font-size: 12px;
	display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.section_salon_list_cont_item .detail_txtbox_title {
	font-family: "roboto", sans-serif;
	font-weight: 100;
	font-size: 14px;
}
.section_salon_list_cont_item .detail_txtbox_title_link {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 4em;
}
.section_salon_list_cont_item .detail_txtbox_title_link_tit-wrp {
}
.section_salon_list_cont_item .detail_txtbox_title_link_tit {
	font-size: clamp(22px, 3vw, 42px);
	-webkit-font-smoothing: antialiased;
}
.section_salon_list_cont_item .detail_txtbox_title_link_jp {
	font-family: dnp-shuei-gothic-gin-std, sans-serif;
    font-weight: 400;
	font-size: 12px;
	margin-top: .5em;
}
.section_salon_list_cont_item .detail_txtbox_title_link_more {
	padding-top: 2%;
}
.section_salon_list_cont_item .detail_txtbox_title_link_more_arrow {
	display: inline-block;
    width: 16px;
    transform: rotate(-30deg);
    margin-left: 16px;
    vertical-align: middle;
}
.section_salon_list_cont_item .detail_txtbox_title_snsbox {
	font-family: "roboto", sans-serif;
	font-size: 14px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 3em;
	margin-bottom: 2em;
}
.section_salon_list_cont_item .detail_txtbox_title_snsbox_insta {
}
.section_salon_list_cont_item .detail_txtbox_title_snsbox_reserv {
}
.section_salon_list_cont_item .detail_txtbox_title_snsbox_icon {
	display: inline-block;
    width: 18px;
    margin-right: 1em;
    vertical-align: middle;
}
.section_salon_list_cont_item .detail_txtbox_box {
}
.section_salon_list_cont_item .detail_txtbox_box_address {
	margin-bottom: 2em;
}
.section_salon_list_cont_item .detail_txtbox_box_address_item {
	margin-bottom: 1em;
}
.section_salon_list_cont_item .detail_txtbox_box_tel {
	margin-bottom: 2em;
}
.section_salon_list_cont_item .detail_txtbox_box_tel a {
}
.section_salon_list_cont_item .detail_txtbox_box_map {
	font-family: "roboto", sans-serif;
	font-size: 12px;
}
.section_salon_list_cont_item .detail_txtbox_box_map a {
	display: inline-block;
	padding: 5px 5%;
	border: 1px solid rgb(47 54 49 / .4);
	border-radius: 50px;
}

@media (max-width: 767px) {
	.section_salon {
		padding-bottom: 100px;
	}
	.section_salon_category {
	gap: 1.5em;
	padding: 0 3%;
	}
	.section_salon_list_cont_item .detail {
		grid-template-columns: repeat(1, 1fr);
	}
	.section_salon_list_cont_item .detail_picbox {
		width: 95%;
	}
	.section_salon_list_cont_item .detail_txtbox {
		padding-left: 5%;
	}
	.section_salon_list_cont_item .detail_txtbox_title_link_more_arrow {
    	margin-left: 8px;
	}
	.section_salon_list_cont_item .detail_txtbox_title_snsbox {
		margin-bottom: 3em;
	}
}


/*----------------------------*/
/* single-salon               */
/*----------------------------*/
.salon-detail {
	padding-top: 300px;
	
	.inner {
	}
	.contBox {
		padding-left: 5%;
	}
	.contBox section {
		margin-bottom: 120px;
	}
	.contBox_top {
		font-family: "roboto", sans-serif;
		font-size: 14px;
	}
	.page_header {
    	padding: 0;
	}
	.contBox_top_title-wrp {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		margin-bottom: 3.5em;
		padding-right: 5%;
	}
	.contBox_top_title {
		font-family: utile-display, sans-serif;
		font-size: clamp(38px, 4vw, 58px);
        font-weight: 300;
		text-align: left;
	}
	.contBox_top_nav-wrp {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		row-gap: 30px;
		
	}
	.contBox_top_nav {
		display: flex;
		justify-content: flex-start;
		gap: 2em;
	}
	.contBox_top_nav a {
	}
	.contBox_top_nav_btn {
	}
	.contBox_top_sns {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		gap: 3em;
		padding-right: 5%;
		margin-left: auto;
	}
	.contBox_top_sns_insta {
	}
	.contBox_top_sns_reserv {
	}
	.contBox_top_sns_icon {
		display: inline-block;
		width: 18px;
		margin-right: 1em;
		vertical-align: middle;
	}
	.contBox_top_mainV {
		width: 100%;
	}
	.contBox_top_mainV img {
		border-radius: 20px 0 0 20px;
		height: 100%;
		max-height: 600px;
		aspect-ratio: 3 / 2;
		object-fit: cover;
	}
	.contBox_cont {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.contBox_cont_title {
		width: 15%;
		min-width: 120px;
		font-family: "roboto", sans-serif;
		font-size: 14px;
		font-weight: 100;
	}
	.contBox_cont_item {
		width: 75%;
		font-size: 15px;
		line-height: normal;
	}
	.contBox_about {
	}
	.contBox_about_item {
		max-width: 700px;
	}
	.contBox_about_text1 {
		font-size: 1.4em;
		margin-bottom: 1em;
	}
	.contBox_about_text2 {
	}
	.contBox_shopPic {
		width: 95%;
        overflow: hidden;
	}
	.contBox_shopPic_inner {
		transform: translateX(-5%);
	}
	.contBox_shopPic_img {
		border-radius: 20px;
		height: 100%;
		max-height: 400px;
		aspect-ratio: 3 / 2;
		object-fit: cover;
	}
	.swiper_shopPic .swiper-wrapper {
	  transition-timing-function: linear; /*等速で流れ続けるため*/
	}
	.contBox_info {
	}
	.contBox_info_item {
		max-width: 700px;
		padding-right: 5%;
	}
	.contBox_info_item_item {
		margin-bottom: 2em;
	}
	.contBox_info_item_item .tit {
		font-family: "roboto", sans-serif;
		font-weight: 600;
		margin-bottom: .5em;
	}
	.contBox_info_item_item .text {
	}
	.contBox_info_item_item .map a {
		font-family: "roboto", sans-serif;
		font-size: 14px;
		font-weight: 100;
		display: inline-block;
		padding: 5px 5%;
		border: 1px solid rgb(47 54 49 / .4);
		border-radius: 50px;
	}
	.contBox_staff {
		margin-bottom: 12em!important;
	}
	.contBox_staff_item {
		width: auto;
		flex: 1;
        padding-right: 5%;
	}
	.contBox_staff_item_list {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		column-gap: 4%;
        /*row-gap: 10%;*/
        row-gap: 4em;
		@media (max-width:1024px){
			grid-template-columns: repeat(3, 1fr);
		}
		@media (max-width:769px){
			grid-template-columns: repeat(2, 1fr);
		}
	}
	.contBox_staff_item_list .item {
	}
	.contBox_staff_item_list .item_link {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
        align-items: center;
		font-size: clamp(15px, 1.3vw, 22px);
	}
	.contBox_staff_item_list .item_link_pic {
		margin-bottom: 1em;
		width: 100%;
	}
	.contBox_staff_item_list .item_link_pic img {
		border-radius: 20px;
		aspect-ratio: 1 / 1;
    	object-fit: cover;
        object-position: top center;
	}
	.contBox_staff_item_list .item_link_post {
		font-family: "roboto", sans-serif;
		font-size: .9em;
		font-weight: 100;
	}
	.contBox_staff_item_list .item_link_name {
		margin-bottom: .3em;
	}
	.contBox_staff_item_list .snsbox {
		display: flex;
		justify-content: flex-end;
		gap: 1em;
	}
	.contBox_staff_item_list .snsbox_item {
		font-family: "roboto", sans-serif;
		font-size: .85em;
		font-weight: 100;
	}
	.contBox_journal {
	}
	.contBox_journal_item {
		flex: 1;
	}
	.contBox_journal_item_txt {
		font-family: utile-display, sans-serif;
        font-weight: 300;
		padding-left: 5%;
		padding-right: 5%;
		margin-bottom: 4em;
	}
	.contBox_journal_item_list-wrp {
		overflow: hidden;
	}
	.contBox_journal_item_list {
		font-size: 1.17vw;
	}
	.contBox_journal_item_list .item {
		padding-left: 1.5em;
	}
	.contBox_journal_item_list .item_link {
		position: relative;
	}
	.contBox_journal_item_list .item_link_date {
		font-family: "roboto", sans-serif;
        font-size: .9em;
        font-weight: 100;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		text-orientation: sideways;
		transform: rotate(180deg);
        display: inline-block;
		position: absolute;
		top: 0;
		left: -5px;
		translate: -100% 0;
	}
	.contBox_journal_item_list .item_link_pic {
	}
	.contBox_journal_item_list .item_link_pic img {
		border-radius: 20px;
		aspect-ratio: 1 / 1;
    	object-fit: cover;
	}
	.contBox_journal_item_list .item_link_txtbox {
		border-left: 1px solid var(--main-color);
		padding-left: 1.5em;
	}
	.contBox_journal_item_list .item_link_txtbox_title {
		font-weight: 500;
		margin:  1em 0 .3em;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
	}
	.contBox_journal_item_list .item_link_txtbox_namebox {
		display: flex;
		align-items: center;
		gap: 1em;
	}
	.contBox_journal_item_list .item_link_txtbox_namebox_tit {
		font-family: "roboto", sans-serif;
        /*font-size: 13px;*/
        font-weight: 100;
		border: 1px solid var(--main-color);
		border-radius: 30px;
		display: inline-block;
		padding: 3px 1em;
	}
	.contBox_journal_item_list .item_link_txtbox_namebox_name {
	}
	.swiper_journal_next_btn,
	.swiper_journal_prev_btn {
		width: 3.515625vw;
		height: 3.515625vw;
		background-color: #6C9171;
		display: grid;
		place-items: center;
		border-radius: 50%;
			@media (max-width:769px){
				width: 10.465116279069768vw;
				height: 10.465116279069768vw;
			}
	}
	.swiper_journal_next_btn:after,
	.swiper_journal_prev_btn:after {
		display: none;
	}
	.swiper_journal_prev_btn img{
		transform: scale(-1, 1);
	}
	.swiper_journal_prev_btn:hover img{
		animation-name: transformRightLeft;
		animation-fill-mode: forwards;
		animation-duration: .7s;
		transition-timing-function: ease-out;
	}
	.swiper_journal_next_btn:hover img{
		animation-name: transformLeftRight;
		animation-fill-mode: forwards;
		animation-duration: .7s;
		transition-timing-function: ease-out;
	}
	.contBox_journal_item_btnBox {
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 80px;
	}
	.contBox_journal_item_btnBox .swiper-btn {
		display: flex;
		justify-content: flex-start;
		gap: 1em;
	}
	.contBox_journal_item_btnBox .link_btn {
		border-color: var(--main-color);
	}
	.contBox_journal_item_btnBox .link_btn_text_second {
		position: absolute;
		top: 3px;
		left: 0;
		transform: translateY(101%);
	}
	.buttonBox {
		background-color: #D8E2D0;
		text-align: center;
		font-family: "roboto", sans-serif;
    	font-size: 14px;
		position: sticky;
        bottom: 0;
		z-index: 1;
	}
	.buttonBox::before {
		content: "";
		width: 90%;
		height: 1px;
		background-color: rgb(47 54 49 / .4);
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	.buttonBox a {
        display: block;
		padding: 1.5em 0;
	}
	.buttonBox_icon {
		display: inline-block;
        width: 18px;
        margin-right: 1em;
        vertical-align: middle;
	}
	
	@media (max-width:767px){
		.contBox_top_title-wrp {
			display: block;
		}
		.page_haeder_breadcrumb {
			text-align: right;
			margin-top: 4em;
		}
		.contBox_top_nav {
			order: 3;
		}
		.contBox_cont_title {
			width: 100%;
			margin-bottom: 4em;
		}
		.contBox_cont_item {
			width: 100%;
		}
		.contBox_about_item {
			padding-right: 5%;
		}
		.contBox_staff {
			margin-bottom: 6em!important;
		}
		.contBox_staff_item_list {
			column-gap: 2em;
			row-gap: 3em;
		}
		.contBox_journal_item_list {
			font-size: 3vw;
		}
		.contBox_journal_item_txt {
			display: none;
		}
		.contBox_journal_item_list .item {
			padding-left: 0;
		}
		.contBox_journal_item_list .item_link_date {
			transform: none;
			writing-mode: inherit;
			position: relative;
			left: 0;
        	translate: 0;
		}
	}
	@media (max-width:540px){
		.contBox section {
			margin-bottom: 80px;
		}
		.contBox_cont_item {
        	font-size: 13px;
		}
		.contBox_about_text1 {
        	font-size: 1.2em;
			margin-bottom: 2em;
		}
		.buttonBox::before {
			width: 80%;
		}
	}
}