@charset "utf-8";
/***************************************************
information
  filename : private.css;
***************************************************/

/* ** private_custom start ** */
/****************** カスタムcss ******************/

/****************** 既存cssに対しての個別設定(ナビに関係する箇所) ******************/

/****************** 職人手配個別設定(個別パーツ作成) ******************/

/*** サイトロゴ調整(ロゴとメニュー表記箇所) ***/
.siteLogoBox {display: flex;align-items: center;}

/* サイドナビ箇所 */
.catenav.catenav-plain.catenav.catenav-align-right {padding: 5.0rem 0 5.0rem 2.0rem;}
.catenav.catenav-plain > nav > ul > li > a,
.catenav.catenav-plain > nav > ul > li > span.no-link {margin-top: 2.0rem;margin-bottom: 2.0rem;}
.catenav.catenav-plain a,
.catenav.catenav-plain span.no-link {padding: 0.8rem 1.5rem;}
.catenav a,
.catenav span.no-link {color: #fff;}
.catenav a:hover,
.catenav a.crt,
.catenav li.crt > a,
.catenav li.active > a {
	color: var(--color-bg-mainti);
	background: #fff;
}
.catenav ul.children {
	margin: 0.2rem 0 0;
	padding-left: 2.5rem;
	border-left: 1px solid #4f98c0;
}
.catenav.catenav-plain > nav > ul > li > a::before,
.catenav.catenav-plain > nav > ul > li > span.no-link::before {background: #fff;}
.catenav.catenav-accordion .catenav-toggle::before {
	border-right: solid 1px #fff;
	border-bottom: solid 1px #fff;
}
.cbDrawerBody .catenav.catenav-plain.catenav.catenav-align-right {padding: 1.0rem 0 5.0rem 2.0rem;}
.cbDrawerBody .catenav.catenav-plain > nav > ul > li > a,
.cbDrawerBody .catenav.catenav-plain > nav > ul > li > span.no-link {margin-top: 0;margin-bottom: 0;}

/*** ウェルカム ***/
.profGuide {
	margin: 0 auto;
	padding: 2.5rem;
	border-radius: 0.2em;-webkit-border-radius: 0.2em;-moz-border-radius: 0.2em;
	background: var(--surface-panel);
	border: var(--color-brd-box-inside);
}
.profGuide h2 {padding: 0 0 1.0rem 0;font-size: clamp(2.4rem, 2.0vw, 2.6rem);color: var(--brand-primary-dkm);font-weight: var(--fw-ui);}
.profGuide .profGuideSup {padding: 0;font-size: clamp(1.6rem, 1.6vw, 1.6rem);line-height: 1.4;font-weight: var(--fw-ui);}
.profGuide .profGuideTxt {padding: 1.0rem 0;font-size: clamp(1.4rem, 1.4vw, 1.4rem);}
.profGuide h3 {padding: 0.5rem 0 1.5rem 0;font-size: clamp(1.8rem, 1.8vw, 1.8rem);color: var(--brand-primary-dkm);font-weight: var(--fw-ui);}
.profGuide ul {margin: 0 2.5rem;padding: 0;font-size: clamp(1.4rem, 1.4vw, 1.4rem);}

.profGuide .btdezpt01.profBt {display: flex;justify-content: flex-end;}
.profGuide .btdezpt01.profBt .inductionBtInn {width: 25.0rem;}

@media screen and (max-width: 600px) {
	.profGuide {width: 90%;margin: 2.5rem auto;padding: 2.0rem;}
	.profGuide .btdezpt02 .inductionBtInn {margin: 2.0rem auto 0 auto;display: block;}
	.profGuide .btdezpt01.profBt {display: block;}
	.profGuide .btdezpt01.profBt .inductionBtInn {width: 90%;}
}
/*** 目的別使い方 ***/
.helpGuide {
	margin: 0 auto;
	padding: 2.5rem 1.5rem 1.5rem 1.5rem;
	border-radius: var(--dispatchBox-rod);-webkit-border-radius: var(--dispatchBox-rod);-moz-border-radius: var(--dispatchBox-rod); /* 角丸 */
	background: var(--color-bg-box);
	border: var(--color-brd-box);
	text-align: center;
}
.helpGuide h2 {
	padding: 0 0 1.0rem 0;
	font-size: clamp(2.8rem, 2.8vw, 3.2rem);
	text-align: center;
	font-weight: var(--fw-ui);
}
.helpGuide .helpGuideSup {padding: 0;font-size: clamp(1.2rem, 1.6vw, 1.6rem);line-height: 1.2;}

.helpGuideInnBox {margin: 2.0rem auto;}
.helpGuideInn {
	margin: 1.0rem 0.5rem;
	padding: 2.5rem 1.5rem;
	border-radius: var(--dispatchBox-rod);-webkit-border-radius: var(--dispatchBox-rod);-moz-border-radius: var(--dispatchBox-rod); /* 角丸 */
	border: var(--app-HelpWakuInn-brd); /* ボーダー指定 */
	background: var(--app-HelpWakuInn-bg);/* 背景指定 */
}
.helpGuideInn .helpGuideInnSup {padding: 0;font-size: clamp(1.4rem, 1.4vw, 1.4rem);line-height: 1.2;}
.helpGuideInn h3 {
	padding: 0.5rem 0;
	font-size: clamp(2.4rem, 2.8vw, 2.8rem);
	text-align: center;
	font-weight: var(--fw-ui);
}
.helpGuideInnImg {padding: 2.5rem 0;}
.helpGuideInnImg img {width: auto;margin: 0 auto;}

/*** ご契約内容リンク箇所の制御 ***/
.contractBox {
	margin: 0 auto;
	padding: 1.5rem 1.5rem 1.0rem 1.5rem;
	border-radius: var(--dispatchBox-rod);-webkit-border-radius: var(--dispatchBox-rod);-moz-border-radius: var(--dispatchBox-rod); /* 角丸 */
	background: var(--color-bg-box);
	border: var(--color-brd-box);
	text-align: left;
}
.contractBox h3 {
	padding: 0 0 0.5rem 0;
	font-size: clamp(2.4rem, 2.8vw, 2.8rem);
	color: var(--brand-primary-dkm);
	font-weight: var(--fw-ui);
}
.contractBox .contractTxt {padding: 0;font-size: clamp(1.2rem, 1.4vw, 1.4rem);}

/*** FAQリンク箇所の制御 ***/
.faqLinkBox {
	position: relative;
	margin: 0 auto;
	padding: 0;
}
.faqLinkBox .faqLinkImg img {width: 100%;}
.faqLinkTxt {
	position: absolute;
	left: 50%;
	bottom: 2.0rem;
	font-size: clamp(1.4rem, 1.4vw, 1.4rem);
	font-weight: bold;
	color: #fff;
	white-space:nowrap;
	transform: translate(-50%);
}
/*** ご利用ガイドリンク箇所の制御 ***/
.guideLinkBox {
	margin: 0 auto;
	padding: 1.5rem 1.5rem 1.0rem 1.5rem;
	border-radius: var(--dispatchBox-rod);-webkit-border-radius: var(--dispatchBox-rod);-moz-border-radius: var(--dispatchBox-rod); /* 角丸 */
	background: var(--color-bg-box);
	border: var(--color-brd-box);
	text-align: center;
}
.guideLinkBox h3 {
	padding: 0 0 0.5rem 0;
	font-size: clamp(2.2rem, 2.2vw, 2.2rem);
	color: var(--brand-primary-dkm);
	text-align: center;
	font-weight: var(--fw-ui);
}
.guideLinkSup {
	padding: 0 1.5rem 0.5rem 1.5rem;
	font-size: clamp(1.2rem, 1.2vw, 1.2rem);
	text-align: left;
	font-weight: var(--fw-ui);
}
.guideLinkBt {
	margin: 1.0rem auto;
	padding: 1.0rem;
	border-radius: var(--dispatchBox-rod);-webkit-border-radius: var(--dispatchBox-rod);-moz-border-radius: var(--dispatchBox-rod); /* 角丸 */
	color: var(--brand-primary-dkm );
	background: var(--color-bg-box-inside);
	border: var(--color-brd-box-inside);
	text-align: center;
	font-weight: var(--fw-ui);
}
.guideLinkStep {font-size: clamp(1.2rem, 1.2vw, 1.2rem);}
.guideLinkTxt {font-size: clamp(1.6rem, 1.6vw, 1.6rem);}

/* メインタイトルデザイン変更処理 */
.ListHeadControl .mainTi {color:  var(--brand-primary);}
.matching .ListHeadControl .mainTi {color:  var(--brand-primary-matching);}

/****************** 職人手配個別設定(ログインパーツ作成) ******************/

/*** ログイン画面 ***/
/* 枠要素 */
.LoginBgArea {background: var(--custom-bg-mainbg);}
.LoginAreaInn {
	width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
/* 左要素（テキスト） */
.LoginAreaTxt {
	padding-top: 28.0rem;
	color: #fff;
	text-shadow:
	0 2px 4px rgba(0,0,0,0.9),
	0 4px 8px rgba(0,0,0,0.8),
	0 8px 20px rgba(0,0,0,0.6);
}
.LoginAreaTi {
	font-size: 6.5rem;
	font-weight: 800;
	line-height: 1.2;
}
.LoginAreaSubTxt {
	padding-top: 1.5rem;
	font-size: 2.5rem;
	font-weight: 600;
	line-height: 1.6;
}
/* 右要素（ログインボックス） */
.LoginAreaBox {
	padding-top: 5.0rem;
	padding-bottom: 5.0rem;
}
.loginDetBox {
	background: var(--custom-bg-login-box);
	border-radius: var(--dispatchBox-rod); /* 角丸 */
	border: 1px solid var(--custom-brd-login-base);
}
.loginDetBt dl {display: flex;}
.loginDetBt dt {width: 100%;}
.loginDetBt a {
	width: 100%;
	display: block;
	padding: 1.0rem 0.5rem;
	text-align: center;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 600;
}
.loginDetBt .loginDetBtBiz a,
.loginDetBiz .loginDetTxt {background: var(--custom-bg-login-base);}
.loginDetBt .loginDetBtApp a,
.loginDetApp .loginDetTxt {background: var(--custom-bg-login-sub);}
.loginDetBt a:hover {text-decoration: none;filter: alpha(opacity=80);-moz-opacity:0.80;opacity:0.80;}

.loginDetail {margin: 0 auto;}
.loginDetTxt {
	width: 100%;
	padding: 2.5rem 0.5rem;
	text-align: center;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 600;
}
.authPlain .LoginBox {padding: 0 1.0rem;}
.authPlain .LoginBoxInn {
	padding: 0.5rem 1.0rem;
	border-radius: var(--dispatchBox-rod); /* 角丸 */
	border: var(--color-brd-box-inside);
}
.authBtSimple.BtM .LoginBt {
	width: 90%;
    color: var(--color-text-bt-login);
    background: var(--custom-bg-loginBt-base);
    border: none;
    box-shadow: var(--color-sd-bt-login);
}
.authBtSimple.BtM .reminderBt {
    width: 90%;
    margin: 0 auto;
    padding: 0.5rem;
    color: var(--color-text-bt-reminder);
    background: none;
    border: none;
    box-shadow: none;
}
.authBtSimple.BtM .newmemBt {
    margin: 2.0rem auto;
    padding: 1.5rem 0.5rem;
    width: 95%;
    font-size: 1.4rem;
    color: var(--custom-bg-loginBt-base);
    background: inhelit;
    border: 1px solid var(--custom-bg-loginBt-base);
}
.authBtSimple.BtM button.newmemBt.next::after,
.authBtSimple.BtM a.newmemBt.next::after,
.authBtSimple.BtM span.newmemBt.next::after,
.authBtSimple.BtM button.newmemBt.back::after,
.authBtSimple.BtM a.newmemBt.back::after,
.authBtSimple.BtM back.newmemBt.next::after {border-left-color: var(--custom-bg-loginBt-base);}
.loginkiyakuTxt {
	padding: 0 0.5rem 2.5rem 0.5rem;
	text-align: center;
	font-size: 1.4rem;
}
@media screen and (min-width:800px) and ( max-width:1200px) {
	.LoginAreaInn {width: 90%;}
}
@media screen and (max-width: 800px) {
	.LoginBgArea {
		background-size: 100%;
	}
	.LoginAreaBox {
		padding-top: 2.0rem;
		padding-bottom: 0;
	}
	.LoginAreaInn {
		width: 90%;
		margin: 0 auto;
		display: block;
	}
	.LoginAreaTxt {padding-top: 16.0rem;}
	.LoginAreaTi {font-size: 3.0rem;}
	.LoginAreaSubTxt {padding-top: 1.0rem;font-size: 1.8rem;}
	.loginDetTxt {padding: 1.2rem 0.5rem;font-size: 1.2rem;}
}
/* 新規誘導エリア*/
.NewRegGuidanceBox {
	width: 90%;
	margin: 0 auto;
	padding: 2.0rem 0;
	display: flex;
	justify-content: space-between;
	gap: 2.0rem;
}
.NewRegGuidanceInnDet {padding-left: 10.0rem;}
.bizGuide .NewRegGuidanceInnDet {background: url(../../../images/sys_img/biz_ico.png) 0.5rem 1.5rem no-repeat;background-size: 70px;}
.staffGuide .NewRegGuidanceInnDet {background: url(../../../images/sys_img/staff_ico.png) 0.5rem 1.5rem no-repeat;background-size: 70px;}

.NewRegGuidanceInn {
	width: 100%;
	padding: 1.5rem;
	border-radius: var(--dispatchBox-rod); /* 角丸 */
}
.NewRegGuidanceInn.bizGuide {border: 1px solid var(--custom-txt-login-base);}
.NewRegGuidanceInn.staffGuide {border: 1px solid var(--custom-txt-login-sub);}
.NewRegGuideTiBox {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2.0rem;
}
.NewRegGuideTxtBox {padding: 0.5rem 0;}
h2.NewRegGuideTi {font-size: 2.4rem;}
.NewRegGuideTxt {font-size: 1.4rem;padding: 0 0.2rem 1.0rem 0.2rem;}
.NewRegGuideSup {
	font-size: 1.4rem;
	padding: 0.5rem 1.0rem;
	border-radius: var(--dispatchBox-rod); /* 角丸 */
}
.bizGuide h2.NewRegGuideTi {color: var(--custom-txt-login-base);}
.staffGuide h2.NewRegGuideTi {color: var(--custom-txt-login-sub);}
.bizGuide .NewRegGuideSup {
	color: var(--custom-txt-login-base);
	background: var(--custom-bg-NewRegGuideSup-base);
}
.staffGuide .NewRegGuideSup {
	color: var(--custom-txt-login-sub);
	background: var(--custom-bg-NewRegGuideSup-sub);
}
.NewRegGuideBt a {
	width: 20.0rem;
	display: block;
	padding: 0.8rem 1.5rem;
	border-radius: var(--dispatchBox-rod); /* 角丸 */
	font-size: 1.4rem;
	font-weight: 600;
	text-align: center;
}
.NewRegGuideBt a:hover {text-decoration: none;filter: alpha(opacity=80);-moz-opacity:0.80;opacity:0.80;}
.bizGuide .NewRegGuideBt a {
	color: var(--custom-txt-login-base);
	border: 1px solid var(--custom-txt-login-base);
}
.staffGuide .NewRegGuideBt a {
	color: var(--custom-txt-login-sub);
	border: 1px solid var(--custom-txt-login-sub);
}
@media screen and (max-width: 800px) {
	.NewRegGuidanceBox {
		width: 90%;
		margin: 0 auto;
		padding: 2.0rem 0;
		display: block;
	}
	.NewRegGuidanceInnDet {padding-left: 0;padding-top: 9.0rem;}
	.bizGuide .NewRegGuidanceInnDet {background: url(../../../images/sys_img/biz_ico.png) center top no-repeat;background-size: 80px;}
	.staffGuide .NewRegGuidanceInnDet {background: url(../../../images/sys_img/staff_ico.png) center top no-repeat;background-size: 80px;}

	.NewRegGuidanceInn {margin-bottom: 1.0rem;}
	.NewRegGuideTiBox {display: block;}
	h2.NewRegGuideTi {font-size: 1.6rem;text-align: center;padding-bottom: 1.0rem;}
	.NewRegGuideBt a {width: 100%;}
	.NewRegGuideTxt {font-size: 1.3rem;padding: 1.0rem 0.2rem;}
}
.siteSpotRailBox {
	padding-top: 2.0rem;
	padding-bottom: 2.0rem;
	border-top: var(--color-brd-box-inside);
	border-bottom: var(--color-brd-box-inside);
}
/*** セールスポイントエリア ***/

/*** おすすめポイント ***/

/* 帯付タイトル */
.SitePointTiBox {
	display: flex;
	align-items: center;
	gap: 4.0rem;
	margin: 0 auto;
	padding: 4.0rem 2.0rem 3.0rem;
}
.SitePointTiBox::before,
.SitePointTiBox::after {
	content: "";
	flex: 1 1 auto;
	border-top: var(--mpNetworkCounter-brd);
}
.SitePointTiBox > .SitePointTi {
	flex: 0 0 auto;
	margin: 0;
	color: var(--mpNetworkCounter-txt);
	font-size: 2.4rem;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}
/* 要素枠 */
.SitePointBox {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 2.0rem;
	max-width: 140rem;
	margin: 0 auto;
	padding: 0 2.0rem 5.0rem;
}
/* 子要素 */
.SitePointInn {
	--site-point-cr: var(--app-main-cr);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	margin: 0;
	padding: 0.5rem 1.0rem 2.5rem 1.0rem;
	color: var(--site-point-cr);
	background: inhelit;
	border-radius: var(--dispatchBox-rod); /* 角丸 */
	border: solid 1px var(--site-point-cr);
	text-align: center;
}

.SitePointImg {
	width: 16.0rem;
	height: 16.0rem;
	margin: 0 auto 0.5rem;
	background-color: currentColor;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}
.SitePointInn .SitePointImg {background-color: transparent;}

/* アイコン画像を使う場合 */
.SitePoint01 .SitePointImg {background-image: url("../../../images/sys_img/point01_ico.png");}
.SitePoint02 .SitePointImg {background-image: url("../../../images/sys_img/point02_ico.png");}
.SitePoint03 .SitePointImg {background-image: url("../../../images/sys_img/point03_ico.png");}
.SitePoint04 .SitePointImg {background-image: url("../../../images/sys_img/point04_ico.png");}

/* 色分け */
.SitePoint01 {--site-point-cr: #005bac;}
.SitePoint02 {--site-point-cr: #159447;}
.SitePoint03 {--site-point-cr: #f08300;}
.SitePoint04 {--site-point-cr: #6f45b7;}

.SitePointInn > .SitePointTi {
	margin: 0 0 0.8rem;
	color: var(--site-point-cr);
	font-size: 2.0rem;
	font-weight: 600;
	line-height: 1.35;
}

.SitePointTxt {
	margin: 0;
	color: var(--mpNetworkCounter-txt);
	font-size: 1.4rem;
	font-weight: 600;
	line-height: 1.7;
}
@media screen and (max-width: 900px) {
	.SitePointBox {grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media screen and (max-width: 600px) {
	.SitePointTiBox {
		gap: 1.5rem;
		padding: 3.0rem 1.5rem 2.0rem;
	}
	.SitePointBox {
		grid-template-columns: 1fr;
		padding: 0 1.5rem 4.0rem;
	}
	.SitePointInn {
		min-height: 0;
		padding: 0.5rem 1.5rem 2.0rem 1.5rem;
	}
	.SitePointImg {
		width: 12.5rem;
		height: 12.5rem;
	}
}
/* ==================================================
   フッター Section
   ================================================== */

/*----------- 会社名エリア -----------*/
.corpCtmSiteLogo {
	width: 250px;
	height: 80px;
	background: url(https://img-hp.shokunin-tehai.online/site_rnw_img/basic_img/site_t_logo_l.png) center top no-repeat;
	background-size: 80% auto;
}
.corpCtmDet {padding: 0.5rem 0 4.5rem 0;}
.corpCtmDetInn {padding: 0.5rem 0 1.5rem 6.0rem;}
.corpCtmDetInn.tkIco {background: url(https://img-hp.shokunin-tehai.online/site_rnw_img/basic_img/tk_ico.png) left center no-repeat;}
.corpCtmDetInn.mavIco {background: url(https://img-hp.shokunin-tehai.online/site_rnw_img/basic_img/mav_ico.png) left center no-repeat;}
.corpCtmName {font-size: 1.6rem;line-height: 1.6;}
.corpCtmName span {font-size: 1.2rem;}
.corpCtmAdd {font-size: 1.0rem;}

@media screen and (max-width: 600px) {
	.footer_corporate {
		width: 80%;
		margin: 0 auto;
		padding: 2.5rem 0;
	}
}
/* ダークモード */
html[data-theme="dark"] .corpCtmSiteLogo {background-image: url(https://img-hp.shokunin-tehai.online/site_rnw_img/basic_img/site_t_logo_d.png);}
html[data-theme="dark"] .corpCtmDetInn.tkIco {background-image: url(https://img-hp.shokunin-tehai.online/site_rnw_img/basic_img/tk_ico_d.png);}
html[data-theme="dark"] .corpCtmDetInn.mavIco {background-image: url(https://img-hp.shokunin-tehai.online/site_rnw_img/basic_img/mav_ico_d.png);}

/* ** private_custom end ** */