@charset "UTF-8";


/* varSet Styles
-------------------------------------- */

/* -- varSet -- */
:root {

	/* -- color -- */
	--cMain:  #1a3047;
	--cMainB: #22324a;
	--cMainW: #042d59;
	--cAcc:  #E50153;
	--cSub:  #004690;
	--cWht:  #ffffff;
	--cGry:  #F8F8F8;
	--cBlk:  #35383f;

	/* -- fontSet -- */
	--fP: 400 16px/2.0 'Outfit','Noto Sans JP', sans-serif;
	--fH2: 300 30px/1.2 'Noto Serif JP', serif;

	/* -- font family -- */
	--fmR: 'Zen Maru Gothic', sans-serif;
	--fmN: 'Noto Sans JP', sans-serif;
	--fmE: 'Outfit', sans-serif;


	/* -- width set -- */
	--w1280: 1280px;
	--w960: 960px;
	--w780: 780px;
	--w640: 640px;
	--w480: 480px;


	/* -- flex set -- */
	--fx: flex;
	--fgap: 30px;
	--fclm2: calc(50% - 15px);
	--fclm3: calc(33.33% - 20px);
	--fclm4: calc(25% - 22.5px);


	/* -- br set -- */
	--nbr: none;
	--br: block;
}

@media screen and (max-width:780px) {
	:root {
		--fclm3: calc(50% - 15px);
		--fclm4: calc(50% - 15px);
		--nbr: block;
		--br: none;
		--fP: 500 16px/2.0 'Outfit','Noto Sans JP', sans-serif;
		--fH2e: 600 20px/1.0 'Outfit', sans-serif;
		--fH2c: 600 20px/1.2 'Zen Maru Gothic', sans-serif;
		--fH2p: 500 22px/2.0 'Zen Maru Gothic', sans-serif;
		--fH3: 500 20px/1.6 'Zen Maru Gothic', sans-serif;
	}
}
@media screen and (max-width:480px) {
	:root {
		--fx: block;
		--fclm2: calc(100% - 30px);
		--fclm3: calc(100% - 30px);
		--fclm4: calc(100% - 30px);
	}
}


/* -- a:link -- */
/* a:link    {color:#2280C0;}
a:visited {color:#105280;}
a:active  {color:#105280;} */
a {transition: all 0.15s;}


/* -- placeholder -- */
::placeholder            {color: #888;}
::-ms-input-placeholder  {color: #888;}
:-ms-input-placeholder   {color: #888;}

/* -- img -- */
figure img {width: 100%;}

/* -- br -- */
br.pcBr {
	display: var(--nbr);
}
br.spBr {
	display: var(--nr);
}

/*-- baseFontSet --*/
html,body,div,dl,dt,dd,ul,ul li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,select,option,button,p,blockquote,th,td,
section,nav,article,aside,header,address,figure,figcaption {
	font: 400 15px/1.8 'Outfit','Noto Sans JP', sans-serif;
	color: var(--cBlk);
}
/* ---------------------------------------------
	common Styles
--------------------------------------------- */

img:is([sizes="auto" i], [sizes^="auto," i]) { contain-intrinsic-size: 3000px 1500px }

body {
	background: var(--cWht);
	overflow: hidden;
	padding: 0 !important;
}
.container {
	position: relative;
}

/* -- sectionBox -- */
/* -- sectionBox header -- */
/* -- sectionBox .article -- */
/* -- responsive brake point -- */
@media screen and (max-width:900px) {}

 #contents .breadcrumb {
	padding-top: 80px !important;
}






/* ---------------------------------------------
	globalHeader Styles
--------------------------------------------- */
#globalHeader {
	height: 75px;
	position: fixed;
	z-index: 20;
	top: 0;
	left: 0;
	right: 0;
	background: var(--cWht);
}
#globalHeader .inner {
	height: 75px;
	width: calc(100% - 40px);
	max-width: 1280px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
}


/* -- siteTitle -- */
#siteTitle {}
#siteTitle h1 {}
#siteTitle h1 a {}
#siteTitle h1 a img {
	width: 180px;
	margin-bottom: 5px;
	margin-left: 2px;
}

/* -- globalNav -- */

@media screen and (min-width:1025px)  {
	#globalNav {
		width: calc(100% - 190px)
	}
	#globalNav hgroup {
		display: none;
	}

	#globalNav .navBox {
		display: flex;
		justify-content: flex-end;
		flex-wrap: wrap;
	}
	#globalNav .navBox ul.main {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		align-items: center;
	}
	#globalNav .navBox ul.main > li > a {
		display: flex;
		height: 75px;
		padding-left: 8px;
		padding-right: 8px;
		justify-content: center;
		flex-wrap: wrap;
		align-items: center;
		align-content: center;
		font: 500 13px/1.0 'Monteserrat', 'Noto Sans JP', sans-serif;
		letter-spacing: .05em;
		text-decoration: none;
		color: var(--cMain);
		border-bottom: 4px solid var(--cWht);
		border-bottom: 4px solid var(--cWht);
	}
	#globalNav .navBox ul.main > li > a:hover {
		border-bottom: 4px solid var(--cMain);
	}

	body.page-id-20756 #globalNav .navBox ul.main > li:nth-child(7) > a,
	body.page-id-20836 #globalNav .navBox ul.main > li:nth-child(2) > a,
	body.page-id-20712 #globalNav .navBox ul.main > li:nth-child(1) > a {
		border-bottom: 4px solid var(--cMain);
	}


	#globalNav .navBox ul.main > li > a:last-child {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		align-items: center;
	}
	#globalNav .navBox ul.main > li:last-child > a::after {
		content: '';
		display: inline-block;
		margin-left: 5px;
		width: 13px;
		height: 13px;
		background: url(https://rechroma.co.jp/wp-content/uploads/ico_exlink.svg) no-repeat 0 1px;
		background-size: 11px;

	}
	/* #globalNav .navBox ul.main li.serviceLink {
		
	}
	#globalNav .navBox ul.main li.serviceLink ul {
		border-top: 1px solid #ddd;
		position: absolute;
		z-index: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 54px;
		width: 100vw;
		height: 100px;
		top: 75px;
		left: -200vw;
		right: -100vw;
		background: #f7f7f7;
	} */
	/* #globalNav .navBox ul.main li.serviceLink:hover ul {
		top: 75px;
		left: 0;
		right: 0;
	}
	#globalNav .navBox ul.main li.serviceLink ul li {
		
	}
	#globalNav .navBox ul.main li.serviceLink ul li a {
        font: 500 13px / 1.0 'Monteserrat', 'Noto Sans JP', sans-serif;
		text-decoration: none;
	}
	#globalNav .navBox ul.main li.serviceLink ul li a:hover {
		text-decoration: underline;
	}
	#globalNav .navBox ul.main li.serviceLink ul li:first-child {
		font-size: 18px;
		font-weight: 700;
		position: relative;
		padding-right: 32px;
	}
	#globalNav .navBox ul.main li.serviceLink ul li:first-child::before {
		content: '';
		display: block;
		position: absolute;
		z-index:5;
		left: 0;
		bottom: -3px;
		width: 40px;
		height: 3px;
		background: #1a3047;
	} */
	/* サービスタブを基準位置に & 最前面に */
    #globalNav .navBox ul.main li.serviceLink {
        position: relative;
        z-index: 9999;
    }

    /* ▼ サービスの child-menu（タブ直下に縦方向で表示） */
    #globalNav .navBox ul.main li.serviceLink > ul {
        position: absolute;
        top: 75px;                 /* ヘッダー高さに合わせる */
        left: 0;
        transform: none;

        background: #f7f7f7;
        padding: 30px;
        box-sizing: border-box;

        /* ★ flex を縦方向にして中身を縦並びに */
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;

        width: auto;
        min-width: 320px;          /* 必要に応じて 360 / 400 に変更可 */
        max-width: none;

        opacity: 0;
        visibility: hidden;
        transition: .3s;
        z-index: 9999;
    }

    /* ホバー中は表示 */
    #globalNav .navBox ul.main li.serviceLink:hover > ul {
        opacity: 1;
        visibility: visible;
    }

    /* ▼ サービスの各 li は1カラム全幅扱い */
    #globalNav .navBox ul.main li.serviceLink > ul > li {
        width: 100%;
        margin-bottom: 12px;
    }

    /* ▼ 見出し（サービスTOP） */
    #globalNav .navBox ul.main li.serviceLink > ul > li:first-child {
        font-size: 18px;
        font-weight: 700;
        position: relative;
        margin-bottom: 16px;
        padding-bottom: 6px;
    }

    /* ▼ 通常リンク（コンサル / Eラーニング / Scope3） */
    #globalNav .navBox ul.main li.serviceLink > ul > li > a {
        display: block;
        font: 500 14px/1.2 'Monteserrat','Noto Sans JP',sans-serif;
        color: #004e8e;
        text-decoration: none;
    }

	#globalNav .navBox ul.main li.serviceLink > ul > li > a:hover {
        text-decoration: underline;
    }
	#globalNav ul.main .has_child {
		position: static;
	}
	#globalNav ul.main .has_child .child-menu {
		position: fixed;
		top: 75px;
		left: 0;
		right: 0;
		transform: none;
		width: 100vw;
		max-width: none;
		box-sizing: border-box;
	}
	#globalNav .navBox ul.utility {
		margin-left: 20px;
		display: flex;
		justify-content: flex-end;
		flex-wrap: wrap;
		align-items: center;
	}
	#globalNav .navBox ul.utility li {
		margin-left: 12px;
	}
	#globalNav .navBox ul.utility li a {
		display: block;
		background: var(--cMain);
		padding: 8px 12px;
		font: 500 14px/1.0 'Monteserrat', 'Noto Sans JP', sans-serif;
		text-decoration: none;
		color: var(--cWht);
		border: 1px solid var(--cMain);
	}
	#globalNav .navBox ul.utility li a:hover {
		background: var(--cWht);
		color: var(--cMain);
	}

}
@media screen and (min-width:1025px) and (max-width: 1190px) {
	#globalNav .navBox ul.utility {
		margin-left: 0px;
	}
	#globalNav .navBox ul.main li a {
		padding-left: 3px;
		padding-right: 3px;
	}
}
@media screen and (max-width: 1024px) {
	#globalNav .navBox ul.main li.serviceLink ul {
		display: none;
	}
}


/* -- hamburger set -- */
#globalNav header {
	position: absolute;
	display: none;
	right: 0;
	top: 0;
	min-width: 75px;
	min-height: 75px;
	cursor: pointer;
	background: var(--cMain);
}

#globalNav header p span,
#globalNav header p::before,
#globalNav header p::after {
	display: block;
	width: 38px;
	height: 3px;
	content: '';
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	border-radius: 5px;
	background-color: var(--cWht);
}
#globalNav header p span {
	position: relative;
	margin: 9px 0;
}
#globalNav header p {
	position: absolute;
	padding: 1.2em 0;
	width: 38px;
	cursor: pointer;
	text-align: center;
}
#globalNav header p.active span {
	-webkit-transform: scale(0);
	        transform: scale(0);
}
#globalNav header p.active::before {
	-webkit-transform: translateY(10px) rotate(135deg);
	        transform: translateY(10px) rotate(135deg);
}
#globalNav header p.active::after {
	-webkit-transform: translateY(-13px) rotate(-135deg);
	        transform: translateY(-13px) rotate(-135deg);
}
#globalNav header h2 {
	position: relative;
	top: 50px;
	right: 0;
	width: 37px;
	text-align: center;
	font-size: 10px;
	color: var(--cWht);
	letter-spacing: 0 !important;
}
@media screen and (max-width:1024px) {
	#globalNav header {
		display: flex;
		justify-content: center;
	}
	#globalNav .navBox {
		display: none; /* HAMBURGER */
		position: absolute;
		content: '';
		z-index: 21;
		height: 100vh;
		top: 75px;
		left: 0;
		right: 0;
		bottom: 0;
		background: var(--cMain);
		overflow: hidden;
	}
	#globalNav ul.main {
		border-top: 1px solid rgba(255,255,255,.4);
		padding: 20px;
		background: var(--cMain);
	}
	#globalNav ul.main li {
		border-bottom: 1px dotted rgba(255,255,255,.6);
	}
	#globalNav ul.main li:first-child {
		border-top: 1px dotted rgba(255,255,255,.6);
	}
	#globalNav ul.main li a {
		display: block;
		padding: 16px;
		font: 500  14px/1.0 'Monteserrat', 'Noto Sans JP', sans-serif;
		color: var(--cWht);
		text-decoration: none;
		background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 16px center;
		background-size: 14px;
	}
	#globalNav ul.main li a:hover {
		background: #fff url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 13px center;
		background-size: 14px;
		color: var(--cMain)
	}

	#globalNav ul.utility {
		padding: 0 20px ;
		background: var(--cMain);
	}
	#globalNav ul.utility li {
		margin-bottom: 20px;
	}
	#globalNav ul.utility li a {
		display: block;
		padding: 16px;
		background: var(--cWht);
		color: var(--cMain);
		border-radius: 4px;
		font: 500  14px/1.0 'Monteserrat', 'Noto Sans JP', sans-serif;
		text-decoration: none;
		text-align: center;
		border: 2px solid var(--cWht);
	}
	#globalNav ul.utility li a:hover {
		background: var(--cMain);
		color: var(--cWht);
	}

}


/* ---------------------------------------------
	mainVisual Styles
--------------------------------------------- */
#home #mainVisual {
	position: relative;
	margin:75px 0 0 0;
	background: #222 url(https://rechroma.co.jp/wp-content/uploads/top_1.png) no-repeat center center;
	background-size: cover;
	min-height: calc(100vh - 75px);
}
#mainVisual .inner {
	position: static !important;
}
#mainVisual .inner .catch {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: column-reverse;
}
#mainVisual .inner .catch h2 {
	margin-top: .9em;
	margin-bottom: .6em;
}
#mainVisual .inner .catch h2 img {
	filter: brightness(0) invert(1);
	width: 180px;
}
#mainVisual .inner .catch p {
	padding: 0 20px;
	margin-bottom: .9em;
	font: 200 28px/1.3 'Noto Serif JP', serif !important;
	color: #fff;
	text-align: center;
	letter-spacing: .37em;
	text-shadow: 0px 0px 10px rgba(0,0,0,.8);
}
@media screen and (max-width:1024px) {}


/* ---------------------------------------------
	pageHeader
--------------------------------------------- */
#pageHeader {
	position: relative;
	margin: 75px 0 0 0;
	width: 100%;
	height: 270px;
}
#pageHeader .inner {
	width: calc(100% - 40px);
	max-width: 1200px !important;
	margin: 0 auto;
}
#pageHeader .inner h2 {
	position: relative;
	z-index: 2;
	width: 100%;
	height: 270px;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
	font: 300 54px/1.0 'Noto Serif JP', serif;
	color: var(--cWht);
	text-shadow: 0px 0px 10px rgba(0,0,0,.8);
}
#pageHeader.company .inner h2 {
	color: var(--cBlk);
	text-shadow: 0px 0px 0px rgba(0,0,0,.0);
}
#pageHeader .inner figure {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1
}
#pageHeader .inner figure img {
	width: 100%;
	height: 270px;
	object-fit: cover;
	object-position: top center;
}

@media screen and (max-width:780px) {
	#pageHeader {
		height: 120px;
	}
	#pageHeader .inner h2 {
		height: 120px;
		font: 300 32px/1.0 'Noto Serif JP', serif;
	}
	#pageHeader .inner figure img {
		height: 120px;
	}

}


/* ---------------------------------------------
	globalBody Styles -- COMMON
--------------------------------------------- */

#globalBody .sectionBox .inner {
	width: calc(100% - 40px);
	max-width: 1200px !important;
	margin: 0 auto;
}
#globalBody .sectionBox .inner header h2 {
	font: var(--fH2);
}
#globalBody .sectionBox .inner .article h4 {
	padding-left: 0;
	border: none !important;
}


/* ---------------------------------------------
	globalBody Styles -- HOME
--------------------------------------------- */

/* -- topics -- */
#topics {
	border-top: 1px solid var(--cBlk);
	border-bottom: 1px solid var(--cBlk);
	padding: 56px 0 64px 0;
}
#topics.categories {
	border-top: none;
	border-bottom: none;
	padding: 0px 0 128px 0;
}
#topics .inner {
	width: calc(100% - 40px);
	max-width: 1200px !important;
	margin: 0 auto;
}
#topics .inner header {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 24px;
}
#topics .inner header h2 {
	font: var(--fH2);
	font-weight: 400;
}
#topics .inner header .archiveLink a {
	display: inline-block;
	padding-right: 20px;
	font: 300 14px/1.2 'Noto Serif JP', serif;
	color: var(--cBlk);
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 3px center;
	background-size: 12px;
}
#topics .inner header .archiveLink a:hover {
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 0px center;
	background-size: 12px;
}
#topics .inner .article .topicsList {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	border-left: 1px solid #ddd;
}
#topics .inner .article .topicsList li {
	flex-shrink: 0;
	width: 33.3333%;
}
#topics.categories .inner .article .topicsList {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	border-left: none;
	gap: 36px; 
}
#topics.categories .inner .article .topicsList li {
	flex-shrink: 0;
	width: calc(50% - 18px);
	border-left: 1px solid #ddd;
}
#topics .inner .article .topicsList li a {
	display: block;
	padding: 0 32px 0 32px;
	border-right: none;
	text-decoration: none;
}
#topics .inner .article .topicsList li a[href='#'] {
	pointer-events: none;
}
#topics .inner .article .topicsList li a:hover {
	text-decoration: underline;
}
#topics .inner .article .topicsList li a[href='#']:hover {
	text-decoration: none;
}
#topics .inner .article .topicsList li a time {
	display: inline-block;
	padding-left: 16px;
	padding-right: 12px;
	font: 400 12px/1.0 'Outfit', sans-serif;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_box-str.svg) no-repeat left center;
	color: #999;
	border-right: 1px solid #ddd;
}
#topics .inner .article .topicsList li a span {
	display: inline-block;
	padding-left: 11px;
	font: 400 11px/1.0 'Noto Sans JP', sans-serif;
	color: #999;

}
#topics .inner .article .topicsList li a p {
	padding-top: 8px;
	font: 500 13px/1.5 'Noto Sans JP', sans-serif;
}
#topics .inner .article .topicsList li a[target='_blank'] p::after {
	display: inline-block;
	margin-left: 5px;
	content:'';
	width: 12px;
	height: 12px;
	background:#ccc;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_exLink2.svg) no-repeat right center;
	background-size: 12px;
}
#topics .inner .article .button {
	margin-top: 64px;
	text-align: center
}
#topics .inner .article .button a {
	border: 2px solid var(--cMain);
	color: var(--cMain);
	display: inline-block;
	width: 220px;
	margin: 0 auto;
	padding: 16px 32px 16px 16px;
	text-decoration: none;
	letter-spacing: .2em;
	font: 400 14px/1.0 'Noto Serif JP', serif;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 20px center;
	background-size: 16px;
}
#topics .inner .article .button a:hover {
	background: var(--cMain) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 12px center;
	background-size: 16px;
	color: var(--cWht);
}

@media screen and (max-width:780px) {
	#topics .inner .article .topicsList {
		border-left: none;
		border-top: 1px solid #ddd;
	}
	#topics .inner .article .topicsList li {
		width: 100%;
	}
	#topics .inner .article .topicsList li a {
		padding: 32px;
		border-right: none;
		border-bottom: 1px solid #ddd;
	}
}

/* -- mission -- */
#mission {
	position: relative;
	z-index: 0;
	background: url(https://rechroma.co.jp/wp-content/uploads/top_2.png) no-repeat center center;
	background-size: cover;
	padding: 64px 0;
}
#mission::before {
	position: absolute;
	content: '';
	z-index: 1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(26,48,71,0.84);
}

#mission .inner {
	border-top: 1px solid rgba(255,255,255,.5);
	position: relative;
	z-index: 2;
	padding: 16px 0;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#mission .inner header {
	flex-shrink: 0;
	width: 35%;
}
#globalBody #mission .inner header h2 {
	font: 200 16px/1.0 'Noto Sefif JP', serif;
	color: #fff;
	margin-bottom: 16px;
}
#mission .inner header p {
	writing-mode: vertical-rl;
	font: 400 28px/1.4 'Noto Serif JP', serif;
	color: var(--cWht);
	letter-spacing: .07em;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
#mission .inner .article {
	flex-shrink: 0;
	width: 60%;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
}
#mission .inner .article p {
	font: 400 13.7px/1.6 'Outfit','Noto Sans JP', sans-serif;
	color: #fff;
	letter-spacing: .14em;
	margin-bottom: 32px;
	flex-shrink: 0;
	width: 100%;
}
#mission .inner .article .button a {
	border: 2px solid var(--cWht);
	color: var(--cWht);
	display: block;
	width: 220px;
	padding: 16px;
	text-decoration: none;
	letter-spacing: .2em;
	font: 400 14px/1.0 'Noto Serif JP', serif;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 20px center;
	background-size: 16px;
}
#mission .inner .article .button a:hover {
	background: #fff url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 12px center;
	background-size: 16px;
	color: var(--cMain);
}

@media screen and (max-width:780px) {
	#mission .inner {
		border-top: 1px solid rgba(255,255,255,.5);
		position: relative;
		z-index: 2;
		padding: 16px 0;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#mission .inner header {
		width: 100%;
		margin-bottom: 32px;
	}
	#mission .inner header p {
		justify-content: flex-start;
		writing-mode: horizontal-tb;
		text-align: left;
	}
	#mission .inner .article {
		width: 100%;
	}
}

/* -- business -- */
#business {
	padding: 64px 0 0 0;
}
#business .inner header h2 {
	margin-bottom: 16px;
}
#business .inner header p {
	margin-bottom: 32px;
}
#business .inner .article .businessList {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 48px;
	margin-bottom: 64px;
}
#business .inner .article .businessList div {
	flex-shrink: 0;
	width: calc(50% - 24px);
}
#business .inner .article .businessList div a {
	text-decoration: none;
}
#business .inner .article .businessList div figure {
	margin-bottom: 12px !important;
}
#business .inner .article .businessList div h3 a,
#business .inner .article .businessList div h3 {
	font: 300 24px/1.3 'Noto Serif JP', serif;
	text-decoration: none;
	color: var(--cBlk);
}
#business .inner .article .businessList div p a,
#business .inner .article .businessList div p {
	text-decoration: none;
	color: var(--cBlk);
}
#business .inner .article .button {
	text-align: center;
}
#business .inner .article .button a {
	border: 2px solid var(--cMain);
	color: var(--cBlk);
	display: inline-block;
	width: 220px;
	padding: 16px;
	text-align: left;
	text-decoration: none;
	letter-spacing: .2em;
	font: 400 14px/1.0 'Noto Serif JP', serif;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 20px center;
	background-size: 16px;
}
#business .inner .article .button a:hover {
	background: var(--cMain) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 12px center;
	background-size: 16px;
	color: var(--cWht);
}

#business .hr {
	margin-top: 80px;
}

@media screen and (max-width:780px) {
	#business .inner .article .businessList {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 48px;
		margin-bottom: 64px;
	}
	#business .inner .article .businessList div {
		flex-shrink: 0;
		width: 100%;
	}
	#business .hr img {
		aspect-ratio: 3 / 2;
		object-fit: cover;
		margin-top: 80px;
	}

}


/* -- recruit -- */
#recruit {
	padding: 80px 0;
}
#recruit .inner {
	border-top: 1px solid var(--cBlk);
	padding: 64px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	gap: 40px;
}
#recruit .inner header {
	flex-shrink: 0;
	width: calc(51% - 20px);
}
#globalBody #recruit .inner header h2 {
	font: 400 20px/1.0 'Noto Sefif JP', serif;
	margin-bottom: 16px;
}
#recruit .inner header h3 {
	font: 400 26px/1.5 'Noto Sefif JP', serif;
	margin-bottom: 32px;
}
#recruit .inner header p {
	font: 400 14px/2.0 'Outfit','Noto Sans JP', sans-serif;
	margin-bottom: 32px;
}
#recruit .inner header .button a {
	border: 2px solid var(--cMain);
	color: var(--cMain);
	display: block;
	width: 220px;
	padding: 16px;
	text-decoration: none;
	letter-spacing: .2em;
	font: 300 14px/1.0 'Noto Serif JP', serif;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_exlink.svg) no-repeat right 20px center;
	background-size: 16px;
}
#recruit .inner header .button a:hover {
	background: var(--cMain) url(https://rechroma.co.jp/wp-content/uploads/ico_exlink-w.svg) no-repeat right 12px center;
	background-size: 16px;
	color: var(--cWht);
}

#recruit .inner .article {
	flex-shrink: 0;
	width: calc(49% - 20px);
}

@media screen and (max-width:1100px) {
	#recruit .inner .article img {
		aspect-ratio: 2 / 3;
		object-fit: cover;
	}
}

@media screen and (max-width:780px) {
	#recruit .inner {
		padding: 32px;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		flex-direction: row-reverse;
		gap: 40px;
	}
	#recruit .inner header {
		width: 100%;
	}
	#recruit .inner header h3 br {
		display: none;
	}
	#recruit .inner .article {
		width: 100%;
	}
}


/* ---------------------------------------------
	globalBody Styles -- SERVICE
--------------------------------------------- */

/* -- download -- */
#download {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 48px 0;
}
#globalBody #download .inner {
	background: var(--cGry);
	width: calc(100% - 40px);
	max-width: 960px !important;
	margin: 0 auto;
	padding: 32px 40px 32px 56px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#download .inner header {
	flex: 1;
}
#download .inner header h2 {
	margin-bottom: 8px;
}
#download .inner header h2 br {
	display: none;
}
#download .inner header p {
	font-weight: 400;
}
#download .inner .article {
	flex-shrink: 0;
	width: 250px;
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	align-items: center;
}

#download .inner .article .button a {
	border: 2px solid var(--cMain);
	color: var(--cBlk);
	display: inline-block;
	width: 220px;
	padding: 16px;
	text-align: left;
	text-decoration: none;
	letter-spacing: .2em;
	font: 300 16px/1.0 'Noto Serif JP', serif;
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 20px center;
	background-size: 16px;
}
#download .inner .article .button a:hover {
	background: var(--cMain) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 12px center;
	background-size: 16px;
	color: var(--cWht);
}

@media screen and (max-width:900px) {
	#globalBody #download .inner {
		padding: 32px;
		display: block;
	}
	#download .inner header h2 {
		text-align: center;
		margin-bottom: 8px;
	}
	#download .inner header h2 br {
		display: block;
	}
	#download .inner header p {
		text-align: center;
		margin-bottom: 12px;
	}
	#download .inner .article {
		flex-shrink: 0;
		width: 100%;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		align-items: center;
	}
}

/* -- serviceList -- */
#serviceList {
	padding: 64px 0 100px 0;
}
#serviceList .inner header h2 {
	display: none;
}
#serviceList .inner header p {
	margin-bottom: 32px;
}
#serviceList .inner .article .businessList {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 48px;
	margin-bottom: 64px;
}
#serviceList .inner .article .businessList div {
	flex-shrink: 0;
	width: calc(50% - 24px);
}
#serviceList .inner .article .businessList div a {
	text-decoration: none;
	overflow: hidden;
	color: #222;
}
#serviceList .inner .article .businessList div figure {
	margin-bottom: 12px;
	overflow: hidden;
}
#serviceList .inner .article .businessList div h3 {
	font: 300 24px/1.3 'Noto Serif JP', serif;
}

#serviceList .inner .article .businessList div a img {
	aspect-ratio: 16 / 9;
	width: 100%;
	overflow: hidden;
	transition: all .2s;
}
#serviceList .inner .article .businessList div a:hover img {
	transform: scale(1.07);
}


@media screen and (max-width:780px) {
	#serviceList .inner .article .businessList div {
		flex-shrink: 0;
		width:100%;
	}
}

/* ---------------------------------------------
	globalBody Styles -- CONSUL
--------------------------------------------- */

/* -- mainVisual -- */
#mainVisual.consul {
	position: relative;
	border-bottom: 1px solid #ccc;
	margin: 75px 0 0 0;
	min-height: calc(100vh - 75px);
}
#mainVisual.consul .inner {
	position: static !important;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#mainVisual.consul .inner header {
	flex-shrink: 0;
	width: 50%;
	background: var(--cMain);
	min-height: calc(100vh - 75px);
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
}
#mainVisual.consul .inner header div {
	padding: 100px;
}
#mainVisual.consul .inner header h2 {
	color: var(--cWht);
	font: 400 64px/1.2 'Noto Serif JP', serif;
	margin-bottom: 24px;
	font-size:clamp(24px, 3.6vw, 64px);
}
#mainVisual.consul .inner header p {
	color: var(--cWht);
	font: 400 17px/1.6 'Noto Sans JP', sans-serif;
	padding: 0 4px;
	letter-spacing: .07em !important;
	margin-bottom: 48px;
}
#mainVisual.consul .inner header ul {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 28px;
}
#mainVisual.consul .inner header ul li a {
	display: block;
	border-radius: 4px;
	border: 2px solid var(--cWht);
	padding: 16px 32px 16px 12px;
	color: var(--cWht);
	text-decoration: none;
	font: 600 16px/1.0 'Noto Sans JP', sans-serif;
	letter-spacing: .07em;
	min-width: 220px;
	text-align: center;
	background: var(--cMainW) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 16px center;
	background-size: 18px;
}
#mainVisual.consul .inner header ul li a:hover {
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 16px center;
	background-size: 18px;
	color: var(--cMainW);
}
#mainVisual.consul .inner header ul li:last-child a {
	color: var(--cMainW);
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 16px center;
	background-size: 18px;
}
#mainVisual.consul .inner header ul li:last-child a:hover {
	background: var(--cMainW) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 16px center;
	background-size: 18px;
	color: var(--cWht);
}

#mainVisual.consul .inner .article {
	flex-shrink: 0;
	width: 50%;
	background: var(--cGry);
	min-height: calc(100vh - 75px);
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
}
#mainVisual.consul .inner .article div {
	max-width: 800px;
	padding: 100px;
}
#mainVisual.consul .inner .article h3 {
	color: var(--cMainB);
	font: 400 64px/1.2 'Noto Serif JP', serif;
	margin-bottom: 24px;
	font-size:clamp(24px, 3.0vw, 56px) !important;
}
#mainVisual.consul .inner .article ul {
	margin-left: 24px;
	padding-bottom: 8px;
}
#mainVisual.consul .inner .article ul li {
	list-style-type: disc;
	padding-left: 4px;
	margin-bottom: 16px;
}
#mainVisual.consul .inner .article ul li a {
	color: var(--cBlk);
	text-decoration: none;
	font: 400 16px/1.5 'Noto Sans JP', sans-serif;
}
#mainVisual.consul .inner .article ul li a:hover {
	padding-left: 5px;
}
#mainVisual.consul .inner .article h4 {
	font: 500 28px/1.5 'Noto Serif JP', serif;
	margin-bottom: 16px;
	border: none !important;
	padding: 0 !important;
}
#mainVisual.consul .inner .article h4 br {
	display: none;
}
#mainVisual.consul .inner .article h4 strong {
	font: 500 64px/1.0 'Noto Serif JP', serif;
	margin: 0 12px;
}
#mainVisual.consul .inner .article p {
	font: 400 14px/1.5 'Noto Sans JP', sans-serif;
	letter-spacing: .07em;
}
#mainVisual.consul .applink {
	border-top: 1px solid #eee;
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	background: url(https://rechroma.co.jp/wp-content/uploads/bkg_tri.svg) no-repeat left top;
	background-size: 168px;
	width: 168px;
	height: 168px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
}
#mainVisual.consul .applink a {
	display: block;
	transform:rotate(-45deg);
	text-align: center;
	padding-bottom: 80px;
	text-decoration: none;
	font: 600 18px/1.5 'Noto Sans JP', sans-serif !important;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: .07em;
	color: var(--cMain);
}
#mainVisual.consul .applink:hover {
	border-top: 1px solid var(--cMain);
	background: url(https://rechroma.co.jp/wp-content/uploads/bkg_tri-hover.svg) no-repeat left top;
}
#mainVisual.consul .applink:hover a {
	color: var(--cWht);
}

#mainVisual.consul .scrolldown {
	position: absolute;
	right: 32px;
	bottom: 32px;
}
#mainVisual.consul .scrolldown a {
	display: block;
	width: 90px;
}
#mainVisual.consul .scrolldown a img {
	width: 90px;
	transition: all .2s;
}
#mainVisual.consul .scrolldown a img:hover {
	width: 100px;
	opacity:0.60;
}

@media screen and (max-width:1000px) {}
@media screen and (max-width:780px) {
	#mainVisual.consul .inner {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#mainVisual.consul .inner header {
		width: 100%;
	}
	#mainVisual.consul .inner header div {
		padding: 32px;
	}
	#mainVisual.consul .inner header h2 {
		font-size: 32px !important;
		text-align: center;
		font-weight: 500 !important;
	}
	#mainVisual.consul .inner header p {
		font-size: 15px !important;
		text-align: center;
	}
	#mainVisual.consul .inner header h2 br {
		display: none;
	}
	#mainVisual.consul .inner header ul {
		justify-content: center;
	}
	#mainVisual.consul .inner .article {
		width: 100%;
	}
	#mainVisual.consul .inner .article div {
		padding: 32px;
	}
	#mainVisual.consul .inner .article h3 {
		font-size: 32px !important;
		text-align: center;
		font-weight: 500 !important;
	}
	#mainVisual.consul .inner .article h4 {
		text-align: center;
	}
	#mainVisual.consul .inner .article h4 br {
		display: block;
	}
	#mainVisual.consul .inner .article p {
		text-align: center;
	}

	#mainVisual.consul .applink {
		background: url(https://rechroma.co.jp/wp-content/uploads/bkg_tri.svg) no-repeat left top;
		background-size: 128px;
		width: 128px;
		height: 128px;
	}
	#mainVisual.consul .applink a {
		padding-bottom: 60px;
		font: 600 14px/1.5 'Noto Sans JP', sans-serif !important;
	}
}

/* -- achieve -- */
#achieve {
	padding: 64px 0;
	background: #f9f9fb;
}
#achieve .inner header {
	margin-bottom: 32px;
}
#achieve .inner header h2 {
	text-align: center;
	margin-bottom: 28px;
}
#achieve .inner header p {
	font: 400 17px/1.5 'Noto Sans JP', sans-serif;
	text-align: center;
}

#achieve .inner .article .achieveList ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
}
#achieve .inner .article .achieveList ul li {
	flex-shrink: 0;
	width: calc(20% - 6.4px);
	background: var(--cWht);
}
#achieve .inner .article .achieveList ul li img {
	width: 100% !important;
}
#achieve .inner .article .achieveList ul + p {
	font-size: 12px;
}

@media screen and (max-width:780px) {
	#achieve .inner .article .achieveList ul {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 8px;
	}
	#achieve .inner .article .achieveList ul li {
		flex-shrink: 0;
		width: calc(33.33% - 5.3333px);
		background: var(--cWht);
	}

}

/* -- support -- */
#support {
	padding: 64px 0;
}
#support .inner > header {display:none;}
#support .inner .article .supportList {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 48px;
	margin-bottom: 80px;
}
#support .inner .article .supportList div {
	flex-shrink: 0;
	width: calc(50% - 24px);
	padding: 32px 28px;
	border: 1px solid #ccc;
	background: #f9f9f9;
}
#support .inner .article .supportList div h3 {
	font: 400 26px/1.0 'Noto Serif JP', serif;
	border-bottom: 1px solid var(--cBlk);
	letter-spacing: .1em;
	padding-bottom: 24px;
	margin-bottom: 24px;
}
#support .inner .article .supportList div ul li {
	padding-left: 24px;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat left top 12px;
	background-size: 13px;
	margin-bottom: 16px;
}
#support .inner .article .supportList div ul li a {
	text-decoration: none;
	color: var(--cBlk);
}
#support .inner .article .supportList div ul li a:hover {
	padding-left: 5px;
}
#support .inner .article .boxLink {
	background: var(--cGry);
	width: calc(100% - 40px);
	max-width: 960px !important;
	margin: 0 auto;
	padding: 32px 32px 32px 56px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
}
#support .inner .article .boxLink header {
	flex: 1;
}
#support .inner .article .boxLink header h3 {
	font: 300 28px/1.5 'Noto Serif JP', serif !important;
	margin-bottom: 16px;
}
#support .inner .article .boxLink header p {
	font: 400 15px/1.5 'Noto Sans JP', sans-serif !important;
}
#support .inner .article .boxLink .button {
	flex-shrink: 0;
	width: 220px;
}
#support .inner .article .boxLink .button a {
	border: 2px solid var(--cMain);
	color: var(--cBlk);
	display: inline-block;
	width: 220px;
	padding: 16px;
	text-align: left;
	text-decoration: none;
	letter-spacing: .2em;
	font: 400 16px/1.0 'Noto Serif JP', serif;
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow.svg) no-repeat right 20px center;
	background-size: 16px;
}
#support .inner .article .boxLink .button a:hover {
	background: var(--cMain) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 12px center;
	background-size: 16px;
	color: var(--cWht);
}


@media screen and (max-width:900px) {
	#support .inner .article .boxLink {
		padding: 32px;
	}
	#support .inner .article .boxLink header h3 {
		text-align: center;
		margin-bottom: 8px;
		flex: 1;
	}
	#support .inner .article .boxLink header p {
		text-align: center;
		margin-bottom: 12px;
	}
	#support .inner .article .boxLink .button {
		flex-shrink: 0;
		width: 100%;
	}
	#support .inner .article .boxLink .button a {
		display: block;
		width: 220px;
		margin: 0 auto;
	}
@media screen and (max-width:780px) {
	#support .inner .article .supportList {
		display: block;
	}
	#support .inner .article .supportList div {
		width: 100%;
		margin-bottom: 24px;
	}
	#support .inner .article .boxLink {
		width: 100%;
	}
	#support .inner .article .boxLink header h3 {
		font: 500 20px/1.5 'Noto Serif JP', serif !important;
		margin-bottom: 16px;
	}
	#support .inner .article .boxLink header p {
		font: 400 13px/1.5 'Noto Sans JP', sans-serif !important;
		margin-bottom: 16px;
	}
	#support .inner .article .boxLink .button a {
		display: block;
		width: 220px;
		margin: 0 auto;
	}
}

}

/* -- otherService -- */
#otherService {
	padding: 64px 0;
}
#otherService .inner header {
	display: none;
}
#otherService .inner .article .businessList {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 30px;
	margin-bottom: 64px;
}
#otherService .inner .article .businessList div {
	flex-shrink: 0;
	width: calc(33.3333% - 20px);
}
#otherService .inner .article .businessList div a {
	text-decoration: none;
	color: var(--cBlk) !important;
}
#otherService .inner .article .businessList div figure {
	margin-bottom: 12px !important;
	overflow: hidden;
}
#otherService .inner .article .businessList div figure img {
	aspect-ratio: 16 / 9;
	width: 100%;
	overflow: hidden;
	transition: all .2s;
}

#otherService .inner .article .businessList div figure:hover img {
	transform: scale(1.07);
}
#otherService .inner .article .businessList div h3 {
	font: 300 18px/1.3 'Noto Serif JP', serif;
	margin-bottom: 6px;
}
#otherService .inner .article .businessList div p {
	font: 300 12px/1.3 'Noto Sans JP', sans-serif;
	color: var(--cBlk) !important;
}


#otherService .hr {
	margin-top: 80px;
}

@media screen and (max-width:780px) {
	#otherService .inner .article .businessList {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 48px;
		margin-bottom: 64px;
	}
	#otherService .inner .article .businessList div {
		flex-shrink: 0;
		width: 100%;
	}
	#otherService .hr img {
		aspect-ratio: 3 / 2;
		object-fit: cover;
		margin-top: 80px;
	}

}

/* -- partner -- */
#partner {
	padding: 64px 0;
}
#partner .inner header {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 140px;
}
#partner .inner header h2 {
	flex-shrink: 0;
	width: 42%;
	font: 400 clamp(20px, 2.4vw, 28px)/1.8 'Noto Serif JP', serif !important;
	letter-spacing: .03em;

}
#partner .inner header p {
	flex-shrink: 0;
	width: 58%;
	font: 400 clamp(14px, 1.2vw, 17px)/1.5 'Noto Sans JP', sans-serif !important;
}
#partner .inner .article h3 {
	font: 400 32px/1.5 'Noto Serif JP', serif !important;
	letter-spacing: .03em;
	text-align: center;
	margin-bottom: 56px;
}
#partner .inner .article .partnerList {
	margin-bottom: 32px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_plus.svg) no-repeat center center;
	background-size: 48px;
}
#partner .inner .article .partnerList div {
	flex-shrink: 0;
	width: 40%;
}
#partner .inner .article .partnerList div h4 {
	padding: 8px;
	margin-bottom: 24px;
	background: #7e8287;
	color: var(--cWht);
	font: 400 20px/1.5 'Noto Serif JP', serif !important;
	letter-spacing: .07em;
	text-align: center;
}
#partner .inner .article .partnerList div:last-child h4 {
	background: var(--cMain);
}
#partner .inner .article .partnerList + p {
	font: 400 20px/1.5 'Noto Serif JP', serif !important;
	text-align: center;
}


@media screen and (max-width:1100px) {
	#partner .inner header h2 {
		width: 40%;
		font: 400 24px/1.8 'Noto Serif JP', serif !important;
	}
	#partner .inner header h2 br {
		display: none;
	}
	#partner .inner .article .partnerList + p br {
		display: none;
	}


}
@media screen and (max-width:780px) {
	#partner .inner header {
		display: block;
	}
	#partner .inner header h2 {
		width: 100%;
		margin-bottom: 32px;
	}
	#partner .inner header p {
		flex-shrink: 0;
		width: 100%;
		font: 400 clamp(14px, 1.2vw, 17px)/1.5 'Noto Sans JP', sans-serif !important;
	}
	#partner .inner .article .partnerList {
		margin-bottom: 32px;
		flex-direction: column;
		gap: 100px;
		background: url(https://rechroma.co.jp/wp-content/uploads/ico_plus.svg) no-repeat center top 45%;
		background-size: 48px;
	}
	#partner .inner .article .partnerList div {
		flex-shrink: 0;
		width: calc(100% - 80px);
		margin: 0 auto 0 auto;
	}

}


/* -- automation -- */
#automation {
	padding: 64px 0;
}
#automation .inner {}
#automation .inner header {}
#automation .inner header h2 {
	font-weight: 500 !important;
	text-align: center;
	margin-bottom: 48px;
}
#automation .inner .article {}
#automation .inner .article ul {
	margin-bottom: 24px;
}
#automation .inner .article ul li {
	display: flex;
	justify-content: flex-start;
	margin-bottom: 12px;
	font: 500 18px/1.5 'Noto Serif JP', serif !important;
	align-items: center;
}
#automation .inner .article ul li figure {
	margin-right: 16px;
	padding-right: 30px;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_3pt.svg) no-repeat right  center;
	background-size: 16px;
}
#automation .inner .article ul li figure img {
	min-width: 180px;
	max-width: 180px;
}
#automation .inner .article ul li strong {
	color: #c41c14;
	font: 800 18px/1.5 'Noto Serif JP', serif !important;
	padding: 0 4px;
}
#automation .inner .article> figure {
	margin-bottom: 32px;
}
#automation .inner .article> figure + p {
	font: 500 18px/1.5 'Noto Serif JP', serif !important;
	text-align: center;
}

@media screen and (max-width:780px) {
	#automation .inner .article ul li {
		display: block;
		align-items: flex-start;
		margin-bottom: 16px;
	}
	#automation .inner .article ul li figure {
		background: none;
	}
	#automation .inner .article ul li figure img {
		margin-bottom: 8px;
	}
	#automation .inner .article> figure + p br {
		display: none
	}

}

/* ---------------------------------------------
	globalBody Styles -- COMPANY
--------------------------------------------- */

/* -- companyIndex -- */
#companyIndex {
	padding: 64px 0 128px 0;
}
#companyIndex .inner {}
#companyIndex .inner header {
	margin-bottom: 48px;
}
#companyIndex .inner header h2 {
	display: none;
}
#companyIndex .inner header p {
	font: 400 16px/1.5 'Noto Sans JP', sans-serif;
}
#companyIndex .inner .article {}
#companyIndex .inner .article .companysList {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 48px;
}
#companyIndex .inner .article .companysList div {
	position: relative;
	flex-shrink: 0;
	width: calc(50% - 24px);
}
#companyIndex .inner .article .companysList div a {
	overflow: hidden;
}
#companyIndex .inner .article .companysList div a figure {
	overflow: hidden;
}
#companyIndex .inner .article .companysList div a img {
	transition: all .2s;
}
#companyIndex .inner .article .companysList div h3 {
	position: absolute;
	left: 0;
	bottom: 0;
	color: var(--cWht);
	font: 400 32px/1.0 'Noto Serif JP', serif;
	padding: 24px;
	pointer-events: none;
	text-shadow: 0px 0px 4px rgba(0,0,0,.6);
	pointer-events: none;
}
#companyIndex .inner .article .companysList div h3::after {
	content: '';
	display: inline-block;
	margin-left: 10px;
	width: 20px;
	height: 20px;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right center;
	background-size: 16px;
}
#companyIndex .inner .article .companysList div:last-child a h3::after {
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_exlink-w.svg) no-repeat right center;
	background-size: 16px;
}

#companyIndex .inner .article .companysList div a:hover img {
	transform: scale(1.05);
	object-fit: contain;
}
#companyIndex .inner .article .companysList {}

@media screen and (max-width:780px) {
	#companyIndex .inner header p br {
		display: none;
	}
	#companyIndex .inner .article .companysList div {
		flex-shrink: 0;
		width: 100%;
	}
}


/* ---------------------------------------------
	globalBody Styles -- COMPANY - POLICY
--------------------------------------------- */

/* -- policyDetail -- */
#policyDetail {
	padding: 128px 0 64px 0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	border-bottom: 1px solid #ddd;
}
#policyDetail .inner {
	width: auto !important;
	margin: 0 20px !important;
}
#policyDetail .inner header {
	margin-bottom: 48px;
}
#policyDetail .inner header h2 {
	font: 600 44px/1.5 'Noto Sans JP', sans-serif !important;
	color: var(--cSub);
	letter-spacing: .1em;
}
#policyDetail .inner .article {}
#policyDetail .inner .article > p {
	font: 600 22px/2.0 'Noto Sans JP', sans-serif !important;
	margin-bottom: 48px;
	letter-spacing: .2em;
	color: var(--cSub);
}
#policyDetail .inner .article .aside {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#policyDetail .inner .article .aside h3 {
	font: 600 26px/1.5 'Noto Sans JP', sans-serif !important;
	color: var(--cSub);
	letter-spacing: .1em;
	flex: 1;
}
#policyDetail .inner .article .aside figure {
	width: 350px;
}
#policyDetail .inner .article .aside figure img {
	width: 350px;
}


@media screen and (max-width:780px) {
	#policyDetail .inner header h2 {
		font: 600 32px/1.5 'Noto Sans JP', sans-serif !important;
		color: var(--cSub);
		letter-spacing: .1em;
	}
	#policyDetail .inner header h2 br {
		display: none;
	}
	#policyDetail .inner .article > p {
		font: 600 18px/1.8 'Noto Sans JP', sans-serif !important;
		margin-bottom: 48px;
		letter-spacing: .2em;
		color: var(--cSub);
	}
	#policyDetail .inner .article > p br {
		display: none;
	}
	#policyDetail .inner .article .aside {
		display: flex;
		justify-content: center;
		align-items: center;
		align-content: center;
		flex-wrap: wrap;
	}
	#policyDetail .inner .article .aside h3 {
		font: 600 26px/1.5 'Noto Sans JP', sans-serif !important;
		flex-shrink: 0;
		width: 100%;
		text-align: center;
		margin-bottom: 24px;
	}
	#policyDetail .inner .article .aside h3 br {
		display: none;
	}
	#policyDetail .inner .article .aside figure {
		flex-shrink: 0;
		width: 100%;
		text-align: center;
	}

}

/* -- policyVision -- */
#policyVision {
	padding: 64px 0;
	border-bottom: 1px solid #ddd;
}
#policyVision .inner {}
#policyVision .inner header {
	margin-bottom: 24px;
}
#policyVision .inner header h2 {
	font: 600 32px/1.5 'Noto Sans JP', sans-serif !important;
	color: var(--cSub);
	letter-spacing: .07em;
}
#policyVision .inner header p {}
#policyVision .inner .article {}
#policyVision .inner .article ul {}
#policyVision .inner .article ul li {
	font: 600 22px/1.5 'Noto Sans JP', sans-serif !important;
	letter-spacing: .2em;
	color: var(--cSub);
	padding-left: 36px;
	margin-bottom: 16px;
}
#policyVision .inner .article ul li:nth-child(1) {
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_visionList-1.svg) no-repeat left top .38em;
	background-size: 30px;
}
#policyVision .inner .article ul li:nth-child(2) {
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_visionList-2.svg) no-repeat left top .38em;
	background-size: 30px;
}
#policyVision .inner .article ul li:nth-child(3) {
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_visionList-3.svg) no-repeat left top .38em;
	background-size: 30px;
}
#policyVision .inner .article figure {}
#policyVision .inner .article figure img {
	width: 80%;
}
#policyVision .inner .article > p {
	letter-spacing: .14em;
}


/* -- policyValue -- */
#policyValue {
	padding: 64px 0;
	border-bottom: 1px solid #ddd;
}
#policyValue .inner {}
#policyValue .inner header {}
#policyValue .inner header h2 {
	font: 600 32px/1.5 'Noto Sans JP', sans-serif !important;
	color: var(--cSub);
	letter-spacing: .07em;
}
#policyValue .inner .article {}
#policyValue .inner .article ul.valueList {}
#policyValue .inner .article ul.valueList li {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
	margin-bottom: 32px;
}
#policyValue .inner .article ul.valueList li figure {
	flex-shrink: 0;
	width: 300px;
}
#policyValue .inner .article ul.valueList li figure img {}
#policyValue .inner .article ul.valueList p {
	flex: 1;
	font: 500 16px/1.5 'Noto Sans JP', sans-serif;
}
#policyValue .inner .article ul.valueList {}


@media screen and (max-width:780px) {
	#policyValue .inner .article ul.valueList li {
		display: flex;
		justify-content: flex-start;
		flex-direction: column;
		flex-wrap: wrap;
		gap: 24px;
		margin-bottom: 32px;
	}
	#policyValue .inner .article ul.valueList li p {
		margin-top: -32px;
	}
}

/* -- recruitBanner -- */
#recruitBanner {
	padding: 48px 0;
	background: var(--cMain) url(https://rechroma.co.jp/wp-content/uploads/pic_recruitBanner.png) no-repeat left 50vw center;
	background-size: cover;
}
#recruitBanner .inner {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: flex-end;
}
#recruitBanner .inner header {
	flex-shrink: 0;
	width: 70%;
}
#recruitBanner .inner header h2 {
	font: 300 32px/1.5 'Noto Sans JP', sans-serif !important;
	color: var(--cWht);
	margin-bottom: 32px;
}
#recruitBanner .inner header h2 img {
	width: 270px;
	vertical-align: middle;
	margin-right: 16px;
}
#recruitBanner .inner header p {
	color: var(--cWht);
	font-size: 16px;
	letter-spacing: .1em;
	text-shadow: 0px 0px 8px rgba(0,0,0,.9);
}
#recruitBanner .inner .article {
	flex: 1;
}
#recruitBanner .inner .article p {
	margin: 0 !important;
}
#recruitBanner .inner .article a {
	color: #fff;
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	text-decoration: none;
	font-size: 19px;
	text-shadow: 0px 0px 4px rgba(0,0,0,.4);
}
#recruitBanner .inner .article a::after {
	content: '';
	display: inline-block;
	margin-left: 12px;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/uploads/ico_triarr.svg) no-repeat left 24px center;
	background-size: 14px;
	transition: all .2s;
}
#recruitBanner .inner .article a:hover::after {
	opacity:0.80;
	margin-left: 8px;
}


@media screen and (max-width:780px) {
	#recruitBanner {
		padding: 48px 0;
		background-size: 100vw;
	}
	#recruitBanner .inner header {
		margin-bottom: 32px;
		width: 100%;
	}
	#recruitBanner .inner header h2 {
		font: 300 24px/1.5 'Noto Sans JP', sans-serif !important;
		color: var(--cWht);
		margin-bottom: 32px;
	}
	#recruitBanner .inner header h2 img {
		width: 200px;
		vertical-align: middle;
		margin-right: 16px;
	}
	#recruitBanner .inner header p br {
		display: none;
	}
	#recruitBanner .inner .article {
		width: 100%;
	}

}



/* ---------------------------------------------
	globalBody Styles -- COMPANY - OUTLINE
--------------------------------------------- */

/* -- companyOutline -- */
#companyOutline {
	padding: 64px 0 128px;
}
#companyOutline .inner {}
#companyOutline .inner header {
	display: none;
}
#companyOutline .inner .article {
}
#companyOutline .inner .article table {
	width: 100%;
}
#companyOutline .inner .article table td {
	border: none;
	border-bottom: 1px solid #ccc;
	padding: 24px 16px;
}
#companyOutline .inner .article table td p {
}
#companyOutline .inner .article table td p {
	margin: 0 !important;
	font: 400 13px/1.5 'Noto Sans JP', sans-serif !important;
	letter-spacing: .07em;
	display: inline-block;
}
#companyOutline .inner .article table td:first-child {
	min-width: 144px;
	text-align: center;
}
#companyOutline .inner .article table td:first-child p {
	white-space: nowrap;
	font: 600 14px/1.5 'Noto Sans JP', sans-serif !important;
	letter-spacing: .14em;
}
#companyOutline .inner .article table td figure {
	display: inline-block;
	padding-right: 32px;
}
#companyOutline .inner .article table td figure img:first-child {
	width: 160px;
	vertical-align: middle;
	margin-right: 20px;
}
#companyOutline .inner .article table td figure img:last-child {
	width: 80px;
	vertical-align: middle;
}

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

	#companyOutline .inner .article table td:first-child {
		min-width: 80px;
		text-align: center;
	}
}


/* -- companyPartner -- */
#companyPartner {
	padding: 64px 0 100px;
	background: var(--cGry);
	border-top: 1px solid #ddd;
}
#companyPartner .inner header {
	margin-bottom: 36px;
}
#companyPartner .inner header h2 {
	margin-bottom: 24px;
}
#companyPartner .inner .article .partnerList {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 30px;
}
#companyPartner .inner .article .partnerList div {
	flex-shrink: 0;
	width: calc(33.33% - 20px);
}
#companyPartner .inner .article .partnerList div figure {
	background: var(--cWht);
	margin-bottom: 8px !important;
}
#companyPartner .inner .article .partnerList div h3 {
	font: 500 16px/1.0 'Noto Serif JP', serif;
}
#companyPartner .inner .article .partnerList div p {
	margin: 0 !important;
}
#companyPartner .inner .article .partnerList div a {
	display: inline-block;
	padding-right: 14px;
	font: 500 11px/1.0 'Noto Sans JP', sans-serif;
	color: var(--cBlk);
	text-decoration: none;
	background: url(https://rechroma.co.jp/wp-content/uploads/ico_exlink.svg) no-repeat right center;
	background-size: 8px;
}


@media screen and (max-width:780px) {
	#companyPartner .inner .article .partnerList {
		justify-content: center;
	}
	#companyPartner .inner .article .partnerList div {
		flex-shrink: 0;
		width: calc(100% - 60px);
	}
}




/* ---------------------------------------------
	globalBody Styles -- COMPANY - HEAD
--------------------------------------------- */

/* -- head -- */
#head {
	padding: 64px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
#head .inner header {
	margin-bottom: 64px
}
#head .inner header h2 {
	font: 300 36px/1.2 'Noto Serif JP', serif !important;
}
#head .inner .article {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
}
#head .inner .article figure {
	flex-shrink: 0;
	width: 420px;
	margin: 0 120px 0 100px;
}
#head .inner .article .detail {
	flex: 1;
}
#head .inner .article .detail h4 {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
	font: 300 38px/1.2 'Noto Serif JP', serif !important;
	margin-bottom: 28px;
    padding: 0;
    border-left: none;

}
#head .inner .article .detail h4 em {
	margin-left: 32px;
	font: 300 18px/1.2 'Noto Serif JP', serif !important;
	letter-spacing: .2em;
}
#head .inner .article .detail p {
	font: 300 22px/1.5 'Noto Serif JP', serif !important;
}

@media screen and (max-width:780px) {
	#head .inner header h2 {
		text-align: center;
	}
	#head .inner .article figure {
		flex-shrink: 0;
		width: calc(100% - 40px);
		margin: 0 20px 24px;
	}
	#head .inner .article figure img {
		width: 100%;
	}
	#head .inner .article .detail h4 {
		justify-content: center;
		flex-wrap: wrap;

	}
	#head .inner .article .detail h4 em {
		flex-shrink: 0;
		width: 100%;
		text-align: center;
		margin-left: 0px;
	}
	#head .inner .article .detail p {
		font: 300 18px/1.5 'Noto Serif JP', serif !important;
	}

}


/* -- adviser -- */
#adviser {
	padding: 64px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
#adviser .inner header {
	margin-bottom: 64px
}
#adviser .inner header h2 {
	font: 300 36px/1.2 'Noto Serif JP', serif !important;
}
#adviser .inner .article {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
}
#adviser .inner .article figure {
	flex-shrink: 0;
	width: 420px;
	margin: 0 120px 0 100px;
}
#adviser .inner .article .detail {
	flex: 1;
}
#adviser .inner .article .detail h4 {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
	font: 300 38px/1.2 'Noto Serif JP', serif !important;
	margin-bottom: 28px;
    padding: 0;
    border-left: none;

}
#adviser .inner .article .detail h4 em {
	margin-left: 32px;
	font: 300 18px/1.2 'Noto Serif JP', serif !important;
	letter-spacing: .2em;
}
#adviser .inner .article .detail p {
	font: 300 22px/1.5 'Noto Serif JP', serif !important;
}

@media screen and (max-width:780px) {
	#adviser .inner header h2 {
		text-align: center;
	}
	#adviser .inner .article figure {
		flex-shrink: 0;
		width: calc(100% - 40px);
		margin: 0 20px 24px;
	}
	#adviser .inner .article figure img {
		width: 100%;
	}
	#adviser .inner .article .detail h4 {
		justify-content: center;
		flex-wrap: wrap;

	}
	#adviser .inner .article .detail h4 em {
		flex-shrink: 0;
		width: 100%;
		text-align: center;
		margin-left: 0px;
	}
	#adviser .inner .article .detail p {
		font: 300 18px/1.5 'Noto Serif JP', serif !important;
	}

}

/* ---------------------------------------------
	globalBody Styles -- terminology
--------------------------------------------- */

/* -- terminologyHead -- */
#terminologyHead {
	margin-top: 75px;
	background: var(--cMain);
}
#terminologyHead .inner {
	padding: 64px 0;
}
#terminologyHead .inner header {}
#terminologyHead .inner header h2 {
	text-align: center;
	color: var(--cWht);
	letter-spacing: .1em;
	font-weight: 300;
	margin-bottom: 32px;
}
#terminologyHead .inner header p {
	text-align: center;
	color: var(--cWht);
	letter-spacing: .07em;
	margin-bottom: 32px;
}
#terminologyHead .inner .article {}

#terminologyHead .inner .article ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 28px;
}
#terminologyHead .inner .article ul li a {
	display: block;
	border-radius: 4px;
	border: 2px solid var(--cWht);
	padding: 16px 32px 16px 12px;
	color: var(--cWht);
	text-decoration: none;
	font: 500 14px/1.0 'Noto Sans JP', sans-serif;
	letter-spacing: .07em;
	min-width: 220px;
	text-align: center;
/* 	background: var(--cMainW) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat right 16px center; */
	background: var(--cMainW) url(https://rechroma.co.jp/wp-content/themes/emanon-premium-custom/bundles/images/arrow-icon-white.png) no-repeat right 16px center;
	background-size: 26px;
}
#terminologyHead .inner .article ul li a:hover {
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/themes/emanon-premium-custom/bundles/images/arrow-icon-blue.png) no-repeat right 16px center;
	background-size: 26px;
	color: var(--cMainW);
}
#terminologyHead .inner .article ul li:last-child a {
	color: var(--cMainW);
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/themes/emanon-premium-custom/bundles/images/arrow-icon-blue.png) no-repeat right 16px center;
	background-size: 26px;
	font: 500 14px/1.0 'Noto Sans JP', sans-serif;
}
#terminologyHead .inner .article ul li:last-child a:hover {
	background: var(--cMainW) url(https://rechroma.co.jp/wp-content/themes/emanon-premium-custom/bundles/images/arrow-icon-white.png) no-repeat right 16px center;
	background-size: 26px;
	color: var(--cWht);
}


/* -- terminologyList -- */
#terminologyList {
	padding: 64px 0 100px;
}
#terminologyList .inner {}
#terminologyList .inner header {
	margin-bottom: 32px;
}
#terminologyList .inner header h2 {
	display: inline-block;
	padding: 6px 20px;
	background: var(--cMain);
	font: 600 15px/1.0 'Noto Sans JP', sans-serif !important;
	color: var(--cWht);
	margin-bottom: 0 !important;
	letter-spacing: .1em;
}
#terminologyList .inner header ul {
	margin-top: -2px;
	border: 3px solid var(--cMain);
	padding: 16px;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 12px;
}
#terminologyList .inner header ul li {
	display: inline-block;
	color: var(--cMain);
	cursor: pointer;
	transition: all .15s;
	text-decoration: underline;
}
#terminologyList .inner header ul li.active {
	font-weight: 600;
	text-decoration: none;
}
#terminologyList .inner header ul li:nth-last-of-type(3) {
	padding-left: 24px;
}
#terminologyList .inner header ul li::before {
	content: '・';
	display: inline-block;
}
#terminologyList .inner header ul li:hover {
	margin-top: -2px;
}
#terminologyList .inner header ul li.active:hover {
	margin-top: 0px;
}

#terminologyList .inner .article {}
#terminologyList .inner .article .termBox {
	display: none;
}
#terminologyList .inner .article .termBox h3 {
	border-top: 3px solid var(--cMain);
	border-bottom: 1px solid var(--cMain);
	font: 600 22px/1.0 'Noto Sans JP', sans-serif;
	padding: 12px 12px;
	margin-bottom: 24px;
}
#terminologyList .inner .article .termBox dl {
	margin-bottom: 24px;
}
#terminologyList .inner .article .termBox dl dt {
	background: #f3f3f3;
	padding: 12px 16px;
	font: 600 22px/1.2 'Noto Sans JP', sans-serif !important;
}
#terminologyList .inner .article .termBox dl dt strong {
	font: 600 22px/1.2 'Noto Sans JP', sans-serif !important;
}
#terminologyList .inner .article .termBox dl dt strong::after {
	content: '/';
	display: inline-block;
	margin: 0 8px;
}
#terminologyList .inner .article .termBox dl dd {
	padding: 12px 16px;
}
#terminologyList .inner .article .termBox dl dd .addtoany_share_save_container {
	display: none;
}

#terminologyList .inner .article .termBox dl dd a {
	margin-top: -12px;
	font: 300 13px/1.5 'Noto Sans JP', sans-serif;
	display: inline-block;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;

}
#terminologyList .inner .article .termBox dl dd a::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--cMain) url(https://rechroma.co.jp/wp-content/uploads/ico_arrow-w.svg) no-repeat left center;
	background-size: 12px;
	margin-right: 12px;
}





/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- HOGE
--------------------------------------------- */

/* -- hoge -- */
#hoge {}
#hoge .inner {}
#hoge .inner header {}
#hoge .inner header h2 {}
#hoge .inner header p {}
#hoge .inner .article {}
#hoge .inner .article {}



/* ---------------------------------------------
	globalBody Styles -- inquiryBox
--------------------------------------------- */

/* -- inquiryBox -- */
#inquiryBox {
	background: var(--cMainB);
	padding: 24px 0;
	margin-bottom: 24px;
}
#globalBody #inquiryBox .inner {
	max-width: 960px !important;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
#inquiryBox .inner > div {
	flex-shrink: 0;
	width: calc(50% - 1px);
	padding: 32px;
}
#inquiryBox .inner > div:nth-child(1) {
	border-right: 1px solid var(--cWht);
}
#inquiryBox .inner > div:nth-child(2) {
	border-left: 1px solid var(--cWht);
}
#inquiryBox .inner > div h2 {
	font: 300 28px/1.0 'Noto Sans JP', sans-serif;
	color: var(--cWht);
	letter-spacing: .07em;
	margin-bottom: 32px;
}
#inquiryBox .inner > div p {
	font: 300 15px/1.5 'Noto Sans JP', sans-serif;
	color: var(--cWht);
	margin-bottom: 32px;
}
#inquiryBox .inner > div p + p {
	margin-bottom: 0;
}
#inquiryBox .inner > div p + p a {
	display: block;
	padding: 16px;
	background: var(--cWht) url(https://rechroma.co.jp/wp-content/uploads/ico_triarr.svg) no-repeat right 16px center;
	background-size: 14px;
	color: var(--cMainW);
	font: 500 18px/1.5 'Noto Sans JP', sans-serif;
	text-align: center;
	text-decoration: none;
	border-radius: 2px;
	border: 2px solid var(--cWht);
}
#inquiryBox .inner > div p + p a:hover {
	background: var(--cMainW) url(https://rechroma.co.jp/wp-content/uploads/ico_triarr-w.svg) no-repeat right 16px center;
	background-size: 14px;
	color: var(--cWht);
}

@media screen and (max-width:780px) {
	#inquiryBox .inner {
		max-width: 960px !important;
		display: block;
		justify-content: center;
		flex-wrap: wrap;
	}
	#inquiryBox .inner > div {
		flex-shrink: 0;
		width: 100%;
		padding: 32px;
	}
	#inquiryBox .inner > div:nth-child(1) {
		border-right: none;
		border-bottom: 1px solid var(--cWht);
	}
	#inquiryBox .inner > div:nth-child(2) {
		border-left: none;
		border-top: 1px solid var(--cWht);
	}
}


/* ---------------------------------------------
	globalFooter Styles
--------------------------------------------- */
#globalFooter {
	background: var(--cMain);
	padding: 64px 0;
}
#globalFooter .inner {
	max-width: 1280px;
	width: calc(100% - 40px);
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#globalFooter .inner header {
	flex-shrink: 0;
	width: 400px;
}
#globalFooter .inner header h2 {
	margin-bottom: 16px;
}
#globalFooter .inner header h2 img {
	width: 260px;
}
#globalFooter .inner header p {
	font: 600 26px/1.0 'Outfit', 'Noto Sans JP', sans-serif;
	color: var(--cWht);
	letter-spacing: 0.07em;
}
#globalFooter .inner .article {
	flex-shrink: 0;
	width: calc(100% - 400px);
}
#globalFooter .inner .article ul {
	column-count: 2;
	width: fit-content;
	column-gap: 2em;
}
#globalFooter .inner .article ul li {
	width: 300px;
}
#globalFooter .inner .article ul li a {
	display: block;
	padding: 4px;
	color: var(--cWht);
	text-decoration: none;
}
#globalFooter .inner .article ul li a:hover {
	text-decoration: underline;
}
#globalFooter .inner .utility {
	flex-shrink: 0;
	width: 100%;
	margin-top: 64px;
}
#globalFooter .inner .utility ul {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 32px;
}
#globalFooter .inner .utility ul li a {
	font-size: 11px;
	color: var(--cWht);
	text-decoration: none;
}
#globalFooter .inner .utility ul li a:hover {
	text-decoration: underline;
}


@media screen and (max-width:1100px) {
	#globalFooter .inner .article ul li {
		width: auto;
	}
}

@media screen and (max-width:780px) {
	#globalFooter .inner header {
		width: 100%;
		margin-bottom: 64px;
	}
	#globalFooter .inner header h2  {
		text-align: center;
	}
	#globalFooter .inner header p  {
		text-align: center;
	}
	#globalFooter .inner .article {
		flex-shrink: 0;
		width: 100%;
	}
	#globalFooter .inner .article ul {
		margin: 0 auto;
		padding: 0 32px;
		column-count: 2;
		width: fit-content;
		column-gap: 2em;
	}
	#globalFooter .inner .article ul li {
		width: auto;
	}
	#globalFooter .inner .utility ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		flex-direction: column;
		align-content: center;
		gap: 4px;
	}
	#globalFooter .inner .utility ul li {
		text-align: center
	}
}



/* scroll-set */

@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400&display=swap');

.scroll_down {
  position:absolute;
  bottom: -80px;
  left: 32px;
	z-index: 6;
}

@media screen and (max-width:1100px) {
	.scroll_down {
		left: 12px;
	}

}
@media screen and (max-width:780px) {
	.scroll_down {
		bottom: -280px;
		left: 12px;
	}

}

.scroll_down a {
  position: absolute;
	content: '';
  left: -10px;
  bottom: 96px;
  color: #2280C0;
  font-size: 14px;
  font-family: 'Outfit', sans-serif;
  letter-spacing: .15em;
  writing-mode: vertical-lr;
  text-decoration: none;
  text-transform: uppercase;
}

.scroll_down:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: -4px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background:#2280C0;
  animation:
    circlemove 2.0s ease-in-out infinite,
    cirlemovehide 2.0s ease-out infinite;
}

@keyframes circlemove {
  0%{bottom:80px;}
  10%{bottom:80px;}
  80%{bottom:-5px;}
  100%{bottom:-5px;}
}

@keyframes cirlemovehide {
  0%{opacity:0}
  50%{opacity:1;}
  80%{opacity:1;}
  100%{opacity:0;}
}

.scroll_down:after {
  content:"";
  position: absolute;
  bottom:0;
  left:0;
  width:2px;
  height: 80px;
  background:#2280C0;
}

/* -- theme reset -- */
#pageHeader .wp-block-group {
	position: static !important;
}
.is-layout-constrained {
	max-width: none !important;
}
#globalBody .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: none !important;
}
#pageHeader .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 1200px !important;
}
#pageHeader .inner .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: none !important;
}
:root :where(.is-layout-constrained) > * {
    margin-block-start: 0 !important;
    margin-block-end: 0;
}
.article-body > *:not([class*="wp-block-spacer"]):not([class*="epb-spacer"]):not([class*="epb-container-box"]):not(:first-child):not(.product) {
	margin-top: 40px !important;
}
figure.wp-block-image {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}
#ez-toc-container {
	display: none !important;
}

.l-guide__item-icon img {
	width: 80px !important;
}

/* .sns-share-sticky__list {
	display: none !important;
}
.header-news.is-header-news-animation {
	display: none;
}
.single-topics main.l-content__main {
	width: 100% !important;
	padding: 0 !important;
}
.single-topics .sidebar {
	display: none;
}

.single-topics .addtoany_share_save_container {
	display: none;
} */