@charset "utf-8";


/************************************
#member
************************************/
@media screen and (min-width: 1366px) {
	#member {
		width: 1100px;
		padding-top: 50px;
		margin: 0 auto 50px;
	}
	
	#member h2 {
		position: relative;
		display: block;
		align-content: center;
		box-sizing: border-box;
		color: var(--holiday1);
		font-size: 28px;
		line-height: 1em;
		font-weight: var(--bold);
		text-align: left;
		width: 100%;
		height: 60px;
		padding-left: 50px;
		margin-bottom: 50px;
	}
	
	#member h2::before {
		position: absolute;
		display: block;
		content: "";
		background: var(--holiday1);
		width: 18px;
		height: 100%;
		top: 0;
		left: 0;
	}
	
	#member .myholiday {
		background: #f3fbfb;
		width: 100%;
		padding: 20px 0 40px;
	}
	
	#member .myholiday h3 {
		color: #00a99d;
		font-size: 28px;
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: 20px;
	}
	
	#member .myholiday p {
		color: var(--bw1);
		font-size: 16px;
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: 100%;
		margin-bottom: 40px;
	}
	
	#member .myholiday a {
		position: relative;
		display: block;
		align-content: center;
		background: #00a99d;
		color: var(--bw6);
		font-size: 16px;
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: 60px;
		width: 260px;
		height: 60px;
		margin: 0 auto;
	}
	
	#member .myholiday a::after {
		position: absolute;
		content: "\f138";
		font-family: "Font Awesome 6 Free";
		color: var(--bw6);
		font-size: 22px;
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: 20px;
		transform: translateY(-50%);
	}
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
	#member {
		width: calc(1100vw / var(--tablet));
		padding-top: calc(50vw / var(--tablet));
		margin: 0 auto calc(50vw / var(--tablet));
	}
	
	#member h2 {
		position: relative;
		display: block;
		align-content: center;
		box-sizing: border-box;
		color: var(--holiday1);
		font-size: calc(28vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: left;
		width: 100%;
		height: calc(60vw / var(--tablet));
		padding-left: calc(50vw / var(--tablet));
		margin-bottom: calc(50vw / var(--tablet));
	}
	
	#member h2::before {
		position: absolute;
		display: block;
		content: "";
		background: var(--holiday1);
		width: calc(18vw / var(--tablet));
		height: 100%;
		top: 0;
		left: 0;
	}
	
	#member .myholiday {
		background: #f3fbfb;
		width: 100%;
		padding: calc(20vw / var(--tablet)) 0 calc(40vw / var(--tablet));
	}
	
	#member .myholiday h3 {
		color: #00a99d;
		font-size: calc(28vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: calc(20vw / var(--tablet));
	}
	
	#member .myholiday p {
		color: var(--bw1);
		font-size: calc(16vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: 100%;
		margin-bottom: calc(40vw / var(--tablet));
	}
	
	#member .myholiday a {
		position: relative;
		display: block;
		align-content: center;
		background: #00a99d;
		color: var(--bw6);
		font-size: calc(16vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: calc(60vw / var(--tablet));
		width: calc(260vw / var(--tablet));
		height: calc(60vw / var(--tablet));
		margin: 0 auto;
	}
	
	#member .myholiday a::after {
		position: absolute;
		content: "\f138";
		font-family: "Font Awesome 6 Free";
		color: var(--bw6);
		font-size: calc(22vw / var(--tablet));
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: calc(20vw / var(--tablet));
		transform: translateY(-50%);
	}
}

@media screen and (max-width: 767px) {
	#member {
		width: 100%;
		margin-bottom: calc(30vw / var(--sp));
	}
	
	#member h2 {
		display: block;
		align-content: center;
		background: var(--holiday1);
		color: var(--bw6);
		font-size: calc(28vw / var(--sp));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		height: calc(60vw / var(--sp));
	}
	
	#member .myholiday {
		background: #f3fbfb;
		width: 100%;
		padding: calc(20vw / var(--sp)) 0 calc(35vw / var(--sp));
	}
	
	#member .myholiday h3 {
		color: #00a99d;
		font-size: calc(28vw / var(--sp));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: calc(20vw / var(--sp));
	}
	
	#member .myholiday p {
		color: var(--bw1);
		font-size: calc(16vw / var(--sp));
		line-height: calc(26vw / var(--sp));
		font-weight: var(--regular);
		text-align: center;
		width: 100%;
		margin-bottom: calc(20vw / var(--sp));
	}
	
	#member .myholiday a {
		position: relative;
		display: block;
		align-content: center;
		background: #00a99d;
		color: var(--bw6);
		font-size: calc(16vw / var(--sp));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: calc(60vw / var(--sp));
		width: calc(260vw / var(--sp));
		height: calc(60vw / var(--sp));
		margin: 0 auto;
	}
	
	#member .myholiday a::after {
		position: absolute;
		content: "\f138";
		font-family: "Font Awesome 6 Free";
		color: var(--bw6);
		font-size: calc(22vw / var(--sp));
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: calc(20vw / var(--sp));
		transform: translateY(-50%);
	}
}


/************************************
#notice
************************************/
@media screen and (min-width: 1366px) {
	#notice {
		width: 800px;
		margin: 0 auto 100px;
	}
	
	#notice h3 {
		color: var(--holiday1);
		font-size: 24px;
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: 30px;
	}
	
	#notice .shop_notice {
		width: 100%;
		margin-bottom: 20px;
	}
	
	#notice .shop_notice table {
		width: 100%;
		margin-bottom: 10px;
	}
	
	#notice .shop_notice table tbody {
		display: flex;
		box-sizing: border-box;
		gap: 0 50px;
		width: 100%;
	}
	
	#notice .shop_notice table tr {
		display: flex;
		gap: 0 20px;
		box-sizing: content-box;
		width: auto;
		height: 38px;
		padding: 5px 0;
	}
	
	#notice .shop_notice table tr th {
		display: block;
		align-content: center;
		background: #808080;
		color: var(--bw6);
		font-size: 16px;
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: 100px;
		height: 100%;
	}
	
	#notice .shop_notice table tr td {
		display: block;
		align-content: center;
		color: var(--bw1);
		font-size: 16px;
		line-height: 1em;
		font-weight: var(--regular);
		text-align: left;
		height: 100%;
	}
	
	#notice .shop_notice p {
		display: block;
		box-sizing: border-box;
		background: #e5f1f9;
		color: var(--holiday1);
		font-size: 16px;
		line-height: 26px;
		font-weight: var(--regular);
		text-align: justify;
		border-radius: 10px;
		width: 100%;
		min-height: 90px;
		padding: 20px;
	}
	
	#notice .shop_notice.none p {
		text-align: center;
	}
	
	#notice small {
		display: block;
		color: var(--bw2);
		font-size: 14px;
		line-height: 24px;
		font-weight: var(--regular);
		text-align: left;
		width: 100%;
	}
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
	#notice {
		width: calc(800vw / var(--tablet));
		margin: 0 auto calc(100vw / var(--tablet));
	}
	
	#notice h3 {
		color: var(--holiday1);
		font-size: calc(24vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: calc(30vw / var(--tablet));
	}
	
	#notice .shop_notice {
		width: 100%;
		margin-bottom: calc(20vw / var(--tablet));
	}
	
	#notice .shop_notice table {
		width: 100%;
		margin-bottom: calc(10vw / var(--tablet));
	}
	
	#notice .shop_notice table tbody {
		display: flex;
		box-sizing: border-box;
		gap: 0 calc(50vw / var(--tablet));
		width: 100%;
	}
	
	#notice .shop_notice table tr {
		display: flex;
		gap: 0 calc(20vw / var(--tablet));
		box-sizing: content-box;
		width: auto;
		height: calc(38vw / var(--tablet));
		padding: calc(5vw / var(--tablet)) 0;
	}
	
	#notice .shop_notice table tr th {
		display: block;
		align-content: center;
		background: #808080;
		color: var(--bw6);
		font-size: calc(16vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: calc(100vw / var(--tablet));
		height: 100%;
	}
	
	#notice .shop_notice table tr td {
		display: block;
		align-content: center;
		color: var(--bw1);
		font-size: calc(16vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--regular);
		text-align: left;
		height: 100%;
	}
	
	#notice .shop_notice p {
		display: block;
		box-sizing: border-box;
		background: #e5f1f9;
		color: var(--holiday1);
		font-size: calc(16vw / var(--tablet));
		line-height: calc(26vw / var(--tablet));
		font-weight: var(--regular);
		text-align: justify;
		border-radius: calc(10vw / var(--tablet));
		width: 100%;
		min-height: calc(90vw / var(--tablet));
		padding: calc(20vw / var(--tablet));
	}
	
	#notice .shop_notice.none p {
		text-align: center;
	}
	
	#notice small {
		display: block;
		color: var(--bw2);
		font-size: calc(14vw / var(--tablet));
		line-height: calc(24vw / var(--tablet));
		font-weight: var(--regular);
		text-align: left;
		width: 100%;
	}
}

@media screen and (max-width: 767px) {
	#notice {
		width: calc(340vw / var(--sp));
		margin: 0 auto calc(50vw / var(--sp));
	}
	
	#notice h3 {
		color: var(--holiday1);
		font-size: calc(24vw / var(--sp));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: calc(20vw / var(--sp));
	}
	
	#notice .shop_notice {
		width: 100%;
		margin-bottom: calc(20vw / var(--sp));
	}
	
	#notice .shop_notice table {
		width: 100%;
		margin-bottom: calc(5vw / var(--sp));
	}
	
	#notice .shop_notice table tr {
		display: flex;
		gap: 0 calc(20vw / var(--sp));
		box-sizing: content-box;
		width: 100%;
		height: calc(38vw / var(--sp));
		padding: calc(5vw / var(--sp)) 0;
	}
	
	#notice .shop_notice table tr.date {
		border-bottom: calc(1vw / var(--sp)) solid var(--bw3);
	}
	
	#notice .shop_notice table tr th {
		display: block;
		align-content: center;
		background: #808080;
		color: var(--bw6);
		font-size: calc(16vw / var(--sp));
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: calc(100vw / var(--sp));
		height: 100%;
	}
	
	#notice .shop_notice table tr td {
		display: block;
		align-content: center;
		color: var(--bw1);
		font-size: calc(16vw / var(--sp));
		line-height: 1em;
		font-weight: var(--regular);
		text-align: left;
		height: 100%;
	}
	
	#notice .shop_notice p {
		display: block;
		box-sizing: border-box;
		background: #e5f1f9;
		color: var(--holiday1);
		font-size: calc(16vw / var(--sp));
		line-height: calc(26vw / var(--sp));
		font-weight: var(--regular);
		text-align: justify;
		border-radius: calc(10vw / var(--sp));
		width: 100%;
		padding: calc(20vw / var(--sp));
	}
	
	#notice small {
		display: block;
		color: var(--bw2);
		font-size: calc(14vw / var(--sp));
		line-height: calc(24vw / var(--sp));
		font-weight: var(--regular);
		text-align: left;
		width: 100%;
	}
}


/************************************
#reserve
************************************/
@media screen and (min-width: 1366px) {
	#reserve {
		background: #f2f2f2;
		width: 800px;
		padding: 25px 0 30px;
		margin: 0 auto 100px;
	}
	
	#reserve h3 {
		color: var(--holiday1);
		font-size: 28px;
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: 30px;
	}
	
	#reserve .button_reserve {
		position: relative;
		display: block;
		align-content: center;
		background: var(--holiday2);
		color: var(--bw6);
		font-size: 16px;
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: 50px;
		width: 280px;
		height: 50px;
		margin: 0 auto;
	}
	
	#reserve .button_reserve::before {
		position: absolute;
		display: block;
		content: "";
		background: url("../img/member/icon_reserve.webp") no-repeat;
		background-size: 100% 100%;
		width: 22px;
		height: 22px;
		top: 50%;
		left: 20px;
		transform: translateY(-50%);
	}
	
	#reserve .schedule {
		position: relative;
		width: 740px;
		border-top: 1px solid var(--bw3);
		padding-top: 30px;
		margin: 30px auto 0;
	}
	
	#reserve .schedule::before {
		display: none;
	}
	
	#reserve .schedule h4 {
		color: var(--bw1);
		font-size: 16px;
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: 100%;
		margin-bottom: 20px;
	}
	
	#reserve .button_schedule {
		position: relative;
		display: block;
		align-content: center;
		background: var(--bw6);
		color: var(--studio);
		font-size: 16px;
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: 48px;
		width: 300px;
		height: 48px;
		margin: 0 auto;
	}
	
	#reserve .button_schedule::before {
		position: absolute;
		display: block;
		content: "";
		background: url("../img/index/icon_schedule_studio.webp") no-repeat;
		background-size: 100% 100%;
		width: 22px;
		height: 22px;
		top: 50%;
		left: 20px;
		transform: translateY(-50%);
	}
	
	#reserve .button_schedule::after {
		position: absolute;
		content: "\f138";
		font-family: "Font Awesome 6 Free";
		color: var(--studio);
		font-size: 22px;
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: 15px;
		transform: translateY(-50%);
	}
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
	#reserve {
		background: #f2f2f2;
		width: calc(800vw / var(--tablet));
		padding: calc(25vw / var(--tablet)) 0 calc(30vw / var(--tablet));
		margin: 0 auto calc(100vw / var(--tablet));
	}
	
	#reserve h3 {
		color: var(--holiday1);
		font-size: calc(28vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: calc(30vw / var(--tablet));
	}
	
	#reserve .button_reserve {
		position: relative;
		display: block;
		align-content: center;
		background: var(--holiday2);
		color: var(--bw6);
		font-size: calc(16vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: calc(50vw / var(--tablet));
		width: calc(280vw / var(--tablet));
		height: calc(50vw / var(--tablet));
		margin: 0 auto;
	}
	
	#reserve .button_reserve::before {
		position: absolute;
		display: block;
		content: "";
		background: url("../img/member/icon_reserve.webp") no-repeat;
		background-size: 100% 100%;
		width: calc(22vw / var(--tablet));
		height: calc(22vw / var(--tablet));
		top: 50%;
		left: calc(20vw / var(--tablet));
		transform: translateY(-50%);
	}
	
	#reserve .schedule {
		position: relative;
		width: calc(740vw / var(--tablet));
		border-top: calc(1vw / var(--tablet)) solid var(--bw3);
		padding-top: calc(30vw / var(--tablet));
		margin: calc(30vw / var(--tablet)) auto 0;
	}
	
	#reserve .schedule::before {
		display: none;
	}
	
	#reserve .schedule h4 {
		color: var(--bw1);
		font-size: calc(16vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: 100%;
		margin-bottom: calc(20vw / var(--tablet));
	}
	
	#reserve .button_schedule {
		position: relative;
		display: block;
		align-content: center;
		background: var(--bw6);
		color: var(--studio);
		font-size: calc(16vw / var(--tablet));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: calc(48vw / var(--tablet));
		width: calc(300vw / var(--tablet));
		height: calc(48vw / var(--tablet));
		margin: 0 auto;
	}
	
	#reserve .button_schedule::before {
		position: absolute;
		display: block;
		content: "";
		background: url("../img/index/icon_schedule_studio.webp") no-repeat;
		background-size: 100% 100%;
		width: calc(22vw / var(--tablet));
		height: calc(22vw / var(--tablet));
		top: 50%;
		left: calc(20vw / var(--tablet));
		transform: translateY(-50%);
	}
	
	#reserve .button_schedule::after {
		position: absolute;
		content: "\f138";
		font-family: "Font Awesome 6 Free";
		color: var(--studio);
		font-size: calc(22vw / var(--tablet));
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: calc(15vw / var(--tablet));
		transform: translateY(-50%);
	}
}

@media screen and (max-width: 767px) {
	#reserve {
		background: #f2f2f2;
		width: calc(340vw / var(--sp));
		padding: calc(25vw / var(--sp)) 0;
		margin: 0 auto calc(50vw / var(--sp));
	}
	
	#reserve h3 {
		color: var(--holiday1);
		font-size: calc(28vw / var(--sp));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		width: 100%;
		margin-bottom: calc(30vw / var(--sp));
	}
	
	#reserve .button_reserve {
		position: relative;
		display: block;
		align-content: center;
		background: var(--holiday2);
		color: var(--bw6);
		font-size: calc(16vw / var(--sp));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: calc(50vw / var(--sp));
		width: calc(280vw / var(--sp));
		height: calc(50vw / var(--sp));
		margin: 0 auto;
	}
	
	#reserve .button_reserve::before {
		position: absolute;
		display: block;
		content: "";
		background: url("../img/member/icon_reserve.webp") no-repeat;
		background-size: 100% 100%;
		width: calc(22vw / var(--sp));
		height: calc(22vw / var(--sp));
		top: 50%;
		left: calc(20vw / var(--sp));
		transform: translateY(-50%);
	}
	
	#reserve .schedule {
		position: relative;
		width: calc(300vw / var(--sp));
		padding-top: calc(30vw / var(--sp));
		margin: calc(30vw / var(--sp)) auto 0;
	}
	
	#reserve .schedule::before {
		position: absolute;
		display: block;
		content: "";
		background: var(--bw3);
		width: calc(280vw / var(--sp));
		height: calc(1vw / var(--sp));
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	}
	
	#reserve .schedule h4 {
		color: var(--bw1);
		font-size: calc(16vw / var(--sp));
		line-height: 1em;
		font-weight: var(--regular);
		text-align: center;
		width: 100%;
		margin-bottom: calc(20vw / var(--sp));
	}
	
	#reserve .button_schedule {
		position: relative;
		display: block;
		align-content: center;
		background: var(--bw6);
		color: var(--studio);
		font-size: calc(16vw / var(--sp));
		line-height: 1em;
		font-weight: var(--bold);
		text-align: center;
		border-radius: calc(48vw / var(--sp));
		width: 100%;
		height: calc(48vw / var(--sp));
		margin: 0 auto;
	}
	
	#reserve .button_schedule::before {
		position: absolute;
		display: block;
		content: "";
		background: url("../img/index/icon_schedule_studio.webp") no-repeat;
		background-size: 100% 100%;
		width: calc(22vw / var(--sp));
		height: calc(22vw / var(--sp));
		top: 50%;
		left: calc(20vw / var(--sp));
		transform: translateY(-50%);
	}
	
	#reserve .button_schedule::after {
		position: absolute;
		content: "\f138";
		font-family: "Font Awesome 6 Free";
		color: var(--studio);
		font-size: calc(22vw / var(--sp));
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: calc(15vw / var(--sp));
		transform: translateY(-50%);
	}
}


/************************************
#service
************************************/
@media screen and (min-width: 1366px) {
	#service {
		width: 720px;
		margin: 0 auto 135px;
	}
	
	#service ul {
		display: flex;
		flex-wrap: wrap;
		gap: 30px 40px;
		width: 100%;
	}
	
	#service ul li {
		width: 340px;
	}
	
	#service ul li a {
		position: relative;
		display: flex;
		align-items: flex-start;
		gap: 0 13px;
		box-sizing: border-box;
		background: var(--bw6);
		border: 1px solid #c8c8c8;
		border-radius: 10px;
		width: 100%;
		padding: 15px;
	}
	
	#service ul li a::after {
		position: absolute;
		content: "\f138";
		background: var(--bw6);
		font-family: "Font Awesome 6 Free";
		color: var(--holiday2);
		font-size: 22px;
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: -11px;
		transform: translateY(-50%);
	}
	
	#service ul li a img {
		width: 90px;
	}
	
	#service ul li a .text {
		width: 198px;
	}
	
	#service ul li a .text h3 {
		color: var(--holiday2);
		font-size: 16px;
		line-height: 26px;
		font-weight: var(--bold);
		text-align: left;
		margin-bottom: 5px;
	}
	
	#service ul li a .text p {
		color: #5f5d5d;
		font-size: 14px;
		line-height: 22px;
		font-weight: var(--regular);
		text-align: left;
	}
}

@media screen and (min-width: 768px) and (max-width: 1365px) {
	#service {
		width: calc(720vw / var(--tablet));
		margin: 0 auto calc(135vw / var(--tablet));
	}
	
	#service ul {
		display: flex;
		flex-wrap: wrap;
		gap: calc(30vw / var(--tablet)) calc(40vw / var(--tablet));
		width: 100%;
	}
	
	#service ul li {
		width: calc(340vw / var(--tablet));
	}
	
	#service ul li a {
		position: relative;
		display: flex;
		align-items: flex-start;
		gap: 0 calc(13vw / var(--tablet));
		box-sizing: border-box;
		background: var(--bw6);
		border: calc(1vw / var(--tablet)) solid #c8c8c8;
		border-radius: calc(10vw / var(--tablet));
		width: 100%;
		padding: calc(15vw / var(--tablet));
	}
	
	#service ul li a::after {
		position: absolute;
		content: "\f138";
		background: var(--bw6);
		font-family: "Font Awesome 6 Free";
		color: var(--holiday2);
		font-size: calc(22vw / var(--tablet));
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: calc(-11vw / var(--tablet));
		transform: translateY(-50%);
	}
	
	#service ul li a img {
		width: calc(90vw / var(--tablet));
	}
	
	#service ul li a .text {
		width: calc(198vw / var(--tablet));
	}
	
	#service ul li a .text h3 {
		color: var(--holiday2);
		font-size: calc(16vw / var(--tablet));
		line-height: calc(26vw / var(--tablet));
		font-weight: var(--bold);
		text-align: left;
		margin-bottom: calc(5vw / var(--tablet));
	}
	
	#service ul li a .text p {
		color: #5f5d5d;
		font-size: calc(14vw / var(--tablet));
		line-height: calc(22vw / var(--tablet));
		font-weight: var(--regular);
		text-align: left;
	}
}

@media screen and (max-width: 767px) {
	#service {
		width: calc(340vw / var(--sp));
		margin: 0 auto calc(140vw / var(--sp));
	}
	
	#service ul {
		display: flex;
		flex-direction: column;
		gap: calc(10vw / var(--sp)) 0;
		width: 100%;
	}
	
	#service ul li {
		width: 100%;
	}
	
	#service ul li a {
		position: relative;
		display: flex;
		align-items: flex-start;
		gap: 0 calc(13vw / var(--sp));
		box-sizing: border-box;
		background: var(--bw6);
		border: calc(1vw / var(--sp)) solid #c8c8c8;
		border-radius: calc(10vw / var(--sp));
		width: 100%;
		padding: calc(15vw / var(--sp));
	}
	
	#service ul li a::after {
		position: absolute;
		content: "\f138";
		background: var(--bw6);
		font-family: "Font Awesome 6 Free";
		color: var(--holiday2);
		font-size: calc(22vw / var(--sp));
		line-height: 1em;
		font-weight: 900;
		top: 50%;
		right: calc(-11vw / var(--sp));
		transform: translateY(-50%);
	}
	
	#service ul li a img {
		width: calc(90vw / var(--sp));
	}
	
	#service ul li a .text {
		width: calc(198vw / var(--sp));
	}
	
	#service ul li a .text h3 {
		color: var(--holiday2);
		font-size: calc(16vw / var(--sp));
		line-height: calc(26vw / var(--sp));
		font-weight: var(--bold);
		text-align: left;
		margin-bottom: calc(5vw / var(--sp));
	}
	
	#service ul li a .text p {
		color: #5f5d5d;
		font-size: calc(14vw / var(--sp));
		line-height: calc(22vw / var(--sp));
		font-weight: var(--regular);
		text-align: left;
	}
}


/************************************
footer
************************************/
@media screen and (max-width: 767px) {
	footer .info {
		padding: calc(55vw / var(--sp)) 0;
	}
}