@charset "utf-8";

/* ========== 初期設定 ========== */
html {
	overflow-y: scroll;
	overflow-x: hidden;
}
@media screen and (min-width:1024px) {
	html {
		font-size: 62.5%;
	}
}

body {
	width: 100%;
	height: auto;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-style: normal;
	font-feature-settings: "palt";
	word-break: break-all;
	font-size: calc((100vw / 375) * 15);
	line-height: 1.8;
	letter-spacing: 0.05rem;
	color: #1c1c1c;
	background: #fff;
	overflow-x: hidden;
}
@media screen and (min-width:1024px) {
  body {
		font-size: 1.6rem;
    line-height: 1.8;
		min-width: 1440px;
  }
}

body, div, p, h1, h2, h3, h4, ul, figure {
	margin: 0;
	padding: 0;
}

h1,h2,h3,h4,h5,h6 {
	font-weight: 400;
	line-height: 1.4;
}

textarea,input[type="text"],input[type="tel"],input[type="email"],select,
textarea::placeholder,input[type="text"]::placeholder,
input[type="tel"]::placeholder,input[type="email"]::placeholder {
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: #1c1c1c;
}

img {
	border: 0;
	max-width: 100%;
	height: auto;
}

a {
	color: #1c1c1c;
	text-decoration: none;
	outline: none;
	transition: 0.7s;
	backface-visibility: hidden;
}
a.under-line {
	text-decoration: underline;	
}
@media screen and (min-width:1024px) {
	a {
		transition: all .6s ease;
	}
	a .i-circle {
		transition: background .4s ease;
	}
}

li {
	list-style-type: none;
}

table {
	width: 100%;
	text-align: left;
	border-collapse: collapse;
}

svg {
  overflow: visible;
}

/* レスポンシブ制御 */
.set-pc {
  display: none;
}
@media screen and (min-width:1024px) {
  .set-pc {
    display: block;
  }
}

.set-sp {
  display: block;
}
@media screen and (min-width:1024px) {
  .set-sp {
    display: none;
  }
}

/* クリアフィックス */
.clearfix:after {
  content: "";
  display: block;
  clear: both;
} 
.clearfix:before {
  content: "";
  display: block;
  clear: both;
} 
.clearfix {
  display: block;
}

/* コンテンツ幅 */
.container {
	position: relative;
	width: auto;
	max-width: 1800px;
	margin: 0 auto;
	padding-left: calc((100vw / 375) * 20);
	padding-right: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	.container {
		padding-left: 40px;
		padding-right: 40px;
		min-width: 1360px;
	}
}
@media screen and (min-width: 1440px) {
	.container {
		padding-left: 60px;
		padding-right: 60px;
	}
}
@media screen and (min-width: 1600px) {
	.container {
		padding-left: 100px;
		padding-right: 100px;
	}
}

/* フォント設定 */
.en {
	font-family: "Outfit", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 400;
}

.en-mr {
	font-family: "Marcellus", serif;
	font-style: normal;
	font-weight: 400;
}

.exlight { font-weight: 200 !important; }
.light { font-weight: 300 !important; }
.medium { font-weight: 500 !important; }
.semiBold { font-weight: 600 !important; }
.bold {	font-weight: bold !important; }
.black { font-weight: 900 !important; }

/* ========== 共通部品 ========== */

/* ボタンデザイン */
.btn01 {
	position: relative;
	font-size: calc((100vw / 375) * 17);
	padding-right: calc((100vw / 375) * 67);
	white-space: nowrap;
}
@media screen and (min-width:1024px) {
	.btn01 {
		font-size: 1.7rem;
		padding-right: 66px;
		padding-top: 10px;
		padding-bottom: 10px;
	}
}


.btn01 .i-circle {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	display: block;
	background: url(../common_img/btn_black.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 50);
	height: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	.btn01 .i-circle {
		width: 50px;
		height: 50px;
	}
}

.btn01.rev .i-circle {
	background: url(../common_img/btn_clear.svg) center center / cover no-repeat;
}

.btn01.rev.white .i-circle {
	background: url(../common_img/btn_white.svg) center center / cover no-repeat;
}

.btn01.line .i-circle {
	background: url(../common_img/btn_white_line.svg) center center / cover no-repeat;
}

@media screen and (min-width: 1024px) {
	.btn01:hover {
		opacity: 1;
	}
	.btn01:hover .i-circle {
		opacity: 1;
		background: url(../common_img/btn_clear.svg) center center / cover no-repeat;
	}
	.btn01.rev:hover .i-circle {
		opacity: 1;
		background: url(../common_img/btn_black.svg) center center / cover no-repeat;
	}
	.btn01.line:hover .i-circle {
		background: url(../common_img/btn_white.svg) center center / cover no-repeat;
	}
}

.btn02 {
	position: relative;
	font-size: calc((100vw / 375) * 13);
	font-weight: 500;
	text-align: center;
	padding: calc((100vw / 375) * 10) calc((100vw / 375) * 26) calc((100vw / 375) * 11) calc((100vw / 375) * 26);
	border-radius: calc((100vw / 375) * 25);
	background-color: #000;
	color: #fff;
	border: 1px solid #000;
	transition: all .7s ease;
}
.btn02.rev {
	background-color: #fff;
	color: #1c1c1c;
}
.btn02 .arrow {
	display: inline-block;
	background: url(../common_img/arrow_down_white.svg) center center / cover no-repeat;
	width: 12px;
	height: 12px;
	margin-left: calc((100vw / 375) * 6);
	transition: all .7s ease;
}
.btn02.rev .arrow {
	background: url(../common_img/arrow_down_black.svg) center center / cover no-repeat;
}

@media screen and (min-width: 1024px) {
	.btn02 {
		font-size: 1.6rem;
		padding: 10px 26px 10px 25px;
		border-radius: 25px;
	}
	.btn02:hover {
		background-color: #fff;
		color: #1c1c1c;
	}
	.btn02.rev:hover {
		background-color: #000;
		color: #fff;
	}
	.btn02 .arrow {
		width: 12px;
		height: 12px;
		margin-left: 6px;
	}
	.btn02:hover .arrow {
		background: url(../common_img/arrow_down_black.svg) center center / cover no-repeat;
	}
	.btn02.rev:hover .arrow {
		background: url(../common_img/arrow_down_white.svg) center center / cover no-repeat;
	}
}

/* ========== ヘッダー ========== */
header {
	position: absolute;
	width: 100%;
	z-index: 100;
}

header .wrap {
	display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
	width: 100%;
  height: 90px;
}

header .headerLogo {
	padding-left: 100px;
	margin-top: 10px;
}

header .headerLogo img {
	width: auto;
}

header .header-nav {
	display: flex;
  flex-direction: column;
  gap: 12px;
	padding-right: 100px;
}

header .header-nav .link-box {
	display: flex;
	gap: 42px;
	flex-direction: row;
	justify-content: flex-end;
}

header .header-nav .link-box li a {
	font-size: 1.5rem;
	font-weight: 500;
  letter-spacing: 0.05rem;
}
header .header-nav .link-box li a:hover {
	opacity: .7;
}	

header .header-nav .link-box li .btn01:hover {
	opacity: 1;
}	

header .header-nav .btn-box {
	position: relative;
	display: flex;
	gap: 20px;
	flex-direction: row;
	justify-content: flex-end;
}

header .header-nav .btn-box .icon-x {
	display: block;
	width: 37.16px;
	height: 38px;
	position: absolute;
  top: 50%;
  right: 530px;
  transform: translateY(-50%);
}
header .header-nav .btn-box .icon-x img {
	width: 37.16px;
	height: 38px;
}

header .header-nav .btn-box .icon-line {
	width: 40px;
	height: 40px;
	position: absolute;
  top: 50%;
  right: 465px;
  transform: translateY(-50%);
}


header .wrap .gnav-open {
	position: fixed;
	right: 30px;
	width: 80px;
	height: 25px;
	cursor: pointer;
	transition: opacity .6s ease;
	display: none;
}
header .wrap .gnav-open::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	background: url(../common_img/menu_open.png) center center / cover no-repeat;
	width: 50px;
	height: 14px;
	transform: translate(-50%, -50%);
}
header .wrap .gnav-open:hover {
	opacity: .7;
}


/* ========== スマホメニュー ========== */
#spnav {
	position: absolute;
	width: 100%;
	z-index: 50;
}

#spnav .wrap {
	display: flex;
	justify-content: flex-end;
	flex-direction: row;
	align-items: center;
	height: calc((100vw / 375) * 40);
}

#spnav .header-logo {
	width: calc((100vw / 375) * 130);
  position: absolute;
	top: calc((100vw / 375) * 15);
	left: calc((100vw / 375) * 20);
}

#spnav .header-logo a {
	display: flex;
}

#spnav .gnav-open {
	position: fixed;
	top: calc((100vw / 375) * 22);
	right: calc((100vw / 375) * 20);
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 13);
}
#spnav .gnav-open::before {
	content: '';
	display: inline-block;
	position: absolute;
	background-image: url('../common_img/menu_open.png');
	background-size: cover;
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 12);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


/* ========== グローバルナビ ========== */
.g-nav {
	display: block;
	position: fixed;
	width: 100%;
	height: 0;
	background-color: #fff;
	opacity: .98;
	opacity: 0;
	visibility: hidden;
	animation-name: fadeout-anime;
	animation-fill-mode: forwards;
	animation-duration: 0.6s;
	animation-timing-function: ease;
	animation-direction: normal;     
	z-index: -1;
	transition: visibility .6s ease;
	overflow-y: auto;

}

.g-nav.is-open {
  animation-name: fadein-anime;
  animation-fill-mode: backwards;
  animation-duration: 0.6s;
  animation-timing-function: ease;
  animation-direction: normal;
  opacity: 0.98;
  z-index: 999;
  visibility: visible;
	height: 100vh;
}

.g-nav .gnav-close {
	position: absolute;
	top: calc((100vw / 375) * 22);
	right: calc((100vw / 375) * 20);
	background-image: url('../common_img/menu_close.png');
	background-size: cover;
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 12);
	z-index: 100;
}
@media screen and (min-width: 1024px) {
	.g-nav .gnav-close {
		top: 35px;
		right: 48px;
		width: 52px;
		height: 15px;
		cursor: pointer;
		transition: opacity .6s ease;
	}
	.g-nav .gnav-close:hover {
		opacity: .7;
	}
}

.g-nav .container {
	height: inherit;
}

.g-nav .wrap {
	display: block;
	width: 100%;
	padding-top: calc((100vw / 375) * 45);
	margin: 0 auto;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-start;
	justify-content: space-between;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap {
		padding-top: 0;
		width: 100%;
		margin: 0 auto;
		flex-direction: row;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
}

.g-nav .wrap .visual {
	position: relative;
	width: 100%;
	height: calc((100vw / 375) * 245);
	background: url(../common_img/gnavi_bg_sp.png) center center / cover no-repeat;
	margin-bottom: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .visual {
		width: 48%;
		height: 100vh;
		background: url(../common_img/gnavi_bg.png) center center / cover no-repeat;
		margin-bottom: 0;
	}
}

.g-nav .wrap .visual img {
	position: absolute;
	left: calc((100vw / 375) * 20);
	bottom: calc((100vw / 375) * 15);
	width: calc((100vw / 375) * 150);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .visual img {
		left: 80px;
		bottom: 10px;
		width: 390px;
	}
}

.g-nav .wrap .contents {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents {
		width: 52%;
		height: 100vh;
	}
}

.g-nav .wrap .contents .box {
	margin-top: calc((100vw / 375) * 15);
	padding: 0 calc((100vw / 375) * 20)
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .box {
		width: 800px;
		margin-top: 120px;
		padding-right: 20px;
		padding-left: 40px;
	}
}
@media screen and (min-width: 1600px) {
	.g-nav .wrap .contents .box {
		padding-right: 0;
		padding-left: 0;
	}
}

.g-nav .wrap .contents .main-nav {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding-bottom: calc((100vw / 375) * 40);
	border-bottom: 1px solid #d5dcdb;
	flex-wrap: wrap;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav {
		flex-direction: row;
		flex-wrap: nowrap;
		padding-bottom: 80px;
	}
}

.g-nav .wrap .contents .main-nav .list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .list {
		display: block;
	}
}

.g-nav .wrap .contents .main-nav .list li {
	width: 50%;
}
.g-nav .wrap .contents .main-nav .list li:nth-of-type(1) {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .list li,
	.g-nav .wrap .contents .main-nav .list li:nth-of-type(1) {
		width: auto;
	}
}

.g-nav .wrap .contents .main-nav .list a {
	font-size: calc((100vw / 375) * 16);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .list a {
		font-size: 1.7rem;
	}
	.g-nav .wrap .contents .main-nav .list a:hover {
		opacity: .7;
	}
}

.g-nav .wrap .contents .main-nav .list li + li {
	margin-top: calc((100vw / 375) * 22);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .list li + li {
		margin-top: 48px;
	}
}

.g-nav .wrap .contents .main-nav .sublist {
	position: relative;
	display: flex;
  justify-content: flex-start;
	align-items: flex-end;
	gap: calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 310);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .sublist {
		justify-content: flex-end;
		gap: 45px;
		margin-top: 0;
	}
}

.g-nav .wrap .contents .main-nav .sublist .link-menu {
	position: absolute;
	top: calc((100vw / 375) * -270);
	right: 0;
  width: 100%;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .sublist .link-menu {
		top: 0;
		width: auto;
	}
}

.g-nav .wrap .contents .main-nav .sublist .link-menu a {
	font-size: calc((100vw / 375) * 23);
	height: calc((100vw / 375) * 230);
	background: url(../common_img/gnavi_menulink_sp.jpg) center center / cover no-repeat;
	display: flex;
	align-items: center;
	padding-left: calc((100vw / 375) * 20);
}
.g-nav .wrap .contents .main-nav .sublist .link-menu a .i-circle {
	position: relative;
	display: block;
	background: url(../common_img/btn_black.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 50);
	height: calc((100vw / 375) * 50);
	margin-left: calc((100vw / 375) * 10);
}
.g-nav .wrap .contents .main-nav .sublist .link-menu a .bold {
	padding-right: 5px;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .sublist .link-menu a {
		font-size: 2.2rem;
		width: 500px;
		height: 380px;
		background: url(../common_img/gnavi_menulink.jpg) center center / cover no-repeat;
		padding-left: 40px;
	}
	.g-nav .wrap .contents .main-nav .sublist .link-menu a .i-circle {
		background: url(../common_img/btn_black.svg) center center / cover no-repeat;
		width: 50px;
		height: 50px;
		margin-left: 15px;
	}
	.g-nav .wrap .contents .main-nav .sublist .link-menu a .bold {
		padding-right: 5px;
	}
	.g-nav .wrap .contents .main-nav .sublist .link-menu a:hover {
		opacity: .8;
	}
	.g-nav .wrap .contents .main-nav .sublist .link-menu a:hover .i-circle {
		opacity: 1;
		background: url(../common_img/btn_clear.svg) center center / cover no-repeat;
	}
}

.g-nav .wrap .contents .main-nav .sublist .btn01 {
	padding-right: calc((100vw / 375) * 58);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .main-nav .sublist .btn01 {
		padding-right: 66px;
	}
}

.g-nav .wrap .contents .sub-nav {
	margin-top: calc((100vw / 375) * 20);
	margin-bottom: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .sub-nav {
		margin-top: 75px;
		margin-bottom: 0;
	}
}

.g-nav .wrap .contents .sub-nav ul {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 15);
	flex-wrap: wrap;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .sub-nav ul {
		gap: 40px;
		flex-wrap: nowrap;
	}
}

.g-nav .wrap .contents .sub-nav ul li {
	width: 45%;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .sub-nav ul li {
		width: auto;
	}
}

.g-nav .wrap .contents .sub-nav ul li a {
	font-size: calc((100vw / 375) * 14);
	color: #6b6b6b;
}
@media screen and (min-width: 1024px) {
	.g-nav .wrap .contents .sub-nav ul li a {
		font-size: 1.4rem;
	}
	.g-nav .wrap .contents .sub-nav ul li a:hover {
		opacity: .7;
	}
}


/* ========== トップメインビジュアル ========== */
.top-mainvisual {
	position: relative;
	height: calc((100vw / 375) * 675);
	background: url(../images/top_mv_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	.top-mainvisual {
		height: 100vh;
		max-height: 950px;
		background: url(../images/top_mv.jpg) center center / cover no-repeat;
	}
}

.top-mainvisual img {
	position: absolute;
	width: calc((100vw / 375) * 285);
	top: calc((100vw / 375) * 72);
	left: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	.top-mainvisual img {
		width: auto;
		top: auto;
		left: auto;
		bottom: 125px;
	}
}

.top-mainvisual .container {
	position: static;
	height: inherit;	
}
@media screen and (min-width: 1024px) {
	.top-mainvisual .container {
		max-height: 950px;
	}
}

/* ========== メインビジュアル：右下リンク ========== */
.mv-link {
	position: absolute;
	right: calc((100vw / 375) * 15);
	bottom: calc((100vw / 375) * -33);
	background: url(../common_img/btn_menu.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 120);
	height: calc((100vw / 375) * 120);
}
@media screen and (min-width: 1024px) {
	.mv-link {
		right: 100px;
		bottom: -30px;
		background: url(../common_img/btn_menu.png) center center / cover no-repeat;
		width: auto;
		height: auto;
	}
}

.mv-link a {
	position: relative;
	text-align: center;
	font-size: calc((100vw / 375) * 11);
	font-weight: 600;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;	
	width: calc((100vw / 375) * 120);
	height: calc((100vw / 375) * 130);
}
.mv-link a .i-circle {
	position: relative;
	display: block;
	background: url(../common_img/btn_black.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	margin-top: calc((100vw / 375) * 2);
}
@media screen and (min-width: 1024px) {
	.mv-link a {
		font-size: 1.5rem;
		width: 176px;
		height: 178px;
	}
	.mv-link a .i-circle {
		width: 50px;
		height: 50px;
		margin-top: 6px;
	}
	.mv-link a:hover .i-circle {
		opacity: 1;
		background: url(../common_img/btn_clear.svg) center center / cover no-repeat;
	}

}

/* ========== 下層：メインビジュアル ========== */
.mainvisual,
.mainvisual .container {
	position: relative;
	height: calc((100vw / 375) * 445);
}
.mainvisual.is-menu {	background: url(../images/menu/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-information {	background: url(../images/information/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-voice {	background: url(../images/voice/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-column {	background: url(../images/column/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-philosophy {	background: url(../images/philosophy/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-aboutus {	background: url(../images/aboutus/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-pp {	background: url(../images/privacypolicy/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-faq {	background: url(../images/faq/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-forsalon {	background: url(../images/forsalon/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-csr {	background: url(../images/csr/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-saloninfo {	background: url(../images/saloninfo/mv_sp.jpg) center center / cover no-repeat; }
.mainvisual.is-contact {	background: url(../images/contact/mv_sp.jpg) center center / cover no-repeat; }
@media screen and (min-width: 1024px) {
	.mainvisual,
	.mainvisual .container {
		height: 100vh;
		max-height: 950px;
	}
	.mainvisual.is-menu { background: url(../images/menu/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-information {	background: url(../images/information/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-voice {	background: url(../images/voice/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-column {	background: url(../images/column/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-philosophy {	background: url(../images/philosophy/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-aboutus {	background: url(../images/aboutus/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-pp {	background: url(../images/privacypolicy/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-faq {	background: url(../images/faq/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-forsalon {	background: url(../images/forsalon/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-csr {	background: url(../images/csr/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-saloninfo {	background: url(../images/saloninfo/mv.jpg) center center / cover no-repeat; }
	.mainvisual.is-contact {	background: url(../images/contact/mv.jpg) center center / cover no-repeat; }
}

.mainvisual h1.en-mr {
	font-size: calc((100vw / 375) * 70);
	line-height: 1;
	letter-spacing: 0.3rem;
	color: #fff;
	position: absolute;
	bottom: calc((100vw / 375) * 35);
}
.mainvisual.is-information h1.en-mr {letter-spacing: 0.5rem; font-size: calc((100vw / 375) * 50); }
.mainvisual.is-column h1.en-mr { font-size: calc((100vw / 375) * 44); }
.mainvisual.is-philosophy h1.en-mr { font-size: calc((100vw / 375) * 60); }
.mainvisual.is-contact h1.en-mr { font-size: calc((100vw / 375) * 52); }
.mainvisual.is-aboutus h1.en-mr { font-size: calc((100vw / 375) * 41); letter-spacing: 0.1rem; }
@media screen and (min-width: 1024px) {
	.mainvisual h1.en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
		color: #fff;
		bottom: 50px;
	}
	.mainvisual.is-information h1.en-mr { font-size: 16.0rem; }
	.mainvisual.is-column h1.en-mr { letter-spacing: 1.6rem; font-size: 16.0rem; }
	.mainvisual.is-philosophy h1.en-mr { font-size: 16.0rem; }
	.mainvisual.is-faq h1.en-mr { letter-spacing: 3.0rem; }
	.mainvisual.is-contact h1.en-mr { font-size: 16.0rem; }
	.mainvisual.is-aboutus h1.en-mr { font-size: 16.0rem; letter-spacing: 1.6rem; }
}


/* ========== メインエリア ========== */
main {
	background: #fff;
}

/* ========== パンくず ========== */
.footer-bc {
	background-color: #f1f6f6;
}

.footer-bc ul {
	display: flex;
	flex-direction: row;
	padding: calc((100vw / 375) * 15) 0;
}
@media screen and (min-width:1024px) {
	.footer-bc ul {
		padding: 21px 0;
	}
}

.footer-bc ul li {
	position: relative;
	display: flex;
}

.footer-bc li + li {
  margin-left: calc((100vw / 375) * 25);
}
@media screen and (min-width: 1024px) {
	.footer-bc li + li {
		margin-left: 35px;
	}
}
.footer-bc li p,
.footer-bc li a {
	font-size: calc((100vw / 375) * 11);
	color: #6b6b6b;
}
.footer-bc li a {
	text-decoration: underline;
}
@media screen and (min-width: 1024px) {
	.footer-bc li p,
	.footer-bc li a {
		font-size: 1.2rem;
	}
	.footer-bc li a:hover {
		opacity: .7;
	}
}

.footer-bc li::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 52%;
	left: calc((100vw / 375) * -15);
	transform: translateY(-50%);
	width: calc((100vw / 375) * 6);
	height: calc((100vw / 375) * 1);
	background-color: #6b6b6b;
}
.footer-bc li:first-of-type::before {
	display: none;
}

@media screen and (min-width:1024px) {
  .footer-bc li::before {
		top: 52%;
		left: -20px;
		width: 4px;
		height: 1px;
	}
}

/* ========== フッター ========== */
footer {
	position: relative;
	background-color: #fff;
	padding-top: calc((100vw / 375) * 30);
	padding-bottom: calc((100vw / 375) * 90);
}
@media screen and (min-width:1024px)  {
	footer {
		padding-top: 150px;
		padding-bottom: 115px;
	}
}

footer .footer-top {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	border-bottom: 1px solid #d5dcdb;
}
@media screen and (min-width: 1024px) {
	footer .footer-top {
		flex-direction: row;
		align-items: flex-end;
	}
}

footer .footer-bottom {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
}
@media screen and (min-width: 1024px) {
	footer .footer-bottom {
		flex-direction: row;
	}
}

footer .footer-main .logo {
	margin-top: calc((100vw / 375) * 20);
	margin-bottom: calc((100vw / 375) * 20);
	width: calc((100vw / 375) * 130);
}
@media screen and (min-width: 1024px) {
	footer .footer-main .logo {
		margin-top: 45px;
		margin-bottom: 45px;
		width: auto;
	}
}

footer .footer-main .txt {
	font-size: calc((100vw / 375) * 14);
}
@media screen and (min-width: 1024px) {
	footer .footer-main .txt {
		font-size: 1.4rem;
	}
}

footer .footer-main .list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	row-gap: calc((100vw / 375) * 20);
	padding-top: calc((100vw / 375) * 30);
	margin-top: calc((100vw / 375) * 30);
	margin-bottom: calc((100vw / 375) * 30);
	border-top: 1px solid #d5dcdb;
}
@media screen and (min-width: 1024px) {
	footer .footer-main .list {
		width: 400px;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		row-gap: 20px;
		padding-top: 0;
		margin-top: 130px;
		margin-bottom: 60px;
		border-top: 0;
	}
}

footer .footer-main .list a {
	font-size: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	footer .footer-main .list a {
		font-size: 1.4rem;
	}
	footer .footer-main .list a:hover {
		opacity: .7;
	}
}

footer .footer-sub {
	position: relative;
	display: flex;
	justify-content: flex-start;
	align-items: flex-end;
	gap: calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 150);
	margin-bottom: calc((100vw / 375) * 105);
}
@media screen and (min-width: 1024px) {
	footer .footer-sub {
		justify-content: flex-end;
		gap: 45px;
		margin-top: 0;
		margin-bottom: 80px;
	}
}

footer .footer-sub .link-menu {
	position: absolute;
	left: 0;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .link-menu {
		bottom: 115px;
		right: 0;
		left: auto;
		width: 500px;
	}
}

footer .footer-sub .link-menu a {
	font-size: calc((100vw / 375) * 23);
	width: 100%;
	height: calc((100vw / 375) * 180);
	background: url(../common_img/f_menulink_sp.jpg) center center / cover no-repeat;
	display: flex;
	align-items: center;
	padding-left: calc((100vw / 375) * 25);
}
footer .footer-sub .link-menu a .i-circle {
	position: relative;
	display: block;
	background: url(../common_img/btn_black.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 50);
	height: calc((100vw / 375) * 50);
	margin-left: calc((100vw / 375) * 10);
}
footer .footer-sub .link-menu a .bold {
	padding-right: 5px;
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .link-menu a {
		font-size: 2.2rem;
		width: 500px;
		height: 250px;
		background: url(../common_img/f_menulink.jpg) center center / cover no-repeat;
		padding-left: 40px;
		width: auto;
	}
	footer .footer-sub .link-menu a .i-circle {
		background: url(../common_img/btn_black.svg) center center / cover no-repeat;
		width: 50px;
		height: 50px;
		margin-left: 15px;
	}
	footer .footer-sub .link-menu a .bold {
		padding-right: 5px;
	}
	footer .footer-sub .link-menu a:hover {
		opacity: .8;
	}
	footer .footer-sub .link-menu a:hover .i-circle {
		opacity: 1;
		background: url(../common_img/btn_clear.svg) center center / cover no-repeat;
	}
}

footer .footer-sub .btn01 {
  top: calc((100vw / 375) * 70);
	padding-right: calc((100vw / 375) * 56);
}
@media screen and (min-width: 1024px) {
	footer .footer-sub .btn01 {
		top: auto;
		padding-right: 66px;
	}
}

footer .footer-middle {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	padding-top: calc((100vw / 375) * 38);
	padding-bottom: calc((100vw / 375) * 25);
	
}
@media screen and (min-width: 1024px) {
	footer .footer-middle {
		align-items: center;
		padding-top: 60px;
		padding-bottom: 60px;
		border-bottom: 1px solid #d5dcdb;	
	}
}

footer .footer-middle .bottom-list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	footer .footer-middle .bottom-list {
		flex-direction: row;
		align-items: center;
		gap: 30px;
	}
}

footer .footer-middle .bottom-list a {
	font-size: calc((100vw / 375) * 14);
	color: #6b6b6b;
}
@media screen and (min-width: 1024px) {
	footer .footer-middle .bottom-list a {
		font-size: 1.3rem;
	}
	footer .footer-middle .bottom-list a:hover {
		opacity: .7;
	}
}

footer .footer-middle .sns-list {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: calc((100vw / 375) * 14);
}
@media screen and (min-width: 1024px) {
	footer .footer-middle .sns-list {
		gap: 20px;
	}
}

footer .footer-middle .sns-list .i-facebook {
	display: block;
	background: url(../common_img/f_facebook.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 27);
	height: calc((100vw / 375) * 26);
}
footer .footer-middle .sns-list .i-instagram {
	display: block;
	background: url(../common_img/f_instagram.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 25);
}
footer .footer-middle .sns-list .i-youtube {
	display: block;
	background: url(../common_img/f_youtube.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 30);
	height: calc((100vw / 375) * 21);
}
@media screen and (min-width: 1024px) {
	footer .footer-middle .sns-list .i-facebook {
		width: 27px;
		height: 26px;
	}
	footer .footer-middle .sns-list .i-instagram {
		width: 25px;
		height: 25px;
	}
	footer .footer-middle .sns-list .i-youtube {
		width: 30px;
		height: 21px;
	}
}

@media screen and (min-width: 1024px) {
	footer .footer-middle .sns-list a:hover {
		opacity: .7;
	}
}

footer .footer-copyright {
	font-size: calc((100vw / 375) * 12);
	color: #a0a0a0;
}
@media screen and (min-width: 1024px) {
	footer .footer-copyright {
		font-size: 1.2rem;
		text-align: right;
		margin-top: 40px;
	}
}

/* ========== index トップページ(#frontpage) ========== */
/* point */
#frontpage .point .bg01 {
	background: url(../images/top_img01_sp.jpg) bottom center / cover no-repeat;
}
#frontpage .point .bg02 {
	background: url(../images/top_img02_sp.jpg) bottom center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#frontpage .point .bg01 {
		background: url(../images/top_img01.jpg) bottom center / cover no-repeat;
	}
	#frontpage .point .bg02 {
		background: url(../images/top_img02.jpg) bottom center / cover no-repeat;
	}
}

#frontpage .point .box {
	position: relative;
	padding-top: calc((100vw / 375) * 160);
	padding-bottom: calc((100vw / 375) * 110);
}
@media screen and (min-width: 1024px) {
	#frontpage .point .box {
		padding-top: 435px;
		padding-bottom: 60px;
		width: 400px;
	}
}

#frontpage .point .box .en-mr {
	position: absolute;
	left: calc((100vw / 375) * -52);
	top: calc((100vw / 375) * -117);
	color: rgb(255 255 255 / 20%);
	font-size: calc((100vw / 375) * 174);
	line-height: 1;
}
@media screen and (min-width: 1024px) {
	#frontpage .point .box .en-mr {
		left: -67px;
		top: -140px;
		font-size: 21.0rem;
	}
}

#frontpage .point .box h2 {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.5rem;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#frontpage .point .box h2 {
		font-size: 3.6rem;
		margin-bottom: 30px;
	}
}

#frontpage .point .box .subtxt {
	font-size: calc((100vw / 375) * 15);
	font-weight: 600;
	line-height: 1.8;
	letter-spacing: 0.2rem;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#frontpage .point .box .subtxt {
		font-size: 1.8rem;
		margin-bottom: 35px;
	}
}

#frontpage .point .box .txt {
	color: #fff;
	letter-spacing: 0.2rem;
}


/* voice */
#frontpage .voice {
	position: relative;
	padding-bottom: calc((100vw / 375) * 35);
}
@media screen and (min-width: 1024px) {
	#frontpage .voice {
		padding-bottom: 140px;
	}
}

#frontpage .voice h2.en-mr {
	font-size: calc((100vw / 375) * 60);
	letter-spacing: 0.7rem;
	line-height: 1;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * -36);
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#frontpage .voice h2.en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
		top: -95px;
	}
}

/* feature */
#frontpage .feature {
	position: relative;
	background: url(../images/feature_bg_sp.png) center right / cover no-repeat;
	padding-top: calc((100vw / 375) * 74);
}
@media screen and (min-width: 1024px) {
	#frontpage .feature {
		background: url(../images/feature_bg.jpg) center center / cover no-repeat;
		padding-top: 125px;
	}
}

#frontpage .feature .en-mr {
	position: absolute;
	top: calc((100vw / 375) * -53);
	left: calc((100vw / 375) * 15);
	font-size: calc((100vw / 375) * 75);
	letter-spacing: 0.2rem;
	color: rgb(233 240 240 / 10%);
}
@media screen and (min-width: 1024px) {
	#frontpage .feature .en-mr {
		top: -15px;
		right: 115px;
		left: auto;
		font-size: 17.0rem;
	}
}

#frontpage .feature .title .en {
	font-size: calc((100vw / 375) * 23);
	letter-spacing: 0.2rem;
	color: #99acb5;
}
@media screen and (min-width: 1024px) {
	#frontpage .feature .title .en {
		font-size: 3.0rem;
	}
}

#frontpage .feature .title .subtxt {
	font-size: calc((100vw / 375) * 30);
	letter-spacing: 0.5rem;
	color: #fff;
	margin-top: calc((100vw / 375) * 25);
	position: relative;
}
@media screen and (min-width: 1024px) {
	#frontpage .feature .title .subtxt {
		font-size: 3.6rem;
		margin-top: 10px;
		left: -5px;
	}
}

#frontpage .feature .title .txt {
	font-size: calc((100vw / 375) * 18);
	font-weight: bold;
	letter-spacing: 0.1rem;
	color: #99acb5;
	margin-top: calc((100vw / 375) * 18);
}
@media screen and (min-width: 1024px) {
	#frontpage .feature .title .txt {
		font-size: 1.8rem;
		margin-top: 20px;
	}
}

#frontpage .feature .box {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	margin-top: calc((100vw / 375) * 24);
	padding-bottom: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#frontpage .feature .box {
		flex-direction: row;
		margin-top: 180px;
		padding-bottom: 100px;
	}
}

@media screen and (min-width: 1024px) {
	#frontpage .feature .box li {
		width: 400px;
	}
}

#frontpage .feature .box .txt {
	color: #fff;
	line-height: 2.0;
	letter-spacing: 0.2rem;
}

#frontpage .feature .box .txt + img,#frontpage .feature .box img + .txt { margin-top: calc((100vw / 375) * 35); }
#frontpage .feature .box li:nth-of-type(1) img {
	width: calc((100vw / 375) * 275);
}
#frontpage .feature .box li:nth-of-type(2) img {
	margin-top: calc((100vw / 375) * 40);
	margin-left: calc((100vw / 375) * 25);
	width: calc((100vw / 375) * 275);
}
#frontpage .feature .box li:nth-of-type(3) img {
	margin-top: calc((100vw / 375) * 40);
	margin-left: calc((100vw / 375) * 50);
	width: calc((100vw / 375) * 275);
}
@media screen and (min-width: 1024px) {
	#frontpage .feature .box .txt + img,#frontpage .feature .box img + .txt { margin-top: 60px; }
	#frontpage .feature .box li:nth-of-type(1) img {
		width: auto;
	}
	#frontpage .feature .box li:nth-of-type(2) img {
		margin-top: 110px;
		margin-left: 0;
		width: auto;
	}
	#frontpage .feature .box li:nth-of-type(3) img {
		margin-top: 0;
		margin-left: 0;
		width: auto;
	}
}

/* menulist */
#frontpage .menulist {
	position: relative;
	margin-top: calc((100vw / 375) * 145);
	margin-bottom: calc((100vw / 375) * 75);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist {
		margin-top: 200px;
		margin-bottom: 150px;
	}
}

#frontpage .menulist .en-mr {
	font-size: calc((100vw / 375) * 78);
	color: #e9f0f0;
	line-height: 1;
	position: absolute;
	top: calc((100vw / 375) * -101);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .en-mr {
		font-size: 16.0rem;
		top: -90px;
	}
}

#frontpage .menulist .title {
	font-size: calc((100vw / 375) * 28);
	position: relative;
	z-index: 1;
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .title {
		font-size: 3.0rem;
		margin-top: 78px;
	}
}

#frontpage .menulist .txt {
	font-size: calc((100vw / 375) * 15);
	line-height: 1.8;
	letter-spacing: 0.04rem;
	position: relative;
	z-index: 1;
	margin-top: calc((100vw / 375) * 26);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .txt {
		font-size: 1.6rem;
		line-height: 1.8;
		margin-top: 20px;
	}
}

#frontpage .menulist .btn-flex {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 30);
	margin-bottom: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .btn-flex {
		gap: 20px;
		justify-content: flex-start;
		margin-top: 60px;
		margin-bottom: 110px;
	}
}

#frontpage .menulist .bg {
	position: relative;
	padding-top: calc((100vw / 375) * 50);	
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg {
		padding-top: 100px;	
	}
}

#frontpage .menulist .bg::before {
	content: '';
	display: block;
	background: url(../images/menulist_bg_sp.jpg) center center / cover no-repeat;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: calc((100vw / 375) * 1050);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg::before {
		background: url(../images/menulist_bg.jpg) center center / cover no-repeat;
		height: 470px;
	}
}

#frontpage .menulist .bg .list {
	display: flex;
  flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: 40px;	
	padding: 0 calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list {
		flex-direction: row;
		gap: 40px;	
		padding: 0;
	}
}
@media screen and (min-width: 1600px) {
	#frontpage .menulist .bg .list {
		gap: 100px;	
	}
}

#frontpage .menulist .bg .list li {
	background: #fff;
	border-radius: 10px;
}

#frontpage .menulist .bg .list li a {
	position: relative;
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20) calc((100vw / 375) * 40) calc((100vw / 375) * 20);
	border-radius: 10px;
	box-shadow: 0px 0px 10px 10px rgb(78 64 68 / 15%);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: calc((100vw / 375) * 5);
	background: #fff;
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list li a {
		padding: 42px 60px 10px;
		border-radius: 10px;
		box-shadow: 0px 0px 10px 10px rgb(78 64 68 / 15%);
		flex-direction: row;
		gap: 60px;
	}
	#frontpage .menulist .bg .list li a:hover {
		opacity: .7;
	}
}

#frontpage .menulist .bg .list img {
	height: calc((100vw / 375) * 285);
	object-fit: contain;
	margin: 0 auto 0 0;
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list img {
		height: auto;
		max-height: 425px;
		margin: 0;
	}
}

@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list .txtbox {
		padding-bottom: 50px;
	}
}

#frontpage .menulist .bg .list .txtbox .cat {
	font-size: calc((100vw / 375) * 13);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list .txtbox .cat {
		font-size: 1.3rem;
	}
}

#frontpage .menulist .bg .list .txtbox .name {
	font-size: calc((100vw / 375) * 23);
	font-weight: 400;
	padding-bottom: calc((100vw / 375) * 15);
	border-bottom: 1px solid #dddddd;
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list .txtbox .name {
		font-size: 2.4rem;
		padding-bottom: 20px;
	}
}

#frontpage .menulist .bg .list .txtbox .desc {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	line-height: 1.8;
	margin-top: calc((100vw / 375) * 15);
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list .txtbox .desc {
		font-size: 1.5rem;
		margin-top: 20px;
	}
}

#frontpage .menulist .bg .list .txtbox .tag {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 10);
	flex-wrap: wrap;
	font-size: calc((100vw / 375) * 11);
	color: #6b6b6b;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list .txtbox .tag {
		gap: 15px;
		font-size: 1.3rem;
		margin-top: 20px;
	}
}

#frontpage .menulist .bg .list .txtbox .catch {
	font-size: calc((100vw / 375) * 20);
	font-weight: bold;
	position: absolute;
	top: calc((100vw / 375) * 30);
	right: calc((100vw / 375) * 20);
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .bg .list .txtbox .catch {
		font-size: 2.0rem;
		top: 55px;
		right: 50px;
	}
}

#frontpage .menulist .btn01 {
	display: block;
	font-size: calc((100vw / 375) * 18);
	text-align: right;
	padding-right: calc((100vw / 375) * 60);
	width: calc((100vw / 375) * 210);
	margin: calc((100vw / 375) * 50) 0 0 auto;
}
@media screen and (min-width: 1024px) {
	#frontpage .menulist .btn01 {
		font-size: 1.7rem;
		padding-right: 60px;
		width: 200px;
		margin: 60px 0 0 auto;
	}
}

/* faq */
#frontpage .faq {
	position: relative;
	padding-top: calc((100vw / 375) * 165);
	padding-bottom: calc((100vw / 375) * 75);
	background-color: #d0e0e0;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq {
		padding-top: 100px;
		padding-bottom: 100px;
		background: url(../images/faq_bg.jpg) center center / cover no-repeat;
	}
}

#frontpage .faq::before {
	content: '';
	display: block;
	background: url(../images/faq_bg_sp.jpg) center center / cover no-repeat;
	position: absolute;
	top: 0;
	width: 100%;
	height: calc((100vw / 375) * 300);
}
@media screen and (min-width: 1024px) {
	#frontpage .faq::before {
		display: none;
	}
}

#frontpage .faq h2.en-mr {
	font-size: calc((100vw / 375) * 77);
	letter-spacing: 0.5rem;
	color: rgb(233 240 240 / 20%);
	position: absolute;
	top: calc((100vw / 375) * -138);
	left: auto;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq h2.en-mr {
		font-size: 16.0rem;
		top: 0;
	}	
}

#frontpage .faq .box {
	box-shadow: 0px 0px 10px 10px rgb(64 78 78 / 15%);
	background-color: #fff;
	border-radius: 10px;
	width: 100%;
	padding: calc((100vw / 375) * 20);
	margin: 0 0 0 auto;
	z-index: 1;
	position: relative;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .box {
		box-shadow: 0px 0px 10px 10px rgb(64 78 78 / 15%);
		border-radius: 10px;
		width: 1100px;
		padding: 110px;
	}
}

#frontpage .faq .faq-list {
	margin-bottom: calc((100vw / 375) * 35);
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .faq-list {
		margin-bottom: 60px;
	}
}

#frontpage .faq .faq-list li {
	position: relative;
	border-bottom: 1px solid #d5dcdb;
}

#frontpage .faq .faq-list .q {
	position: relative;
	letter-spacing: 0.1rem;
	line-height: 1.8;
	padding-top: calc((100vw / 375) * 30);
	padding-bottom: calc((100vw / 375) * 27);
	padding-left: calc((100vw / 375) * 32);
	width: calc((100vw / 375) * 250);
	user-select: none;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .faq-list .q {
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 0;
		width: auto;
	}
}

#frontpage .faq .faq-list .q span {
	font-size: calc((100vw / 375) * 28);
	color: #9fadac;
	margin-right: calc((100vw / 375) * 8);
	position: absolute;
	top: calc((100vw / 375) * 17);
	left: 0;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .faq-list .q span {
		font-size: 3.0rem;
		margin-right: 12px;
		position: relative;
		top: 3px;
	}
}

#frontpage .faq .faq-list .q::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * -42);
	transform: translateY(-50%);
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .faq-list .q::before {
		width: 19px;
		height: 1px;
		top: 52%;
		right: 20px;
	}
}

#frontpage .faq .faq-list .q::after {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * -42);
	transform: translateY(-50%) rotate(90deg);
}
#frontpage .faq .faq-list li.is-open .q::after {
	visibility: hidden;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .faq-list .q::after {
		width: 19px;
		height: 1px;
		top: 52%;
		right: 20px;
	}
}

#frontpage .faq .faq-list .a {
	letter-spacing: 0.1rem;
	line-height: 1.8;
	padding-bottom: calc((100vw / 375) * 30);
	display: none;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .faq-list .a {
		padding-bottom: 35px;
	}
}

#frontpage .faq .btn01 {
	display: flex;
  justify-content: flex-end;
  flex-direction: row;
	margin: 0 0 calc((100vw / 375) * 38) auto;
	width: calc((100vw / 375) * 170);
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .btn01 {
		margin: 0 0 0 auto;
		width: 170px;
	}
}

#frontpage .faq .btn01 span {
	margin-right: 5px;
}
@media screen and (min-width: 1024px) {
	#frontpage .faq .btn01 span {
		margin-right: 5px;
	}
}

/* column */
#frontpage .column {
	position: relative;
}

#frontpage .column::before {
	content: '';
	display: block;
	background: url(../images/column_bg_sp.jpg) center center / cover no-repeat;
	position: absolute;
	top: calc((100vw / 375) * 280);
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: calc((100vw / 375) * 1900);
}
@media screen and (min-width: 1024px) {
	#frontpage .column::before {
		background: url(../images/column_bg.jpg) center center / cover no-repeat;
		height: 450px;
		top: auto;
		bottom: 0;
	}
}

#frontpage .column .container {
	position: relative;
	padding-top: calc((100vw / 375) * 67);
	padding-bottom: calc((100vw / 375) * 150);
}
@media screen and (min-width: 1024px) {
	#frontpage .column .container {
		padding-top: 200px;
		padding-bottom: 150px;
	}
}

#frontpage .column h2.en-mr {
	font-size: calc((100vw / 375) * 66);
	line-height: 1;
	letter-spacing: 0.5rem;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * 48);
	left: auto;
}
@media screen and (min-width: 1024px) {
	#frontpage .column h2.en-mr {
		font-size: 16.0rem;
		top: 120px;
	}
}

#frontpage .column .btn01 {
	display: block;
	position: absolute;
	bottom: calc((100vw / 375) * 75);
	right: calc((100vw / 375) * 20);
	margin: 0 0 0 auto;
	width: calc((100vw / 375) * 170);
}
@media screen and (min-width: 1024px) {
	#frontpage .column .btn01 {
		position: relative;
		bottom: auto;
		right: auto;
		margin: 0 0 0 auto;
		width: 170px;
	}
}

#frontpage .column .btn01 span {
	margin-right: 5px;
}
@media screen and (min-width: 1024px) {
	#frontpage .column .btn01 span {
		margin-right: 5px;
	}
}

#frontpage .column .list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: calc((100vw / 375) * 35);
	margin-top: 80px;
}
@media screen and (min-width: 1024px) {
	#frontpage .column .list {
		flex-direction: row;
		align-items: flex-start;
		gap: 5px;
		margin-top: 80px;
	}
}

#frontpage .column .list article {
  background: #fff;
	border-radius: 10px;
}

#frontpage .column .list a {
	display: block;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 10px 10px rgb(64 78 78 / 15%);
	padding: calc((100vw / 375) * 25);
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#frontpage .column .list a {
		border-radius: 10px;
		padding: 30px;
		width: 380px;
	}
	#frontpage .column .list a:hover {
		opacity: .7;
	}
}
@media screen and (min-width: 1600px) {
	#frontpage .column .list a {
		width: 450px;
	}
}

#frontpage .column .list a img {
	aspect-ratio: 390 / 240;
	width: 100%;
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#frontpage .column .list a img {
		aspect-ratio: 390 / 240;
		margin-bottom: 16px;
	}
}

#frontpage .column .list a h2 {
	font-size: calc((100vw / 375) * 19);
	font-weight: 400;
	line-height: 1.7;
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#frontpage .column .list a h2 {
		font-size: 2.0rem;
		line-height: 1.8;
		margin-bottom: 13px;
	}
}

#frontpage .column .list a p {
	font-size: calc((100vw / 375) * 14);
	color: #6b6b6b;
	overflow: hidden;   
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#frontpage .column .list a p {
		font-size: 1.5rem;
	}
}

/* topics */
#frontpage .topics {
	position: relative;
	padding-top: calc((100vw / 375) * 110);
	padding-bottom: calc((100vw / 375) * 78);
	background: url(../images/topics_bg_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics {
		padding-top: 90px;
		padding-bottom: 110px;
		background: url(../images/topics_bg.jpg) center center / cover no-repeat;
	}
}

#frontpage .topics h2.en-mr {
	font-size: calc((100vw / 375) * 70);
	line-height: 1;
	letter-spacing: 0.3rem;
	color: rgb(233 240 240 / 10%);
	position: absolute;
	top: calc((100vw / 375) * -60);
	left: auto;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics h2.en-mr {
		font-size: 16.0rem;
		letter-spacing: 0.5rem;
		top: -50px;
	}
}
@media screen and (min-width: 1670px) {
	#frontpage .topics h2.en-mr {
		top: 35px;
	}
}

#frontpage .topics .box {
	width: auto;
	margin: 0 0 0 auto;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .box {
		width: 900px;
	}
}

#frontpage .topics .list a {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: calc((100vw / 375) * 15);
	padding: calc((100vw / 375) * 35) 0;
	border-bottom: 1px solid #596d76;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .list a {
		flex-direction: row;
		gap: 30px;
		padding: 60px 0;
		border-bottom: 1px solid #596d76;
	}
	#frontpage .topics .list a:hover {
		opacity: .7;
	}
}

#frontpage .topics .list .txtarea {
	width: 100%;
}

#frontpage .topics .list img {
	aspect-ratio: 220 / 136;
	width: 100%;
	object-fit: cover;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .list img {
		aspect-ratio: 220 / 136;
		width: 220px;
		max-height: 136px;
	}
}

#frontpage .topics .list .t-top {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	margin-bottom: calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .list .t-top {
		margin-bottom: 12px;
		margin-top: 14px;
	}
}

#frontpage .topics .list .t-top .date {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	color: #fff;
	padding-right: calc((100vw / 375) * 12);
	border-right: 1px solid #fff;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .list .t-top .date {
		font-size: 1.5rem;
		padding-right: 12px;
	}
}

#frontpage .topics .list .t-top .cat {
	font-size: calc((100vw / 375) * 13);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	margin-left: calc((100vw / 375) * 12);
	color: #fff;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .list .t-top .cat {
		font-size: 1.3rem;
		line-height: 1.7;
		letter-spacing: 0.1rem;
		margin-left: 12px;
	}
}

#frontpage .topics .list .title {
	font-size: calc((100vw / 375) * 19);
	font-weight: 400;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 12);
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .list .title {
		font-size: 2.0rem;
		margin-bottom: 12px;
	}
}

#frontpage .topics .list .txt {
	font-size: calc((100vw / 375) * 15);
	color: #99acb5;
	overflow: hidden;   
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .list .txt {
		font-size: 1.5rem;
	}
}

#frontpage .topics .box .btn01 {
	color: #fff;
	margin: calc((100vw / 375) * 40) 0 0 auto;
	width: calc((100vw / 375) * 170);
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .box .btn01 {
		padding-right: 65px;
		margin: 60px 0 0 auto;
		width: 170px
	}
}

#frontpage .topics .box .btn01 .bold {
	margin-right: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#frontpage .topics .box .btn01 .bold {
		margin-right: 5px;
	}
}

/* ========== index link-comp-salon(link-comp-salon) ========== */
.link-comp-salon {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}
@media screen and (min-width: 1024px) {
	.link-comp-salon {
		flex-direction: row;
	}
}

.link-comp-salon .l-comp {
	width: 100%;
	background: url(../common_img/link_company_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	.link-comp-salon .l-comp {
		width: 50%;
		background: url(../common_img/link_company.jpg) center center / cover no-repeat;
	}
}

.link-comp-salon .l-salon {
	width: 100%;
	background: url(../common_img/link_salon_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	.link-comp-salon .l-salon {
		width: 50%;
		background: url(../common_img/link_salon.jpg) center center / cover no-repeat;
	}
}

.link-comp-salon .l-product {
	width: 100%;
	background: url(../common_img/link_product_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	.link-comp-salon .l-product {
		width: 50%;
		background: url(../common_img/link_product.jpg) center center / cover no-repeat;
	}
}

.link-comp-salon a {
	display: block;
	padding-top: calc((100vw / 375) * 45);
	padding-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	.link-comp-salon a {
		padding-top: 175px;
		padding-bottom: 140px;
	}
	.link-comp-salon a:hover {
		opacity: .65;
	}
}

.link-comp-salon a h2 {
	font-size: calc((100vw / 375) * 24);
	letter-spacing: 0.2rem;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	.link-comp-salon a h2 {
		font-size: 3.0rem;
		margin-bottom: 20px;
	}
}

.link-comp-salon a p {
	line-height: 2.0;
	letter-spacing: 0.2rem;
	color: #fff;
	padding-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	.link-comp-salon a p {
		padding-bottom: 50px;
	}
}

.link-comp-salon a .wrap {
	width: auto;
	margin: 0 calc((100vw / 375) * 20);
	border-bottom: 1px solid #fff;
}
@media screen and (min-width: 1024px) {
	.link-comp-salon a .wrap {
		width: 600px;
		margin: 0 auto;
	}
}

.detail-main + .link-comp-salon {
	padding-top: calc((100vw / 375) * 40);
	background-color: #f1f6f6;
}
@media screen and (min-width: 1024px) {
	.detail-main + .link-comp-salon {
		padding-top: 100px;
	}
}

/* ========== index MENU(menu-sec) ========== */
#menu-sec {
	position: relative;
}

#menu-sec .search {
	background-color: #f1f6f6;
	padding-top: calc((100vw / 375) * 45);
}
@media screen and (min-width: 1024px) {
	#menu-sec .search {
		padding-top: 105px;
	}
}

#menu-sec .menulist {
	background-color: #f1f6f6;
	position: relative;
	padding-top: calc((100vw / 375) * 80);
	padding-bottom: calc((100vw / 375) * 75);
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist {
		padding-top: 130px;
		padding-bottom: 150px;
	}
}

#menu-sec .menulist .list {
	display: flex;
  flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	flex-wrap: nowrap;
	gap: calc((100vw / 375) * 40);	
	padding: 0 calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 40px;	
		padding: 0;
	}
}
@media screen and (min-width: 1600px) {
	#menu-sec .menulist .list {
		gap: 100px;	
	}
}

#menu-sec .menulist .list li {
	background: #fff;
	border-radius: 10px;
	width: auto;
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list li {
		width: calc((100% - 100px) / 2);
	}
}

#menu-sec .menulist .list li a {
	position: relative;
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20) calc((100vw / 375) * 40) calc((100vw / 375) * 20);
	border-radius: 10px;
	box-shadow: 0px 0px 20px 20px rgb(78 64 68 / 10%);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: calc((100vw / 375) * 5);
	background: #fff;
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list li a {
		padding: 42px 60px 10px;
		border-radius: 10px;
		flex-direction: row;
		gap: 60px;
	}
	#menu-sec .menulist .list li a:hover {
		opacity: .7;
	}
}

#menu-sec .menulist .list img {
	height: calc((100vw / 375) * 285);
	object-fit: contain;
	margin: 0 auto 0 0;
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list img {
		height: auto;
		max-height: 425px;
		margin: 0;
	}
}

@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list .txtbox {
		padding-bottom: 50px;
	}
}

#menu-sec .menulist .list .txtbox .cat {
	font-size: calc((100vw / 375) * 13);
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list .txtbox .cat {
		font-size: 1.3rem;
	}
}

#menu-sec .menulist .list .txtbox .name {
	font-size: calc((100vw / 375) * 23);
	font-weight: 400;
	padding-bottom: calc((100vw / 375) * 15);
	border-bottom: 1px solid #dddddd;
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list .txtbox .name {
		font-size: 2.4rem;
		padding-bottom: 20px;
	}
}

#menu-sec .menulist .list .txtbox .desc {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	line-height: 1.8;
	margin-top: calc((100vw / 375) * 15);
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list .txtbox .desc {
		font-size: 1.5rem;
		margin-top: 20px;
	}
}

#menu-sec .menulist .list .txtbox .tag {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 10);
	flex-wrap: wrap;
	font-size: calc((100vw / 375) * 11);
	color: #6b6b6b;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list .txtbox .tag {
		gap: 15px;
		font-size: 1.3rem;
		margin-top: 15px;
	}
}

#menu-sec .menulist .list .txtbox .catch {
	font-size: calc((100vw / 375) * 20);
	font-weight: bold;
	position: absolute;
	top: calc((100vw / 375) * 30);
	right: calc((100vw / 375) * 20);
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
}
@media screen and (min-width: 1024px) {
	#menu-sec .menulist .list .txtbox .catch {
		font-size: 2.0rem;
		top: 50px;
		right: 50px;
	}
}


/* ========== index MENU DETAIL(menudetail-sec) ========== */
#menudetail-sec .item-main {
	padding-top: calc((100vw / 375) * 75);
	padding-bottom: calc((100vw / 375) * 55);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main {
		padding-top: 150px;
		padding-bottom: 150px;
	}
}

#menudetail-sec .item-main .box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box {
		flex-direction: row;
		justify-content: space-between;
		gap: 50px;
	}
}

#menudetail-sec .item-main .box .imgbox {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .imgbox {
		width: 700px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider {
	width: 100%;
}

#menudetail-sec .item-main .box .imgbox .slider-main {
	position: relative;
}

#menudetail-sec .item-main .box .imgbox .slider-main .swiper-slide {
	position: relative;
	display: flex;
  justify-content: center; 
	margin: auto 0;
}

#menudetail-sec .item-main .box .imgbox .slider-main .swiper-slide img {
	align-self: center;
	object-fit: cover;
	object-position: center;
	max-height: 100%;
  max-width: 100%;
	border-radius: calc((100vw / 375) * 8);
	user-select: none;
}
@media screen and (min-width: 1024px){
	#menudetail-sec .item-main .box .imgbox .slider-main .swiper-slide img {
		border-radius: 10px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub {
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px){
	#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub {
		margin-top: 60px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px){
	#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb {
		flex-wrap: wrap;
		justify-content: normal;
		gap: 30px 60px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb .thumb-img {
	width: calc((100vw / 375) * 155);
	object-fit: cover;
	cursor: pointer;
	transition: border .7s ease, opacity .7s ease;
	box-sizing:border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
	border-radius: calc((100vw / 375) * 8);
}
#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb .thumb-img {
	border: 2px solid transparent;
}
#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb .thumb-img.is-active {
	border: 2px solid #dddddd;
}
@media screen and (min-width: 1024px){
	#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb .thumb-img {
		width: 320px;
		border-radius: 10px;
	}
	#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb .thumb-img:hover {
		opacity: .7;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb .thumb-img img {
	aspect-ratio: 320 / 320;
	object-fit: cover;
	object-position: center;
	height: 100%;
	border-radius: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px){
	#menudetail-sec .item-main .box .imgbox .img-slider .slider-sub .thumb .thumb-img img {
		border-radius: 10px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-next,
#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-prev {
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	color: transparent;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-next,
	#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-prev {
		width: 50px;
		height: 50px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-next {
	right: calc((100vw / 375) * 10);
	background: url(../common_img/slide_next.png) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-next {
		right: 20px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-prev {
	left: calc((100vw / 375) * 10);
	background: url(../common_img/slide_prev.png) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-prev {
		left: 20px;
	}
}

#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-next.swiper-button-disabled,
#menudetail-sec .item-main .box .imgbox .img-slider .swiper-button-prev.swiper-button-disabled {
	visibility: hidden;
}

#menudetail-sec .item-main .box .txt {
	width: auto;
	max-width: 800px;
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt {
		width: calc(100% - 720px);
		max-width: 800px;
		padding-top: 40px;
	}
}

#menudetail-sec .item-main .box .txt .cat {
	font-size: calc((100vw / 375) * 13);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .cat {
		font-size: 1.3rem;
	}
}

#menudetail-sec .item-main .box .txt .name {
	font-size: calc((100vw / 375) * 23);
	font-weight: 400;
	padding-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .name {
		font-size: 2.4rem;
		padding-top: 10px;
	}
}

#menudetail-sec .item-main .box .txt .tag {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 10);
	flex-wrap: wrap;
	font-size: calc((100vw / 375) * 11);
	color: #6b6b6b;
	margin-top: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .tag {
		gap: 15px;
		font-size: 1.3rem;
		margin-top: 15px;
	}
}

#menudetail-sec .item-main .box .txt .contents {
	padding-top: calc((100vw / 375) * 25);
	margin-top: calc((100vw / 375) * 25);
	border-top: 1px solid #dddddd;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents {
		padding-top: 30px;
		margin-top: 30px;
		border-top: 1px solid #dddddd;
	}
}

#menudetail-sec .item-main .box .txt .contents p {
	font-size: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents p {
		font-size: 1.6rem;
	}
}

#menudetail-sec .item-main .box .txt .contents .btn-salon {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
	font-size: calc((100vw / 375) * 13);
	font-weight: 500;
	color: #fff;
	background-color: #d54d85;
	border: 1px solid #d54d85;
	text-align: center;
	border-radius: calc((100vw / 375) * 40);
	padding: calc((100vw / 375) * 12) 0;
	transition: all .7s ease;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents .btn-salon {
		width: 600px;
		font-size: 1.7rem;
		border-radius: 40px;
		padding: 15px 0;
	}
	#menudetail-sec .item-main .box .txt .contents .btn-salon:hover {
		background-color: #fff;
		color: #d54d85;
	}
}

#menudetail-sec .item-main .box .txt .contents .btn-salon .i-circle {
	display: inline-block;
	width: calc((100vw / 375) * 39);
	height: calc((100vw / 375) * 39);
	background: url(../common_img/btn_white_line.svg) center center / cover no-repeat;
	margin-left: calc((100vw / 375) * 5);
	transition: all .8s ease;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents .btn-salon .i-circle {
		width: 50px;
		height: 50px;
		margin-left: 10px;
	}
	#menudetail-sec .item-main .box .txt .contents .btn-salon:hover .i-circle {
		background: url(../common_img/btn_pink.svg) center center / cover no-repeat;
	}
}

#menudetail-sec .item-main .box .txt .contents .subtxt {
	position: relative;
	font-size: calc((100vw / 375) * 12);
	color: #6b6b6b;
	margin-top: calc((100vw / 375) * 20);
	padding-left: calc((100vw / 375) * 15)
}
#menudetail-sec .item-main .box .txt .contents .subtxt .icon {
	position: absolute;
	left: 0;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents .subtxt {
		text-align: center;
		font-size: 1.3rem;
		margin-top: 20px;
		padding-left: 0;
	}
	#menudetail-sec .item-main .box .txt .contents .subtxt .icon {
		position: relative;
		left: auto;
	}
}

#menudetail-sec .item-main .box .txt .contents .btn-contact {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: calc((100vw / 375) * 305);
	margin: 0 auto;
	font-size: calc((100vw / 375) * 13);
	font-weight: 500;
	color: #120606;
	background-color: #fff;
	text-align: center;
	border: 1px solid #120606;
	border-radius: calc((100vw / 375) * 30);
	padding: calc((100vw / 375) * 9) 0 calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 18);
	transition: all .7s ease;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents .btn-contact {
		width: 400px;
		font-size: 1.6rem;
		border-radius: 23px;
		padding: 8px 0;
		margin-top: 20px;
	}
	#menudetail-sec .item-main .box .txt .contents .btn-contact:hover {
		color: #fff;
		background-color: #120606;
	}
}

#menudetail-sec .item-main .box .txt .contents .btn-contact .arrow {
	display: inline-block;
	width: calc((100vw / 375) * 11);
	height: calc((100vw / 375) * 11);
	background: url(../common_img/arrow_up_black.svg) center center / cover no-repeat;
	margin-left: calc((100vw / 375) * 4);
	transition: all .8s ease;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents .btn-contact .arrow {
		width: 11px;
		height: 11px;
		margin-left: 5px;
	}
	#menudetail-sec .item-main .box .txt .contents .btn-contact:hover .arrow {
		background: url(../common_img/arrow_up_white.svg) center center / cover no-repeat;
	}
}

#menudetail-sec .item-main .box .txt .contents .subtitle {
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	letter-spacing: 0.2rem;
	line-height: 1.8;
	margin-top: calc((100vw / 375) * 35);
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents .subtitle {
		font-size: 2.0rem;
		margin-top: 65px;
		margin-bottom: 10px;
	}
}

#menudetail-sec .item-main .box .txt .contents .recommend {
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	letter-spacing: 0.2rem;
	line-height: 1.8;	
	margin-top: calc((100vw / 375) * 35);
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .item-main .box .txt .contents .recommend {
		font-size: 2.0rem;
		margin-top: 45px;
		margin-bottom: 10px;
	}
}

/* details */
#menudetail-sec .details {
	position: relative;
}

#menudetail-sec .details .title {
	font-size: calc((100vw / 375) * 20);
	font-weight: 400;
	letter-spacing: 0.5rem;
	line-height: 1.8;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .title {
		font-size: 3.6rem;
	}
}

#menudetail-sec .details .title .t-sub {
	display: block;
	font-size: calc((100vw / 375) * 15);
	letter-spacing: 0.2rem;
	font-weight: bold;
	padding-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .title .t-sub {
		font-size: 1.8rem;
		letter-spacing: 0.4rem;
		padding-bottom: 10px;
	}
}

#menudetail-sec .details .small {
	font-size: calc((100vw / 375) * 12) !important;
	letter-spacing: 0.1rem !important;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .small {
		font-size: 1.3rem !important;
	}
}

#menudetail-sec .details .title + .small { margin-top: calc((100vw / 375) * 8); }
#menudetail-sec .details .desc p + .small {	margin-top: calc((100vw / 375) * 20); }
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .title + .small { margin-top: 8px; }
	#menudetail-sec .details .desc p + .small {	margin-top: 20px; }
}

#menudetail-sec .details .box p {
	font-size: calc((100vw / 375) * 15);
	letter-spacing: 0.5rem;
	line-height: 1.8;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .box p {
		font-size: 2.2rem;
	}
}

#menudetail-sec .details .box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .box {
		flex-direction: row;
		justify-content: space-between;
		gap: 30px;
	}
}
@media screen and (min-width: 1720px) {
	#menudetail-sec .details .box {
		gap: 80px;
	}
	#menudetail-sec .details.cont02 .box {
		gap: 60px;
	}
}

#menudetail-sec .details .box .list {
	position: relative;
	margin-top: 25px;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .box .list {
		margin-top: 25px;
	}
}

#menudetail-sec .details .box .list li {
	position: relative;
	font-size:calc((100vw / 375) * 14);
	padding-left: calc((100vw / 375) * 19);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .box .list li {
		font-size: 2.2rem;
		padding-left: 22px;
	}
}

#menudetail-sec .details .box .list li + li {
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .box .list li + li {
		margin-top: 18px;
	}
}

#menudetail-sec .details .box .list li::before {
	content: '・';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}

#menudetail-sec .details .bgtitle {
	position: relative;
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .bgtitle {
		margin-bottom: 30px;
	}
}

#menudetail-sec .details .bgtitle .en-mr {
	font-size: calc((100vw / 375) * 70);
	color: #e9f0f0;
	letter-spacing: 0.4rem;
	position: absolute;
	top: calc((100vw / 375) * -45);
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .bgtitle .en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.4rem;
		top: -152px;
	}
}

#menudetail-sec .details .bgtitle .en {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.3rem;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .bgtitle .en {
		position: relative;
		font-size: 3.0rem;
	}
}

#menudetail-sec .details .whitebox {
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0px 0px 20px 20px rgb(64 78 78 / 15%);
	padding: calc((100vw / 375) * 20) calc((100vw / 375) * 20) calc((100vw / 375) * 40) calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 45);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .whitebox {
		border-radius: 10px;
		padding: 100px 100px 80px 100px;
		margin-top: 90px;
	}
}

#menudetail-sec .details .whitebox .desctitle {
	font-size: calc((100vw / 375) * 19);
	line-height: 1.6;
	letter-spacing: 0.5rem;
	margin-bottom: calc((100vw / 375) * 10);
	padding-top: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .whitebox .desctitle {
		font-size: 3.0rem;
		margin-bottom: 30px;
		padding-top: 10px;
	}
}

#menudetail-sec .details .whitebox p {
	font-size: calc((100vw / 375) * 15);
	line-height: 2.0;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .whitebox p {
		font-size: 1.6rem;
	}
}

#menudetail-sec .details .whitebox .b-top {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .whitebox .b-top {
		flex-direction: row;
		gap: 95px;
	}
}

#menudetail-sec .details .whitebox .b-top .desc,
#menudetail-sec .details .whitebox .b-top img {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .whitebox .b-top .desc,
	#menudetail-sec .details .whitebox .b-top img {
		width: calc((100% - 95px) / 2);
	}
}

#menudetail-sec .details .whitebox .b-bottom {
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details .whitebox .b-bottom {
		padding-top: 60px;
	}
}

#menudetail-sec .details.cont01 {
	padding-bottom: calc((100vw / 375) * 60);
	margin-bottom: calc((100vw / 375) * 60);
}
#menudetail-sec .details.cont01::before {
	content: '';
	display: block;
	background-color: #f1f6f6;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: calc((100vw / 375) * 640);	
}
#menudetail-sec .details.cont01 .desc .title {
  max-width: 645px;
}
#menudetail-sec .details.cont01 img { 
	width: 100%;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details.cont01 {
		padding-bottom: 160px;
		margin-bottom: 150px;
	}
	#menudetail-sec .details.cont01::before {
		bottom: 0;
		height: 575px;	
	}
	#menudetail-sec .details.cont01 .desc .title {
		max-width: 645px;
	}
	#menudetail-sec .details.cont01 img { 
		width: 54%;
		margin-top: 20px;
	}
}

#menudetail-sec .details.cont02 {
	padding-top: calc((100vw / 375) * 60);
	padding-bottom: calc((100vw / 375) * 60);
	background: url(../images/menu/detail_bg01.jpg) center center / cover no-repeat;
}
#menudetail-sec .details.cont02 p {
	color: #fff;
}
#menudetail-sec .details.cont02 .en-mr {
	font-size: calc((100vw / 375) * 64);
	line-height: 1;
	letter-spacing: 0.5rem;
	color: #e9f0f0;
	margin-bottom: calc((100vw / 375) * 15);
}
#menudetail-sec .details.cont02 .title {
	color: #fff;
}
#menudetail-sec .details.cont02 .box {
	margin-top: calc((100vw / 375) * 20);
}
#menudetail-sec .details.cont02 img { 
	width: 100%;
	height: calc((100vw / 375) * 220);
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details.cont02 {
		padding-top: 120px;
		padding-bottom: 155px;
	}
	#menudetail-sec .details.cont02 .en-mr {
		font-size: 16.0rem;
		margin-bottom: 40px;
	}
	#menudetail-sec .details.cont02 .box {
		margin-top: 80px;
	}
	#menudetail-sec .details.cont02 img { 
		width: 50%;
		height: auto;
		margin-top: 10px;
	}
}

#menudetail-sec .details.cont03 {
	padding-top: calc((100vw / 375) * 50);
	padding-bottom: calc((100vw / 375) * 50);
}
#menudetail-sec .details.cont03::before {
	content: '';
	display: block;
	background-color: #c9dacf;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: calc((100vw / 375) * 180);	
}
#menudetail-sec .details.cont03 .title {
	text-align: left;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details.cont03 .title {
		text-align: center;
	}
}
#menudetail-sec .details.cont03 img {
	margin-top: 40px;
	border-radius: calc((100vw / 375) * 8);
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details.cont03 {
		padding-top: 140px;
		padding-bottom: 80px;
	}
	#menudetail-sec .details.cont03::before {
		width: 100%;
		height: 590px;	
	}
	#menudetail-sec .details.cont03 img {
		margin-top: 40px;
		border-radius: 10px;
		width: 100%;
	}
}

#menudetail-sec .details.cont04 {
	padding-top: calc((100vw / 375) * 50);
	padding-bottom: calc((100vw / 375) * 50);
}
#menudetail-sec .details.cont04 .box {
	margin-top: calc((100vw / 375) * 20);
}
#menudetail-sec .details.cont04 img { 
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details.cont04 {
		padding-top: 100px;
		padding-bottom: 120px;
	}
	#menudetail-sec .details.cont04 .box {
		margin-top: 40px;
	}
	#menudetail-sec .details.cont04 .desc {
		padding-top: 10px;
	}
	#menudetail-sec .details.cont04 img { 
		width: 50%;
	}
}

#menudetail-sec .details.cont05 {
	padding-top: calc((100vw / 375) * 40);
	padding-bottom: calc((100vw / 375) * 40);
	background: url(../images/menu/detail_bg02_sp.jpg) center center / cover no-repeat;
}
#menudetail-sec .details.cont05::before {
	content: '';
	display: block;
	background-color: #fff;
	position: absolute;
	top: 0;
	width: 100%;
	height: calc((100vw / 375) * 440);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .details.cont05 {
		padding-top: 100px;
		padding-bottom: 155px;
		margin-bottom: 155px;
		background: url(../images/menu/detail_bg02.jpg) center center / cover no-repeat;
	}
	#menudetail-sec .details.cont05::before {
		top: 0;
		width: 100%;
		height: 640px;
	}
}

/* info */
#menudetail-sec .info {
	padding: calc((100vw / 375) * 45) 0;
	background: #f1f6f6;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info {
		padding: 100px 0;
	}
}

#menudetail-sec .info .box {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 10px 10px rgb(111 125 125 / 15%);
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	padding: calc((100vw / 375) * 35) calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info .box {
		flex-direction: row;
		align-items: center;
		gap: 0;
		border-radius: 10px;
		padding: 75px 90px 100px 90px;
		box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
	}
}

#menudetail-sec .info .box h2 {
	font-size: calc((100vw / 375) * 20);
	font-weight: bold;
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info .box h2 {
		font-size: 2.4rem;
		width: 280px;
		margin-right: 130px;
		margin-bottom: 0;
	}
}

#menudetail-sec .info .info-list {
	width: 100%;
	max-width: 1000px;
}

#menudetail-sec .info .info-list li {
	position: relative;
	padding: calc((100vw / 375) * 20) 0;
	border-bottom: 1px solid #d5dcdb;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info .info-list li {
		padding: 35px 20px 35px 0;
	}
}

#menudetail-sec .info .info-list h3 {
	position: relative;
	font-size: calc((100vw / 375) * 17);
	font-weight: bold;
	width: calc((100vw / 375) * 258);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info .info-list h3 {
		font-size: 1.8rem;
		width: 98%;
	}
}

#menudetail-sec .info .info-list h3::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * -32);
	transform: translateY(-50%);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info .info-list h3::before {
		width: 19px;
		height: 1px;
		top: 52%;
		right: -25px;
	}
}

#menudetail-sec .info .info-list h3::after {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * -32);
	transform: translateY(-50%) rotate(90deg);
}
#menudetail-sec .info .info-list li.is-open h3::after {
	visibility: hidden;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info .info-list h3::after {
		width: 19px;
		height: 1px;
		top: 52%;
		right: -25px;
	}
}

#menudetail-sec .info .info-list .txt {
	font-size: calc((100vw / 375) * 15);
	padding-top: calc((100vw / 375) * 20);
	display: none;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .info .info-list .txt {
		font-size: 1.6rem;
		padding-top: 20px;
	}
}

/* voice */
#menudetail-sec .voice {
	position: relative;
	padding-bottom: 0;
}

#menudetail-sec .voice h2.en-mr {
	font-size: calc((100vw / 375) * 60);
	letter-spacing: 0.7rem;
	line-height: 1;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * -36);
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .voice h2.en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
		top: -95px;
	}
}

#menudetail-sec .voice .voice-swiper {
	margin-bottom: calc((100vw / 375) * 100);
}
@media screen and (min-width: 1024px) {
	#menudetail-sec .voice .voice-swiper {
		margin-bottom: 165px;
	}
}


/* ========== index TOPICS(information-sec) ========== */
#information-sec .infolist {
	padding-top: calc((100vw / 375) * 65);
	padding-bottom: calc((100vw / 375) * 65);
	background-color: #f1f6f6;	
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist {
		padding-top: 100px;
		padding-bottom: 140px;
	}
}

#information-sec .infolist .box {
	box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
	border-radius: calc((100vw / 375) * 8);
	background-color: #fff;
	padding: calc((100vw / 375) * 10) calc((100vw / 375) * 20) calc((100vw / 375) * 20) calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box {
		border-radius: 10px;
		padding: 60px 20px;
	}
}

#information-sec .infolist .box .list {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

#information-sec .infolist .box .list a {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: calc((100vw / 375) * 15);
	padding: calc((100vw / 375) * 30) 0;
	border-bottom: 1px solid #d5dcdb;
}
#information-sec .infolist .box .list article:last-of-type a { border-bottom: 0; }
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box .list a {
		flex-direction: row;
		gap: 30px;
		padding: 60px 0;
	}
	#information-sec .infolist .box .list a:hover {
		opacity: .7;
	}
}

#information-sec .infolist .box .list .txtarea {
	width: 100%;
}

#information-sec .infolist .box .list img {
	flex: 0 0 auto;
	aspect-ratio: 320 / 200;
	object-fit: cover;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box .list img {
		width: 320px;
		max-height: 200px;
	}
}

#information-sec .infolist .box .list .t-top {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	margin-top: calc((100vw / 375) * 10);
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box .list .t-top {
		margin-top: 35px;
		margin-bottom: 12px;
	}
}

#information-sec .infolist .box .list .t-top .date {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	padding-right: calc((100vw / 375) * 10);
	border-right: 1px solid #9fadac;
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box .list .t-top .date {
		font-size: 1.5rem;
		padding-right: 12px;
	}
}

#information-sec .infolist .box .list .t-top .cat {
	font-size: calc((100vw / 375) * 13);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	margin-left: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box .list .t-top .cat {
		font-size: 1.3rem;
		line-height: 1.7;
		letter-spacing: 0.1rem;
		margin-left: 12px;
	}
}

#information-sec .infolist .box .list .title {
	font-size: calc((100vw / 375) * 19);
	font-weight: 400;
	margin-bottom: calc((100vw / 375) * 12);
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box .list .title {
		font-size: 2.0rem;
		margin-bottom: 12px;
	}
}

#information-sec .infolist .box .list .txt {
	font-size: calc((100vw / 375) * 15);
	overflow: hidden;   
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#information-sec .infolist .box .list .txt {
		font-size: 1.5rem;
	}
}

/* ========== index VOICE(voice-sec) ========== */
#voice-sec .voicelist {
	padding-top: calc((100vw / 375) * 65);
	padding-bottom: calc((100vw / 375) * 65);	
}
@media screen and (min-width: 1024px) {
	#voice-sec .voicelist {
		padding-top: 100px;
		padding-bottom: 0;
	}
}

#voice-sec .voicelist .box .list {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: calc((100vw / 375) * 45);
}
@media screen and (min-width: 1024px) {
	#voice-sec .voicelist .box .list {
		flex-direction: row;
		gap: 100px;
	}
}

#voice-sec .voicelist .box .list article {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#voice-sec .voicelist .box .list article {
		width: calc((100% - 200px) / 3);
	}
}

#voice-sec .voicelist .box .list a {
	position: relative;
	display: block;
}
#voice-sec .voicelist .box .list article:last-of-type a { border-bottom: 0; }
@media screen and (min-width: 1024px) {
	#voice-sec .voicelist .box .list a:hover {
		opacity: .7;
	}
}

#voice-sec .voicelist .box .list .img {
	padding-bottom: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#voice-sec .voicelist .box .list .img {
		padding-bottom: 65px;
	}
}

#voice-sec .voicelist .box .list .img img {
	aspect-ratio: 470 / 540;
	width: 100%;
	max-height: calc((100vw / 375) * 400);
	object-fit: cover;
}
@media screen and (min-width: 1024px) {
	#voice-sec .voicelist .box .list .img img {
		height: 540px;
	}
}

#voice-sec .voicelist .box .list .txt {
	font-size: calc((100vw / 375) * 15);
	letter-spacing: 0.1rem;
	line-height: 2.0;
	position: absolute;
	background-color: #fff;
	right: -1px;
	bottom: 0;
	width: calc((100vw / 375) * 268);
	min-height: calc((100vw / 375) * 135);
	padding-top: calc((100vw / 375) * 15);
	padding-left: calc((100vw / 375) * 15);
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 4;
}
@media screen and (min-width: 1024px) {
	#voice-sec .voicelist .box .list .txt {
		font-size: 1.6rem;
		width: 350px;
		min-height: 153px;
		padding-top: 25px;
		padding-left: 30px;
	}
}


/* ========== index COLUMN(column-sec) ========== */
#column-sec .columnlist {
	padding-top: calc((100vw / 375) * 65);
	padding-bottom: calc((100vw / 375) * 65);	
	background-color: #f1f6f6;
}
@media screen and (min-width: 1024px) {
	#column-sec .columnlist {
		padding-top: 100px;
		padding-bottom: 180px;
	}
}

#column-sec .columnlist .box .list {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	#column-sec .columnlist .box .list {
		flex-direction: row;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
		gap: 40px;
	}
}
@media screen and (min-width: 1600px) {
	#column-sec .columnlist .box .list {
		gap: 95px;
	}
}

#column-sec .columnlist .box .list article {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#column-sec .columnlist .box .list article {
		width: calc((100% - 80px) / 3);
	}
}
@media screen and (min-width: 1600px) {
	#column-sec .columnlist .box .list article {
		width: calc((100% - 190px) / 3);
	}
}

#column-sec .columnlist .box .list a {
	display: block;
	padding: calc((100vw / 375) * 20);
	border-radius: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 10px 10px rgb(64 78 78 / 10%);
	background-color: #fff;
}
@media screen and (min-width: 1024px) {
	#column-sec .columnlist .box .list a {
		padding: 40px;
		border-radius: 10px;
		box-shadow: 0px 0px 20px 20px rgb(64 78 78 / 10%);
	}
	#column-sec .columnlist .box .list a:hover {
		opacity: .7;
	}
}

#column-sec .columnlist .box .list img {
	flex: 0 0 auto;
	aspect-ratio: 390 / 240;
	object-fit: cover;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#column-sec .columnlist .box .list img {
		width: 390px;
		max-height: 240px;
	}
}

#column-sec .columnlist .box .list .title {
	font-size: calc((100vw / 375) * 19);
	font-weight: 400;
	line-height: 1.6;
	margin-top: calc((100vw / 375) * 5);
	margin-bottom: calc((100vw / 375) * 12);
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
}
@media screen and (min-width: 1024px) {
	#column-sec .columnlist .box .list .title {
		font-size: 2.0rem;
		margin-top: 10px;
		margin-bottom: 10px;
	}
}

#column-sec .columnlist .box .list .txt {
	font-size: calc((100vw / 375) * 15);
	overflow: hidden;   
  text-overflow: ellipsis;
  white-space: nowrap;
	padding-bottom: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#column-sec .columnlist .box .list .txt {
		font-size: 1.5rem;
		padding-bottom: 10px;
	}
}

/* ========== index PAGE DETAIL(detail-sec) ========== */
#detail-sec .detail-main {
	position: relative;
	padding-top: calc((100vw / 375) * 75);
	background-color: #f1f6f6;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main {
		padding-top: 200px;
	}
}

#detail-sec .detail-main::before {
	content: '';
	display: block;
	background: url(../images/information/detail_bg01.png) center center / cover no-repeat;
	width: 100%;
	height: 892px;
	position: absolute;
	top: 0;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main::before {
		width: 100%;
		height: 892px;
	}
}

#detail-sec .detail-main .p-date {
  font-size: calc((100vw / 375) * 16);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .p-date {
		font-size: 1.8rem;
		margin-bottom: 15px;
	}
}

#detail-sec .detail-main .p-title {
	font-size: calc((100vw / 375) * 23);
	line-height: 1.8;
	margin-bottom: calc((100vw / 375) * 40);
	display: flex;
	align-items: center;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .p-title {
		font-size: 3.6rem;
		margin-bottom: 175px;
		height: 130px;
	}
}

#detail-sec .detail-main .flexwrap {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .flexwrap {
		flex-direction: row;
		gap: 50px;
	}
}
@media screen and (min-width: 1600px) {
	#detail-sec .detail-main .flexwrap {
		gap: 100px;
	}
}

#detail-sec .detail-main .contents {
	position: relative;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20);
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents {
		border-radius: 10px;
		padding: 60px 40px;
		width: calc(100% - 490px);
	}
}
@media screen and (min-width: 1600px) {
	#detail-sec .detail-main .contents {
		padding: 90px;
		width: calc(100% - 540px);
	}
}

#detail-sec .detail-main .contents p {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.2rem;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents p {
		font-size: 1.6rem;
		margin-top: 20px;
	}
}

#detail-sec .detail-main .contents h2,
#detail-sec .detail-main .contents h3,
#detail-sec .detail-main .contents h4 {
	font-size: calc((100vw / 375) * 18);
	font-weight: bold;
	letter-spacing: 0.2rem;
	line-height: 1.8;
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents h2,
	#detail-sec .detail-main .contents h3,
	#detail-sec .detail-main .contents h4 {
		font-size: 2.0rem;
		margin-top: 60px;
	}
}

#detail-sec .detail-main .contents img {
	margin-top: calc((100vw / 375) * 30);
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents img {
		margin-top: 60px;
	}
}

#detail-sec .detail-main .contents ul {
	margin-top: 20px;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents ul {
		margin-top: 20px;
	}
}

#detail-sec .detail-main .contents ul li {
	position: relative;
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.2rem;
	padding: calc((100vw / 375) * 15) 0 calc((100vw / 375) * 15) calc((100vw / 375) * 12);
	border-bottom: 1px solid #d5dcdb;	
}
#detail-sec .detail-main .contents ul li::before {
	content: '';
	display: block;
	position: absolute;
	top: calc((100vw / 375) * 25);
	left: 0;
	width: calc((100vw / 375) * 5);
	height: calc((100vw / 375) * 5);
	border-radius: 50%;
	background-color: #000;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents ul li {
		font-size: 1.6rem;
		padding: 28px 0 28px 12px;
	}
	#detail-sec .detail-main .contents ul li::before {
		top: 40px;
		width: 6px;
		height: 6px;
	}
}

#detail-sec .detail-main .contents ol {
	margin-top: 20px;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents ol {
		margin-top: 20px;
	}
}

#detail-sec .detail-main .contents ol li {
	position: relative;
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.2rem;
	padding: calc((100vw / 375) * 15) 0 calc((100vw / 375) * 15) calc((100vw / 375) * 17);
	border-bottom: 1px solid #d5dcdb;	
}
#detail-sec .detail-main .contents ol li::before {
	display: block;
	position: absolute;
	top: calc((100vw / 375) * 15);
	left: 0;
}
#detail-sec .detail-main .contents ol li:nth-of-type(1)::before { content: '①'; }
#detail-sec .detail-main .contents ol li:nth-of-type(2)::before { content: '②'; }
#detail-sec .detail-main .contents ol li:nth-of-type(3)::before { content: '③'; }
#detail-sec .detail-main .contents ol li:nth-of-type(4)::before { content: '④'; }
#detail-sec .detail-main .contents ol li:nth-of-type(5)::before { content: '⑤'; }
#detail-sec .detail-main .contents ol li:nth-of-type(6)::before { content: '⑥'; }
#detail-sec .detail-main .contents ol li:nth-of-type(7)::before { content: '⑦'; }
#detail-sec .detail-main .contents ol li:nth-of-type(8)::before { content: '⑧'; }
#detail-sec .detail-main .contents ol li:nth-of-type(9)::before { content: '⑨'; }
#detail-sec .detail-main .contents ol li:nth-of-type(10)::before { content: '⑩'; }
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents ol li {
		font-size: 1.6rem;
		padding: 28px 0 28px 20px;
	}
	#detail-sec .detail-main .contents ol li::before {
		top: 29px;
	}
}

#detail-sec .detail-main .contents p:first-child,
#detail-sec .detail-main .contents h2:first-child,
#detail-sec .detail-main .contents h3:first-child,
#detail-sec .detail-main .contents h4:first-child,
#detail-sec .detail-main .contents ul:first-child,
#detail-sec .detail-main .contents ol:first-child,
#detail-sec .detail-main .contents img:first-child {
	margin-top: 0;
}

#detail-sec .detail-main .contents .btn01 {
	display: block;
	font-weight: 500;
	padding-right: calc((100vw / 375) * 40);
	margin: calc((100vw / 375) * 30) auto 0;
	width: fit-content;
}
#detail-sec .detail-main .contents .btn01.size-sm {
	font-size: calc((100vw / 375) * 12);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents .btn01,
	#detail-sec .detail-main .contents .btn01.size-sm {
		font-size: 1.7rem;
		padding-right: 66px;
		margin: 55px auto 0;
	}
}

#detail-sec .detail-main .contents .btn01 .i-circle {
	width: calc((100vw / 375) * 35);
	height: calc((100vw / 375) * 35);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .contents .btn01 .i-circle {
		width: 50px;
		height: 50px;
	}
}

#detail-sec .detail-main .contents .whitebox {
	background-color: #fff;
	border: 1px solid #000;
	border-radius: 10px;
	padding: 30px 20px;
	margin-top: 30px;
}

/* sidebar */
#detail-sec .detail-main .sidebar {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar {
		width: 450px;
	}
}

#detail-sec .detail-main .sidebar .sidetitle {
	font-size: calc((100vw / 375) * 27);
	letter-spacing: 0.1rem;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .sidetitle {
		font-size: 3.0rem;
		letter-spacing: 0.2rem;
	}
}

#detail-sec.is-voice .detail-main .sidebar .list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
#detail-sec.is-voice .detail-main .sidebar .list article {
	width: calc((100% - calc((100vw / 375) * 15)) / 2);
	border-bottom: 1px solid #d5dcdb;
}
#detail-sec.is-voice .detail-main .sidebar .list article:nth-child(odd) {
	padding-right: calc((100vw / 375) * 7.5);
}
#detail-sec.is-voice .detail-main .sidebar .list article:nth-child(even) {
	padding-left: calc((100vw / 375) * 7.5);
}
@media screen and (min-width: 1024px) {
	#detail-sec.is-voice .detail-main .sidebar .list,
	#detail-sec.is-column .detail-main .sidebar .list {
		display: block;
	}
	#detail-sec.is-voice .detail-main .sidebar .list article {
		width: auto;
		border-bottom: none;
	}
	#detail-sec.is-voice .detail-main .sidebar .list article:nth-child(odd) {
		padding-right: 0;
	}
	#detail-sec.is-voice .detail-main .sidebar .list article:nth-child(even) {
		padding-left: 0;
	}
}

#detail-sec .detail-main .sidebar .list a {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: calc((100vw / 375) * 15);
	padding: calc((100vw / 375) * 35) 0;
	border-bottom: 1px solid #d5dcdb;
}
#detail-sec.is-voice .detail-main .sidebar .list a {
  align-items: center;
	border-bottom: none;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .list a {
		flex-direction: row;
		gap: 20px;
		padding: 30px 0;
	}
	#detail-sec .detail-main .sidebar .list a:hover {
		opacity: .7;
	}
	#detail-sec.is-voice .detail-main .sidebar .list a,
	#detail-sec.is-column .detail-main .sidebar .list a {
		border-bottom: 1px solid #d5dcdb;
	}
}

#detail-sec .detail-main .sidebar .list .txtarea {
	width: 100%;
}
#detail-sec .detail-main .sidebar .list picture,
#detail-sec .detail-main .sidebar .list img {
	display: block;
	aspect-ratio: 160 / 100;
	width: 100%;
	object-fit: cover;
}
#detail-sec .detail-main .sidebar .list source {
	display: block;
	width: 100%;
}
#detail-sec.is-voice .detail-main .sidebar .list picture,
#detail-sec.is-voice .detail-main .sidebar .list img {
	aspect-ratio: 160 / 180;
}
@media screen and (min-width: 1024px) {	
	#detail-sec .detail-main .sidebar .list picture,
	#detail-sec .detail-main .sidebar .list img {
		width: 160px;
		max-height: 100px;
	}
	#detail-sec .detail-main .sidebar .list source {
		width: 160px;
	}
	#detail-sec.is-voice .detail-main .sidebar .list picture,
	#detail-sec.is-voice .detail-main .sidebar .list img {
		max-height: 180px;
	}
}

#detail-sec .detail-main .sidebar .list .t-top {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .list .t-top {
		margin-bottom: 7px;
		margin-top: 9px;
	}
}

#detail-sec .detail-main .sidebar .list .t-top .date {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	padding-right: calc((100vw / 375) * 12);
	border-right: 1px solid #9fadac;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .list .t-top .date {
		font-size: 1.4rem;
		padding-right: 7px;
	}
}

#detail-sec .detail-main .sidebar .list .t-top .cat {
	font-size: calc((100vw / 375) * 13);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	margin-left: calc((100vw / 375) * 12);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .list .t-top .cat {
		font-size: 1.2rem;
		line-height: 1.7;
		letter-spacing: 0.1rem;
		margin-left: 7px;
	}
}

#detail-sec .detail-main .sidebar .list .title {
	font-size: calc((100vw / 375) * 18);
	font-weight: 400;
	margin-bottom: calc((100vw / 375) * 10);
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
}
#detail-sec.is-voice .detail-main .sidebar .list .title {
	-webkit-line-clamp: 5;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .list .title {
		font-size: 1.6rem;
		margin-bottom: 7px;
	}
	#detail-sec.is-voice .detail-main .sidebar .list .title,
	#detail-sec.is-column .detail-main .sidebar .list .title {
	-webkit-line-clamp: 1;
}
}

#detail-sec .detail-main .sidebar .list .txt {
	font-size: calc((100vw / 375) * 15);
	color: #6b6b6b;
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
}
#detail-sec.is-voice .detail-main .sidebar .list .txt {
	-webkit-line-clamp: 4;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .list .txt {
		font-size: 1.3rem;
	}
	#detail-sec.is-voice .detail-main .sidebar .list .txt,
	#detail-sec.is-column .detail-main .sidebar .list .txt {
		-webkit-line-clamp: 1;
	}
}

#detail-sec .detail-main .sidebar .btn01 {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	padding-right: calc((100vw / 375) * 60);
	width: calc((100vw / 375) * 145);
	margin: calc((100vw / 375) * 35) 0 0 auto;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .btn01 {
		padding-right: 60px;
		display: block;
		width: 145px;
		margin: 30px 0 0 auto;
	}
}

#detail-sec .detail-main .sidebar .btn01 .bold {
	padding-right: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-main .sidebar .btn01 .bold {
		padding-right: 5px;
	}
}

#detail-sec .detail-link {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	gap: calc((100vw / 375) * 15);
	padding-top: calc((100vw / 375) * 40);
	padding-bottom: calc((100vw / 375) * 90);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link {
		align-items: center;
		padding-top: 90px;
		padding-bottom: 170px;
		gap: 0;
	}
}

#detail-sec .detail-link .box {
	position: relative;
	width: calc((100% - calc((100vw / 375) * 15) / 2 ));
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box {
		position: relative;
		width: 525px;
	}
}

#detail-sec .detail-link .box a {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: calc((100vw / 375) * 15);
	padding: calc((100vw / 375) * 35) 0;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box a {
		flex-direction: row;
		gap: 30px;
		padding: 35px 0;
		border-bottom: 1px solid #d5dcdb;
	}
	#detail-sec .detail-link .box.rev a {
    flex-direction: row-reverse;
	}
	#detail-sec.is-voice .detail-link .box a {
		padding: 40px 0;
	}
}

#detail-sec .detail-link .box .txtarea {
	width: 100%;
}

#detail-sec .detail-link .box img {
	aspect-ratio: 260 / 160;
	width: 100%;
	object-fit: cover;
	flex: 0 0 auto;
}
#detail-sec.is-voice .detail-link .box img {
	aspect-ratio: 260 / 298;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box img {
		width: 260px;
		max-height: 160px;
	}
	#detail-sec.is-voice .detail-link .box img {
		height: 298px;
		max-height: 298px;
	}
}

#detail-sec .detail-link .box .t-top {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	margin-bottom: calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .t-top {
		flex-direction: row;
		margin-bottom: 12px;
		margin-top: 4px;
	}
}

#detail-sec .detail-link .box .t-top .date {
	position: relative;
	font-size: calc((100vw / 375) * 12);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	padding-right: calc((100vw / 375) * 12);
	padding-bottom: calc((100vw / 375) * 3);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .t-top .date {
		font-size: 1.5rem;
		padding-right: 12px;
		padding-bottom: 0;
		border-right: 1px solid #9fadac;
	}
}

#detail-sec .detail-link .box .t-top .cat {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	line-height: 1.4;
	padding-top: calc((100vw / 375) * 3);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .t-top .cat {
		font-size: 1.3rem;
		line-height: 1.7;
		letter-spacing: 0.1rem;
		padding-top: 0;
		margin-left: 12px;
	}
}

#detail-sec .detail-link .box .title {
	font-size: calc((100vw / 375) * 16);
	font-weight: 400;
	line-height: 1.6;
	margin-bottom: calc((100vw / 375) * 12);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .title {
		font-size: 2.0rem;
		margin-bottom: 12px;
	}
	#detail-sec.is-voice .detail-link .box .title {
		margin-top: 90px;
	}
	#detail-sec.is-column .detail-link .box .title {
		margin-top: 15px;
	}
}

#detail-sec .detail-link .box .txt {
	font-size: calc((100vw / 375) * 15);
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 4;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .txt {
		font-size: 1.5rem;
	}
}

#detail-sec .detail-link .box .icon {
	position: relative;
	font-size: calc((100vw / 375) * 17);
	background-color: #f1f6f6;
	margin-top: calc((100vw / 375) * 20);
}
#detail-sec .detail-link .box .icon::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 31);
	height: calc((100vw / 375) * 31);
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	transition: all .6s ease;
	margin-top: 0;
}
#detail-sec .detail-link .box .icon::after {
	content: '';
	display: block;
	width: calc((100vw / 375) * 50);
	height: 1px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background-color: #9fadac;
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .icon {
		font-size: 1.7rem;
		position: absolute;
		bottom: -15px;
	}
	#detail-sec .detail-link .box .icon::before {
		width: 50px;
		height: 50px;
	}
	#detail-sec .detail-link .box .icon::after {
		display: none;
	}
}

#detail-sec .detail-link .box .icon.prev {
	left: 0;
	padding-right: calc((100vw / 375) * 10);
	padding-left: calc((100vw / 375) * 38);
}
#detail-sec .detail-link .box .icon.prev::before {
	background: url(../common_img/icon_prev.svg) center center / cover no-repeat;
	left: 0;
}
#detail-sec .detail-link .box .icon.prev::after {
	right: calc((100vw / 375) * -55);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .icon.prev {
		padding-right: 20px;
		padding-left: 64px;
	}
	#detail-sec .detail-link .box a:hover .icon.prev::before {
		background: url(../common_img/icon_prev_clear.svg) center center / cover no-repeat;
	}
}

#detail-sec .detail-link .box .icon.next {
	right: 0;
	padding-right: calc((100vw / 375) * 38);
	padding-left: calc((100vw / 375) * 10);
	margin-left: auto;
}
#detail-sec .detail-link .box .icon.next::before {
	background: url(../common_img/icon_next.svg) center center / cover no-repeat;
	right: 0;
}
#detail-sec .detail-link .box .icon.next::after {
	left: calc((100vw / 375) * -60);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .box .icon.next {
		padding-right: 64px;
		padding-left: 20px;
		margin-left: 0;
	}
	#detail-sec .detail-link .box a:hover .icon.next::before {
		background: url(../common_img/icon_next_clear.svg) center center / cover no-repeat;
	}
}

#detail-sec .detail-link .btn01 {
	position: absolute;
	padding-right: calc((100vw / 375) * 60);
	bottom: calc((100vw / 375) * 50);
	left: 50%;
	transform: translateX(-50%);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .btn01 {
		position: relative;
		padding-right: 60px;
		bottom: auto;
		left: 0;
		transform: none;
	}
}

#detail-sec .detail-link .btn01 .bold {
	margin-right: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#detail-sec .detail-link .btn01 .bold {
		margin-right: 5px;
	}
}


/* ========== index FEATURES(philosophy-sec) ========== */
/* outline */
#philosophy-sec .outline {
	padding-top: calc((100vw / 375) * 75);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .outline {
		padding-top: 200px;
	}
}

#philosophy-sec .outline .box {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: calc((100vw / 375) * 20);
	margin-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .outline .box {
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
		gap: 30px;
		margin-bottom: 160px;
	}
}

#philosophy-sec .outline h2.en-mr {
	position: absolute;
	top: calc((100vw / 375) * -30);
	font-size: calc((100vw / 375) * 72);
	letter-spacing: 0.4rem;
	color: #e9f0f0;
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .outline h2.en-mr {
		top: -104px;
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
	}
}

#philosophy-sec .outline .sub {
	position: relative;
	font-size: calc((100vw / 375) * 26);
	letter-spacing: 0.6rem;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .outline .sub {
		font-size: 3.6rem;
		letter-spacing: 0.7rem;
	}
}

#philosophy-sec .outline .txt {
	position: relative;
	letter-spacing: 0.2rem;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .outline .txt {
		letter-spacing: 0.2rem;
		width: 50%;
		max-width: 800px;
		margin-top: 15px;
		margin-right: 20px;
	}
}

#philosophy-sec .outline picture,
#philosophy-sec .outline img {
	width: 100%;
}

/* point */
#philosophy-sec .point .bg01 {
	background: url(../images/philosophy/outline_img02_sp.jpg) bottom center / cover no-repeat;
}
#philosophy-sec .point .bg02 {
	background: url(../images/philosophy/outline_img04_sp.jpg) bottom right / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .bg01 {
		background: url(../images/philosophy/outline_img02.jpg) top center / cover no-repeat;
	}
	#philosophy-sec .point .bg02 {
		background: url(../images/philosophy/outline_img04.jpg) bottom center / cover no-repeat;
	}
}

#philosophy-sec .point .box {
	position: relative;
	padding-top: calc((100vw / 375) * 160);
	padding-bottom: calc((100vw / 375) * 50);
}
#philosophy-sec .point .p-bg .box {
	padding-top: calc((100vw / 375) * 80);
	padding-bottom: calc((100vw / 375) * 280);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .box {
		padding-top: 230px;
		padding-bottom: 60px;
	}
	#philosophy-sec .point .p-bg .box {
		padding-top: 200px;
		padding-bottom: 255px;
		width: 600px;
	}
}

#philosophy-sec .point .p-top .box {
	display: flex;
	flex-direction: column;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-top .box {
		flex-direction: row;
	}
}

#philosophy-sec .point .box .en-mr {
	position: absolute;
	left: calc((100vw / 375) * -52);
	top: calc((100vw / 375) * -117);
	color: #e9f0f0;
	font-size: calc((100vw / 375) * 174);
	line-height: 1;
	z-index: -1;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .box .en-mr {
		left: -67px;
		top: -140px;
		font-size: 21.0rem;
	}
}

#philosophy-sec .point .box .flexwrap {
	position: relative;
	width: 100%;
	z-index: 1;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .box .flexwrap {
		width: 50%;
	}
}

#philosophy-sec .point .box h2 {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.5rem;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .box h2 {
		font-size: 3.6rem;
		margin-bottom: 25px;
	}
}

#philosophy-sec .point .box h3 {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.5rem;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .box h3 {
		font-size: 3.6rem;
		margin-bottom: 25px;
	}
}

#philosophy-sec .point .box .subtxt {
	font-size: calc((100vw / 375) * 15);
	font-weight: 600;
	line-height: 1.8;
	letter-spacing: 0.2rem;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .box .subtxt {
		font-size: 1.8rem;
		margin-bottom: 35px;
	}
}

#philosophy-sec .point .box .txt {
	letter-spacing: 0.2rem;
	line-height: 2.0;
}

#philosophy-sec .point .p-top .box .txt {
	width: 100%;
	padding-top: 18px;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-top .box .txt {
		width: 50%;
		max-width: 800px;
		padding-top: 18px;
	}
}

#philosophy-sec .point .p-bg .box h2,
#philosophy-sec .point .p-bg .box h3,
#philosophy-sec .point .p-bg .box .subtxt,
#philosophy-sec .point .p-bg .box .txt {
	color: #fff;
}

#philosophy-sec .point .p-bottom {
	background: url(../images/philosophy/outline_bg01.jpg) top center / cover no-repeat;
}
#philosophy-sec .point .p-bottom.wide {	background: url(../images/philosophy/outline_bg02.jpg) top center / cover no-repeat; }
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-bottom {
		padding-bottom: 50px;
	}
}

#philosophy-sec .point .p-bottom .list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-bottom .list {
		flex-direction: row;
		gap: 40px;
	}
}

#philosophy-sec .point .p-bottom .list li {
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20);
	box-shadow: 0px 0px 20px 20px rgb(1 10 17 / 15%);
	border-radius: 10px;
	background-color: #fff;
	position: relative;
	top: calc((100vw / 375) * -100);
}
#philosophy-sec .point .p-bottom.wide .list li {
	max-width: none;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-bottom .list li {
		padding: 80px;
		border-radius: 10px;
		top: -100px;
		max-width: 750px;
	}
	#philosophy-sec .point .p-bottom.wide .list li {
		max-width: none;
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		gap: 40px;
	}
}

#philosophy-sec .point .p-bottom .list img {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-bottom .list img {
		width: 100%;
	}
	#philosophy-sec .point .p-bottom.wide .list img {
		width: 50%;
	}
}

#philosophy-sec .point .p-bottom.wide .list .desc {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-bottom.wide .list .desc {
		max-width: 600px;
		width: 45%;
	}
}

#philosophy-sec .point .p-bottom .list .subtitle {
	font-size: calc((100vw / 375) * 26);
	letter-spacing: 0.4rem;
	line-height: 1.6;
	margin-top: 20px;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-bottom .list .subtitle {
		font-size: 3.0rem;
		margin-top: 20px;
	}
	#philosophy-sec .point .p-bottom.wide .list .subtitle {	margin-top: 0; }
}

#philosophy-sec .point .p-bottom .list .txt {
	margin-top: 20px;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .point .p-bottom .list .txt {
		margin-top: 20px;
	}
}

/* menulist */
#philosophy-sec .menulist {
	position: relative;
	margin-top: calc((100vw / 375) * 145);
	margin-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist {
		margin-top: 200px;
		margin-bottom: 0;
	}
}

#philosophy-sec .menulist .en-mr {
	font-size: calc((100vw / 375) * 78);
	color: #e9f0f0;
	line-height: 1;
	position: absolute;
	top: calc((100vw / 375) * -101);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .en-mr {
		font-size: 16.0rem;
		top: -90px;
	}
}

#philosophy-sec .menulist .title {
	font-size: calc((100vw / 375) * 28);
	position: relative;
	z-index: 1;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .title {
		font-size: 3.0rem;
		margin-top: 78px;
	}
}

#philosophy-sec .menulist .txt {
	font-size: calc((100vw / 375) * 15);
	line-height: 1.8;
	letter-spacing: 0.04rem;
	position: relative;
	z-index: 1;
	margin-top: calc((100vw / 375) * 26);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .txt {
		font-size: 1.6rem;
		line-height: 1.8;
		margin-top: 20px;
	}
}

#philosophy-sec .menulist .btn-flex {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 30);
	margin-bottom: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .btn-flex {
		gap: 20px;
		justify-content: flex-start;
		margin-top: 60px;
		margin-bottom: 110px;
	}
}

#philosophy-sec .menulist .bg {
	position: relative;
	padding-top: calc((100vw / 375) * 50);	
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg {
		padding-top: 100px;	
	}
}

#philosophy-sec .menulist .bg::before {
	content: '';
	display: block;
	background: url(../images/philosophy/menulist_bg_sp.jpg) center center / cover no-repeat;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: calc((100vw / 375) * 1050);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg::before {
		background: url(../images/philosophy/menulist_bg.jpg) center center / cover no-repeat;
		height: 470px;
	}
}

#philosophy-sec .menulist .bg .list {
	display: flex;
  flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: 40px;	
	padding: 0 calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list {
		flex-direction: row;
		gap: 40px;	
		padding: 0;
	}
}
@media screen and (min-width: 1600px) {
	#philosophy-sec .menulist .bg .list {
		gap: 100px;	
	}
}

#philosophy-sec .menulist .bg .list li {
	background: #fff;
	border-radius: 10px;
}

#philosophy-sec .menulist .bg .list li a {
	position: relative;
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20) calc((100vw / 375) * 40) calc((100vw / 375) * 20);
	border-radius: 10px;
	box-shadow: 0px 0px 10px 10px rgb(78 64 68 / 15%);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: calc((100vw / 375) * 5);
	background: #fff;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list li a {
		padding: 42px 60px 10px;
		border-radius: 10px;
		box-shadow: 0px 0px 10px 10px rgb(78 64 68 / 15%);
		flex-direction: row;
		gap: 60px;
	}
	#philosophy-sec .menulist .bg .list li a:hover {
		opacity: .7;
	}
}

#philosophy-sec .menulist .bg .list img {
	height: calc((100vw / 375) * 285);
	object-fit: contain;
	margin: 0 auto 0 0;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list img {
		height: auto;
		max-height: 425px;
		margin: 0;
	}
}

@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list .txtbox {
		padding-bottom: 50px;
	}
}

#philosophy-sec .menulist .bg .list .txtbox .cat {
	font-size: calc((100vw / 375) * 13);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list .txtbox .cat {
		font-size: 1.3rem;
	}
}

#philosophy-sec .menulist .bg .list .txtbox .name {
	font-size: calc((100vw / 375) * 23);
	font-weight: 400;
	padding-bottom: calc((100vw / 375) * 15);
	border-bottom: 1px solid #dddddd;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list .txtbox .name {
		font-size: 2.4rem;
		padding-bottom: 20px;
	}
}

#philosophy-sec .menulist .bg .list .txtbox .desc {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	line-height: 1.8;
	margin-top: calc((100vw / 375) * 15);
	display: -webkit-box;
	-webkit-box-orient: vertical; 
	overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list .txtbox .desc {
		font-size: 1.5rem;
		margin-top: 20px;
	}
}

#philosophy-sec .menulist .bg .list .txtbox .tag {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 10);
	flex-wrap: wrap;
	font-size: calc((100vw / 375) * 11);
	color: #6b6b6b;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list .txtbox .tag {
		gap: 15px;
		font-size: 1.3rem;
		margin-top: 20px;
	}
}

#philosophy-sec .menulist .bg .list .txtbox .catch {
	font-size: calc((100vw / 375) * 20);
	font-weight: bold;
	position: absolute;
	top: calc((100vw / 375) * 30);
	right: calc((100vw / 375) * 20);
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .bg .list .txtbox .catch {
		font-size: 2.0rem;
		top: 55px;
		right: 50px;
	}
}

#philosophy-sec .menulist .btn01 {
	display: block;
	font-size: calc((100vw / 375) * 18);
	text-align: right;
	margin: calc((100vw / 375) * 50) 0 0 auto;
	padding-right: calc((100vw / 375) * 60);
	width: calc((100vw / 375) * 210);
}
@media screen and (min-width: 1024px) {
	#philosophy-sec .menulist .btn01 {
		font-size: 1.7rem;
		padding-right: 60px;
		width: 200px;
		margin: 60px 0 0 auto;
	}
}


/* ========== index COMPANY(aboutus-sec) ========== */
/* message */
#aboutus-sec .message {
	padding-top: calc((100vw / 375) * 85);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .message {
		padding-top: 150px;
	}
}

#aboutus-sec .message .box {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: calc((100vw / 375) * 20);
	margin-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .message .box {
		flex-direction: row;
		justify-content: flex-end;
		align-items: flex-start;
		gap: 30px;
		margin-bottom: 160px;
	}
}

#aboutus-sec .message .txtwrap {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .message .txtwrap {
		width: 50%;
		max-width: 700px;
	}
}

#aboutus-sec .message h2.en-mr {
	position: absolute;
	top: calc((100vw / 375) * -42);
	left: 0;
	font-size: calc((100vw / 375) * 72);
	letter-spacing: 0.4rem;
	color: #e9f0f0;
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .message h2.en-mr {
		top: -30px;
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
	}
}

#aboutus-sec .message .sub {
	position: relative;
	font-size: calc((100vw / 375) * 22);
	letter-spacing: 0.2rem;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .message .sub {
		font-size: 3.0rem;
	}
}

#aboutus-sec .message .bgtxt {
	position: relative;
	font-size: calc((100vw / 375) * 26);
	letter-spacing: 0.5rem;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .message .bgtxt {
		font-size: 3.6rem;
	}
}

#aboutus-sec .message .txt {
	position: relative;
	letter-spacing: 0.2rem;
	margin-top: calc((100vw / 375) * 25);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .message .txt {
		letter-spacing: 0.2rem;
		margin-top: 35px;
	}
}

/* outline */
#aboutus-sec .outline {
	position: relative;
	margin-top: calc((100vw / 375) * 105);
	padding-bottom: calc((100vw / 375) * 60);
	background-color: #f1f6f6;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline {
		margin-top: 200px;
		padding-bottom: 120px;
	}
}

#aboutus-sec .outline::before {
	content: '';
	display: block;
	width: 100%;
	height: calc((100vw / 375) * 320);
	position: absolute;
	top: 0;
	background-color: #fff;
}
#aboutus-sec .outline::after {
	content: '';
	display: block;
	width: 100%;
	height: calc((100vw / 375) * 420);
	position: absolute;
	bottom: 0;
	background-color: #fff;
	box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline::before {
		height: 405px;
	}
	#aboutus-sec .outline::after {
		height: 480px;
	}
}

#aboutus-sec .outline .en-mr {
	font-size: calc((100vw / 375) * 72);
	letter-spacing: 0.4rem;
	color: #e9f0f0;
	line-height: 1;
	position: absolute;
	top: calc((100vw / 375) * -23);
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline .en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
		top: -87px;
	}
}

#aboutus-sec .outline .sub {
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.2rem;
	position: relative;
	z-index: 1;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline .sub {
		font-size: 3.0rem;
		margin-top: 78px;
	}
}

#aboutus-sec .outline .txt {
	font-size: calc((100vw / 375) * 24);
	letter-spacing: 0.2rem;
	margin-top: calc((100vw / 375) * 8);
	position: relative;
	z-index: 1;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline .txt {
		font-size: 3.6rem;
		letter-spacing: 0.7rem;
		margin-top: 5px;
	}
}

#aboutus-sec .outline .list {
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 10%);
	padding: calc((100vw / 375) * 20) calc((100vw / 375) * 20) calc((100vw / 375) * 40) calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 40);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline .list {
		flex-direction: row;
		flex-wrap: wrap;
		border-radius: 10px;
		box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
		padding: 80px 100px 100px 100px;
		margin-top: 80px;
		column-gap: 100px;
	}
}

#aboutus-sec .outline .list li {
	width: 100%;
	border-bottom: 1px solid #c8cccd;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline .list li {
		width: calc((100% - 100px) / 2);
		border-bottom: 1px solid #c8cccd;
	}
}

#aboutus-sec .outline .list li p {
	vertical-align: top;
	text-align: left;
	box-sizing: border-box;
}

#aboutus-sec .outline .list li .name {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	color: #1c1c1c;
	padding-top: calc((100vw / 375) * 20);
	width: 100%;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .outline .list li .name {
    font-size: 1.6rem;
		font-weight: 400;
    display: table-cell;
		padding: 30px 22px 30px 22px;
		width: 130px;
	}
}

#aboutus-sec .outline .list li .desc {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	color: #1c1c1c;
	border-bottom: none;
	padding-top: calc((100vw / 375) * 8);
	padding-bottom: calc((100vw / 375) * 20);
	width: 100%;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .outline .list li .desc {
    display: table-cell;
		font-size: 1.6rem;
		letter-spacing: 0.1rem;
    padding: 30px 22px 30px 22px;
		width: auto;
	}
	#aboutus-sec .outline .list li .desc::before {
		content: '';
		display: block;
		width: 1px;
		height: -webkit-fill-available;
		background-color: #ddd;
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
	}
}

#aboutus-sec .outline .img {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 25);
	margin-top: calc((100vw / 375) * 50);
	margin-bottom: calc((100vw / 375) * 50);
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline .img {
		flex-direction: row;
		gap: 50px;
		margin-top: 100px;
		margin-bottom: 80px;
		width: 100%;
	}
}

#aboutus-sec .outline .map {
	position: relative;
	z-index: 10;
}

#aboutus-sec .outline .map iframe {
	display: block;
	width: 100%;
	height: calc((100vw / 375) * 180);
	margin-bottom: calc((100vw / 375) * 15);
	border: none;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .outline .map iframe {
		width: 100%;
		height: 600px;
		margin-bottom: 30px;
	}
}

#aboutus-sec .address {
	position: relative;
	display: flex;
	flex-direction: column;
	margin-top: calc((100vw / 375) * 60);
	z-index: 10;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address {
		flex-direction: row;
		justify-content: space-between;
		margin-top: 40px;
	}
}

#aboutus-sec .address .desc {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .desc {
		width: 390px;
	}
}

#aboutus-sec .address .desc h3 {
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.2rem;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .desc h3 {
		font-size: 3.0rem;
		padding-top: 17px;
	}
}

#aboutus-sec .address .desc p {
	margin-top: calc((100vw / 375) * 20);
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .desc p {
		margin-top: 15px;
		margin-bottom: 0;
	}
}

#aboutus-sec .address .root {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 25);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .root {
		flex-direction: row;
		justify-content: center;
		gap: 30px;
		margin-top: 0;
	}
}

#aboutus-sec .address .root li {
	width: 100%;
	border-radius: calc((100vw / 375) * 8);
	background-color: #f1f6f6;
	padding: calc((100vw / 375) * 20) calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .root li {
		width: calc((100% - 30px) / 2);
		border-radius: 10px;
		padding: 28px 25px 25px 25px;
	}
}

#aboutus-sec .address .root li h4 {
	position: relative;
	font-size: calc((100vw / 375) * 18);
	font-weight: bold;
	padding-left: calc((100vw / 375) * 31);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .root li h4 {
		font-size: 2.0rem;
		padding-left: 35px;
	}
}

#aboutus-sec .address .root li p {
	margin-top: 12px;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .root li p {
		margin-top: 12px;
	}
}

#aboutus-sec .address .root li h4 .i-train {
	background: url(../images/aboutus/icon_train.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 16);
	height: calc((100vw / 375) * 19);
	position: absolute;
	top: calc((100vw / 375) * 4);
	left: calc((100vw / 375) * 6);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .root li h4 .i-train {
		width: 18px;
		height: 22px;
		top: 4px;
		left: 6px;
	}
}

#aboutus-sec .address .root li h4 .i-car {
	background: url(../images/aboutus/icon_car.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 22);
	height: calc((100vw / 375) * 15);
	position: absolute;
	top: calc((100vw / 375) * 6);
	left: calc((100vw / 375) * 2);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .address .root li h4 .i-car {
		width: 24px;
		height: 17px;
		top: 6px;
		left: 3px;
	}
}

/* history */
#aboutus-sec .history .bg01 {
	position: relative;
	background: url(../images/aboutus/history_bg01.jpg) center center / cover no-repeat;
	padding-top: calc((100vw / 375) * 80);
	padding-bottom: calc((100vw / 375) * 70);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .history .bg01 {
		padding-top: 160px;
		padding-bottom: 150px;
	}
}

#aboutus-sec .history .bg02 {
	position: relative;
	padding-top: calc((100vw / 375) * 80);
	padding-bottom: calc((100vw / 375) * 80);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .history .bg02 {
		padding-top: 160px;
		padding-bottom: 150px;
	}
	#aboutus-sec .history .bg02::before {
		content: '';
		display: block;
		background-color: #f1f6f6;
		width: 30%;
		height: -webkit-fill-available;
		position: absolute;
		top: 0;
	}
}
@media screen and (min-width: 1700px) {
	#aboutus-sec .history .bg02::before {
		width: 30%;
	}
}

#aboutus-sec .history .title {
	position: absolute;
	top: calc((100vw / 375) * -21);
	font-size: calc((100vw / 375) * 74);
	letter-spacing: 0.4rem;
	line-height: 1;
	color: #e9f0f0;
	white-space: nowrap;
}
#aboutus-sec .history .bg01 .title { opacity: .1; }
@media screen and (min-width: 1024px) {
	#aboutus-sec .history .title {
		top: -15px;
		right: 40px;
		font-size: 16.0rem;
		letter-spacing: 1.5rem;
	}
}
@media screen and (min-width: 1440px) {
	#aboutus-sec .history .title {
		right: 60px;
	}
}
@media screen and (min-width: 1600px) {
	#aboutus-sec .history .title {
		right: 80px;
	}
}

#aboutus-sec .history .sub {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.2rem;
}
#aboutus-sec .history .bg01 .sub { color: #99acb5; }
@media screen and (min-width: 1024px) {
	#aboutus-sec .history .sub {
		font-size: 3.0rem;
	}
}

#aboutus-sec .history .txt {
	font-size: calc((100vw / 375) * 24);
	letter-spacing: 0.3rem;
	margin-top: calc((100vw / 375) * 8);
}
#aboutus-sec .history .bg01 .txt { color: #fff }
@media screen and (min-width: 1024px) {
	#aboutus-sec .history .txt {
		font-size: 3.6rem;
		letter-spacing: 0.5rem;
		margin-top: 8px;
	}
}

#aboutus-sec .history .history-slider {
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .history-slider {
		margin-top: 80px;
	}
}

#aboutus-sec .history .history-slider .backborder {
	content: '';
	display: block;
	background-color: #adbdca;
	width: 100%;
	height: 1px;
	position: absolute;
	top: 50%;
	left: 0;
	z-index: 1;
}

#aboutus-sec .history .history-slider .swiper-slide {
	position: relative;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
  align-items: flex-start;
	gap: calc((100vw / 375) * 10);
	padding: calc((100vw / 375) * 20);
	transition: background-color .8s ease;
	z-index: 2;
}
#aboutus-sec .history .history-slider .swiper-slide-next + .swiper-slide {
	background-color: #d9d9d9;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .history-slider .swiper-slide {
		flex-direction: row;
		align-items: center;
		border-radius: 10px;
		width: 650px;
		height: 250px;
		gap: 50px;
		padding: 50px;
	}
}

#aboutus-sec .history .history-slider .swiper-slide::before {
	content: '';
	display: block;
	width: 100%;
	height: calc((100vw / 375) * 99);
	background: url(../images/aboutus/slide_bg01.png) top center / contain no-repeat;
	opacity: 0.9;
	position: absolute;
	bottom: calc((100vw / 375) * -101);
	left: 0;
	pointer-events: none;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .history-slider .swiper-slide::before {
		width: 100%;
		height: 99px;
		bottom: -101px;
	}
}

#aboutus-sec .history .history-slider .swiper-slide h3 {
	font-size: calc((100vw / 375) * 28);
	white-space: nowrap;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .history-slider .swiper-slide h3 {
		font-size: 5.0rem;
		width: 200px;
	}
}

#aboutus-sec .history .history-slider .swiper-slide p {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .history-slider .swiper-slide p {
		font-size: 1.8rem;
	}
}

#aboutus-sec .history .history-slider .btnwrap {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: calc((100vw / 375) * 35);
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .history-slider .btnwrap {
		gap: 52px;
		margin-top: 50px;
	}
}

#aboutus-sec .history .history-slider .swiper-button-next,
#aboutus-sec .history .history-slider .swiper-button-prev {
	position: relative;
	width: calc((100vw / 375) * 40);
	height: calc((100vw / 375) * 40);
	color: transparent;
	margin-top: 0;
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .history .history-slider .swiper-button-next,
	#aboutus-sec .history .history-slider .swiper-button-prev {
		width: 50px;
		height: 50px;
	}
}

#aboutus-sec .history .history-slider .swiper-button-next {
	top: auto;
	left: auto;
	background: url(../images/aboutus/slide_right.svg) center center / cover no-repeat;
}

#aboutus-sec .history .history-slider .swiper-button-prev {
	top: auto;
	left: auto;
	background: url(../images/aboutus/slide_left.svg) center center / cover no-repeat;
}

#aboutus-sec .history .h-table {
	width: 100%;
  margin-top: calc((100vw / 375) * 35);
}
@media screen and (min-width: 1024px) {
	#aboutus-sec .history .h-table {
		margin: -65px 0 0 auto;
		width: 1000px;
	}
}

#aboutus-sec .history .h-table th {
	position: relative;
	display: table-cell;
	vertical-align: top;
	font-size: calc((100vw / 375) * 24);
	letter-spacing: 0.1rem;
	color: #1c1c1c;
	padding-top: calc((100vw / 375) * 12);
	width: calc((100vw / 375) * 78);
	border-bottom: 1px solid #000;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .h-table th {
    font-size: 2.8rem;
		padding: 25px 22px 25px 40px;
		width: 150px;
	}
}

#aboutus-sec .history .h-table td {
	position: relative;
  display: table-cell;
	font-size: calc((100vw / 375) * 15);
	color: #1c1c1c;
	border-bottom: none;
	padding-top: calc((100vw / 375) * 20);
	padding-bottom: calc((100vw / 375) * 20);
	width: auto;
	border-bottom: 1px solid #d5dcdb;
}
@media screen and (min-width:1024px) {
	#aboutus-sec .history .h-table td {
		font-size: 1.6rem;
		letter-spacing: 0.1rem;
    padding: 35px 22px 33px 30px;
		width: auto;
	}
	#aboutus-sec .outline .list li .desc::before {
		content: '';
		display: block;
		width: 1px;
		height: -webkit-fill-available;
		background-color: #ddd;
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
	}
}

/* ========== index PRIVACY POLICY(pp-sec) ========== */
#pp-sec .pp-main {
	padding-top: calc((100vw / 375) * 50);
	padding-bottom: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#pp-sec .pp-main {
		padding-top: 150px;
		padding-bottom: 45px;
	}
}

@media screen and (min-width: 1024px) {
	#pp-sec .pp-main .box {
		width: 1000px;
		margin: 0 auto;
	}
}

#pp-sec .pp-main .box + .box {
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#pp-sec .pp-main .box + .box {
		margin-top: 30px;
	}
}

#pp-sec .pp-main .box h2,
#pp-sec .pp-main .box p {
  line-height: 2.0;
}

#pp-sec .pp-main .box .list li {
	position: relative;
	padding-left: calc((100vw / 375) * 16);
}
@media screen and (min-width: 1024px) {
	#pp-sec .pp-main .box .list li {
		padding-left: 20px;
	}
}

#pp-sec .pp-main .box .list li::before {
	content: '・';
	display: inline-block;
	position: absolute;
	left: calc((100vw / 375) * -1);
	top: calc((100vw / 375) * 3);
}
@media screen and (min-width: 1024px) {
	#pp-sec .pp-main .box .list li::before {
		left: 1px;
		top: 3px;
	}
}

/* ========== index FAQ(faq-sec) ========== */
#faq-sec .faq {
	position: relative;
	background-color: #f1f6f6;
}

#faq-sec .faq .category-box {
	position: relative;
	padding-top: calc((100vw / 375) * 80);
	padding-bottom: calc((100vw / 375) * 75);
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .category-box {
		padding-top: 90px;
		padding-bottom: 150px;
	}
}

#faq-sec .faq .category-box::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	width: 100%;
	height: calc((100vw / 375) * 300);
	background-color: #fff;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .category-box::before {
		height: 500px;
	}
}

#faq-sec .faq .category-box .container {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .category-box .container {
		flex-direction: row;
		justify-content: center;
		gap: 10px;
	}
}

#faq-sec .faq h2.en-mr {
	position: relative;
	font-size: calc((100vw / 375) * 60);
	letter-spacing: 0.2rem;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * -38);
	left: auto;
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq h2.en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.3rem;
		top: 0;
		left: 60px;
	}	
}	
@media screen and (min-width: 1600px) {
	#faq-sec .faq h2.en-mr {
		left: 100px;
	}
}

#faq-sec .faq .title {
	position: relative;
	font-size: calc((100vw / 375) * 26);
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .title {
		font-size: 3.0rem;
		padding-top: 120px;
	}
}

#faq-sec .faq .sub {
	position: relative;
	font-size: calc((100vw / 375) * 21);
	letter-spacing: 0.5rem;
	line-height: 1.6;
	padding-top: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .sub {
		font-size: 3.0rem;
		padding-top: 10px;
	}
}
@media screen and (min-width: 1700px) {
	#faq-sec .faq .sub {
		font-size: 3.6rem;
	}
}

#faq-sec .faq .box {
	box-shadow: 0px 0px 20px 20px rgb(64 78 78 / 10%);
	background-color: #fff;
	border-radius: 10px;
	width: 100%;
	padding: calc((100vw / 375) * 20);
	margin: 0 0 0 auto;
	z-index: 1;
	position: relative;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .box {
		border-radius: 10px;
		width: 960px;
		padding: 75px 100px 100px 100px;
		margin-top: 120px;
	}
}
@media screen and (min-width: 1700px) {
	#faq-sec .faq .box {
		width: 1100px;
	}
}

#faq-sec .faq .faq-list li {
	position: relative;
	border-bottom: 1px solid #d5dcdb;
}

#faq-sec .faq .faq-list .q {
	position: relative;
	letter-spacing: 0.1rem;
	line-height: 1.8;
	padding-top: calc((100vw / 375) * 30);
	padding-bottom: calc((100vw / 375) * 27);
	padding-left: calc((100vw / 375) * 32);
	width: calc((100vw / 375) * 250);
	user-select: none;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .faq-list .q {
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 0;
		width: auto;
	}
}

#faq-sec .faq .faq-list .q span {
	font-size: calc((100vw / 375) * 28);
	color: #9fadac;
	margin-right: calc((100vw / 375) * 8);
	position: absolute;
	top: calc((100vw / 375) * 17);
	left: 0;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .faq-list .q span {
		font-size: 3.0rem;
		margin-right: 12px;
		position: relative;
		top: 3px;
	}
}

#faq-sec .faq .faq-list .q::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * -42);
	transform: translateY(-50%);
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .faq-list .q::before {
		width: 19px;
		height: 1px;
		top: 52%;
		right: 20px;
	}
}

#faq-sec .faq .faq-list .q::after {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * -42);
	transform: translateY(-50%) rotate(90deg);
}
#faq-sec .faq .faq-list li.is-open .q::after {
	visibility: hidden;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .faq-list .q::after {
		width: 19px;
		height: 1px;
		top: 52%;
		right: 20px;
	}
}

#faq-sec .faq .faq-list .a {
	letter-spacing: 0.1rem;
	line-height: 1.8;
	padding-bottom: calc((100vw / 375) * 30);
	display: none;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .faq-list .a {
		padding-bottom: 35px;
	}
}

#faq-sec .faq .btn01 {
	display: flex;
  justify-content: flex-end;
  flex-direction: row;
	margin-bottom: calc((100vw / 375) * 38);
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .btn01 {
		margin-bottom: 0;
	}
}

#faq-sec .faq .btn01 span {
	margin-right: 5px;
}
@media screen and (min-width: 1024px) {
	#faq-sec .faq .btn01 span {
		margin-right: 5px;
	}
}


/* ========== index CSR(csr-sec) ========== */
#csr-sec .overview {
	padding-top: calc((100vw / 375) * 80);
	padding-bottom: calc((100vw / 375) * 70);
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview {
		padding-top: 150px;
		padding-bottom: 150px;
	}
}

#csr-sec .overview .box {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: flex-start;
}

#csr-sec .overview .box .desc {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview .box .desc {
		width: 50%;
		max-width: 790px;
	}
}

#csr-sec .overview .en-mr {
	font-size: calc((100vw / 375) * 72);
	letter-spacing: 0.4rem;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * -35);
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview .en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.4rem;
		top: -33px;
	}
}

#csr-sec .overview .title {
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.2rem;
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview .title {
		font-size: 3.0rem;
		letter-spacing: 0.2rem;
	}
}

#csr-sec .overview .sub {
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.4rem;
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview .sub {
		font-size: 3.6rem;
		letter-spacing: 0.4rem;
		margin-top: 10px;
	}
}

#csr-sec .overview .txt {
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview .txt {
		margin-top: 40px;
	}
}

#csr-sec .overview .img-wrap {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 30);
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview .img-wrap {
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
		gap: 50px;
		margin-top: 140px;
	}
}

#csr-sec .overview .img-wrap img {
	width: 100%;
	height: calc((100vw / 375) * 220);
	object-fit: cover;
}
@media screen and (min-width: 1024px) {
	#csr-sec .overview .img-wrap img {
		width: calc((100% - 50px) / 2);
		height: auto;
	}
	#csr-sec .overview .img-wrap img:nth-of-type(1) { margin-top: 100px; }
	#csr-sec .overview .img-wrap img:nth-of-type(2) { margin-bottom: 100px; }
}

#csr-sec .point .p-bg {
	position: relative;
	background: url(../images/csr/point_img01_sp.jpg) bottom center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bg {
		background: url(../images/csr/point_img01.jpg) bottom center / cover no-repeat;
	}
}

#csr-sec .point .box {
	position: relative;
	padding-top: calc((100vw / 375) * 40);
	padding-bottom: calc((100vw / 375) * 355);
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .box {
		padding-top: 200px;
		padding-bottom: 255px;
		width: 600px;
	}
}

#csr-sec .point .box h3 {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.5rem;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .box h3 {
		font-size: 3.6rem;
		margin-bottom: 25px;
	}
}

#csr-sec .point .box .txt {
	color: #fff;
	letter-spacing: 0.2rem;
	width: 100%;
	padding-top: 18px;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .box .txt {
		padding-top: 18px;
	}
}

#csr-sec .point .p-bottom {
	background: url(../images/csr/outline_bg01.jpg) top center / cover no-repeat;
}
#csr-sec .point .p-bottom.wide {	background: url(../images/csr/outline_bg02.jpg) top center / cover no-repeat; }
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bottom {
		padding-bottom: 50px;
	}
}

#csr-sec .point .p-bottom .list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bottom .list {
		flex-direction: row;
		gap: 40px;
	}
}

#csr-sec .point .p-bottom .list li {
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20);
	box-shadow: 0px 0px 20px 20px rgb(1 10 17 / 15%);
	border-radius: 10px;
	background-color: #fff;
	position: relative;
	top: calc((100vw / 375) * -100);
}
#csr-sec .point .p-bottom.wide .list li {
	max-width: none;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bottom .list li {
		padding: 80px;
		border-radius: 10px;
		top: -100px;
		max-width: 750px;
	}
	#csr-sec .point .p-bottom.wide .list li {
		max-width: none;
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		gap: 40px;
	}
}

#csr-sec .point .p-bottom .list img {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bottom .list img {
		width: 100%;
	}
	#csr-sec .point .p-bottom.wide .list img {
		width: 50%;
	}
}

#csr-sec .point .p-bottom.wide .list .desc {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bottom.wide .list .desc {
		max-width: 600px;
		width: 45%;
	}
}

#csr-sec .point .p-bottom .list .subtitle {
	font-size: calc((100vw / 375) * 26);
	letter-spacing: 0.4rem;
	line-height: 1.6;
	margin-top: 20px;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bottom .list .subtitle {
		font-size: 3.0rem;
		margin-top: 20px;
	}
	#csr-sec .point .p-bottom.wide .list .subtitle {	margin-top: 0; }
}

#csr-sec .point .p-bottom .list .txt {
	margin-top: 20px;
}
@media screen and (min-width: 1024px) {
	#csr-sec .point .p-bottom .list .txt {
		margin-top: 20px;
	}
}


/* ========== index SALONINFO(saloninfo-sec) ========== */
#saloninfo-sec {
	background-color: #f1f6f6;
	padding-top: calc((100vw / 375) * 50);
	padding-bottom: 150px;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec {
		padding-top: 100px;
		padding-bottom: 150px;
	}
}

/* guide */
#saloninfo-sec .guide .box {
	background: url(../images/saloninfo/guide_bg01.jpg) center center / cover no-repeat;
	padding: calc((100vw / 375) * 40) calc((100vw / 375) * 15);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .box {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		padding: 70px 40px;
		gap: 40px;
	}
}
@media screen and (min-width: 1650px) {
	#saloninfo-sec .guide .box {
		padding: 70px 100px;
	}
}

#saloninfo-sec .guide .titlebox p {
	font-size: calc((100vw / 375) * 54);
	letter-spacing: 0.2rem;
	line-height: 1;
	color: #fff;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .titlebox p {
		font-size: 7.0rem;
		letter-spacing: 0.4rem;
	}
}

#saloninfo-sec .guide .titlebox h2 {
	font-size: calc((100vw / 375) * 20);
	letter-spacing: 0.2rem;
	color: #fff;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .titlebox h2 {
		font-size: 2.4rem;
		margin-top: 10px;
	}
}

@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .desc {
		width: 800px;
		margin-right: 100px;
	}
}

#saloninfo-sec .guide .desc .txt {
	color: #fff;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .desc .txt {
		text-align: center;
	}
}

#saloninfo-sec .guide .desc .bgtxt {
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	color: #fff;
	margin-top: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .desc .bgtxt {
		font-size: 1.8rem;
		text-align: center;
		margin-top: 15px;
	}
}

#saloninfo-sec .guide .contents {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents {
		margin-top: 25px;
	}
}

#saloninfo-sec .guide .contents .inputbox {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: calc((100vw / 375) * 15);
	padding: calc((100vw / 375) * 40) 0;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents .inputbox {
		flex-direction: row;
		gap: 0;
		padding: 40px 0;
	}
}

#saloninfo-sec .guide .contents .inputbox p {
	font-size: calc((100vw / 375) * 18);
	font-weight: bold;
	letter-spacing: 0.1rem;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 5);
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents .inputbox p {
		font-size: 1.6rem;
		margin-bottom: 0;
	}
}

#saloninfo-sec .guide .contents select {
	position: relative;
	appearance: none;
	width: 100%;	
	background-color: #fff;
	border-radius: calc((100vw / 375) * 5);
	color: #1c1c1c;
	padding: calc((100vw / 375) * 12) calc((100vw / 375) * 10);
	font-size: calc((100vw / 375) * 16);
	letter-spacing: 0.05rem;
}
#saloninfo-sec .guide .contents select:focus {
  outline: 1px #000 solid;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents select {
		width: 100%;	
		height: 60px;
		border-radius: 10px;
		padding: 0 20px;
		font-size: 1.6rem;
	}
}

#saloninfo-sec .guide .contents .selectwrap {
	position: relative;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents .selectwrap {
		width: auto;
	}
}

@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents .selectwrap.area01 { width: 190px; } 
	#saloninfo-sec .guide .contents .selectwrap.area02 { width: 240px; }
}

#saloninfo-sec .guide .contents .selectwrap::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 16);
	height: calc((100vw / 375) * 9);
	background: url(../common_img/icon_arrow.svg) center center / cover no-repeat;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 15);
	transform: translateY(-50%);
	z-index: 1;
	pointer-events: none;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents .selectwrap::before {
		width: 16px;
		height: 9px;
		position: absolute;
		right: 20px;
	}
}

#saloninfo-sec .guide .contents .submitbtn {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 22);
	text-align: center;
	letter-spacing: 0.1rem;
	width: calc((100vw / 375) * 285);
	color: #000;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: calc((100vw / 375) * 30);
	padding: calc((100vw / 375) * 15) calc((100vw / 375) * 25) calc((100vw / 375) * 15) calc((100vw / 375) * 5);
	margin-top: calc((100vw / 375) * 20);
	transition: all .6s ease;
}
#saloninfo-sec .guide .contents .submitbtn::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 24);
	height: calc((100vw / 375) * 24);
	background: url(../common_img/icon_search.svg) center center / cover no-repeat;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 60);
	transform: translateY(-50%);
	z-index: 1;
	pointer-events: none;
	transition: all .6s ease;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents .submitbtn {
		font-size: 2.2rem;
		width: 180px;
		border-radius: 30px;
		padding: 16px 32px 16px 10px;
		margin-top: 0;
		cursor: pointer;
	}
	#saloninfo-sec .guide .contents .submitbtn::before {
		width: 23px;
		height: 24px;
		right: 20px;
	}
	#saloninfo-sec .guide .contents .submitbtn:hover {
		color: #fff;
		background-color: transparent;
	}
	#saloninfo-sec .guide .contents .submitbtn:hover::before {
		background: url(../common_img/icon_search_white.svg) center center / cover no-repeat;
	}
}

@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .contents .inputbox p + .selectwrap {	margin-left: 20px; }
	#saloninfo-sec .guide .contents .inputbox .selectwrap + .selectwrap {	margin-left: 10px; }
	#saloninfo-sec .guide .contents .inputbox .selectwrap + button {	margin-left: 20px; }
}

#saloninfo-sec .guide .btn01 {
	display: block;
	text-align: right;
	font-size: calc((100vw / 375) * 16);
	font-weight: 500;
	letter-spacing: 0.05rem;
	color: #fff;
	width: max-content;
	padding-right: calc((100vw / 375) * 60);
	margin: calc((100vw / 375) * 25) auto 0;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .btn01 {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		text-align: center;
		padding-right: 66px;
		margin: 32px auto 0;
	}
}

#saloninfo-sec .guide .note {
	font-size: calc((100vw / 375) * 13);
	color: #99acb5;
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .guide .note {
		font-size: 1.3rem;
		text-align: center;
		margin-top: 12px;
	}
}

/* search */
#saloninfo-sec .search {
	padding-top: calc((100vw / 375) * 45);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .search {
		padding-top: 70px;
	}
}

#saloninfo-sec .search .inner {
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 10px 10px rgb(111 125 125 / 15%);
	padding-top: calc((100vw / 375) * 40);
	padding-bottom: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .search .inner {
		border-radius: 10px;
		box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
		padding-top: 60px;
		padding-bottom: 100px;
	}
}

#saloninfo-sec .search #searchbox .titlebox {
	margin-right: calc((100vw / 375) * 15);
	margin-left: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .search #searchbox .titlebox {
		margin-right: 0;
		margin-left: 0;
	}
}

#saloninfo-sec .search #searchbox .contents {
	background-color: #f1f6f6;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
  margin-right: calc((100vw / 375) * 15);
  margin-left: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .search #searchbox .contents {
		border-bottom-right-radius: 10px;
		border-bottom-left-radius: 10px;
		margin-right: 0;
		margin-left: 0;
	}
}

#saloninfo-sec .search #searchbox .contents .toggle-wrap {
	padding: 0 calc((100vw / 375) * 15) calc((100vw / 375) * 40) calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .search #searchbox .contents .toggle-wrap {
		padding: 0 0 55px 0;
	}
}

@media screen and (max-width: 1023px) {
	#saloninfo-sec .search #searchbox .contents .s-submit .submitbtn {
		width: calc((100vw / 375) * 275);
	}
	#saloninfo-sec .search #searchbox .contents .s-submit .submitbtn::before {
	  right: calc((100vw / 375) * 50);
	}
}

/* salonlist */
#saloninfo-sec .salonlist {
	margin-top: calc((100vw / 375) * 50);
	margin-right: calc((100vw / 375) * 15);
	margin-left: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist {
		margin-top: 100px;
		margin-right: 0;
		margin-left: 0;
	}
}

#saloninfo-sec .salonlist .box {
	position: relative;
	background-color: #f1f6f6;
	padding: calc((100vw / 375) * 50) calc((100vw / 375) * 15) calc((100vw / 375) * 40) calc((100vw / 375) * 15);
	border-radius: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box {
		padding: 70px 50px 65px 50px;
		border-radius: 10px;
	}
}

#saloninfo-sec .salonlist .box + .box {
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box + .box {
		margin-top: 50px;
	}
}

#saloninfo-sec .salonlist .box .area {
	font-weight: bold;
	letter-spacing: 0.1rem;
	color: #fff;
	text-align: center;
	position: absolute;
	top: calc((100vw / 375) * -3);
	left: calc((100vw / 375) * 15);
	background: url(../images/saloninfo/icon_area.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 90);
	height: calc((100vw / 375) * 35);
	padding-top: calc((100vw / 375) * 3);
	padding-left: calc((100vw / 375) * 3);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .area {
		letter-spacing: 0.2rem;
		top: -4px;
		left: 48px;
		width: 104px;
		height: 40px;
		padding-top: 3px;
		padding-left: 4px;
	}
}

#saloninfo-sec .salonlist .box h3 {
	font-size: calc((100vw / 375) * 18);
	letter-spacing: 0.1rem;
	font-weight: bold;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box h3 {
		font-size: 2.0rem;
		letter-spacing: 0.2rem;
	}
}

#saloninfo-sec .salonlist .box .s-address {
	display: flex;
	flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
	gap: calc((100vw / 375) * 15);
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-address {
		flex-direction: row;
		align-items: center;
		gap: 20px;
		margin-top: 14px;
	}
}

#saloninfo-sec .salonlist .box .s-address .map {
	font-weight: 500;
	letter-spacing: 0.05rem;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 30);
	padding: calc((100vw / 375) * 3) calc((100vw / 375) * 12) calc((100vw / 375) * 4) calc((100vw / 375) * 12);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-address .map {
		border-radius: 15px;
		padding: 0 21px 1px 21px;
	}
	#saloninfo-sec .salonlist .box .s-address .map:hover {
		background-color: #1c1c1c;
		color: #fff;
	} 
}

#saloninfo-sec .salonlist .box .s-address .map .i-pin {
	display: inline-block;
	background: url(../images/saloninfo/icon_pin.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 15);
	height: calc((100vw / 375) * 19);
	position: relative;
	top: calc((100vw / 375) * 4);
	margin-right: calc((100vw / 375) * 6);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-address .map .i-pin {
		background: url(../images/saloninfo/icon_pin.svg) center center / cover no-repeat;
		width: 18px;
		height: 23px;
		top: 5px;
		margin-right: 8px;
		transition: filter .7s ease;
	}
	#saloninfo-sec .salonlist .box .s-address .map:hover .i-pin {
	  filter: invert(1);
	}
}

#saloninfo-sec .salonlist .box .s-link {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	gap: calc((100vw / 375) * 18) calc((100vw / 375) * 13);
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link {
		flex-wrap: nowrap;
		gap: 20px;
		margin-top: 18px;
	}
}

#saloninfo-sec .salonlist .box .s-link .tel {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	padding-right: calc((100vw / 375) * 2);
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .tel {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		padding-right: 8px;
		width: auto;
	}
}

#saloninfo-sec .salonlist .box .s-link .tel .is-black {
	font-weight: 500;
	color: #fff;
	background-color: #000;
	border-radius: calc((100vw / 375) * 25);
	padding: calc((100vw / 375) * 5) calc((100vw / 375) * 12) calc((100vw / 375) * 6) calc((100vw / 375) * 12);
	margin-right: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .tel .is-black {
		border-radius: 15px;
		padding: 2px 13px 4px 13px;
		margin-right: 10px;
	}
}

#saloninfo-sec .salonlist .box .s-link .site {
	position: relative;
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	width: calc((100vw / 375) * 128);
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .site {
		font-size: 1.6rem;
		letter-spacing: 0.1rem;
		width: auto;
	}
}

#saloninfo-sec .salonlist .box .s-link .site .is-black {
	font-weight: 500;
	color: #fff;
	background-color: #000;
	border-radius: calc((100vw / 375) * 25);
	padding: calc((100vw / 375) * 5) calc((100vw / 375) * 35) calc((100vw / 375) * 6) calc((100vw / 375) * 12);
	transition: all .6s ease;
	border: 1px solid #000;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .site .is-black {
		border-radius: 15px;
		padding: 1px 33px 3px 13px;
	}
	#saloninfo-sec .salonlist .box .s-link .site:hover .is-black {		
		background-color: #fff;
		color: #000;
	}
}

#saloninfo-sec .salonlist .box .s-link .site::before {
	content: '';
	display: block;
	background: url(../common_img/arrow_up_black.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 11);
	height: calc((100vw / 375) * 11);
	position: absolute;
	top: 51%;
	right: calc((100vw / 375) * 13);
	transform: translateY(-50%);
	transition: all .6s ease;
	z-index: 1;
}
#saloninfo-sec .salonlist .box .s-link .site::after {
	content: '';
	display: block;
	width: calc((100vw / 375) * 22);
	height: calc((100vw / 375) * 22);
	background-color: #fff;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 7);
	transform: translateY(-50%);
	transition: all .6s ease;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .site::before {
		width: 11px;
		height: 11px;
		right: 11px;
	}
	#saloninfo-sec .salonlist .box .s-link .site::after {
		width: 22px;
		height: 22px;
		right: 6px;
	}
	#saloninfo-sec .salonlist .box .s-link .site:hover::before {
		background: url(../common_img/arrow_up_white.svg) center center / cover no-repeat;
	}
	#saloninfo-sec .salonlist .box .s-link .site:hover::after {
		background-color: #000;
	}
}

#saloninfo-sec .salonlist .box .s-link .sns {
	font-size: calc((100vw / 375) * 14);
	font-weight: 500;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 25);
	padding: calc((100vw / 375) * 5) calc((100vw / 375) * 12) calc((100vw / 375) * 6) calc((100vw / 375) * 12);
	transition: all .6s ease;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .sns {
		font-size: 1.6rem;
		border-radius: 15px;
		padding: 2px 24px 4px 24px;
	}
}

#saloninfo-sec .salonlist .box .s-link .sns p {
	font-weight: bold;
	margin-right: 15px;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .sns p {
		margin-right: 15px;
	}
}

#saloninfo-sec .salonlist .box .s-link .sns a {
	display: inline-block;
}
#saloninfo-sec .salonlist .box .s-link .sns a + a {
	margin-left: 12px;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .sns a:hover {
		opacity: .7;
	}
	#saloninfo-sec .salonlist .box .s-link .sns a + a {
		margin-left: 12px;
	}
}

#saloninfo-sec .salonlist .box .s-link .sns .i-facebook {
	background: url(../images/saloninfo/icon_facebook.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 19);
	height: calc((100vw / 375) * 19);
}
#saloninfo-sec .salonlist .box .s-link .sns .i-instagram {
	background: url(../images/saloninfo/icon_instagram.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 18);
	height: calc((100vw / 375) * 18);
}
#saloninfo-sec .salonlist .box .s-link .sns .i-x {
	background: url(../images/saloninfo/icon_x.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 16);
	height: calc((100vw / 375) * 16);
}
#saloninfo-sec .salonlist .box .s-link .sns .i-youtube {
	background: url(../images/saloninfo/icon_youtube.png) center center / cover no-repeat;
	width: calc((100vw / 375) * 23);
	height: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .s-link .sns .i-facebook {
		width: 23px;
		height: 23px;
	}
	#saloninfo-sec .salonlist .box .s-link .sns .i-instagram {
		width: 22px;
		height: 22px;
	}
	#saloninfo-sec .salonlist .box .s-link .sns .i-x {
		width: 20px;
		height: 20px;
	}
	#saloninfo-sec .salonlist .box .s-link .sns .i-youtube {
		width: 27px;
		height: 19px;
	}
}

#saloninfo-sec .salonlist .box .tag {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	gap: calc((100vw / 375) * 10);
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .tag {
		gap: 10px;
		margin-top: 30px;
	}
}

#saloninfo-sec .salonlist .box .tag p {
	font-weight: 500;
	letter-spacing: 0.1rem;
	border: 1px solid #000;
	border-radius: calc((100vw / 375) * 30);
	padding: calc((100vw / 375) * 2) calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .tag p {
		border-radius: 20px;
		padding: 5px 27px;
	}
}

#saloninfo-sec .salonlist .box .desc {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	gap: calc((100vw / 375) * 30);
	border-top: 1px solid #d5dcdb;
	padding-top: calc((100vw / 375) * 30);
	margin-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc {
		flex-direction: row;
		gap: 40px;
		padding-top: 30px;
		margin-top: 30px;
	}
}

#saloninfo-sec .salonlist .box .txt {
	width: auto;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .txt {
		width: 660px;
		flex: 0 0 auto;
	}
}

#saloninfo-sec .salonlist .box .desc .com {
	padding: calc((100vw / 375) * 20) calc((100vw / 375) * 15);
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com {
		padding: 15px 15px 20px 15px;
		border-radius: 10px;
	}
}

#saloninfo-sec .salonlist .box .desc .com .head {
	font-weight: bold;
	letter-spacing: 0.1rem;
	line-height: calc((100vw / 375) * 38);
	color: #fff;
	text-align: center;
	background-color: #000;
	border-radius: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com .head {
		line-height: 40px;
		border-radius: 10px;
	}
}

#saloninfo-sec .salonlist .box .desc .com .list {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: flex-start;
	flex-wrap: wrap;
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com .list {
		flex-wrap: nowrap;
		margin-top: 20px;
	}
}

#saloninfo-sec .salonlist .box .desc .com .list li {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	width: calc(100% / 2);
	height: calc((100vw / 375) * 105);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com .list li {
		width: calc(100% / 4);
		height: 100px;
	}
}
@media screen and (max-width: 1023px) {	
	#saloninfo-sec .salonlist .box .desc .com .list li:nth-of-type(1),
	#saloninfo-sec .salonlist .box .desc .com .list li:nth-of-type(2) {
		border-bottom: 1px solid #d5dcdb;
	}
}

#saloninfo-sec .salonlist .box .desc .com .list li + li {
	border-left: 1px solid #d5dcdb;
}

@media screen and (max-width: 1023px) {
	#saloninfo-sec .salonlist .box .desc .com .list li:nth-of-type(3) {
		border-left: 1px solid transparent;
	}
}

#saloninfo-sec .salonlist .box .desc .com .list li .name {
	font-size: calc((100vw / 375) * 16);
	font-weight: bold;
	text-align: center;
	letter-spacing: 0;
	padding-top: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com .list li .name {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		padding-top: 0;
	}
}

#saloninfo-sec .salonlist .box .desc .com .list li .i-circle {
	background: url(../images/saloninfo/icon_circle.svg) center center / cover no-repeat;
  width: calc((100vw / 375) * 30);
  height: calc((100vw / 375) * 30);
  margin-top: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com .list li .i-circle {
		width: 30px;
		height: 30px;
		margin-top: 8px;
	}
}

#saloninfo-sec .salonlist .box .desc .com .list li .i-cross {
	background: url(../images/saloninfo/icon_cross.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 22);
	height: calc((100vw / 375) * 22);
	margin-top: calc((100vw / 375) * 9);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com .list li .i-cross {
		width: 22px;
		height: 22px;
		margin-top: 12px;
	}
}

#saloninfo-sec .salonlist .box .desc .com .list li .sub {
	font-size: calc((100vw / 375) * 11);
	letter-spacing: 0;
	margin-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com .list li .sub {
		font-size: 1.3rem;
		letter-spacing: 0.1rem;
		margin-top: 5px;
	}
}

#saloninfo-sec .salonlist .box .desc .ap-title {
	font-size: calc((100vw / 375) * 22);
	font-weight: bold;
	letter-spacing: 0.2rem;
	line-height: 1.8;
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .ap-title {
		font-size: 2.0rem;
	}
}

#saloninfo-sec .salonlist .box .desc .com + .ap-title,
#saloninfo-sec .salonlist .box .desc .ap-txt + .ap-title {
	margin-top: calc((100vw / 375) * 25);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .com + .ap-title {
		margin-top: 30px;
	}
}

#saloninfo-sec .salonlist .box .desc .ap-txt {
	line-height: 2.0;
	letter-spacing: 0.1rem;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .ap-txt {
		margin-top: 15px;
	}
}

#saloninfo-sec .salonlist .box .desc .img {
	display: flex;
	flex-direction: column;
	gap: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#saloninfo-sec .salonlist .box .desc .img {
		gap: 30px;
	}
}

#saloninfo-sec .salonlist .box .desc .img img {
  width: 100%;
}

/* ========== index FORSALON(forsalon-sec) ========== */
/* index */
#forsalon-sec #indexbox .list li:nth-of-type(5) h3 { letter-spacing: 0; }
#forsalon-sec #indexbox .list li:nth-of-type(6) h3 { line-height: 1.2; }
@media screen and (min-width: 1024px) {
	#forsalon-sec #indexbox .list li:nth-of-type(5) h3 { letter-spacing: 0.05rem; }
	#forsalon-sec #indexbox .list li:nth-of-type(6) h3 { line-height: 1.4; }
}

/* outline */
#forsalon-sec .outline {
	height: auto;
	background: url(../images/forsalon/forsalon_bg01_sp.jpg) bottom center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .outline {
		height: auto;
		min-height: 645px;
		background: url(../images/forsalon/forsalon_bg01.jpg) center left / cover no-repeat;
	}
}
@media screen and (min-width: 1750px) {
	#forsalon-sec .outline {
		height: 950px;
	}
}

#forsalon-sec .outline .box {
	padding-top: calc((100vw / 375) * 70);
	padding-bottom: calc((100vw / 375) * 500);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .outline .box {
		padding-top: 130px;
		padding-bottom: 130px;
		width: 600px;
		margin: 0 100px 0 auto;
	}
}
@media screen and (min-width: 1750px) {
	#forsalon-sec .outline .box {
		padding-top: 230px;
		padding-bottom: 230px;
		width: 600px;
		margin: 0 100px 0 auto;
	}
}

#forsalon-sec .outline .box h2 {
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.5rem;
	line-height: 1.6;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .outline .box h2 {
		font-size: 3.6rem;
	}
}

#forsalon-sec .outline .box p {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.2rem;
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .outline .box p {
		font-size: 1.6rem;
		padding-top: 40px;
	}
}

/* feature */
#forsalon-sec .feature {
	position: relative;
	background: url(../images/forsalon/forsalon_bg02_sp.png) top right / cover no-repeat;
	padding-top: calc((100vw / 375) * 74);
	margin-top: calc((100vw / 375) * -51);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .feature {
		background: url(../images/forsalon/forsalon_bg02.jpg) center center / cover no-repeat;
		padding-top: 125px;
		margin-top: 0;
	}
}

#forsalon-sec .feature .en-mr {
	position: absolute;
	top: calc((100vw / 375) * -53);
	left: calc((100vw / 375) * 15);
	font-size: calc((100vw / 375) * 75);
	letter-spacing: 0.2rem;
	color: rgb(233 240 240 / 10%);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .feature .en-mr {
		top: -15px;
		right: 115px;
		left: auto;
		font-size: 17.0rem;
	}
}

#forsalon-sec .feature .title .en {
	font-size: calc((100vw / 375) * 23);
	letter-spacing: 0.2rem;
	color: #99acb5;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .feature .title .en {
		font-size: 3.0rem;
	}
}

#forsalon-sec .feature .title .subtxt {
	font-size: calc((100vw / 375) * 30);
	letter-spacing: 0.5rem;
	line-height: 1.6;
	color: #fff;
	margin-top: calc((100vw / 375) * 25);
	position: relative;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .feature .title .subtxt {
		font-size: 3.6rem;
		line-height: 1.8;
		margin-top: 10px;
		left: -5px;
	}
}

#forsalon-sec .feature .title .txt {
	font-size: calc((100vw / 375) * 18);
	font-weight: bold;
	letter-spacing: 0.1rem;
	color: #99acb5;
	margin-top: calc((100vw / 375) * 18);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .feature .title .txt {
		font-size: 1.8rem;
		margin-top: 20px;
	}
}

#forsalon-sec .feature .box {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	margin-top: calc((100vw / 375) * 24);
	padding-bottom: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .feature .box {
		flex-direction: row;
		margin-top: 135px;
		padding-bottom: 155px;
		gap: 40px;
	}
}

@media screen and (min-width: 1024px) {
	#forsalon-sec .feature .box li {
		width: 700px;
	}
}

#forsalon-sec .feature .box .txt {
	color: #fff;
	line-height: 2.0;
	letter-spacing: 0.2rem;
}

#forsalon-sec .feature .box .txt + img,
#forsalon-sec .feature .box img + .txt {
	margin-top: calc((100vw / 375) * 35);
}
#forsalon-sec .feature .box li:nth-of-type(2) img {
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .feature .box .txt + img,
	#forsalon-sec .feature .box img + .txt {
		margin-top: 60px;
	}
	#forsalon-sec .feature .box li:nth-of-type(2) img {
		margin-top: -20px;
		margin-left: 0;
		width: auto;
	}
}

/* point */
#forsalon-sec .point .bg01 {
	background: url(../images/forsalon/point_img01_sp.jpg) bottom center / cover no-repeat;
}
#forsalon-sec .point .bg02 {
	background: url(../images/forsalon/point_img02_sp.jpg) bottom center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .point .bg01 {
		background: url(../images/forsalon/point_img01.jpg) bottom center / cover no-repeat;
	}
	#forsalon-sec .point .bg02 {
		background: url(../images/forsalon/point_img02.jpg) bottom center / cover no-repeat;
	}
}

#forsalon-sec .point .box {
	position: relative;
	padding-top: calc((100vw / 375) * 160);
	padding-bottom: calc((100vw / 375) * 110);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .point .box {
		padding-top: 435px;
		padding-bottom: 60px;
		width: 400px;
	}
}

#forsalon-sec .point .box .en-mr {
	position: absolute;
	left: calc((100vw / 375) * -52);
	top: calc((100vw / 375) * -117);
	color: rgb(255 255 255 / 20%);
	font-size: calc((100vw / 375) * 174);
	line-height: 1;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .point .box .en-mr {
		left: -67px;
		top: -140px;
		font-size: 21.0rem;
	}
}

#forsalon-sec .point .box h2 {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	font-weight: 400;
	line-height: 1.8;
	letter-spacing: 0.5rem;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .point .box h2 {
		font-size: 3.6rem;
		margin-bottom: 30px;
	}
}

#forsalon-sec .point .box .subtxt {
	font-size: calc((100vw / 375) * 15);
	font-weight: 600;
	line-height: 1.8;
	letter-spacing: 0.2rem;
	color: #fff;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .point .box .subtxt {
		font-size: 1.8rem;
		margin-bottom: 35px;
	}
}

#forsalon-sec .point .box .txt {
	color: #fff;
	letter-spacing: 0.2rem;
}


/* voice */
#forsalon-sec .voice {
	position: relative;
	padding-bottom: calc((100vw / 375) * 35);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .voice {
		padding-bottom: 80px;
	}
}

#forsalon-sec .voice h2.en-mr {
	font-size: calc((100vw / 375) * 60);
	letter-spacing: 0.7rem;
	line-height: 1;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * 62);
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .voice h2.en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
		top: 110px;
	}
}

#forsalon-sec .voice .voice-swiper {
	padding-top: calc((100vw / 375) * 100);
	margin-top: 0;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .voice .voice-swiper {
		padding-top: 200px;
	}
}

/* explanation */
#forsalon-sec .explanation {
	position: relative;
	padding-top: calc((100vw / 375) * 40);
	padding-bottom: calc((100vw / 375) * 80);
	background: url(../images/forsalon/forsalon_bg03_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation {
		padding-top: 100px;
		padding-bottom: 155px;
		background: url(../images/forsalon/forsalon_bg03.jpg) center center / cover no-repeat;
	}
}

#forsalon-sec .explanation::before {
	content: '';
	display: block;
	width: 100%;
	height: calc((100vw / 375) * 555);
	background-color: #fff;
	position: absolute;
	top: 0;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation::before {
		content: '';
		display: block;
		width: 100%;
		height: 640px;
		background-color: #fff;
		position: absolute;
		top: 0;
	}
}

#forsalon-sec .explanation .bgtitle {
	position: relative;
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .bgtitle {
		margin-bottom: 30px;
	}
}

#forsalon-sec .explanation .bgtitle .en-mr {
	font-size: calc((100vw / 375) * 70);
	color: #e9f0f0;
	letter-spacing: 0.4rem;
	position: absolute;
	top: calc((100vw / 375) * -45);
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .bgtitle .en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.4rem;
		top: -152px;
	}
}

#forsalon-sec .explanation .bgtitle .en {
	position: relative;
	font-size: calc((100vw / 375) * 28);
	letter-spacing: 0.3rem;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .bgtitle .en {
		position: relative;
		font-size: 3.0rem;
	}
}

#forsalon-sec .explanation .title {
	font-size: calc((100vw / 375) * 28);
	font-weight: 400;
	letter-spacing: 0.5rem;
	line-height: 1.8;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .title {
		font-size: 3.6rem;
		width: 1000px;
	}
}

#forsalon-sec .explanation .title .t-sub {
	display: block;
	font-size: calc((100vw / 375) * 15);
	letter-spacing: 0.2rem;
	font-weight: bold;
	padding-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .title .t-sub {
		font-size: 1.8rem;
		letter-spacing: 0.4rem;
		padding-bottom: 10px;
	}
}

#forsalon-sec .explanation .whitebox {
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 20px 20px rgb(64 78 78 / 15%);
	padding: calc((100vw / 375) * 20) calc((100vw / 375) * 20) calc((100vw / 375) * 40) calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 45);
	display: flex;
	flex-direction: column;
	justify-content: normal;
	align-items: normal;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .whitebox {
		border-radius: 10px;
		padding: 100px 100px 80px 100px;
		margin-top: 90px;
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
	}
}

#forsalon-sec .explanation .whitebox .desc,
#forsalon-sec .explanation .whitebox .desc img {
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .whitebox .desc,
	#forsalon-sec .explanation .whitebox img {
		width: calc((100% - 95px) / 2);
	}
}

#forsalon-sec .explanation .whitebox .desc .desctitle {
	font-size: calc((100vw / 375) * 21);
	line-height: 1.6;
	letter-spacing: 0.2rem;
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .whitebox .desc .desctitle {
		font-size: 3.0rem;
		padding-top: 10px;
	}
}

#forsalon-sec .explanation .whitebox .desc p {
	font-size: calc((100vw / 375) * 13);
	letter-spacing: 0.3rem;
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .whitebox .desc p {
		font-size: 1.6rem;
		padding-top: 30px;
	}
}

#forsalon-sec .explanation .whitebox .desc .btn01 {
	display: block;
	width: calc((100vw / 375) * 168);
	margin: calc((100vw / 375) * 24) 0 0 auto;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .whitebox .desc .btn01 {
		width: 165px;
		padding-right: 60px;
		margin: 20px 0 0 auto;
	}
}

#forsalon-sec .explanation .whitebox .desc .btn01 .bold {
	padding-right: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .explanation .whitebox .desc .btn01 .bold {
		padding-right: 5px;
	}
}

/* product lineup */
#forsalon-sec .lineup {
	position: relative;
	padding-top: calc((100vw / 375) * 120);	
	padding-bottom: calc((100vw / 375) * 80);
	background-color: #f1f6f6;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup {
		padding-top: 345px;	
		padding-bottom: 150px;
	}
}

#forsalon-sec .lineup::before {
	content: '';
	display: block;
	width: 100%;
	height: calc((100vw / 375) * 420);
	background-color: #fff;
	position: absolute;
	top: 0;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup::before {
		height: 720px;
	}
}

#forsalon-sec .lineup h2.en-mr {
	font-size: calc((100vw / 375) * 70);
	line-height: 1;
	letter-spacing: 0.4rem;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * -85);
	white-space: nowrap;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup h2.en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
		top: -235px;
	}
}

#forsalon-sec .lineup .title {
	position: relative;
	font-size: calc((100vw / 375) * 25);
	letter-spacing: 0.1rem;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .title {
		font-size: 3.0rem;
		letter-spacing: 0.2rem;
	}
}

#forsalon-sec .lineup .txt {
	font-size: calc((100vw / 375) * 15);
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .txt {
		font-size: 1.6rem;
		margin-top: 20px;
	}
}

#forsalon-sec .lineup .box {
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .box {
		margin-top: 80px;
	}
}

#forsalon-sec .lineup .box li {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	gap: calc((100vw / 375) * 20);
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
	padding: calc((100vw / 375) * 25) calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .box li {
		flex-direction: row;
		gap: 20px;
		border-radius: 10px;
		padding: 100px 100px 75px 100px;
	}
}

#forsalon-sec .lineup .box li + li {
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .box li + li {
		margin-top: 80px;
	}
}

#forsalon-sec .lineup .box .item {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .box .item {
		flex-direction: row;
		align-items: flex-start;
		gap: 70px;
	}
	#forsalon-sec .lineup .box .item:hover {
		opacity: .7;
	}
}

#forsalon-sec .lineup .item img {
	aspect-ratio: 350 / 425;
	object-fit: cover;
	height: calc((100vw / 375) * 300);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .item img {
		width: 300px;
		height: auto;
		max-width: 350px;
	}
}
@media screen and (min-width: 1700px) {
	#forsalon-sec .lineup .item img {
		width: auto;
	}
}

#forsalon-sec .lineup .item .itemdesc {
	width: auto;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .item .itemdesc {
		width: 400px;
		padding-top: 100px;
	}
	#forsalon-sec .lineup .box li:nth-of-type(6) .item .itemdesc {
		padding-top: 55px;	
	}
}

#forsalon-sec .lineup .item .itemdesc h3 {
	font-size: calc((100vw / 375) * 22);
	padding-bottom: calc((100vw / 375) * 20);
	border-bottom: 1px solid #dddddd;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .item .itemdesc h3 {
		font-size: 2.4rem;
		padding-bottom: 25px;
	}
}

#forsalon-sec .lineup .item .itemdesc .item-sub {
	font-size: calc((100vw / 375) * 17);
	font-weight: bold;
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .item .itemdesc .item-sub {
		font-size: 2.0rem;
		padding-top: 22px;
	}
}

#forsalon-sec .lineup .item .itemdesc .item-txt {
	font-size: calc((100vw / 375) * 15);
	padding-top: calc((100vw / 375) * 20);
}
#forsalon-sec .lineup .item .itemdesc .item-txt .icon {
	position: relative;
	font-size: calc((100vw / 375) * 10);
	top: calc((100vw / 375) * -3);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .item .itemdesc .item-txt {
		font-size: 1.6rem;
		padding-top: 22px;
	}
	#forsalon-sec .lineup .item .itemdesc .item-txt .icon {
		font-size: 1.3rem;
		top: -3px;
	}
}

#forsalon-sec .lineup .item .itemdesc .item-smtxt {
	position: relative;
	font-size: calc((100vw / 375) * 12);
	padding-left: calc((100vw / 375) * 14);
}
#forsalon-sec .lineup .item .itemdesc .item-smtxt span {
	position: absolute;
  left: 0;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .item .itemdesc .item-smtxt {
		font-size: 1.1rem;
		padding-left: 17px;
	}
}

#forsalon-sec .lineup .slide {
  height: calc((100vw / 375) * 235);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .slide {
		height: -webkit-fill-available;
	}
}

#forsalon-sec .lineup .slide .img {
	height: calc((100vw / 375) * 235);
	display: none;
	object-fit: cover;
}
#forsalon-sec .lineup .slide .img.is-active {
	display: block;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .slide .img {
		height: auto;
		min-height: 400px;
	}
}

#forsalon-sec .lineup .btnwrap {
	display: flex;
	flex-direction: row;
	gap: calc((100vw / 375) * 3);
	margin-bottom: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .btnwrap {
		position: absolute;
		right: 70px;
		bottom: 12px;
		gap: 5px;
		margin-bottom: 0;
	}
}
@media screen and (min-width: 1700px) {
	#forsalon-sec .lineup .btnwrap {
		bottom: 26px;
	}
}

#forsalon-sec .lineup .btnwrap .slidebtn {
	border-radius: 50%;
	display: block;
	width: calc((100vw / 375) * 30);
	height: calc((100vw / 375) * 30);
	margin: 0 calc((100vw / 375) * 3);
	background-color: transparent;
	opacity: 1;
}
#forsalon-sec .lineup .btnwrap .slidebtn::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 7);
	height: calc((100vw / 375) * 7);
	position: relative;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background-color: #bdbdbd;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .btnwrap .slidebtn {
		width: 50px;
		height: 50px;
		margin: 0 10px;
		cursor: pointer;
	}
	#forsalon-sec .lineup .btnwrap .slidebtn::before {
		width: 10px;
		height: 10px;
	}
}

#forsalon-sec .lineup .btnwrap .slidebtn.is-active {
	border: 1px solid #1c1c1c;
}
#forsalon-sec .lineup .btnwrap .slidebtn.is-active::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 7);
	height: calc((100vw / 375) * 7);
	position: relative;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background-color: #1c1c1c;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .lineup .btnwrap .slidebtn.is-active::before {
		width: 10px;
		height: 10px;
	}
}

/* trial */
#forsalon-sec .trial {
	display: flex;
	flex-direction: column;
	padding-top: calc((100vw / 375) * 20);
	padding-bottom: calc((100vw / 375) * 20);
	gap: calc((100vw / 375) * 20);
	margin: 0 calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .trial {
		padding-top: 100px;
		padding-bottom: 100px;
		gap: 40px;
		margin: 0 100px;
	}
}

#forsalon-sec .box-traial .box {
	display: block;
	position: relative;
	width: 100%;
	padding: calc((100vw / 375) * 20);
	background: url(../common_img/trial_img01_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-traial .box {
		padding: 100px;
		background: url(../common_img/trial_img01.jpg) center center / cover no-repeat;
	}
	#forsalon-sec .box-traial .box:hover {
		opacity: .8;
	}
}

#forsalon-sec .box-traial .desc {
	display: block;
	border-bottom: 1px solid #fff;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-traial .desc {
		width: 50%;
		max-width: 600px;
		border-bottom: 1px solid #fff;
		padding-top: 30px;
	}
}

#forsalon-sec .box-traial .desc h2 {
	font-size: calc((100vw / 375) * 14);
	font-weight: 500;
	letter-spacing: 0.2rem;
	color: #fff;
	padding-top: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-traial .desc h2 {
		font-size: 2.0rem;
		padding-top: 0;
	}
}

#forsalon-sec .box-traial .desc h2 span {
	display: block;
	font-size: calc((100vw / 375) * 25);
	letter-spacing: 0.2rem;
	line-height: 1.3;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-traial .desc h2 span {
		font-size: 10.0rem;
		letter-spacing: 0.4rem;
		line-height: 1;
	}
}

#forsalon-sec .box-traial .desc p {
	font-size: calc((100vw / 375) * 14);
	color: #fff;
	letter-spacing: 0.1rem;
	padding-top: calc((100vw / 375) * 12);
	padding-bottom: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-traial .desc p {
		font-size: 1.6rem;
		padding-top: 20px;
		padding-bottom: 30px;
	}
}

#forsalon-sec .box-seminars .box {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-seminars .box {
		flex-direction: row;
	}
		#forsalon-sec .box-seminars .box:hover {
		opacity: .8;
	}
}

#forsalon-sec .box-seminars .box .desc {
	position: relative;
	display: block;
	width: 100%;
	padding: calc((100vw / 375) * 20);
	background: url(../common_img/seminars_bg01.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-seminars .box .desc {
		width: 63%;
		padding: 60px 30px;
	}
}
@media screen and (min-width: 1750px) {
	#forsalon-sec .box-seminars .box .desc {
		width: 55%;
		padding: 60px 70px;
	}
}

#forsalon-sec .box-seminars .box .bg {
	width: 100%;
	height: calc((100vw / 375) * 160);
	background: url(../common_img/seminars_img01_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-seminars .box .bg {
		width: 37%;
		height: -webkit-fill-available;
		background: url(../common_img/seminars_img01.jpg) center center / cover no-repeat;
	}
}
@media screen and (min-width: 1750px) {
	#forsalon-sec .box-seminars .box .bg {
		width: 45%;
	}
}

#forsalon-sec .box-seminars .box h2 {
	display: block;
	font-size: calc((100vw / 375) * 25);
	color: #fff;
	letter-spacing: 0.2rem;
	line-height: 1;
	padding-top: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-seminars .box h2 {
		font-size: 7.0rem;
		letter-spacing: 0.4rem;
		padding-top: 60px;
	}
}

#forsalon-sec .box-seminars .box .txt {
	font-size: calc((100vw / 375) * 14);
	color: #fff;
	letter-spacing: 0.1rem;
	padding-top: calc((100vw / 375) * 15);
	padding-bottom: calc((100vw / 375) * 85);
	border-bottom: 1px solid #fff;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-seminars .box .txt {
		font-size: 1.6rem;
		padding-top: 30px;
		padding-bottom: 30px;
	}
}

#forsalon-sec .box-seminars .box .btn01 {
	position: absolute;
	left: calc((100vw / 375) * 20);
	bottom: calc((100vw / 375) * 50);
	font-size: calc((100vw / 375) * 16);
	font-weight: 500;
	color: #fff;
	padding-right: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .box-seminars .box .btn01 {
		font-size: 1.7rem;
		right: 30px;
		left: auto;
		bottom: 90px;
		padding-right: 66px;
	}
	#forsalon-sec .box-seminars .box .btn01:hover .i-circle {
    background: url(../common_img/btn_white.svg) center center / cover no-repeat;
	}
}
@media screen and (min-width: 1750px) {
		#forsalon-sec .box-seminars .box .btn01 {
		right: 70px;
	}
}

/* agent */
#forsalon-sec .agent {
	position: relative;
	padding-top: calc((100vw / 375) * 116);	
	padding-bottom: calc((100vw / 375) * 75);
	background-color: #e8eded;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent {
		padding-top: 110px;	
		padding-bottom: 150px;
	}
}

#forsalon-sec .agent::before {
	content: '';
	display: block;
	width: 100%;
	height: calc((100vw / 375) * 395);
	background-color: #fff;
	position: absolute;
	top: 0;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent::before {
		height: 605px;
	}
}

#forsalon-sec .agent h2.en-mr {
	font-size: calc((100vw / 375) * 74);
	line-height: 1;
	letter-spacing: 0.4rem;
	color: #e9f0f0;
	position: absolute;
	top: calc((100vw / 375) * -92);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent h2.en-mr {
		font-size: 16.0rem;
		letter-spacing: 1.0rem;
		top: -84px;
	}
}

#forsalon-sec .agent .title {
	position: relative;
	font-size: calc((100vw / 375) * 26);
	letter-spacing: 0.2rem;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .title {
		font-size: 3.0rem;
	}
}

#forsalon-sec .agent .txt {
	font-size: calc((100vw / 375) * 29);
	letter-spacing: 0.6rem;
	padding-top: calc((100vw / 375) * 3);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .txt {
		font-size: 3.6rem;
		letter-spacing: 1.0rem;
		padding-top: 5px;
	}
}

#forsalon-sec .agent .agent-list {
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
	padding: calc((100vw / 375) * 10) calc((100vw / 375) * 20) calc((100vw / 375) * 28) calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 35);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list {
		border-radius: 10px;
		box-shadow: 0px 0px 20px 20px rgb(111 125 125 / 15%);
		padding: 45px 100px 80px 100px;
		margin-top: 85px;
	}
}

#forsalon-sec .agent .agent-list .box {
	position: relative;
	padding-bottom: calc((100vw / 375) * 26);
	border-bottom: 1px solid #d5dcdb;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .box {
		padding-bottom: 40px;
	}
}

#forsalon-sec .agent .agent-list .box::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: calc((100vw / 375) * 34);
	right: 0;
	pointer-events: none;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .box::before {
		width: 19px;
		height: 1px;
		top: 50px;
		right: 20px;
	}
}

#forsalon-sec .agent .agent-list .box::after {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: calc((100vw / 375) * 34);
	right: 0;
	transform: rotate(90deg);
	pointer-events: none;
}
#forsalon-sec .agent .agent-list .box.is-open::after {
	visibility: hidden;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .box::after {
		width: 19px;
		height: 1px;
		top: 50px;
		right: 20px;
	}
}

#forsalon-sec .agent .agent-list h3 {
	font-size: calc((100vw / 375) * 18);
	font-weight: bold;
	letter-spacing: 0.2rem;
	padding-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list h3 {
		font-size: 2.0rem;
		padding-top: 35px;
	}
}

#forsalon-sec .agent .agent-list .area {
	display: flex;
	flex-direction: row;
  justify-content: space-between;
	align-items: center;
	gap: calc((100vw / 375) * 5);
	flex-wrap: wrap;
	margin-top: calc((100vw / 375) * 25);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .area {
		justify-content: flex-start;
		gap: 20px;
		margin-top: 40px;
	}
}

#forsalon-sec .agent .agent-list .area li a {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
  letter-spacing: 0.1rem;
	width: calc((100vw / 375) * 93);
	height: calc((100vw / 375) * 42);
	border: 1px solid #000;
	border-radius: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .area li a {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		width: 140px;
		height: 50px;
		border-radius: 25px;
	}
	#forsalon-sec .agent .agent-list .area li a:hover {
		color: #fff;
		background-color: #000;
	}
}

#forsalon-sec .agent .agent-list .detail h4 {
	position: relative;
	font-size: calc((100vw / 375) * 18);
	font-weight: bold;
	line-height: 2;
	letter-spacing: 0.2rem;
	padding-left: calc((100vw / 375) * 13);
	margin-top: calc((100vw / 375) * 25);
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .detail h4 {
		font-size: 2.0rem;
		line-height: 3;
		padding-left: 15px;
		margin-top: 20px;
		margin-bottom: 20px;
	}
}

#forsalon-sec .agent .agent-list .detail h4::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 4);
	height: calc((100vw / 375) * 27);
	background-color: #000;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	border-radius: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .detail h4::before {
		width: 4px;
		height: 36px;
		border-radius: 20px;
	}
}

#forsalon-sec .agent .agent-list .address {
	background-color: #f1f6f6;
	border-radius: calc((100vw / 375) * 8);
	padding: calc((100vw / 375) * 20) calc((100vw / 375) * 20) calc((100vw / 375) * 30) calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address {
		border-radius: 10px;
		padding: 45px 50px;
	}
}

#forsalon-sec .agent .agent-list .address + .address {
	margin-top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address + .address {
		margin-top: 20px;
	}
}

#forsalon-sec .agent .agent-list .address .head {
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	letter-spacing: 0.1rem;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .head {
		font-size: 1.8rem;
		letter-spacing: 0.4rem;
	}
}

#forsalon-sec .agent .agent-list .address .ad {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	margin-top: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .ad {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		margin-top: 12px;
	}
}

#forsalon-sec .agent .agent-list .address .subaddress {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .subaddress {
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		gap: 40px;
	}
}

#forsalon-sec .agent .agent-list .address .tel {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .tel {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		margin-top: 12px;
	}
}

#forsalon-sec .agent .agent-list .address .tel .is-black {
	font-weight: 500;
	color: #fff;
	background-color: #000;
	border-radius: calc((100vw / 375) * 25);
	padding: calc((100vw / 375) * 5) calc((100vw / 375) * 13) calc((100vw / 375) * 6) calc((100vw / 375) * 13);
	margin-right: calc((100vw / 375) * 10);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .tel .is-black {
		border-radius: 15px;
		padding: 2px 13px 4px 13px;
		margin-right: 10px;
	}
}

#forsalon-sec .agent .agent-list .address .site {
	position: relative;
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.1rem;
	margin-top: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .site {
		font-size: 1.6rem;
		letter-spacing: 0.2rem;
		margin-top: 12px;
	}
}

#forsalon-sec .agent .agent-list .address .site .is-black {
	font-weight: 500;
	color: #fff;
	background-color: #000;
	border-radius: calc((100vw / 375) * 25);
	padding: calc((100vw / 375) * 5) calc((100vw / 375) * 30) calc((100vw / 375) * 6) calc((100vw / 375) * 19);
	transition: all .6s ease;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .site .is-black {
		border-radius: 15px;
		padding: 2px 33px 4px 13px;
	}
	#forsalon-sec .agent .agent-list .address .site:hover .is-black {		
		background-color: #fff;
		color: #000;
	}
}

#forsalon-sec .agent .agent-list .address .site::before {
	content: '';
	display: block;
	background: url(../common_img/arrow_up_white.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 11);
	height: calc((100vw / 375) * 11);
	position: absolute;
	top: 51%;
	right: calc((100vw / 375) * 16);
	transform: translateY(-50%);
	transition: all .6s ease;
}
@media screen and (min-width: 1024px) {
	#forsalon-sec .agent .agent-list .address .site::before {
		width: 11px;
		height: 11px;
		right: 18px;
	}
	#forsalon-sec .agent .agent-list .address .site:hover::before {
		background: url(../common_img/arrow_up_black.svg) center center / cover no-repeat;
	}
}


/* ========== index INDEX BOX(indexbox) ========== */
#indexbox {
	background-color: #f1f6f6;
	padding-top: calc((100vw / 375) * 45);
	padding-bottom: calc((100vw / 375) * 50);
}
@media screen and (min-width: 1024px) {
	#indexbox {
		padding-top: 80px;
		padding-bottom: 130px;
	}
}

#indexbox .title {
	font-size: calc((100vw / 375) * 26);
	text-align: center;
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#indexbox .title {
		font-size: 3.0rem;
		margin-bottom: 30px;
	}
}

#indexbox .list {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	gap: calc((100vw / 375) * 5);
}
@media screen and (min-width: 1024px) {
	#indexbox .list {
		gap: 20px 50px;
	}
}

#indexbox .list li {
	width: calc((100% - calc((100vw / 375) * 5)) / 2);
}
@media screen and (min-width: 1024px) {
	#indexbox .list li {
		width: calc((100% - 100px) / 3);
	}
}

#indexbox .list li a {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	padding: calc((100vw / 375) * 10);
	min-height: calc((100vw / 375) * 120);
}
@media screen and (min-width: 1024px) {
	#indexbox .list li a {
		border-radius: 10px;
		padding: 35px 30px;
		min-height: 0;
		max-height: 130px;
	}
}

#indexbox .list h3 {
	font-size: calc((100vw / 375) * 16);
}
@media screen and (min-width: 1024px) {
	#indexbox .list h3 {
		font-size: 1.8rem;
	}
}

#indexbox .list .txt {
	font-size: calc((100vw / 375) * 12);
	line-height: 1.6;
	margin-top: calc((100vw / 375) * 3);
	width: calc((100vw / 375) * 105);
}
@media screen and (min-width: 1024px) {
	#indexbox .list .txt {
		font-size: 1.6rem;
		line-height: 1.8;
		margin-top: 5px;
		width: 85%;
	}
}

#indexbox .list .i-circle {
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 8);
	transform: translateY(-50%) rotate(90deg);
	display: block;
	background: url(../common_img/btn_black.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 35);
	height: calc((100vw / 375) * 35);
}
@media screen and (min-width: 1024px) {
	#indexbox .list .i-circle {
		width: 50px;
		height: 50px;
	}
	#indexbox .list li:hover .i-circle {
		opacity: 1;
		background: url(../common_img/btn_clear.svg) center center / cover no-repeat;
	}
}


/* ========== index SEARCH BOX(searchbox) ========== */
#searchbox {
	margin: 0 auto;
}
@media screen and (min-width: 1024px) {
	#searchbox {
		width: 100%;
		padding: 0 40px;
	}
}
@media screen and (min-width: 1650px) {
	#searchbox {
		width: 1400px;
		padding: 0;
	}
}

#searchbox .titlebox {
	position: relative;
	padding-bottom: calc((100vw / 375) * 25);
	border-bottom: 1px solid #d5dcdb;
}
@media screen and (min-width: 1024px) {
	#searchbox .titlebox {
		padding-bottom: 30px;
		cursor: pointer;
	}
}

#searchbox .link-txt {
	display: block;
	text-align: center;
	width: max-content;
	margin: 0 auto;
}
@media screen and (min-width: 1024px) {
	#searchbox .link-txt {
		margin-top: 5px;
	}
}

#searchbox .titlebox .search-toggle {
	width: calc((100vw / 375) * 44);
	height: calc((100vw / 375) * 44);
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}
@media screen and (min-width: 1024px) {
	#searchbox .titlebox .search-toggle {
		width: 50px;
		height: 50px;
		cursor: pointer;
	}
}

#searchbox .titlebox .search-toggle::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}
@media screen and (min-width: 1024px) {
	#searchbox .titlebox .search-toggle::before {
		width: 19px;
		height: 1px;
		top: 52%;
		right: 20px;
	}
}

#searchbox .titlebox .search-toggle::after {
	content: '';
	display: block;
	width: calc((100vw / 375) * 25);
	height: calc((100vw / 375) * 1);
	background-color: #9fadac;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%) rotate(90deg);
}
#searchbox .titlebox .search-toggle.is-open::after {
	visibility: hidden;
}
@media screen and (min-width: 1024px) {
	#searchbox .titlebox .search-toggle::after {
		width: 19px;
		height: 1px;
		top: 52%;
		right: 20px;
	}
}

#searchbox .titlebox .search-toggle.is-open::after {
	visibility: hidden;
}

#searchbox .titlebox h2 {
	font-size: calc((100vw / 375) * 28);
	text-align: center;
}
@media screen and (min-width: 1024px) {
	#searchbox .titlebox h2 {
		font-size: 3.0rem;
	}
}

#searchbox .contents .toggle-wrap {
	width: 100%;
	margin: 0 auto;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .toggle-wrap {
		width: 1200px;
		margin: 0 auto;
	}
}

#searchbox .contents .menu-table tr {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: calc((100vw / 375) * 10);
	border-bottom: 1px solid #d5dcdb;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table tr {
		flex-direction: row;
		align-items: center;
		gap: 20px;
	}
}

#searchbox .contents .menu-table tr th {
	font-size: calc((100vw / 375) * 16);
	padding: calc((100vw / 375) * 28) 0 0 0;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table tr th {
		font-size: 1.6rem;
		line-height: 60px;
		padding: 30px 0;
		width: 190px;
	}
}

#searchbox .contents .menu-table tr td {
	padding: 0 0 calc((100vw / 375) * 28) 0;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table tr td {
		line-height: 60px;
		padding: 30px 0;
		width: 100%;
	}
}

#searchbox .contents .menu-table select {
	position: relative;
	appearance: none;
	width: 100%;	
	border: 1px solid #ddd;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 5);
	color: #1c1c1c;
	padding: calc((100vw / 375) * 12) calc((100vw / 375) * 10);
	font-size: calc((100vw / 375) * 16);
	letter-spacing: 0.05rem;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table select {
		width: 100%;	
		height: 60px;
		border-radius: 10px;
		padding: 0 20px;
		font-size: 1.6rem;
	}
}

#searchbox .contents .menu-table .selectwrap {
	position: relative;
}

#searchbox .contents .menu-table .selectwrap::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 16);
	height: calc((100vw / 375) * 9);
	background: url(../common_img/icon_arrow.svg) center center / cover no-repeat;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 15);
	transform: translateY(-50%);
	z-index: 1;
	pointer-events: none;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table .selectwrap::before {
		width: 16px;
		height: 9px;
		position: absolute;
		right: 20px;
	}
}

#searchbox .contents .menu-table input {
	position: relative;
	appearance: none;
	width: 100%;	
	height: calc((100vw / 375) * 50);
	border: 1px solid #ddd;
	border-radius: calc((100vw / 375) * 5);
	color: #1c1c1c;
	padding: calc((100vw / 375) * 12) calc((100vw / 375) * 10);
	font-size: calc((100vw / 375) * 16);
	letter-spacing: 0.05rem;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table input {
		width: 100%;	
		height: 60px;
		padding: 0 20px;
		border-radius: 10px;
		font-size: 1.6rem;
		letter-spacing: 0.05rem;
	}
}

#searchbox .contents .menu-table .s-box {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: calc((100vw / 375) * 5);
	flex-wrap: wrap;
	width: 100%;	
	height: auto;
	border: 1px solid #ddd;
	border-radius: calc((100vw / 375) * 5);
	padding: calc((100vw / 375) * 6) calc((100vw / 375) * 40) calc((100vw / 375) * 6) calc((100vw / 375) * 10);
	background-color: #fff;
	min-height: calc((100vw / 375) * 49);
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table .s-box {
		gap: 10px;
		width: 100%;
		border-radius: 10px;
		padding: 10.5px 20px;
		min-height: 60px;
	}
}

#searchbox .contents .menu-table .s-box::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 16);
	height: calc((100vw / 375) * 9);
	background: url(../common_img/icon_arrow.svg) center center / cover no-repeat;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 15);
	transform: translateY(-50%);
	z-index: 1;
	pointer-events: none;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table .s-box::before {
		width: 16px;
		height: 9px;
		right: 20px;
	}
}

#searchbox .contents .menu-table .s-box .checktxt {
	font-weight: 500;
	line-height: 1;
	color: #fff;
	background-color: #000;
	border-radius: 20px;
	white-space: nowrap;
	padding: calc((100vw / 375) * 10) calc((100vw / 375) * 20) calc((100vw / 375) * 11) calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table .s-box .checktxt {
		border-radius: 20px;
		padding: 10px 19px 11px 19px;
	}
}

#searchbox .contents .menu-table .s-box .checktxt .icon {
	display: inline-block;
	background: url(../common_img/icon_close_white.svg) center center / cover no-repeat;
	width: calc((100vw / 375) * 12);
	height: calc((100vw / 375) * 12);
	margin-left: calc((100vw / 375) * 6);
	display: inline-block;
	position: relative;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .menu-table .s-box .checktxt .icon {
		width: 14px;
		height: 14px;
		margin-left: 8px;
		top: 1px;
		cursor: pointer;
	}
}

#searchbox .contents .s-submit .submitbtn {
	position: relative;
	display: block;
	color: #000;
	font-size: calc((100vw / 375) * 22);
	text-align: center;
	letter-spacing: 0.1rem;
	width: calc((100vw / 375) * 285);
	margin: calc((100vw / 375) * 30) auto 0;
	background-color: #fff;
	border: none;
	border-radius: calc((100vw / 375) * 30);
	padding: calc((100vw / 375) * 15) 0;
	transition: all .6s ease;
}
#searchbox .contents .s-submit .submitbtn::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 24);
	height: calc((100vw / 375) * 24);
	background: url(../common_img/icon_search.svg) center center / cover no-repeat;
	position: absolute;
	top: 50%;
	right: calc((100vw / 375) * 60);
	transform: translateY(-50%);
	z-index: 1;
	pointer-events: none;
	transition: all .6s ease;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .s-submit .submitbtn {
		font-size: 2.2rem;
		width: 300px;
		margin: 40px auto 0;
		border-radius: 30px;
		padding: 16px 0;
		cursor: pointer;
	}
	#searchbox .contents .s-submit .submitbtn::before {
		width: 23px;
		height: 24px;
		right: 20px;
	}
	#searchbox .contents .s-submit .submitbtn:hover {
		color: #fff;
		background-color: #000;
	}
	#searchbox .contents .s-submit .submitbtn:hover::before {
		background: url(../common_img/icon_search_white.svg) center center / cover no-repeat;
	}
}

#searchbox .contents .s-reset {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	text-align: center;
	width: calc((100vw / 375) * 208);
	margin: calc((100vw / 375) * 18) auto 0;
	border: 1px solid #000;
	border-radius: calc((100vw / 375) * 20);
	padding: calc((100vw / 375) * 6) 0;
	transition: all .6s ease;
}
#searchbox .contents .s-reset .icon {
	content: '';
	display: inline-block;
	width: calc((100vw / 375) * 14);
	height: calc((100vw / 375) * 14);
	background: url(../common_img/icon_close.svg) center center / cover no-repeat;
	position: relative;
	top: calc((100vw / 375) * 1);
	z-index: 1;
	pointer-events: none;
	margin-right: calc((100vw / 375) * 5);
	transition: all .6s ease;
}
@media screen and (min-width: 1024px) {
	#searchbox .contents .s-reset {
		font-size: 1.5rem;
		width: 220px;
		margin: 25px auto 0;
		border-radius: 20px;
		padding: 6px 0;
		cursor: pointer;
	}
	#searchbox .contents .s-reset .icon {
		width: 14px;
		height: 14px;
		top: 1px;
		margin-right: 5px;
	}
	#searchbox .contents .s-reset:hover {
		color: #fff;
		background-color: #000;
	}
	#searchbox .contents .s-reset:hover .icon {
		background: url(../common_img/icon_close_white.svg) center center / cover no-repeat;
	}
}


/* ========== index PAGENAVI(page-box) ========== */
#page-box {
	display: block;
	padding-top: calc((100vw / 375) * 55);
  margin: 0 auto;
}
@media screen and (min-width: 1024px) {
	#page-box {
		padding-top: 120px;
	}
}

#page-box .nav-links {
	position: relative;
	display: flex;
	gap: calc((100vw / 375) * 18);
	justify-content: center;
	font-size: calc((100vw / 375) * 15);
	font-weight: 600;
	width: fit-content;
	margin: 0 auto;
}
@media screen and (min-width: 1024px) {
	#page-box .nav-links {
		display: flex;
		gap: 35px;
		justify-content: center;
		font-size: 1.7rem;
		font-weight: 600;
	}
}

#page-box .nav-links .page-numbers {
	font-size: calc((100vw / 375) * 18);
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc((100vw / 375) * 50);
	height: calc((100vw / 375) * 50);
	border-radius: 50%;
	border: 1px solid transparent;
}
@media screen and (min-width: 1024px) {
	#page-box .nav-links .page-numbers {
		font-size: 1.7rem;
		width: 50px;
		height: 50px;
	}
	#page-box .nav-links a.page-numbers:hover {
		border: 1px solid #1c1c1c;
	}
}

#page-box .nav-links .page-numbers.current {
	border: 1px solid #1c1c1c;
}

#page-box .nav-links .page-numbers.left,
#page-box .nav-links .page-numbers.right {
	position: absolute;
	background-color: #1c1c1c;
}
#page-box .nav-links .page-numbers.left { left: calc((100vw / 375) * -65); }
#page-box .nav-links .page-numbers.right { right: calc((100vw / 375) * -65); }
@media screen and (min-width: 1024px) {
	#page-box .nav-links .page-numbers.left { left: -90px; }
	#page-box .nav-links .page-numbers.right { right: -90px; }
}

#page-box .nav-links .page-numbers.left::before,
#page-box .nav-links .page-numbers.right::before {
	content: '';
	display: block;
	width: 16px;
	height: 10px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#page-box .nav-links .page-numbers.left::before { background: url(../common_img/page_left.svg) center center / cover no-repeat; }
#page-box .nav-links .page-numbers.right::before { background: url(../common_img/page_right.svg) center center / cover no-repeat; }
@media screen and (min-width: 1024px) {
	#page-box .nav-links .page-numbers.left::before,
	#page-box .nav-links .page-numbers.right::before {		
		width: 16px;
		height: 10px;
		transition: opacity .7s ease;
	}
	#page-box .nav-links .page-numbers.left:hover::before,
	#page-box .nav-links .page-numbers.right:hover::before {
		opacity: .6;
	}
}

/* ========== index CTA(cta-contact) ========== */
.cta-contact {
	position: relative;
	background: #fff;
}

.cta-contact .txt {
	font-size: calc((100vw / 375) * 15);
	line-height: 2.0;
	text-align: center;
	padding-top: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	.cta-contact .txt {
		font-size: 1.6rem;
		padding-top: 165px;
	}
}

.cta-contact .btn01 {
	font-size: calc((100vw / 375) * 42);
	letter-spacing: 0.3rem;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	padding-top: calc((100vw / 375) * 16);
	padding-right: 0;
	margin-bottom: calc((100vw / 375) * 60);
}
@media screen and (min-width: 1024px) {
	.cta-contact .btn01 {
		font-size: 12.0rem;
		letter-spacing: 0.6rem;
		width: 800px;
		margin: 0 auto;
		padding-top: 10px;
		padding-right: 0;
		margin-bottom: 170px;
	}
}

.cta-contact .btn01 .i-circle {
	position: relative;
	display: inline-block;
	width: calc((100vw / 375) * 50);
	height: calc((100vw / 375) * 50);
	top: auto;
	transform: none;
	margin-left: calc((100vw / 375) * 8);
}
@media screen and (min-width: 1024px) {
	.cta-contact .btn01 .i-circle {
		width: 70px;
		height: 70px;
		top: auto;
		transform: none;
		margin-left: 20px;
	}
}

.cta-contact .bg {
	position: relative;
	height: calc((100vw / 375) * 235);
	background: url(../common_img/f_bg_sp.jpg) center center / cover no-repeat;
}
@media screen and (min-width: 1024px) {
	.cta-contact .bg {
		position: relative;
		height: 800px;
		background: url(../common_img/f_bg.jpg) center center / cover no-repeat;
	}
}

.cta-contact .bg .container {
	height: calc((100vw / 375) * 235);
}
@media screen and (min-width: 1024px) {
	.cta-contact .bg .container {
		height: 800px;
	}
}

.cta-contact .bg img {
	position: absolute;
	left: calc((100vw / 375) * 20);
	bottom: calc((100vw / 375) * 28);
	width: calc((100vw / 375) * 147);
}
@media screen and (min-width: 1024px) {
	.cta-contact .bg img {
		left: 200px;
		bottom: 90px;
		width: auto;
	}
}

.cta-contact .bg .en {
	font-size: calc((100vw / 375) * 11);
	font-weight: 200;
	color: #fff;
	position: absolute;
	top: calc((100vw / 375) * 142);
	right: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	.cta-contact .bg .en {
		font-size: 2.0rem;
		top: 50%;
		right: 17%;
		transform: translateY(-50%);
	}
}


/* ========== index CONTACT(#contact) ========== */
#contact {
	background-color: #f1f6f6;
}

#contact .contact-form .inner {
	position: relative;
	padding: calc((100vw / 375) * 40) 0 calc((100vw / 375) * 20);
	z-index: 10;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .inner{
    padding: 140px 20px 120px 20px;
		max-width: 1240px;
		width: auto;
		margin: 0 auto;
	}
}

#contact .contact-form .step {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: calc((100vw / 375) * 18);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .step {
    margin-bottom: 65px;
	}
}


#contact .contact-form .step::before {

	
}
@media screen and (min-width:1024px) {

}

#contact .contact-form .step li {
	position: relative;
	padding-bottom: calc((100vw / 375) * 15);
	border-bottom: 1px solid #d5dcdb;
	width: 33.3%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	z-index: 10;
}
#contact .contact-form .step li.is-active::before {
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0px 7px 12px 7px;
	border-color: transparent transparent #1c1c1c transparent;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .step li {
		padding-top: 10px;
		padding-bottom: 20px;
		width: 33.3%;
	}
	#contact .contact-form .step li.is-active::before {
		border-width: 0px 7px 12px 7px;
	}
}

#contact .contact-form .step li.is-active {
	border-bottom: 2px solid #1c1c1c;
}

#contact .contact-form .step li p {
	text-align: center;
	color: #9f9f9f;
	font-weight: bold;
}
#contact .contact-form .step li.is-active p {
	color: #1c1c1c;
}
#contact .contact-form .step li p:nth-of-type(1) {
	display: inline-block;
	font-size: calc((100vw / 375) * 15);
	line-height: 1.2;
}
#contact .contact-form .step li p:nth-of-type(1) .num {
	display: inline-block;
	position: relative;
	font-size: calc((100vw / 375) * 22);
	padding-left: calc((100vw / 375) * 5);
	top: calc((100vw / 375) * 2);
}
#contact .contact-form .step li p:nth-of-type(2) {
	font-size: calc((100vw / 375) * 14);
	letter-spacing: 0.05rem;
	line-height: 1.2;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .step li p:nth-of-type(1) {
		font-size: 2.2rem;
	}
	#contact .contact-form .step li p:nth-of-type(1) .num {
		font-size: 2.8rem;
		padding-left: 5px;
		top: 2px;
	}
	#contact .contact-form .step li p:nth-of-type(2) {
		font-size: 1.6rem;
		line-height: 1.8;
	}
}

#contact .contact-form .contact-main .main-wrap h2 {
	font-size: calc((100vw / 375) * 19);
	padding-top: calc((100vw / 375) * 10);
	padding-bottom: calc((100vw / 375) * 15);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-main .main-wrap h2 {
		font-size: 24px;
		letter-spacing: 3px;
		padding-top: 20px;
		padding-left: 55px;
		padding-bottom: 38px;
	}
}

#contact .contact-form li {
	list-style: none;
}

#contact .contact-form .contact-main .lead {
	font-size: calc((100vw / 375) * 15);
	font-weight: 400;
	margin-bottom: calc((100vw / 375) * 20);
	color: #1c1c1c;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-main .lead {
		font-size: 16px;
		padding-left: 0;
		margin-bottom: 25px;
	}
}

#contact .contact-form .contact-main .sublead {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	font-weight: 400;
	margin-bottom: calc((100vw / 375) * 20);
	color: #1c1c1c;
}
#contact .contact-form .contact-main .sublead .icon {
	display: inline-block;
	width: calc((100vw / 375) * 8);
	height: calc((100vw / 375) * 8);
	background-color: #d54d85;
	border-radius: 50%;
	margin-right: calc((100vw / 375) * 4);
	position: relative;
	top: calc((100vw / 375) * -1);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-main .sublead {
		font-size: 16px;
		padding-left: 0;
		margin-bottom: 30px;
	}
	#contact .contact-form .contact-main .sublead .icon {
		width: 10px;
		height: 10px;
		margin-right: 5px;
		top: -1px;
	}
}

#contact .contact-form .contact-sub {
	background-color: #fff;
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 10px;
}
#contact .contact-form .contact-sub p {
	font-size: 12px;
	line-height: 1.6;
	letter-spacing: 0;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-sub {
		border-radius: 20px;
		padding: 50px;
	}
	#contact .contact-form .contact-sub p {
		font-size: 16px;
		line-height: 1.8;
		letter-spacing: 1px;
	}
}

#contact .contact-form .form-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: calc((100vw / 375) * 18);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table {
		margin-bottom: 70px;
	}
}

#contact .contact-form .form-table tr {
	border-bottom: 1px solid #c8cccd;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}
#contact .contact-form .form-table tr.no-bottom {
	border-bottom: none;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table tr {
		flex-direction: row;
	}
}

#contact .contact-form .form-table th {
	padding: 50px 20px 50px 0;
	position: relative;
}

#contact .contact-form .form-table th,
#contact .contact-form .form-table td {
	vertical-align: top;
	text-align: left;
	box-sizing: border-box;
}

#contact .contact-form .form-table th {
	display: block;
	color: #1c1c1c;
	font-size: calc((100vw / 375) * 16);
	font-weight: 600;
	letter-spacing: 1px;
	padding: calc((100vw / 375) * 18) 0 0 0;
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th {
		font-size: 1.6rem;
		display: table-cell;
		padding: 46px 20px 30px 20px;
		width: 200px;
	}
	#contact .contact-form .form-table tr.no-bottom th,
	#contact .contact-form .form-table tr.no-bottom th.must,
	#contact .contact-form .form-table tr.no-bottom td,
	#contact .contact-form .form-table tr.no-bottom td.must {
		padding-bottom: 0;
	}
}

#contact .contact-form .form-table td {
	display: block;
	border-bottom: none;
	padding: calc((100vw / 375) * 15) 0;
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table td {
		display: table-cell;
		padding: 30px 0;
		width: calc(100% - 200px);
	}
}

#contact .contact-form .form-table td > p {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	font-weight: 400;
	letter-spacing: 0;
	color: #464646;
	padding-top: 8px;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table td > p {
		font-size: 1.6rem;
		font-weight: 500;
		padding-top: 16px;
	}
}

#contact .contact-form .form-table th.must::before {
	content: '';
	width: calc((100vw / 375) * 8);
	height: calc((100vw / 375) * 8);
	background-color: #d54d85;
	border-radius: 50%;
	position: absolute;
	top: calc((100vw / 375) * 29);
	left: calc((100vw / 375) * -11);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th.must::before {
		width: 10px;
		height: 10px;
		border-radius: 50%;
		top: 56px;
		left: 0;
	}
}

#contact .contact-form .form-table th .sub-text,
#contact .contact-form .form-table td .sub-text {
	font-size: calc((100vw / 375) * 11);
	font-weight: 500;
	padding-top: calc((100vw / 375) * 10);
}
#contact .contact-form .form-table th.must .sub-text {
	margin-left: calc((100vw / 375) * -44);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th .sub-text,
	#contact .contact-form .form-table td .sub-text,
	#contact .contact-form .form-table th.must .sub-text {
		font-size: 1.2rem;
		padding-top: 8px;
		margin-left: 0;
	}
}

#contact .contact-form .form-table th .sub-text-lg,
#contact .contact-form .form-table td .sub-text-lg {
	font-size: calc((100vw / 375) * 12);
	font-weight: 500;
	padding-top: calc((100vw / 375) * 6);
}
#contact .contact-form .form-table th.must .sub-text-lg {
	margin-left: calc((100vw / 375) * -44);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th .sub-text-lg,
	#contact .contact-form .form-table th.must .sub-text-lg,
	#contact .contact-form .form-table td .sub-text-lg {
		font-size: 16px;
		padding-top: 10px;
		margin-left: 0;
	}
}

#contact .contact-form .form-table th .sub-text-lg + .sub-text {
	padding-top: calc((100vw / 375) * 3);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .form-table th .sub-text-lg + .sub-text {
		padding-top: 6px;
	}
}

#contact .contact-form .checkbox {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 10px;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox {
		flex-wrap: nowrap;
		gap: 20px;
	}
}

#contact .contact-form .checkbox li {
	width: calc((100vw / 375) * 245);
}
#contact .contact-form .checkbox.ch-kakunin li {
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox li,
	#contact .contact-form .checkbox.ch-kakunin li {
		width: auto;
	}
}

#contact .contact-form .checkbox .checkbox-input input {
	display: none;
}

#contact .contact-form .checkbox .checkbox-input .checkbox-text {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	color: #1c1c1c;
	padding: calc((100vw / 375) * 10) 0 calc((100vw / 375) * 10) calc((100vw / 375) * 48);
	line-height: calc((100vw / 375) * 30);
	display: block;
	border-radius: calc((100vw / 375) * 8);
	background-color: #fff;
	transition-duration: 0.3s;
}
#contact .contact-form .checkbox .checkbox-input.mfp_checked .checkbox-text {
	color: #fff;
	background-color: #1c1c1c;
}
#contact .contact-form .checkbox.ch-kakunin .checkbox-input .checkbox-text {
	padding-left: calc((100vw / 375) * 23);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox .checkbox-input .checkbox-text {
		font-size: 1.6rem;
		padding: 0 20px 0 54px;
		line-height: 58px;
		border-radius: 10px;
	}
	#contact .contact-form .checkbox.ch-kakunin .checkbox-input .checkbox-text {
		padding-left: 40px;
	}
}

#contact .contact-form .checkbox .checkbox-input .checkbox-text::before {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: calc((100vw / 375) * 11);
	width: calc((100vw / 375) * 28);
	height: calc((100vw / 375) * 28);
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: calc((100vw / 375) * 6);
	transform: translateY(-50%);
	transition: all .3s ease;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox .checkbox-input .checkbox-text::before {
		left: 10px;
		width: 34px;
		height: 34px;
		border-radius: 6px;
	}
	#contact .contact-form .checkbox .checkbox-input.mfp_checked .checkbox-text::before {
		border: 1px solid #000;
	}
}

#contact .contact-form .checkbox .checkbox-input.mfp_checked .checkbox-text::after {
	content: "";
	display: block;
	position: absolute;
	top: 46%;
	left: calc((100vw / 375) * 21);
	width: calc((100vw / 375) * 9);
	height: calc((100vw / 375) * 14);
	transform: translateY(-50%) rotate(40deg);
	border-bottom: calc((100vw / 375) * 2) solid #000;
	border-right: calc((100vw / 375) * 2) solid #000;
	transition: all .3s ease;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .checkbox .checkbox-input.mfp_checked .checkbox-text::after {
    border-bottom: 2px solid #000;
    border-right: 2px solid #000;
    width: 11px;
    height: 19px;
    top: 46%;
    left: 21px;
	}
}

#contact .contact-form form#mailformpro .checkbox .checkbox-input {
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form form#mailformpro .checkbox .checkbox-input  {
		width: auto;
	}
}

#contact .contact-form .radiobox {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: calc((100vw / 375) * 10);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .radiobox {
		flex-wrap: nowrap;
		flex-direction: row;
		gap: 20px;
	}
}

#contact .contact-form .radiobox li {
	width: calc((100% - calc((100vw / 375) * 10)) / 2);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .radiobox li {
		width: auto;
	}
}

#contact .contact-form .radiobox-input input {
	display: none;
}

#contact .contact-form .radiobox-input .radiobox-text {
	position: relative;
	font-size: calc((100vw / 375) * 15);
	color: #1c1c1c;
	line-height: calc((100vw / 375) * 35);
	padding: calc((100vw / 375) * 10) 0 calc((100vw / 375) * 10) calc((100vw / 375) * 48);
	display: block;
	transition-duration: 0.3s;
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
}
#contact .contact-form .radiobox-input.mfp_checked .radiobox-text {
	background-color: #000;
	color: #fff
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .radiobox-input .radiobox-text {
		font-size: 1.6rem;
		padding: 0 25px 0 54px;
		line-height: 58px;
		border-radius: 10px;
	}
}

#contact .contact-form .radiobox-input .radiobox-text::before {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: calc((100vw / 375) * 10);
	width: calc((100vw / 375) * 30);
	height: calc((100vw / 375) * 30);
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 50%;
	transform: translateY(-50%);
}
#contact .contact-form .radiobox-input.mfp_checked .radiobox-text::after {
	content: "";
	display: block;
	position: absolute;
	top: calc((100vw / 375) * 19.5);
	left: calc((100vw / 375) * 17);
	width: calc((100vw / 375) * 16);
	height: calc((100vw / 375) * 16);
	background-color: #000;
	border-radius: 50%;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .radiobox-input .radiobox-text::before {
		top: 50%;
		left: 10px;
		width: 34px;
		height: 34px;
	}
	#contact .contact-form .radiobox-input.mfp_checked .radiobox-text::before {
		border: 1px solid #000;
	}
	#contact .contact-form .radiobox-input.mfp_checked .radiobox-text::after {
		top: 21px;
		left: 19px;
		width: 16px;
		height: 16px;
	}
}

#contact .contact-form form#mailformpro .radiobox-input {
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form form#mailformpro .radiobox-input  {
		width: auto;
	}
}

#contact .contact-form .address-wrap {
	position: relative;
	padding-bottom: 0;
}
#contact .contact-form .address-wrap .address-icon {
	position: absolute;
	top: calc((100vw / 375) * 12);
	left: calc((100vw / 375) * 4);
}
#contact .contact-form .address-wrap .address-input {
	width: calc((100vw / 375) * 120) !important;
  margin-left: calc((100vw / 375) * 25);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .address-wrap {
		padding-bottom: 20px;
	}
	#contact .contact-form .address-wrap .address-icon {
		top: 20px;
		left: -30px;
	}
	#contact .contact-form .address-wrap .address-input {
		width: 180px !important;
		margin-left: 0;
	}
}

#contact .contact-form .selectbox-wrap {
	position: relative;
}

#contact .contact-form .selectbox-wrap::after {
	content: "";
	display: block;
	position: absolute;
	top: calc((100vw / 375) * 28);
	right: calc((100vw / 375) * 15);
	width: calc((100vw / 375) * 10);
	height: calc((100vw / 375) * 10);
	transform: rotate(45deg);
	border-bottom: calc((100vw / 375) * 1) solid #1c1c1c;
	border-right: calc((100vw / 375) * 1) solid #1c1c1c;
}
@media screen and (min-width: 1280px) {
	#contact .contact-form .selectbox-wrap::after {
    border-bottom: 2px solid #1c1c1c;
    border-right: 2px solid #1c1c1c;
    width: 15px;
    height: 15px;
    top: 37px;
    right: 76px;
	}
}


#contact .contact-form textarea,
#contact .contact-form input[type="text"],
#contact .contact-form input[type="tel"],
#contact .contact-form input[type="email"],
#contact .contact-form select {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-weight: 500;
	font-size: calc((100vw / 375) * 15);
	color: #1c1c1c;
	border: none;
	border-radius: 0;
	background: #FFF;
	width: 100% !important;
	box-sizing: border-box;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	border: 1px #ddd solid;
}
@media screen and (min-width:1024px) {
	#contact .contact-form input[type="text"],
	#contact .contact-form input[type="tel"],
	#contact .contact-form input[type="email"],
	#contact .contact-form select {
		font-size: 1.6rem;
	}
	#contact .contact-form textarea {
		font-size: 1.6rem;
	}
}

#contact .contact-form input[type="text"],
#contact .contact-form input[type="tel"],
#contact .contact-form input[type="email"],
#contact .contact-form select {
	line-height: calc((100vw / 375) * 45);
	height: calc((100vw / 375) * 45);
	padding: 0 calc((100vw / 375) * 15);
	background-color: #fff;
	border-radius: calc((100vw / 375) * 8);
	border: 1px solid #c8cccd;
	margin-bottom: calc((100vw / 375) * 8);
}
@media screen and (min-width:1024px) {
	#contact .contact-form input[type="text"],
	#contact .contact-form input[type="tel"],
	#contact .contact-form input[type="email"],
	#contact .contact-form select {
		line-height: 60px;
		height: 58px;
		padding: 0 20px;
		margin-bottom: 0;
		border-radius: 10px;
	}
}

#contact .contact-form input[type="text"] + p,
#contact .contact-form input[type="tel"] + p,
#contact .contact-form input[type="email"] + p {
	height: 68px;
	padding-top: 16px;
}

#contact .contact-form textarea {
	height: calc((100vw / 375) * 120) !important;
	padding: 12px;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: calc((100vw / 375) * 8);
}
#contact .contact-form textarea.textarea-small {
	height: 80px !important;
}
@media screen and (min-width:1024px) {
	#contact .contact-form textarea {
		height: 260px !important;
		padding: 15px 20px;
		border-radius: 10px;
	}
	#contact .contact-form textarea.textarea-small {
		height: 120px !important;
	}
}

#contact .contact-form textarea::placeholder,
#contact .contact-form input[type="text"]::placeholder,
#contact .contact-form input[type="tel"]::placeholder,
#contact .contact-form input[type="email"]::placeholder {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: calc((100vw / 375) * 13);
	font-weight: 500;
	line-height: 1.6;
	color: rgb(33 59 76 / 40%);
}
@media screen and (min-width:1024px) {
	#contact .contact-form textarea::placeholder,
	#contact .contact-form input[type="text"]::placeholder,
	#contact .contact-form input[type="tel"]::placeholder,
	#contact .contact-form input[type="email"]::placeholder {
		font-size: 1.6rem;
	}
}

#contact .contact-form div.mfp_err {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: calc((100vw / 375) * 13);
	color: #d54d85;
	position: relative;
}
@media screen and (min-width:1024px) {
	#contact .contact-form div.mfp_err {
		font-size: 1.6rem;
		line-height: 2;
		top: 10px;
	}
}

#contact .contact-form .contact-box {
	position: relative;
	padding: calc((100vw / 375) * 30) calc((100vw / 375) * 20);
	margin-top: calc((100vw / 375) * 25);
	border-radius: calc((100vw / 375) * 8);
	background-color: #fff;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-box {
    padding: 50px 100px;
    margin: 0 auto;
		border-radius: 10px;
	}
}

#contact .contact-form .contact-box h2 {
	font-size: calc((100vw / 375) * 21);
	font-weight: bold;
	color: #1c1c1c;
	text-align: left;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box h2 {
		font-size: 2.0rem;
	}
}

#contact .contact-form .contact-box p {
	font-size: calc((100vw / 375) * 15);
	font-weight: 400;
	line-height: 1.9;
	letter-spacing: 0.1rem;
	color: #1c1c1c;
	padding-top: calc((100vw / 375) * 15);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box p {
		font-size: 1.6rem;
		padding-top: 10px;
	}
}

#contact .contact-form .contact-box + .contact-box {
	margin-top: calc((100vw / 375) * 25);
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box + .contact-box {
		margin-top: 40px;
	}
}

#contact .contact-form .contact-box .btn02 {
	display: inline-block;
	margin-top: calc((100vw / 375) * 15);
	padding: calc((100vw / 375) * 15) calc((100vw / 375) * 12);
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form .contact-box .btn02 {
		margin-top: 15px;
		padding: 14px 39px 14px 25px;
		width: auto;
	}
}

#contact .contact-form .contact-submit button {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
	font-size: calc((100vw / 375) * 15);
	font-weight: 500;
	letter-spacing: 0.1rem;
	color: #fff;
	background-color: #d54d85;
	border: 1px solid #d54d85;
	text-align: center;
	border-radius: calc((100vw / 375) * 40);
	padding: calc((100vw / 375) * 12) 0;
	margin-top: calc((100vw / 375) * 30);
	transition: all .7s ease;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-submit button {
		width: 600px;
		font-size: 1.7rem;
		border-radius: 40px;
		padding: 15px 0;
		margin-top: 70px;
		cursor: pointer;
	}
	#contact .contact-form .contact-submit button:hover {
		background-color: #fff;
		color: #d54d85;
	}
}

#contact .contact-form .contact-submit button::after {
	content: '';
	display: inline-block;
	width: calc((100vw / 375) * 39);
	height: calc((100vw / 375) * 39);
	background: url(../common_img/btn_white_line.svg) center center / cover no-repeat;
	margin-left: calc((100vw / 375) * 10);
	transition: all .8s ease;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form .contact-submit button::after {
		width: 50px;
		height: 50px;
		margin-left: 10px;
	}
	#contact .contact-form .contact-submit button:hover::after {
		background: url(../common_img/btn_pink.svg) center center / cover no-repeat;
	}
}

#contact .contact-form #mfp_hidden {
	display: none;
}


/* CONTACT：確認 */
#contact .contact-form #mfp_phase_confirm {
	display: none;
	position: relative;
	padding-bottom: calc((100vw / 375) * 30);
	z-index: 10;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm {
		border-radius: 30px;
		padding: 0;
	}
}

@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner {
    display: block;
    max-width: 1200px;
    margin: 0 auto;
	}
}

#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner > h4 {
	display: none;
	font-size: calc((100vw / 375) * 16);
	padding-bottom: calc((100vw / 375) * 5);
	padding-left: calc((100vw / 375) * 10);
	letter-spacing: 0.2rem;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner > h4 {
		font-size: 28px;
    padding-bottom: 60px;
		padding-left: 0;
    letter-spacing: 4px;
	}
}

#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner .confirm_area {
	background-color: #f5f2f0;
	border-radius: 20px;
	padding: 28px 20px 52px 20px;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm #mfp_phase_confirm_inner .confirm_area {
		padding: 60px 50px;
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table {
	overflow: visible !important;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table {
		margin-bottom: 40px;
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table tr {
	border-bottom: 1px solid #c8cccd;
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th,
#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table td {
	vertical-align: top;
	text-align: left;
	box-sizing: border-box;
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	font-weight: 600;
	color: #1c1c1c;
	padding-top: calc((100vw / 375) * 20);
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th {
    font-size: 1.6rem;
    display: table-cell;
		padding: 30px 22px 30px 22px;
		width: 200px;
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th::before {
	content: '';
	width: calc((100vw / 375) * 8);
	height: calc((100vw / 375) * 8);
	background-color: #d54d85;
	border-radius: 50%;
	position: absolute;
	top: calc((100vw / 375) * 30);
	left: calc((100vw / 375) * -12);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table th::before {
		width: 10px;
		height: 10px;
		border-radius: 50%;
		top: 40px;
		left: 0;
	}
}

#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table td {
	position: relative;
	display: block;
	font-size: calc((100vw / 375) * 15);
	color: #1c1c1c;
	border-bottom: none;
	padding-top: calc((100vw / 375) * 8);
	padding-bottom: calc((100vw / 375) * 20);
	width: 100%;
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table td {
    display: table-cell;
		font-size: 1.6rem;
		letter-spacing: 0.1rem;
    padding: 30px 22px 30px 22px;
		width: auto;
	}
	#contact .contact-form #mfp_phase_confirm table#mfp_confirm_table td::before {
		content: '';
		display: block;
		width: 1px;
		height: -webkit-fill-available;
		background-color: #ddd;
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
	}
}

#contact .contact-form #mfp_phase_confirm #th_mfp_element_19,
#contact .contact-form #mfp_phase_confirm #td_mfp_element_19 {
	display: none !important;
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc((100vw / 375) * 15);
	margin-top: calc((100vw / 375) * 22);
	margin-bottom: calc((100vw / 375) * 20);
}
@media screen and (min-width:1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons {
		gap: 25px;
		margin-top: 0;
		margin-bottom: 0;
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
	font-size: calc((100vw / 375) * 15);
	font-weight: 400;
	letter-spacing: 0.1rem;
	color: #fff;
	background-color: #d54d85;
	border: 1px solid #d54d85;
	text-align: center;
	border-radius: calc((100vw / 375) * 40);
	padding: calc((100vw / 375) * 12) 0;
	margin-top: calc((100vw / 375) * 20);
	transition: all .7s ease;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send {
		width: 600px;
		font-size: 1.7rem;
		border-radius: 40px;
		padding: 15px 0;
		margin-top: 40px;
		cursor: pointer;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send:hover {
		background-color: #fff;
		color: #d54d85;
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send::after {
	content: '';
	display: inline-block;
	width: calc((100vw / 375) * 39);
	height: calc((100vw / 375) * 39);
	background: url(../common_img/btn_white_line.svg) center center / cover no-repeat;
	margin-left: calc((100vw / 375) * 10);
	transition: all .8s ease;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send::after {
		width: 50px;
		height: 50px;
		margin-left: 10px;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_send:hover::after {
		background: url(../common_img/btn_pink.svg) center center / cover no-repeat;
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
	font-size: calc((100vw / 375) * 15);
	font-weight: 400;
	letter-spacing: 0.1rem;
	color: #120606;
	border: 1px solid #120606;
	text-align: center;
	border-radius: calc((100vw / 375) * 40);
	padding: calc((100vw / 375) * 12) 0;
	transition: all .7s ease;
	background-color: #fff;
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel {
		width: 500px;
		font-size: 1.7rem;
		border-radius: 40px;
		padding: 16px 0;
		cursor: pointer;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel:hover {
		background-color: #120606;
		color: #fff;
	}
}

#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel::after {
	content: '';
	display: inline-block;
	width: calc((100vw / 375) * 11);
	height: calc((100vw / 375) * 11);
	background: url(../common_img/arrow_up_black.svg) center center / cover no-repeat;
	margin-left: calc((100vw / 375) * 10);
	transition: all .8s ease;
	transform: rotateY(180deg);
	position: relative;
	top: calc((100vw / 375) * 1);
}
@media screen and (min-width: 1024px) {
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel::after {
		width: 11px;
		height: 11px;
		margin-left: 10px;
		transform: rotateY(180deg);
		top: 1px;
	}
	#contact .contact-form #mfp_phase_confirm .mfp_buttons #mfp_button_cancel:hover::after {
		background: url(../common_img/arrow_up_white.svg) center center / cover no-repeat;
	}
}


/* CONTACT：完了 */
#contact.contact-comp .contact-form {
	height: calc(100vh - calc((100vw / 375) * 188));
}
@media screen and (min-width: 1024px) {
	#contact.contact-comp .contact-form {
		height: auto;
	}
}

#contact.contact-comp .contact-form .thanks-desc h2 {
	font-size: calc((100vw / 375) * 23);
	text-align: center;
  padding-top: calc((100vw / 375) * 30);
}
@media screen and (min-width: 1024px) {
	#contact.contact-comp .contact-form .thanks-desc h2 {
		font-size: 24px;
		padding-top: 0;
	}
}

#contact.contact-comp .contact-form .thanks-desc li {
	list-style: none;
}

#contact.contact-comp .contact-form .thanks-desc p {
	font-size: calc((100vw / 375) * 15);
	padding-top: calc((100vw / 375) * 18);
	line-height: 1.8;
}
@media screen and (min-width:1024px) {
	#contact.contact-comp .contact-form .thanks-desc p {
		font-size: 16px;
		padding-top: 28px;
		text-align: center;
	}
}

#contact.contact-comp .thanks-btn {
	display: flex;
	justify-content: center;
	flex-direction: row;
	margin-top: calc((100vw / 375) * 40);
}
@media screen and (min-width:1024px) {
	#contact.contact-comp .thanks-btn {
	  margin-top: 60px;
	}
}

/* #contact.contact-comp .thanks-btn a {
	position: relative;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: calc((100vw / 375) * 15);
	font-weight: bold;
	text-align: center;
	color: #fff;
	width: 100%;
	padding: 1.4em;
	margin: calc((100vw / 375) * 20) auto calc((100vw / 375) * 30);
  display: block;
	border: none;
	border-radius: 2px;
	background-color: #223b4b;
}
#contact.contact-comp .thanks-btn a::before {
	content: '';
	display: inline-block;
	position: absolute;
	width: calc((100vw / 375) * 15);
	height: calc((100vw / 375) * 10);
	top: 50%;
	right: calc((100vw / 375) * 103);
	background-size: cover;
	transform: translateY(-50%);
}
@media screen and (min-width:1024px) {
	#contact.contact-comp .thanks-btn a {
		font-size: 24px;
		width: 510px;
		padding: 32.5px 60px 32.5px 20px;
		margin: 45px auto 0;
		border-radius: 4px;
		cursor: pointer;
	}
	#contact.contact-comp .thanks-btn a::before {
		width: 25px;
		height: 18px;
		top: 50%;
		right: 165px;
		transform: translateY(-50%);
	}
	#contact.contact-comp .thanks-btn a:hover {
		filter: brightness(140%);
	}
} */

/* ========== VOICE SLIDE(.voice-swiper) ========== */
.voice-swiper {
	margin-top: calc((100vw / 375) * 100);
	margin-bottom: calc((100vw / 375) * 120);
}
@media screen and (min-width: 1024px) {
	.voice-swiper {
		margin-top: 200px;
		margin-bottom: 210px;
	}
}

.voice-swiper .item {
	position: relative;
	width: calc((100vw / 375) * 225);
	margin: 0 auto;
}
@media screen and (min-width: 1024px) {
	.voice-swiper .item {
		width: 400px;
	}
	.voice-swiper .item:hover a {
		opacity: .7;
	}
}

.voice-swiper .swiper-slide:nth-child(even) .item {
	top: calc((100vw / 375) * 20);
}
@media screen and (min-width: 1024px) {
	.voice-swiper .swiper-slide:nth-child(even) .item {
		top: 70px;
	}
}

.voice-swiper .item .img {
  padding-bottom: calc((100vw / 375) * 70);
}
@media screen and (min-width: 1024px) {
	.voice-swiper .item .img {
		padding-bottom: 42px;
	}
}

.voice-swiper .item .txt {
	position: absolute;
	bottom: 0;
	left: calc((100vw / 375) * -1);
	background: #fff;
	padding-top: calc((100vw / 375) * 20);
	padding-right: calc((100vw / 375) * 20);
	line-height: 2.0;
	width: calc((100vw / 375) * 182);
}
@media screen and (min-width: 1024px) {
	.voice-swiper .item .txt {
		left: -1px;
		padding-top: 30px;
		padding-right: 30px;
		width: 75%;
	}
}

.swiper-pagination.is-voice {
  bottom: calc((100vw / 375) * -86);
}
@media screen and (min-width: 1024px) {
	.swiper-pagination.is-voice {
		bottom: -170px;
	}
}

.swiper-pagination.is-voice .swiper-pagination-bullet {
	width: calc((100vw / 375) * 30);
	height: calc((100vw / 375) * 30);
	margin: 0 calc((100vw / 375) * 3);
	background-color: #fff;
	opacity: 1;
}
.swiper-pagination.is-voice .swiper-pagination-bullet::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 7);
	height: calc((100vw / 375) * 7);
	position: relative;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background-color: #bdbdbd;
}
@media screen and (min-width: 1024px) {
	.swiper-pagination.is-voice .swiper-pagination-bullet {
		width: 50px;
		height: 50px;
		margin: 0 10px;
	}
	.swiper-pagination.is-voice .swiper-pagination-bullet::before {
		width: 10px;
		height: 10px;
	}
}

.swiper-pagination.is-voice .swiper-pagination-bullet-active {
	border: 1px solid #1c1c1c;
}
.swiper-pagination.is-voice .swiper-pagination-bullet-active::before {
	content: '';
	display: block;
	width: calc((100vw / 375) * 7);
	height: calc((100vw / 375) * 7);
	position: relative;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background-color: #1c1c1c;
}
@media screen and (min-width: 1024px) {
	.swiper-pagination.is-voice .swiper-pagination-bullet-active::before {
		width: 10px;
		height: 10px;
	}
}

/* ========== COMMON PARTS ========== */
.posit_r { position:relative!important; }
.posit_a { position:absolute!important; }
.posit_f { position:fixed!important; }

.align_c { text-align:center!important; }
.align_r { text-align:right!important; }
.align_l { text-align:left!important; }

.disp_l { float:left!important; }
.disp_r { float:right!important; }

.va_top { vertical-align:top!important; }
.va_mid { vertical-align:middle!important; }
.va_btm { vertical-align:bottom!important; }
.va_sub { vertical-align:sub!important; }

/* ▼width▼ */
.w4per { width:4%; }
.w5per { width:5%; }
.w8per { width:8%; }
.w10per { width:10%; }
.w15per { width:15%; }
.w20per { width:20%; }
.w22per { width:22%; }
.w25per { width:25%; }
.w30per { width:30%; }
.w35per { width:35%; }
.w50per { width:50%; }
.w55per { width:55%; }
.w56per { width:56%; }
.w60per { width:60%; }
.w70per { width:70%; }
.w75per { width:75%; }
.w80per { width:80%; }
.w100per { width:100%!important; }

/* ▼area▼ */
.mb200 { margin-bottom:200px!important; }
.mb160 { margin-bottom:160px!important; }
.mb150 { margin-bottom:150px!important; }
.mb140 { margin-bottom:140px!important; }
.mb130 { margin-bottom:130px!important; }
.mb120 { margin-bottom:120px!important; }
.mb110 { margin-bottom:110px!important; }
.mb100 { margin-bottom:100px!important; }
.mb95 { margin-bottom:95px!important; }
.mb90 { margin-bottom:90px!important; }
.mb85 { margin-bottom:85px!important; }
.mb80 { margin-bottom:80px!important; }
.mb75 { margin-bottom:75px!important; }
.mb70 { margin-bottom:70px!important; }
.mb65 { margin-bottom:65px!important; }
.mb60 { margin-bottom:60px!important; }
.mb55 { margin-bottom:55px!important; }
.mb50 { margin-bottom:50px!important; }
.mb45 { margin-bottom:45px!important; }
.mb40 { margin-bottom:40px!important; }
.mb35 { margin-bottom:35px!important; }
.mb30 { margin-bottom:30px!important; }
.mb25 { margin-bottom:25px!important; }
.mb20 { margin-bottom:20px!important; }
.mb15 { margin-bottom:15px!important; }
.mb12 { margin-bottom:12px!important; }
.mb10 { margin-bottom:10px!important; }
.mb8 { margin-bottom:8px!important; }
.mb5 { margin-bottom:5px!important; }
.mb0 { margin-bottom:0!important; }

.mlr300 { margin-left:300px!important; margin-right:300px!important; }
.mlr115 { margin-left:115px!important; margin-right:115px!important; }
.mlr100 { margin-left:100px!important; margin-right:100px!important; }
.mlr80 { margin-left:80px!important; margin-right:80px!important; }
.mlr75 { margin-left:75px!important; margin-right:75px!important; }
.mlr70 { margin-left:70px!important; margin-right:70px!important; }
.mlr60 { margin-left:60px!important; margin-right:60px!important; }
.mlr55 { margin-left:55px!important; margin-right:55px!important; }
.mlr50 { margin-left:50px!important; margin-right:50px!important; }
.mlr45 { margin-left:40px!important; margin-right:45px!important; }
.mlr40 { margin-left:40px!important; margin-right:40px!important; }
.mlr35 { margin-left:35px!important; margin-right:35px!important; }
.mlr30 { margin-left:30px!important; margin-right:30px!important; }
.mlr25 { margin-left:25px!important; margin-right:25px!important; }
.mlr20 { margin-left:20px!important; margin-right:20px!important; }
.mlr15 { margin-left:15px!important; margin-right:15px!important; }
.mlr10 { margin-left:10px!important; margin-right:10px!important; }
.mlr5 { margin-left:5px!important; margin-right:5px!important; }
.mlr-1 { margin-left:-1px!important; margin-right:-1px!important; }
.mlr-5 { margin-left:-5px!important; margin-right:-5px!important; }
.mlr-10 { margin-left:-10px!important; margin-right:-10px!important; }
.mlr-20 { margin-left:-20px!important; margin-right:-20px!important; }
.mlr-50 { margin-left:-50px!important; margin-right:-50px!important; }
.mlr-100 { margin-left:-100px!important; margin-right:-100px!important; }
.mlr_auto { margin-left:auto!important; margin-right:auto!important; }

.mr50 { margin-right:50px!important; }
.mr40 { margin-right:40px!important; }
.mr30 { margin-right:30px!important; }
.mr25 { margin-right:25px!important; }
.mr20 { margin-right:20px!important; }
.mr15 { margin-right:15px!important; }
.mr10 { margin-right:10px!important; }
.mr5 { margin-right:5px!important; }
.mr0 { margin-right:0px!important; }
.mr-5 { margin-right:-5px!important; }

.ml80 { margin-left:80px!important; }
.ml50 { margin-left:50px!important; }
.ml40 { margin-left:40px!important; }
.ml30 { margin-left:30px!important; }
.ml20 { margin-left:20px!important; }
.ml15 { margin-left:15px!important; }
.ml10 { margin-left:10px!important; }
.ml0 { margin-left:0px!important; }
.ml-5 { margin-left:-5px!important; }
.ml-10 { margin-left:-10px!important; }
.ml-15 { margin-left:-15px!important; }
.ml-20 { margin-left:-20px!important; }

.mt120 { margin-top:120px!important; }
.mt90 { margin-top:90px!important; }
.mt80 { margin-top:80px!important; }
.mt70 { margin-top:70px!important; }
.mt60 { margin-top:60px!important; }
.mt55 { margin-top:55px!important; }
.mt50 { margin-top:50px!important; }
.mt45 { margin-top:45px!important; }
.mt40 { margin-top:40px!important; }
.mt35 { margin-top:35px!important; }
.mt30 { margin-top:30px!important; }
.mt20 { margin-top:20px!important; }
.mt15 { margin-top:15px!important; }
.mt10 { margin-top:10px!important; }
.mt5 { margin-top:5px!important; }
.mt3 { margin-top:3px!important; }
.mt0 { margin-top:0!important; }
.mt-5 { margin-top:-5px!important; }
.mt-10 { margin-top:-10px!important; }
.mt-20 { margin-top:-20px!important; }
.mt-40 { margin-top:-40px!important; }
.mt-50 { margin-top:-50px!important; }
.mt-60 { margin-top:-60px!important; }
.mt-70 { margin-top:-70px!important; }
.mt-80 { margin-top:-80px!important; }

.pb100 { padding-bottom:100px!important; }
.pb80 { padding-bottom:80px!important; }
.pb30 { padding-bottom:30px!important; }
.pb8 { padding-bottom:8px!important; }
.pb0 { padding-bottom:0!important; }

.p20 { padding:20px!important; }
.p15 { padding:15px!important; }
.p10 { padding:10px!important; }

.pt60 { padding-top:60px!important; }
.pt50 { padding-top:50px!important; }
.pt20 { padding-top:20px!important; }
.pt15 { padding-top:20px!important; }
.pt0  { padding-top:0!important; }

.ptb20 { padding-top:20px!important; padding-bottom:20px!important; }
.ptb15 { padding-top:15px!important; padding-bottom:15px!important; }
.ptb5 { padding-top:5px!important; padding-bottom:5px!important; }
.ptb0 { padding-top:0!important; padding-bottom:0!important; }

.plr25 { padding-left:25px!important; padding-right:25px!important; }

/* キーフレーム */
@keyframes fadein-anime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0.98;
  }
}
@keyframes fadeout-anime {
  0% {
    opacity: 0.98;
    visibility: visible;
  }
  100% {
    opacity: 0;
    visibility: hidden;
	}
  }