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

/* --------------------------------------------------------------
共通
-------------------------------------------------------------- */
#contents {
	width: var(--pcWidth);
	margin: 0 auto;
	padding: 40px 0 160px;
	padding-left: var(--pcSideSpace);
	padding-right: var(--pcSideSpace);
}

#breadcrumb {
	margin-bottom: 50px;
}

#breadcrumbArea ul {
	display: flex;
	flex-wrap: wrap;
	margin: -5px 0 0 -10px;
}

#breadcrumbArea ul li {
	background: url("../images/common/iconArrowPan.svg") no-repeat right top 10px / 8px 7px;
	font-size: 1.4rem;
	color: #666;
	padding: 0 18px 0 0;
	margin: 5px 0 0 10px;
	position: static;
}

#breadcrumbArea ul li:last-child {
	background: none;
	padding: 0;
}

#breadcrumbArea ul li::before {
	content: none;
}

.detail > *:last-child {
	margin-bottom: 0!important;
}

.detail > h2:first-child {
	margin-top: 0!important;
}

.aligncenter {
	display: block;
	margin: 0 auto;
	/* margin: 0 auto 25px; */
}

.alignright {
	display: block;
	margin: 0 0 30px 30px;
	float: right;
}

.alignleft {
	display: block;
	margin: 0 30px 30px 0;
	float: left;
}

.wp-caption {
	border: 1px solid #999;
	text-align: center;
	background-color: #eee;
	padding: 10px;
	margin-bottom: 30px;
	max-width: 100%;
	height: auto;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 0;
}

.wp-caption-text a, 
.wp-caption-text {
	font-size: 1.6rem;
	color: #666;
	margin: 5px 0 0;
}

.wp-video {
	margin-bottom: 30px;
}

.pagination {
	margin-top: 50px;
}

.pagination .navLinks {
	display: flex;
	flex-wrap: wrap;
	margin: -10px 0 0 -10px;
}

.pagination span, 
.pagination a {
	font-size: 16px;
}

.pagination .current, 
.pagination a.page-numbers {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 2px 5px;
	margin: 10px 0 0 10px;
	text-decoration: none;
	min-width: 32px;
	min-height: 30px;
}

.pagination .page-numbers.dots {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 10px 0 0 10px;
}

.pagination .current {
	border: var(--bd);
	background-color: var(--bgColorRev);
	color: var(--txtColorRev);
}

.pagination a.page-numbers {
	border: var(--bd);
	background-color: var(--bgColor);
	color: var(--txtColor);
}

.pagination a.page-numbers:hover {
	background-color: var(--bgColorRev);
	color: var(--txtColorRev);
}

#postNav {
	border-top: 1px solid #999;
	padding-top: 50px;
	margin-top: 50px;
	position: relative;
}

#postNav p {
	margin-bottom: 0;
}

#postNav .box {
	width: 100%;
	display: grid;
	grid-auto-columns: 1fr;
	grid-auto-flow: column;
	align-items: center;
	column-gap: 10px;
	min-height: 50px;
	position: absolute;
}

#postNav .box p a {
	display: inline-block;
}

#postNav .box p#prev a, 
#postNav .box p#next a {
	color: #000;
}

#postNav .box p#prev a {
	background: url("../images/common/iconArrowPrev.svg") no-repeat left center / 34px 17px;
	padding-left: 44px;
}

#postNav .box p#next {
	justify-self: end;
}

#postNav .box p#next a {
	background: url("../images/common/iconArrowNext.svg") no-repeat right center / 34px 17px;
	padding-right: 44px;
}

#postNav p#return {
	text-align: center;
	width: 300px;
	margin: 0 auto;
	position: relative;
}

#postNav p#return a {
	border: var(--bd);
	background-color: var(--bgColor);
	color: var(--txtColor);
	border-radius: 30px;
	text-decoration: none;
	padding: 10px;
	display: block;
}

#postNav p#return a:hover {
	background-color: var(--bgColorRev);
	color: var(--txtColorRev);
}

.pageColumn {
	display: grid;
	grid-template-columns: 760px 360px;
	column-gap: 80px;
}

.pageColumn + .pageColumn {
	margin-top: var(--pcH2mt);
}

.pageColumn + .pageColumn.clH3 {
	margin-top: var(--h3mt);
}

.pageColumn.W560 {
	grid-template-columns: 560px 560px;
}

.pageColumn.rev .columnL {
	order: 2;
}

.columnL > *:first-child, 
.columnR > *:first-child {
	margin-top: 0!important;
}

.columnL > *:last-child, 
.columnR > *:last-child {
	margin-bottom: 0!important;
}

.columnR .phList {
	display: grid;
	row-gap: 30px;
	justify-content: center;
	justify-items: center;
}

.columnR .phList figure {
	margin-bottom: 0;
}

.sticky {}
.gallery-caption {}
.bypostauthor {}
.screen-reader-text {}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	.pageColumn + .pageColumn {
		margin-top: var(--tbspH2mt);
	}

	.pageColumn, 
	.pageColumn.W560 {
		grid-template-columns: auto;
		row-gap: 30px;
	}

	.pageColumn.rev .columnL {
		order: initial;
	}

	.pageColumn.tbspRev .columnL {
		order: 2;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {

	#contents {
		width: var(--tbWidth);
		padding: 40px 0 100px;
		padding-left: var(--tbspSideSpace);
		padding-right: var(--tbspSideSpace)
	}

	.columnR .phList {
		grid-template-columns: repeat(auto-fit, minmax(223px, 1fr));
		column-gap: 30px;
	}

}


/*__________ SP __________*/
@media screen and (max-width: 767px) {

	#contents {
		width: var(--spWidth);
		min-width: var(--spWidthMin);
		max-width: var(--spWidthMax);
		padding: 40px 0 60px;
		padding-left: var(--tbspSideSpace);
		padding-right: var(--tbspSideSpace)
	}

	.aligncenter {
			margin: 0 auto 30px;
		}

	.alignright, 
	.alignleft {
		float: none;
		margin: 0 auto 30px;
	}

	#postNav .box {
		min-height: initial;
		margin-bottom: 15px;
		position: static;
	}

	.columnR .phList {
		grid-template-columns: repeat(auto-fit, minmax(157px, 1fr));
		column-gap: 20px;
	}

}


/* --------------------------------------------------------------
CATEGORY
-------------------------------------------------------------- */
#category h1 {
	margin-bottom: 20px;
}

#category p#catDesc {
	font-size: 2.4rem;
	margin-bottom: 40px;
}

/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	#category p#catDesc {
		font-size: 1.8rem;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}


/* --------------------------------------------------------------
CATEGORY-works
-------------------------------------------------------------- */
#categoryWorks ul#worksList {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 30px;
	row-gap: 40px;
}

#categoryWorks ul#worksList li {
	padding-left: 0;
	position: static;
	font-size: 1.6rem;
}

#categoryWorks ul#worksList li::before {
	content: none;
}

#categoryWorks ul#worksList li + li {
	margin-top: 0;
}

#categoryWorks ul#worksList li a {
	text-decoration: none;
	color: #000;
}

#categoryWorks ul#worksList li a p {
	margin-bottom: 0;
}

#categoryWorks ul#worksList li a figure.ph {
	background-color: #F2F2F2;
	margin-bottom: 20px;
	display: grid;
	overflow: hidden;
	align-items: center;
	justify-items: center;
	/* height: 380px; */
	aspect-ratio: 1/1;
}

#categoryWorks ul#worksList li a:hover figure.ph {
	background-color: rgba(242, 242, 242, 0.5);
}

#categoryWorks ul#worksList li a figure.ph img[src$=".svg"] {
	width: 760px;
}

#categoryWorks ul#worksList li a .catBox {
	display: flex;
	flex-wrap: wrap;
	place-items: baseline;
	margin-bottom: 5px;
}

#categoryWorks ul#worksList li a .catBox p.catName {
	border: 1px solid #000;
	border-radius: 9999px;
	padding: 2px 10px;
	margin-right: 10px;
	min-width: 60px;
	text-align: center;
}

#categoryWorks ul#worksList li a:hover .titBox p {
	text-decoration: underline;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {

	#categoryWorks ul#worksList {
		grid-template-columns: repeat(2, 1fr);
	}

}


/*__________ SP __________*/
@media screen and (max-width: 767px) {

	#categoryWorks ul#worksList {
		grid-template-columns: auto;
	}

}


/* --------------------------------------------------------------
SINGLE
-------------------------------------------------------------- */
#singleDetail h1 {
	margin-bottom: 5px;
}

#singleDetail time {
	font-size: 1.8rem;
	margin-bottom: 20px;
	display: inline-block;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	#singleDetail time {
		font-size: 1.4rem;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}


/* --------------------------------------------------------------
SINGLE-works
-------------------------------------------------------------- */
#singleWorkDetail #worksTit {
	display: flex;
	flex-wrap: wrap;
	place-items: baseline;
}

#singleWorkDetail p#customer {
	font-size: 3.0rem;
	font-weight: 700;
	position: relative;
}

#singleWorkDetail p#customer::before {
	content: '／';
}

#singleWorkDetail #mainPhoto {
	text-align: center;
	margin-bottom: 0;
}

#singleWorkDetail #subPhoto1, 
#singleWorkDetail #subPhoto2 {
	margin: 20px 0 0;
	display: grid;
	column-gap: 20px;
	justify-items: center;
}

#singleWorkDetail #subPhoto1 {
	grid-template-columns: repeat(2, 1fr);
}

#singleWorkDetail #subPhoto2 {
	grid-template-columns: repeat(3, 1fr);
}

#singleWorkDetail #subPhoto1 figure, 
#singleWorkDetail #subPhoto2 figure {
	margin-bottom: 0;
}

#singleWorkDetail .columnR {
	padding-top: 0;
}

#singleWorkDetail .columnR h2 {
	border-bottom: none;
	font-size: 2.8rem;
	padding-bottom: 0;
	margin-bottom: 30px;
}

#singleWorkDetail .columnR #spec {
	font-size: 1.6rem;
}

#singleWorkDetail .columnR #spec h3 {
	font-size: 1.8rem;
	margin: 30px 0 10px;
}

#singleWorkDetail .columnR #spec > *, 
#singleWorkDetail .columnR #spec ul li + li, 
#singleWorkDetail .columnR #spec ol li + li {
	margin-bottom: 5px;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	#singleWorkDetail p#customer {
		font-size: 2.0rem;
	}

	#singleWorkDetail .columnR h2 {
		margin-bottom: 20px;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}


/* --------------------------------------------------------------
PAGE
-------------------------------------------------------------- */
#pageDetail h1 {
	margin-bottom: 20px;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}


/* --------------------------------------------------------------
PAGE（コンテンツ幅ワイド用）
-------------------------------------------------------------- */
#contentsSe #pageDetail {
	padding-top: 40px;
}

#contentsSe h1 {
	width: var(--pcWidth);
	margin: 0 auto 20px;
	padding-left: var(--pcSideSpace);
	padding-right: var(--pcSideSpace);
}

#contentsSe h1 span.num {
	font-family: "Roboto", sans-serif;
	font-size: 12.0rem;
	font-weight: 300;
	line-height: 1;
}

#contentsSe h1 span {
	font-size: 3.4rem;
}

#contentsSe h2 {
	border-bottom: none;
	font-size: 3.0rem;
	padding-bottom: 0;
	margin: 40px 0 20px;
}

#contentsSe #breadcrumb {
	width: var(--pcWidth);
	margin: 0 auto 50px;
	padding-left: var(--pcSideSpace);
	padding-right: var(--pcSideSpace);
}

#contentsSe .detail {
	padding-bottom: 160px;
}

#contentsSe .contBox {
	padding: 0;
	padding-left: var(--pcSideSpace);
	padding-right: var(--pcSideSpace);
	margin-bottom: 80px;
}

#contentsSe .contBox.lead {
	font-size: 2.4rem;
}

#contentsSe figure.sePh {
	margin-bottom: 80px;
	height: 596px;
	overflow: hidden;
	position: relative;
}

#contentsSe figure.sePh img {
	width: 100%;
	min-width: 2000px;
	position: absolute;
	right: 50%;
	bottom: 50%;
	transform: translate(50%, 50%);
}

#contentsSe .pageColumn + .pageColumn {
	margin-top: 80px;
}

#contentsSe .columnR {
	padding-top: 0;
}

#contentsSe  p.btnView {
	max-width: 200px;
	margin: 50px 0 0 auto;
	font-size: 1.4rem;
}

#contentsSe  p.btnView.posL {
	margin-left: 0;
}

#contentsSe  p.btnView a {
	font-size: 1.6rem;
	width: auto;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) { 

	#contentsSe h1 {
		padding-left: var(--tbspSideSpace);
		padding-right: var(--tbspSideSpace);
	}

	#contentsSe #breadcrumb {
		padding-left: var(--tbspSideSpace);
		padding-right: var(--tbspSideSpace);
	}

	#contentsSe .contBox {
		padding-left: var(--tbspSideSpace);
		padding-right: var(--tbspSideSpace);
	}

	#contentsSe .contBox.lead {
		font-size: 1.8rem;
		margin-bottom: 40px;
	}

	#contentsSe h2 {
		font-size: 2.4rem;
		margin: 40px 0 10px;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {

	#contentsSe h1 {
		width: var(--tbWidth);
	}

	#contentsSe #breadcrumb {
		width: var(--tbWidth);
	}

	#contentsSe .detail {
		padding-bottom: 100px;
	}

	#contentsSe figure.sePh {
		height: 300px;
	}

	#contentsSe figure.sePh img {
		min-width: 1020px;
	}

}


/*__________ SP __________*/
@media screen and (max-width: 767px) {

	#contentsSe h1 {
		width: var(--spWidth);
		min-width: var(--spWidthMin);
		max-width: var(--spWidthMax);
	}

	#contentsSe #breadcrumb {
		width: var(--spWidth);
		min-width: var(--spWidthMin);
		max-width: var(--spWidthMax);
	}

	#contentsSe .detail {
		padding-bottom: 60px;
	}

	#contentsSe .contBox {
		margin-bottom: 60px;
	}

	#contentsSe figure.sePh {
		margin-bottom: 60px;
		height: 200px;
	}

	#contentsSe figure.sePh img {
		min-width: 672px;
	}

	#contentsSe .pageColumn + .pageColumn {
		margin-top: 60px;
	}

}

/* --------------------------------------------------------------
service
-------------------------------------------------------------- */
#service ul#pageContList {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 40px 40px;
}

#service ul#pageContList li {
	padding-left: 0;
	position: static;
}

#service ul#pageContList li::before {
	content: none;
}

#service ul#pageContList li + li {
	margin-top: 0;
}

#service ul#pageContList li a img {
	border-radius: 16px;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	#service ul#pageContList {
		gap: 30px 30px;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {

	#service ul#pageContList {
		grid-template-columns: auto;
	}

}


/*____________________ detail-page ____________________*/
#original-wear .pageColumn .columnL.bgLoulu {
	background: url("../images/service/loulu.svg") no-repeat right bottom / 272px 178px;
	padding-bottom: 198px;
}

#sign.detail {
	background: url("../images/service/bgSign.webp") no-repeat center bottom / 1740px 340px;
	padding-bottom: 420px;
}

#app .appColumn {
	display: grid;
	grid-template-columns: 128px 1fr;
	column-gap: 20px;
	margin-bottom: 30px;
}

#app .appColumn ul {
	margin-bottom: 0;
}

#app .appColumn ul li {
	font-size: 1.6rem;
}

#app .appColumn ul li + li {
	margin-top: 5px;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	#original-wear .pageColumn .columnL.bgLoulu {
		background: none;
		padding-bottom: 0;
	}

	#sign.detail {
		background-size: 836px 163px;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {

	#sign.detail {
		padding-bottom: 243px;
	}

}


/*__________ SP __________*/
@media screen and (max-width: 767px) {

	#sign.detail {
		padding-bottom: 223px;
	}

}


/* --------------------------------------------------------------
company
-------------------------------------------------------------- */
#company.detail {
	padding-bottom: 0;
}

#company #bgCompanyHome {
	background: url("../images/company/bgCompanyHome.webp") no-repeat center center / cover;
	min-height: 506px;
	/* min-height: 706px; */
}

#company #companyPageListArea {
	opacity: 0;
}

#company #companyPageListArea.on {
	background: url("../images/company/bgCompanyHome.webp") no-repeat center center / cover;
}

#company #companyPageList {
	display: grid;
	grid-auto-rows: minmax(506px, auto);
	/* grid-auto-rows: minmax(706px, auto); */
	/* align-items: center; */
	justify-items: center;
	max-width: 500px;
	margin: 0 auto;
	position: relative;
}

#company #companyPageList::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #646464;
	mix-blend-mode: multiply;
	z-index: 0;
}

#company #companyPageList ul {
  max-width: 300px;
  width: 100%;
	margin: 0;
	padding: 80px 40px;
	opacity: 0;
}

#company #companyPageList ul li {
	padding-left: 0;
	font-size: 2.0rem;
}

#company #companyPageList ul li::before {
	content: none;
}

#company #companyPageList ul li + li {
	margin-top: 30px;
}

#company #companyPageList ul li a {
	color: #fff;
	text-decoration: none;
	display: block;
}

#company #companyPageList ul li a:hover {
	text-decoration: underline;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}


/*____________________ profile ____________________*/
#profile dl {
	margin-bottom: 30px;
}

#profile dl dd + dt {
	margin-top: 20px;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}


/*____________________ calendar ____________________*/
#calendar p.holiday2, 
#calendar p.aw01b, 
#calendar p.aw02b, 
#calendar p.aw03b {
	background-repeat: no-repeat;
	background-position: 0 3px;
	background-size: 28px 28px;
	padding-left: 35px;
	min-height: 31px;
}

#calendar p.holiday2 {
	background-image: url("../images/company/calendar/iconHoliday.svg");
}

#calendar p.aw01b {
	background-image: url("../images/company/calendar/iconAw01.svg");
}

#calendar p.aw02b {
	background-image: url("../images/company/calendar/iconAw02.svg");
}

#calendar p.aw03b {
	background-image: url("../images/company/calendar/iconAw03.svg");
}

#calendar ul {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px 30px;
}

#calendar ul li {
	padding-left: 0;
	position: static;
}

#calendar ul li::before {
	content: none;
}

#calendar ul li + li {
	margin-top: 0;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	#calendar p.holiday2, 
	#calendar p.aw01b, 
	#calendar p.aw02b, 
	#calendar p.aw03b {
		background-position: 0 0;
		min-height: 28px;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {

	#calendar ul {
		gap: 20px 20px;
	}

}


/* --------------------------------------------------------------
security
-------------------------------------------------------------- */
#security dl, 
#compliance dl {
	margin-bottom: 20px;
}

#security dl dt, 
#compliance dl dt {
	font-size: 2.2rem;
	font-weight: 500;
}

#security dl dd + dt, 
#compliance dl dd + dt {
	margin-top: 10px;
}


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {

	#security dl dt, 
	#compliance dl dt {
		font-size: 1.8rem;
	}

}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}


/* --------------------------------------------------------------
-------------------------------------------------------------- */
/*____________________  ____________________*/


/*__________ TAB-SP __________*/
@media screen and (max-width: 959px) {}


/*__________ TAB __________*/
@media screen and (max-width: 959px) and (min-width: 768px) {}


/*__________ SP __________*/
@media screen and (max-width: 767px) {}