/* mv
========================================== */
.submvArea {
	overflow: hidden;
	background-color: #fff;
	margin: 20px auto 0;
	width: calc(100% - (clamp(20px, 5vw, 30px)*2));
	border-radius: 30px;
}
.submvArea .inner{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 0;
	width: 100%;
	max-width: 100%;
	margin:0 auto;
}
.submvArea .title{
	letter-spacing: 2px;
	line-height: 1.2;
	font-weight: 900;
    display: flex;
    flex-direction:column-reverse;
	gap: 20px;
	box-sizing: border-box;
	flex: 0 0 100%;
	padding: 100px 50px 100px 50px;
}
.submvArea.has-text .title {
    flex: 0 0 35%;
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction:column-reverse;
    justify-content: center;
	gap: 20px;
}
.submvArea.has-text .title::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	background-image: 
		linear-gradient(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.85)),
		var(--bg-img, none);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.submvArea .title .en,
.submvArea .title .ja {
    position: relative;
    z-index: 2;
	text-shadow :3px 3px 5px #fff,
	-3px 3px 5px #fff,
	3px -3px 5px #fff,
	-3px -3px 5px #fff,
	0 0 6px #fff,0 0 8px #fff;
}
.submvArea .title .en{
	display: block;
	word-break: break-word;
    line-height: 1;
    letter-spacing: 3px;
    font-family: var(--font-english);
	font-size: var(--font-size-accent);
    font-weight: 700;
    color: var(--color-primary);
}
.submvArea .title .ja{
	display: block;
	font-family: var(--font-secondary);
	font-weight: 900;
	font-size: clamp(2.4rem, 2.66vw + 0.81rem, 3.6rem);
}
.submvArea .textBlock{
	line-height: 2;
	width: 65%;
	padding: 0 50px;
}
.submvArea .textBlock .lead{
	font-weight: 600;
	font-size: 1.7rem;
}

@media screen and (max-width:1200px) {

}
@media screen and (max-width:840px) {
	.submvArea {margin-top: 10px;}
	.submvArea .inner{
		flex-direction: column;
		gap: 30px 10%;
		padding:0;
	}
	.submvArea .title{
		padding:40px 0;
		align-items: center;
	}
	.submvArea.has-text .title{
		width: 100%;
		max-width: 100%;
		text-align: center;
	}
	.submvArea .textBlock{width: 100%;padding:0 2em 30px;}
}

@media screen and (max-width:599px) {
}

/* breadcrumb
========================================== */
.breadcrumb {
	margin: 20px auto 0;
	max-width: 1200px;
	text-align: right;
}
.breadcrumb li {
	display: inline;
	list-style-type: none;
	font-size: 1.2rem;
	font-weight: 600;
}
.breadcrumb li:before {
	content: "";
    display: inline-block;
    vertical-align: middle;
    margin: 0 1em;
    width: 10px;
    height: 1px;
    background: var(--border-color);
}
.breadcrumb li:first-child:before {content: none;}
.breadcrumb li a {
	text-decoration: none;
	font-weight: 400;
	color: #888;}
.breadcrumb li a:hover {
	text-decoration: underline;
}

@media screen and (max-width: 1200px) {
	.breadcrumb {
		margin: 15px auto;
		max-width: 100%;
		padding:0 clamp(20px, 5vw, 30px);
	}
}
@media screen and (max-width: 599px) {
	.breadcrumb li {font-size: 1.1rem;}
}

/* section
========================================== */
.sectionBox {
    padding: 60px 0;
}
.sectionBox:last-of-type{margin-bottom: 60px;}

.sectionInner {
    max-width: 1200px;
    margin: 0 auto;
    padding:30px 0;
}

.sectionInner.is-card {
    background-color: #fff;
	margin: 0 auto;
    padding: 60px 50px;
    border-radius: 20px;
}
.sectionWrap{
	display: grid;
	grid-template-columns: 3fr 1fr;
	gap: 5%;
	max-width: 1200px;
	margin: 0 auto;
}
.sectionMain {
	min-width: 0;
}

@media screen and (max-width: 1200px) {
	.sectionBox {padding: 40px clamp(20px, 5vw, 30px);}
}
@media screen and (max-width: 840px) {
	.sectionBox {padding: 30px clamp(20px, 5vw, 30px);}
	.sectionInner.is-card {padding: 30px 20px;}
	.sectionWrap{
		grid-template-columns:1fr;
		gap:60px;
	}
}

/* 背景色 シャドウ
========================================== */
.bgBlue{background-color: var(--bg-blue);}
.bgGrey{background-color: var(--bg-lightgrey);}
.boxShadow{filter: drop-shadow(var(--shadow-box));}

/* menu
========================================== */
.subpageMenuWrap {
	position: sticky;
	z-index: 10;
	top: 60px;
	margin-top: 40px;
	padding: 40px 0 30px;
}
.subpageMenu {
	position:relative;
	z-index: 10;
	max-width: 1200px;
	margin:0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
	gap: 1em;
}
.subpageMenu li a {
	position: relative;
	display: block;
	padding: 0.5em 3em 0.5em 1.5em;
	font-weight: 500;
	text-align: center;
	text-decoration: none;
	border-radius: 9999px;
	box-sizing: border-box;
	border: 1px solid var(--color-primary);
	background-color:#fff;
	transition: 0.3s;
}
.subpageMenu li a::after {
	content: "";
	position: absolute;
	right: 1.3em;
	top: 50%;
	border-top: 2px solid var(--color-primary);
	border-right: 2px solid var(--color-primary);
	width: 8px;
	height: 8px;
	transform: translateY(-50%) rotate(135deg);
	transition: 0.3s;
}
.subpageMenu li a:hover {
	color: var(--color-primary);
}
.subpageMenu li a:hover::after {
	top: 55%;
}
.scrollHint{display: none;}

@media screen and (max-width:1200px) {
	.subpageMenuWrap {padding: 0 clamp(20px, 5vw, 30px);}
	.subpageMenu{gap: 10px;}
}

@media screen and (max-width:1024px) {
	.subpageMenuWrap {
		margin-top:0;
		padding:0;
		background-color: var(--color-secondary);
	}
	.subpageMenu{
		padding:10px 10px;
		flex-wrap: nowrap;
		justify-content: flex-start;
		overflow-x: auto;
		gap:.5em;
		margin:0;
		-webkit-overflow-scrolling: touch;
	}
	.subpageMenu li a{
		white-space: nowrap;
		padding:0.2em 1em;
		font-size: 1.4rem;}
	.subpageMenu li a::after {display: none;}

	.subpageMenu::-webkit-scrollbar {height: 8px;}
	.subpageMenu::-webkit-scrollbar-track {background: #F1F1F1;}
	.subpageMenu::-webkit-scrollbar-thumb {background: #888;}

	.scrollHint {
		display: block;
		position: absolute;
		right: 1em;
		font-size: 0.9rem;
		color: #333;
		margin-top: 4px;
		opacity: 0.7;
	}
}

/* サービス
========================================== */
.serviceImageText{
	display:flex;
	flex-wrap: wrap;
	gap: 30px 5%;
	margin-bottom: 60px;
}
.serviceImageText .textBlock{
	width: 55%;
}
.serviceImageText .imageBlock{
	width: 40%;
	text-align: center;
}
.serviceImageText .imageBlock img{
	max-width: 100%;
	height: auto;
	border-radius: 20px;
}

.serviceHours{
	display: flex;
	gap:.5em 1em;
	margin-top: 20px;
}
.serviceHours dt{
	color: var(--color-primary);
}
@media screen and (max-width:599px) {
	.serviceImageText{
		flex-direction: column;
		margin-bottom: 30px;
	}
	.serviceImageText .textBlock{
		width: 100%;
	}
	.serviceImageText .imageBlock{
		width: 100%;
	}
}

.checkList01{
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: fit-content;
	margin: 50px auto;
	padding: 4%;
	background-color: #fff;
	border-radius: 30px;
}
.checkList01 li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--font-size-accent);
}

.checkList01 .icon-check {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 2px solid var(--color-primary);
	border-radius: 4px;
	position: relative;
	flex-shrink: 0;
	background-color: #fff;
}

.checkList01 .icon-check::after {
	content: "";
	position: absolute;
	top: 2px;
	left: 6px;
	width: 5px;
	height: 10px;
	border: solid var(--color-accent);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

@media screen and (max-width:599px) {
	.checkList01{
		padding:20px 30px;
	}
}


.serviceMenu{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	padding:60px 0;
}

.serviceMenu .item{
	width: calc((100% - 30px)/2);
	display: flex;
	flex-direction: column;
	padding: 1.5em;
	border: 1px solid var(--border-color);
	border-radius: 20px;
	box-sizing: border-box;
	background-color: #fff;
}
.serviceMenu .item:first-of-type{
	width: 100%;
}
.serviceMenu .item .title{
	line-height: 1.3;
	margin-top: .5em;
	margin-bottom: 1.5em;
	display: flex;
	align-items: center;
	gap: 10px 20px;
}
.serviceMenu .item .title .number{
	font-family: var(--font-number);
	font-size: var(--font-size-heading);
	color: var(--color-primary);
}

.serviceMenu .item .title .plan{
	width: 100%;
	font-size: var(--font-size-subheading);
	font-weight: 600;
}
.serviceMenu .item .text{
	margin-bottom: 1em;
}
.serviceMenu .item .more{
	margin-top: auto;
	text-align: right;
}
.serviceMenu .item .more a{
	position: relative;
	z-index: 1;
	display: inline-block;
	padding: .6em 40px .6em 30px;
	line-height: var(--line-height-heading);
	box-sizing: border-box;
	border-radius: 9999px;
	outline:2px solid #f2a25a;
	outline-offset: -2px;
	background: var(--gradient-orange);
	filter: drop-shadow(var(--shadow-box));
	text-align: center;
	text-decoration: none;
	color: #fff;
	overflow: hidden;
}
.serviceMenu .item .more a::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	opacity: 0;
	transition: opacity 0.3s ease;
	z-index: -1;
}
.serviceMenu .item .more a::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    background-color: #fff;
    border-radius: 9999px;
    transition: 0.3s;
    z-index: 2;
}
.serviceMenu .item .more a:hover {
	color: var(--text-primary);
	transition: outline-color .3s;
}
.serviceMenu .item .more a:hover::after {
	opacity: 1;
}
.serviceMenu .item .more a:hover::before {background-color:#f2a25a;}

.servicePlanBox + .servicePlanBox{margin-top: 60px;}
.servicePlanBox{
	padding: 40px;
	border: 1px solid var(--border-color);
	border-radius: 20px;
	box-sizing: border-box;
	background-color: #fff;
}
.servicePlanBox .summary{
	line-height: 2;
	font-size: var(--font-size-accent);
}

.planTitle{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap:0 20px;
	margin-bottom:2em;
}
.planTitle .number{
	font-family: var(--font-number);
	font-size: clamp(3rem, 2.66vw + 0.81rem, 3.6rem);
	color: var(--color-primary);
}
.planTitle .plan{
	line-height: 1.5;
    letter-spacing: 2px;
    font-weight: 800;
    font-size: clamp(2.4rem, 2.66vw + 0.81rem, 3.6rem);
    word-break: keep-all;
    overflow-wrap: break-word;
	text-align: center;
}

.planTable {
	max-width: 100%;
	margin-bottom: 30px;
	border-collapse: collapse;
}

.planTable th,
.planTable td {
	padding:.5em 1.2em;
	border: 1px solid #e0e0e0;
	background-color: #fff;
	vertical-align: middle;
}

.planTable th {
	background-color:var(--bg-lightgrey);
	text-align: left;
}

@media screen and (max-width:599px) {
	.serviceMenu{
		flex-direction: column;
		gap: 20px;
		padding:30px 0;
	}
	.serviceMenu .item{width: 100%;}
	.serviceMenu .item .more{text-align: center;}
	.servicePlanBox{
		padding:30px 20px;
	}
}

/* リセット＆ベース設定 */
.pointList {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* カード全体のスタイル */
.pointList .item {
	padding:1.5em;
	background-color: #fff;
	border: 1px solid #ddd;
	box-sizing: border-box;
	border-radius: 10px;
}

.pointList .title{
	line-height: 1.5;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin-bottom: 1.2em;
}
.pointList .title .number {
	display: inline-block;
	color:#ea5514;
	font-weight: 700;
	font-size: var(--font-size-accent);
	font-family: var(--font-english);
}
.pointList .title .jp{
	font-weight: 700;
	font-size: var(--font-size-accent);
}

.pointList .title {
}

.pointList .text {}



/* 会社案内
========================================== */
.philosophyText{
	letter-spacing: 2px;
	line-height: 2.4;
	margin: 2em auto;
	padding: 2em 3em;
	width: fit-content;
	background-color: #fff;
	filter: drop-shadow(var(--shadow-box));
	border-radius: 20px;
	font-size: var(--font-size-subheading);
	font-weight: 600;
}
.maeesgeLead{
	margin: 0 0 2em;
	width: fit-content;
	font-size: var(--font-size-subheading);
	font-weight: 600;
}
.maeesgeText{
	line-height: 2.2;
	word-break: keep-all;
	overflow-wrap: break-word;
}
.maeesgeText .signature{
	display: block;
	width: fit-content;
	margin-left: auto;
}
.messageWrap {
	display: flex;
	flex-wrap: wrap;
	column-gap: 5%;
	row-gap: 2em;
}
.messageWrap .imageBlock {
	width: 40%;
	text-align: center;
}
.messageWrap .imageBlock img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}
.messageWrap .textBlock {
	width: 50%;
}

@media screen and (max-width:599px) {
	.messageWrap .imageBlock {width: 100%;}
	.messageWrap .textBlock {width: 100%;}
}

/* ショップ一覧 */
.shopListTable {
	width: 100%;
	margin: 0 auto;
	border-collapse: collapse;
	white-space: nowrap;
}

.shopListTable th,
.shopListTable td {
	padding:.6em 1em;
	border: 1px solid #e0e0e0;
	background-color: #fff;
	vertical-align: middle;
}

.shopListTable th {
	background-color:var(--bg-lightgrey);
	text-align: left;
}

/* エリア見出し行のスタイル */
.shopListTable .areaHeader td {
	background-color: var(--color-secondary);
	font-weight: bold;
	color: var(--color-primary)
}
/* 電話番号リンク（スマホでタップして発信可能に） */
.shopListTable a[href^="tel:"] {
	color: inherit;
	text-decoration: none;
}
@media screen and (max-width: 767px) {
	.table-scroll-wrap {
		width: 100%;
		padding-bottom: 20px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
	.shopListTable {min-width: 650px;}

	.shopListTable a[href^="tel:"] {
		text-decoration: underline;
	}
}
@media screen and (max-width: 599px) {
	.philosophyText{
		line-height: 2;
		padding: 1.5em 2em;
	}
	.maeesgeText{
		text-align: left;
		word-break: normal;
	}
}

/* アクセス */
.accessWrap{
	display: flex;
	gap: 5%;
	margin-bottom: 60px;
}
.accessWrap .textBlock{flex: 0 0 50%;}
.accessWrap .mapBlock{flex:1;}
.accessWrap .textBlock .shopListTable{
	white-space: normal;
	min-width: 100%;
	width: 100%;
}
.accessWrap .imageBlock{
	text-align: center;
}
.accessWrap .imageBlock img{
	max-width: 100%;
	height: auto;
	border-radius: 20px;
}
.gmap {
	position: relative;
	height: 0;
	overflow: hidden;
	padding-bottom: 65%;
}
.gmap iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}

@media screen and (max-width:840px) {
	.accessWrap{
		flex-direction: column;
		gap: 30px;
	}
	.accessWrap .textBlock{width: 100%;}
	.accessWrap .mapBlock{width: 100%;}
}

/* 沿革 */
.historyList{
	max-width: 1000px;
	margin: 0 auto;
}
.historyList .item {
	position: relative;
	display: flex;
	gap: 5%;
	padding-bottom: 20px;
}
.historyList .item:not(:last-of-type)::before {
	content: "";
	position: absolute;
	top: 25px;
	left: 6px;
	bottom: 0;
	width: 2px;
	height: 100%;
	background: #ccc;
}
.historyList .item dt {
	position: relative;
	padding:10px 10px 10px 40px;
	width: 8em;
	font-size: var(--font-size-subheading);
	font-family: var(--font-english);
}

.historyList .item dt::before {
	content: "";
	position: absolute;
	top: 25px;
	left: 0;
	width: 14px;
	height: 14px;
	background: var(--color-primary);
	border-radius: 50%;
}

.historyList .item dd {
	width: calc(100% - 10em);
	padding:15px 10px 10px;
}
@media screen and (max-width: 599px) {
	.historyList .item {
		gap: 1em;
		padding-bottom: 10px;
	}
	.historyList .item dt{
		padding:10px 10px 10px 30px;
		width: 9em;}
	.historyList .item dd {
		width: calc(100% - 9em);
		padding:10px;
	}
	.historyList .item dt::before {top: 20px;}
}
@media screen and (max-width: 380px) {
	.historyList .item {flex-direction: column;gap:0;padding: 0;}
	.historyList .item dt{width: 100%;}
	.historyList .item dd {
		width:100%;
		padding:0 10px 15px 35px;
	}
	.historyList .item dt::before {top: 18px;}
}

/* 採用情報
========================================== */
.recruitmvArea {
	position: relative;
}
.recruitmvArea .image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.recruitmvArea .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.recruitmvArea .inner{
	position: relative;
	z-index: 2;
	max-width: 1200px;
	margin: 0 auto;
	padding: 8% 0 60px;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 30px 10px;
}
.recruitmvArea .textBlock{
	padding-bottom: 30px;
}

.recruitmvArea .textBlock .title{
	position: relative;
	line-height: 1.3;
	display: flex;
	gap: 10px;
	flex-direction: column;
	margin-bottom: 30px;
}
.recruitmvArea .textBlock .title .en{
	font-family: var(--font-english);
	font-size: var(--font-size-subheading);
	color: var(--color-primary);
}
.recruitmvArea .textBlock .title .jp{
	font-weight: 600;
	font-size:var(--font-size-heading);
}

.recruitmvArea .textBlock .lead{
	font-size: var(--font-size-accent);
}

.recruitmvArea .link{
	display: flex;
	flex-wrap: wrap;
	gap:10px 20px;
	margin-top: 30px;
}
.recruitmvArea .inner .illust{
	width: 30%;
}
.recruitmvArea .inner .illust img{
	max-width: 100%;
	height: auto;
}

@media screen and (max-width: 1200px) {
	.recruitmvArea .inner{
		padding-right: clamp(20px, 5vw, 30px);
		padding-left: clamp(20px, 5vw, 30px);
	}
}
@media screen and (max-width: 599px) {
	.recruitmvArea .inner{
		flex-direction: column;
		padding-bottom: 30px;
	}

	.recruitmvArea .textBlock{
		padding-bottom: 0;
		width: 100%;
	}
}

/* 魅力 */
.appealList {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
.appealList .item {
	border-radius: 10px;
	padding: 20px 15px;
	display: flex;
	align-items: center;
	gap: 10px 20px;
	background-color: #fff;
}
.appealList .item .icon {
	width: 100px;
	flex-shrink: 0;
}
.appealList .item .icon img{
	width: 100%;
	height: auto;
}
.appealList .item .item-content{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}
.appealList .item .title {
	line-height: 1.3;
	margin-bottom: 10px;
	font-size: var(--font-size-subheading);
	font-weight: 600;
}
@media screen and (max-width:840px) {
	.appealList .item .icon {
		width:80px;
	}
}

@media screen and (max-width:599px) {
	.appealList {
		gap: 10px;
		grid-template-columns: repeat(1, 1fr);
	}
	.appealList .item {padding: 10px 15px;}
	.appealList .item .icon {
		width: 60px;
	}
}

/* ある1日の流れ */
.scheduleWrap{
	display: flex;
	gap: 20px 5%;
}

.scheduleWrap .imageBlock{
	width: 40%;
}
.scheduleWrap .imageBlock > div + div{
	margin-top: 20px;
}
.scheduleWrap .imageBlock img{
	max-width: 100%;
	height: auto;
}
.scheduleWrap .scheduleList{
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--border-color);
}
.scheduleWrap .scheduleList .item {
	display: flex;
	align-items: flex-start;
	padding: 20px 0;
	border-bottom: 1px solid var(--border-color);
}
.scheduleWrap .scheduleList .item .time {
	width: 5em;
	flex-shrink: 0;
	font-size: var(--font-size-accent);
	font-weight: 800;
	font-family: var(--font-number);
	color:var(--color-primary);
	line-height: 1.4;
}

.scheduleWrap .scheduleList .item .content {
	flex-grow: 1;
	margin: 0;
}

.scheduleWrap .scheduleList .item .content .title {
	line-height: 1.4;
	margin-bottom: .6em;
	font-size: var(--font-size-accent);
	font-weight: 800;
}

.scheduleWrap .scheduleList .item .content .text {

}


@media screen and (max-width:840px) {
	.scheduleWrap{
		flex-direction: column;
	}
	.scheduleWrap .imageBlock{
		display: flex;
		column-gap: 10px;
		width: 100%;
	}
	.scheduleWrap .imageBlock > div + div{
		margin-top: 0;
	}
}

/* キャリアアップイメージ */
.careerupTitle{
	line-height: 1.3;
	width: fit-content;
	margin: 0 auto 2em;
	padding: 5px 10px;
	font-size: var(--font-size-subheading);
	font-weight: 800;
	background-color: var(--color-primary);
	color: #fff;
	text-align: center;
}
.careerupList{
	display: flex;
	justify-content: center;
	padding-left: 2em;
	padding-bottom: 8em;
}

.careerupList .item{
	position: relative;
	display: flex;
	flex-direction: column;
	width: calc(25% + 2em);
	margin-left: -2em;
}
.careerupList .item:nth-child(1){
	bottom: -8em;
	z-index: 1;
}
.careerupList .item:nth-child(2){
	bottom: -6em;
	z-index: 2;
}
.careerupList .item:nth-child(3){
	bottom: -4em;
	z-index: 3;
}
.careerupList .item:nth-child(4){
	bottom: -2em;
	z-index: 4;
}

.careerupList .item .head{
	line-height: 1.3;
	padding: 5px 10px;
	background-color:#444;
	color: #fff;
	width: fit-content;
}
.careerupList .item .contents{
	height: 100%;
	padding: 1.5em 3.5em 1.5em 1.5em;
	border: 1px solid var(--border-color);
	background-color: #fff;
}

.careerupList .item .contents .title{
	margin-bottom: 1em;
	font-size: var(--font-size-accent);
	font-weight: 800;
	color: #ea5514;
}
.careerupList .item .contents .list{
	display: flex;
	flex-direction: column;
	gap: 1em;
}
.careerupList .item .contents .list li{
	line-height: 1.3;
    position: relative;
    padding-left: 20px;
}
.careerupList .item .contents .list li::after {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 9999px;
	background-color: var(--color-primary);
}
@media (max-width: 768px) {
    .careerupList {
		overflow:hidden;
        flex-direction: column;
		gap: 20px;
        padding-left: 0;
        padding-bottom: 0;
        position: relative;
    }
	.careerupList::after{
		z-index: -1;
		content: "";
		position: absolute;
		top: 2em;
		left: 50%;
		transform: translateX(-50%);
		width: 20px;
		height: 100%;
		background-color: #eee;
	}
    .careerupList .item {
        width: 100%;
        margin-left: 0;
    }

    .careerupList .item:nth-child(1),
    .careerupList .item:nth-child(2),
    .careerupList .item:nth-child(3),
    .careerupList .item:nth-child(4) {
        bottom: 0;
        z-index: auto;
    }
    .careerupList .item .contents {
        padding: 1.2em;
    }
	.careerupList .item .contents .inner{
		display: flex;
		align-items: center;
		gap: 10px;
		margin-bottom: 20px;
	}
	.careerupList .item .contents .title{margin-bottom: 0;font-size: 1.8rem;}

}

@media (max-width: 599px) {
	.careerupList .item .contents .icon{
		width: 60px;
	}
	.careerupList .item .contents .icon img{
		max-width: 100%;
		height: auto;
	}
}


/* こんな人に向いています */
.targetList {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px 5%;
	margin: 60px 0 80px;
}
.targetList .item{
	position: relative;
	width: calc((100% - 5% * 2)/3);
	background-color: #fff;
	padding: 20px;
	border-radius:20px;
}

.targetList .item .num {
	position: absolute;
	top: 10px;
	left: 10px;
	width: 2em;
	height:2em;
	background-color: var(--color-primary);
	border-radius: 50px;
	color: #fff;
	line-height: 2;
	text-align: center;
	font-size: 2rem;
	font-weight: 500;
	font-family: var(--font-number);
}
.targetList .item .image {
	margin-bottom: 20px;

}
.targetList .item .image img{
	width: 100%;
	height: auto;
	border-radius: 10px
}
.targetList .item .contents{
	display: flex;
	flex-direction: column;
}
.targetList .item .title {
	margin-bottom: 1em;
	line-height: 1.5;
	font-size: var(--font-size-accent);
	font-weight: 600;
}


@media screen and (max-width:840px) {
	.targetList .item{
		width: calc((100% - 5% )/2);
	}
}
@media screen and (max-width:380px) {
	.targetList .item{
		width:100%;
	}
}

.careerBox{
	width: fit-content;
	margin: 0 auto;
	padding: 40px 60px;
	border-radius: 20px;
	background-color: #fff;
}

.careerBox .title{
	margin-bottom: 1.5em;
	font-size: var(--font-size-accent);
	font-weight: 600;
	text-align: center;
}

.careerBox .careerList{
	display: flex;
	flex-wrap: wrap;
	gap: .6em;
}
.careerBox .careerList li{
	line-height: 1.2;
	padding: 0.3em 1em;
	background-color: var(--color-secondary);
	box-sizing: border-box;
	border: 1px solid var(--color-primary);
}

@media screen and (max-width:599px) {
	.careerBox{
		padding: 30px;
	}
}

/* 福利厚生 */
.welfareList {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.welfareList .item {
	border-radius: 10px;
	padding: 20px 15px;
	display: flex;
	align-items: center;
	gap: 10px 20px;
	background-color: #fff;
}
.welfareList .item .icon {
	width: 80px;
	height: 80px;
	flex-shrink: 0;
}
.welfareList .item .icon img{
	width: 100%;
	height: auto;
}
.welfareList .item .title {
	margin-bottom: 10px;
	font-size: var(--font-size-accent);
	font-weight: 600;
}
.welfareList .item .text{
	margin: 0;
	line-height: 1.4;
}

@media screen and (max-width:840px) {
	.welfareList {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width:599px) {
	.welfareList {
		grid-template-columns: repeat(1, 1fr);
	}
}


/* 募集要項 */
.recruitDetail{
	display: flex;
	flex-wrap: wrap;
	align-items: self-start;
	gap:0 20px;

}
*+.recruitDetail {margin-top: 10px;}
.recruitDetail.column{
	flex-direction: column;
}

.recruitDetail dt{
    line-height: 1.3;
    width: fit-content;
    padding: .5em 1em;
    background-color: var(--color-secondary);
    border: 1px solid var(--color-primary);
    border-radius: 10px;
    font-weight: 600;
}
.recruitDetail dd{
	padding: .5em 0;
}

.recruitTab .tabs{
	display: flex;
	justify-content: center;
	gap: 1em;
	margin-bottom: 30px;
}

.recruitTab .tabs li a{
	line-height: 1.3;
	display:block;
	padding: 0.5em 1.5em;
	text-decoration: none;
	background-color: #fff;
	border-radius: 9999px;
	border: 1px solid var(--color-primary);
	box-sizing: border-box;
	font-size: var(--font-size-accent);
	transition: 0.3s;
}

.recruitTab .tabs li a:hover,
.recruitTab .tabs li a.active{
	background-color:var(--color-primary);
	font-weight: 600;
	color: #fff;
}

.recruitTab .panels > .panel{display: none;}
.recruitTab .panels > .panel.active{
	display: block;
}


@media screen and (max-width:599px){
	.recruitTab .tabs{
		flex-wrap: wrap;
		justify-content: center;
		gap: 1em .5em;
	}
	.recruitTab .tabs li a{
		padding: 0.5em 1em;}
}

@media screen and (max-width:380px){
	.recruitTab .tabs{display: block;border: none;}
	.recruitTab .tabs li:first-child{margin-right: 0;}
	.recruitTab .panels > .panel.active{
		margin-top:0;
		padding-top:0;}
}






/* モデル年収 */
.salaryTable {
	max-width: 800px;
	width: 100%;
	margin: 60px auto 0;
	border-collapse: collapse;
}

.salaryTable th,
.salaryTable td {
	padding: .6em 1.2em;
	border: 1px solid #e0e0e0;
	background-color: #fff;
	vertical-align: middle;
	text-align: center;
}

.salaryTable thead th {
	background-color: var(--color-secondary);
	font-weight: bold;
	letter-spacing: 0.05em;
}

.salaryTable tbody tr:nth-child(even) td {
	background-color: #fafafa;
}

.salaryTable td.price {
	font-size:var(--font-size-subheading);
	font-weight: bold;
	color: #ea5514;
	letter-spacing: 0.02em;
}

.salaryTable td.price span {
	font-size: var(--font-size-caption);
	font-weight: normal;
	color: #333;
	margin-left: 2px;
}
@media screen and (max-width:599px) {
	.salaryTable {
		margin: 30px auto 0;
		min-width: 400px;
	}
}

/* 手当 */
.allowanceTable {
	max-width: 800px;
	width: 100%;
	margin: 60px auto 30px;
	border-collapse: collapse;
}

.allowanceTable th,
.allowanceTable td {
	padding:.5em 1.2em;
	border: 1px solid #e0e0e0;
	background-color: #fff;
	vertical-align: middle;
}

.allowanceTable th{}
.allowanceTable thead th {
	background-color:var(--bg-lightgrey);
}
.allowanceNote{
	text-align: center;
	color:#666;
}

@media screen and (max-width:599px) {
	.allowanceTable {
		margin: 30px auto 0;
	}
	.allowanceNote{text-align: left;}
}

/* CTA */
.recruitCta{
	padding: 60px 0;
	background-color: #fff;
}
.recruitCta .inner{
	margin: 0 auto;
	max-width: 1200px;
}
.recruitCta .title{
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 2em;
	text-align: center;
}
.recruitCta .title .en{
	font-size: var(--font-size-heading);
	color: var(--color-primary);
}
.recruitCta .title .jp{
	font-size: var(--font-size-subheading);
	font-weight: 600;
}
.recruitCta .lead{
	font-size: var(--font-size-accent);
	text-align: center;
}
.recruitCta .linkWrap{
	margin-top: 30px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap:10px 40px;
}
.recruitCta .ctaTel{
	width: fit-content;
	padding-bottom: 10px;
}

.recruitCta .ctaTel a{
	display: flex;
	align-items: center;
	gap:0 10px;
    font-family: var(--font-number);
    font-weight: 600;
    font-size: var(--font-size-heading);
    color: var(--color-primary);
}
.recruitCta .ctaTel a::before{
	content: "";
	display: inline-block;
	background: url(../img/icon_tel.svg)left top/contain no-repeat;
	width:40px;
	height:30px;
}

@media screen and (max-width:599px) {
	.recruitCta{
		padding: 30px 0;
	}
}

/* インタビュー
========================================== */
.interviewList{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin: 60px 0;
}
.interviewList .item {
	background-color: #fff;
	filter: drop-shadow(var(--shadow-box));
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.interviewList a{
	display: flex;
	text-decoration: none;
	height: 100%;
}

.interviewList .content {
	flex: 1;
	padding: 12px 15px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background-color: #fff;
}

.interviewList .num {
	font-size:var(--font-size-subheading);
	font-family: var(--font-number);
	font-weight: 300;
	color: var(--color-primary);
	line-height: 1;
	margin-bottom: 15px;
}
.interviewList .info .shop {
    display: inline-block;
    font-size: var(--font-size-caption);
    color: #fff;
    background-color: #444;
	margin-bottom: 10px;
    padding: 3px 8px;
    border-radius: 3px;
    line-height: 1.3;
}
.interviewList .info .name {
	margin-bottom: 10px;
	font-size: var(--font-size-subheading);
	font-weight: 600;
}

.interviewList .info .sub,
.interviewList .info .dept {
	margin: 0 0 2px 0;
	line-height: 1.3;
	font-size: var(--font-size-caption);
}

.interviewList .info .btnText {
	display: inline-block;
	color: #555;
	margin-top: 8px;
}

.interviewList .imageBlock {
	width: 120px;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	background-color: #fff;
}

.interviewList .imageBlock img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	transition: transform 0.3s ease;
}
.interviewList .item:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}
.interviewList .item:hover .imageBlock img {
	transform: scale(1.08);
}

@media screen and (max-width: 1024px) {
	.interviewList{
		grid-template-columns: repeat(2, 1fr);
	}
}
@media screen and (max-width: 599px) {
	.interviewList{
		grid-template-columns: repeat(1, 1fr);
		margin: 30px 0;
	}
}

/* インタビュー詳細 */
.interviewDetail {
	margin: 0 auto;
	padding: 40px 5%;
	line-height: 1.8;
	background-color: #fff;
	border-radius: 30px;
}

.secProfile {
	margin-bottom: 60px;
}

.profileInner {
	display: flex;
	gap: 30px;
	align-items: start;
}

.profileImg {
	width: 30%;
}

.profileImg img {
	max-width: 100%;
	height: auto;
}

.profileContent{flex: 1;}

.profileHeader {
	border-bottom: 2px solid var(--color-primary);
	padding-bottom: 15px;
	margin-bottom: 20px;
}

.profileHeader .shop {
	display: inline-block;
	background-color: #444;
	color: #fff;
	padding: 2px 10px;
	border-radius: 3px;
	margin-bottom: 8px;
}

.profileHeader .name {
	font-size: var(--font-size-heading);
	font-weight: bold;
	margin: 0 0 5px 0;
	display: flex;
	align-items: baseline;
	gap: 12px;
}

.profileHeader .ruby {
	font-size: var(--font-size-caption);
	color: #777;
	font-weight: normal;
}

.profileHeader .meta {
	font-size: var(--font-size-caption);
	color: #666;
	margin: 0;
}

/* プロフィール内のQ&A定義リスト */
.profileQnA dt {
	font-weight: bold;
	color: #ea5514;
	margin-top: 15px;
}

.profileQnA dt:first-child {
	margin-top: 0;
}

.profileQnA dd {
	margin: 4px 0 0 0;
	text-align: justify;
}

.secBlock:not(:last-of-type){
	margin-bottom: 60px;
}
.secHeading {
	font-size: var(--font-size-subheading);
	font-weight: bold;
	padding-left: 12px;
	border-left: 5px solid #ea5514;
	margin: 0 0 30px 0;
}

.secWrap{
	display: flex;
	gap: 30px 5%;
}
.secBlock:nth-of-type(even) .secWrap{
	flex-direction: row-reverse;
}
.secWrap .imageBlock{
	width: 30%;
	text-align: center;
}
.secWrap .imageBlock img{
	max-width: 100%;
	height: auto;
}
.secWrap .textBlock{
	flex: 1;
}

.qnaItem {
	margin-bottom: 35px;
}

.qTitle {
	font-weight: bold;
	margin: 0 0 12px 0;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	line-height: 1.5;
}

.qBadge {
	background-color: #ea5514;
	color: #fff;
	font-size: var(--font-size-caption);
	font-weight: bold;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-top: 2px;
}

.aBox {
	background-color: #fff;
	padding: 0 0 0 34px;
}

.aBox p {
	margin: 0 0 1em 0;
	text-align: justify;
}

.aBox p:last-child {
	margin-bottom: 0;
}

.messageBox {
	background-color: var(--color-secondary);
	border: 1px solid var(--color-primary);
	border-radius: 8px;
	padding: 25px;
	margin-top: 40px;
	margin-bottom: 30px;
}

.messageBox .msgTitle {
	font-weight: bold;
	color: #ea5514;
	margin: 0 0 15px 0;
}

.messageBox p {
	margin: 0 0 1em 0;
}

.messageBox p:last-child {
	margin-bottom: 0;
}

@media (max-width: 599px) {
	.interviewDetail {
		padding: 30px 20px;
	}

	.profileInner {
		flex-direction: column;
		gap: 20px;
	}
	.profileImg{
		text-align: center;
		width: 100%;
	}
	.aBox {
		padding-left: 0;
	}
	.profileHeader .name {
		flex-direction: column;
		gap: 2px;
	}
	.secWrap{
		flex-direction: column;
	}
	.secBlock:nth-of-type(even) .secWrap{
		flex-direction: column;
	}
	.secWrap .imageBlock{
		width: 100%;
	}
	.secWrap .textBlock{
		width: 100%;
	}
	.messageBox {
		margin-top: 20px;
		margin-bottom:0;
	}

}


/* 流れ
========================================== */
.flowWrap{
	position: relative;
	display: flex;
	flex-direction: column;
	gap:35px 30px;
	margin: 40px 0;
}
.flowWrap::before{
	content: "";
	position: absolute;
	top: 0;
	left: 38px;
	z-index: 1;
	width: 8px;
	height: 100%;
	background-color: var(--bg-lightgrey);
}
.flowWrap .item{
	position: relative;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 20px;
	padding:.8em 1.5em;
	background-color: #fff;
	border: 1px solid #ddd;
	box-sizing: border-box;
	border-radius: 10px;
}

.flowWrap .item .titleBlock{
	display: flex;
	align-items: center;
	gap:1em 2em;
	width: 16em;
	font-size: var(--font-size-accent);
	font-weight: 600;
}
.flowWrap .item .titleBlock .number{
	color: var(--color-primary);
	font-size: var(--font-size-heading);
	font-family: var(--font-english);
	font-weight:400;
}

.flowWrap .item .textBlock{
	width: calc(100% - 16em);
}

@media screen and (max-width:599px){
	.flowWrap .item{
		flex-direction: column;
		gap: 10px;
	}
	.flowWrap .item .titleBlock,
	.flowWrap .item .textBlock{width:100%;}
	.flowWrap::before{
		left: 28px;
	}
}

/* プライバシーポリシー
========================================== */
.privacyBox + .privacyBox{
	margin-top: 60px;
}

.privacyBox h2{
	line-height: var(--line-height-heading);
	margin-bottom: 1em;
	padding-bottom: 1em;
	border-bottom: 1px solid var(--border-color);
	font-weight: 600;
	font-size: var(--font-size-accent);
}
.privacyBox h3{
	line-height: var(--line-height-heading);
	padding: 1em 0;
	font-weight: 600;
}
.privacyBox dl dd{
	margin-bottom: 1em;
}