/*----------------------------------------------------------------------------*/
/* 	共通構造 CSS											     */
/*----------------------------------------------------------------------------*/
@charset "UTF-8";

/*==========================================
	基本情報領域
===========================================*/
	body {
		font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "小塚ゴシック Pro","Kozuka Gothic Pro","メイリオ", 
						Meiryo, Osaka, helvetica, arial,
						"游ゴシック体", YuGothic,"ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	body{
		font-family: 'Noto Serif JP', serif;
		font-family: "Noto Sans JP", serif;
		color: #555;
		font-size:1rem;
		line-height:1.85;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		-webkit-text-size-adjust: 100%; 
		word-wrap: break-word;
		letter-spacing: 0.2em;
	}

	main{
		margin-top:0;
		clear:both;
		display:block;
	}

	/* 要素のはみ出し解決 -------------------------------------------------- */
	main {
		overflow-x: hidden;	/* ★ 横方向はみ出した部分を非表示にする */
		overflow-y: hidden;	/* ★ 縦方向はみ出した部分を非表示にする */
	}
	body {
		overflow-x: hidden;	/* ★ 横方向はみ出した部分を非表示にする */
		overflow-y: hidden;	/* ★ 縦方向はみ出した部分を非表示にする */
	}


/* ■ Conents ------------------------------------------*/

	#wrapper {
		margin-top: 0;
		background-color:#FFF;
	}
	@media only screen and (min-width:768px) {	/* PC Layout ◇ */

		#wrapper {
			margin-top: 0;
/*			background	: url("../images/bg/bgsym01.jpg") repeat-y;	*/
			background-size:100%;
		}
	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#wrapper {
			margin-top: 0;
		}
	}
	#wrapper main h1 {
		display:none;
	}

/* ■ MainConents about facebook timeline -----*/

	#sns {
		margin: 0 auto 0 auto;
		width: 100%;
		border-top: 2px solid #E5E5E5;
		border-bottom: 2px solid #E5E5E5;
	}
	#sns h1,h2,h3,h4,h5,h6{
		font-size:100%;
		font-weight:normal;
	}

	#sns .cont01 {
		margin: 0 auto 0 auto;
		width: 100%;
		background-color: #FFF;
		padding-bottom:30px;
		background	: url("../images/com/subtle_dots.png") repeat;
	}
	#sns .cont01 h3 {
		display:block;
	}
	#sns .cont01 .h3 {
		display:block;
		margin: 20px auto 20px auto;
		width: 90%;
		height: 30px;
		font-size:14px;
		color:#444;
		padding-top:5px;
		padding-left:25px;
		border-left: 5px solid #1F518E; 		/* bf-blue01 */
		border-bottom: 1px solid #BDC3C7;	/* Siver */
	}
	#sns .cont01 .left {
		width: 100%;
	}
	#sns .cont01 .right {
		width: 100%;
	}
	#sns .cont01 .right .fb-page {
		margin: 0 auto 0 auto;
		width: 100%;
		max-width: 320px;
	}
	#sns .cont01 .right p {
		padding-left:20px;
		padding-right:20px;
		padding-bottom:20px;
	}
	#sns .cont01 .left p {	/* Title SNS */
		margin: 20px auto 20px 50px;
		width: 61px;
		height:61px;
		text-indent: -99999px;	/* テキスト非表示 */
		background	: url("../images/sns/facebook.png") no-repeat;
		background-size:61px 61px;
	}
	/* SP ex Layout ◇ */
	@media only screen and (min-width: 414px) and (max-width: 768px) {

		#sns .cont01 .right p {
			padding-left:13%;
			padding-right:0px;
			padding-bottom:20px;
		}

	}

	@media only screen and (min-width:768px) {	/* PC Layout ◇ */

		#sns {
			margin: 0 auto 0 auto;
			width: 100%;
			border-top: 3px solid #F5F5F5;
			border-top: 3px solid #E5E5E5;
			border-bottom: 1px solid #F5F5F5;
		}
		#sns .cont01 {
			margin: 50px auto 30px auto;
			width: 100%;
			max-width: 1100px;
			height:700px;
			padding-bottom:60px;
			padding-top:50px;
		}
		#sns .cont01 h3 {
			display:block;
		}
		#sns .cont01 .h3 {
			display:block;
			margin: 0 auto 60px auto;
			width: 65%;
			width: 90%;
			height: 40px;
			font-size:22px;
			color:#555;
			padding-top:5px;
			padding-left:40px;
			border-left: 5px solid #1F518E; 		/* bf-blue01 */
			border-bottom: 1px solid #BDC3C7;	/* Siver */
		}
		#sns .cont01 .left {
			float:left;
			margin-left:17%;
			width: 20%;
			position: relative;
		}
		#sns .cont01 .right {
			float:left;
			width: 60%;
		}
		#sns .cont01 .right .fb-page {
			margin: 0 auto 0 auto;
			width: 700px;
		}
		#sns .cont01 .right p {
			float:left;
			padding-left:0;
			padding-right:30px;
			padding-bottom:30px;
		}
		#sns .cont01 .left p {	/* Title SNS */
			margin: 0 auto 0 0;
			width: 94px;
			height:100px;
		}
	}

	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#sns .cont01 {
			margin: 30px auto 30px auto;
			width: 100%;
			height:670px;
			padding-bottom:30px;
			padding-top:30px;
		}
		#sns .cont01 .h3 {
			display:block;
			margin: 0 auto 60px auto;
			width: 90%;
			height: 30px;
			font-size:17px;
			padding-top:5px;
			padding-left:20px;
		}
		#sns .cont01 .left {
			float:left;
			margin-left:8%;
			width: 20%;
			position: relative;
		}
		#sns .cont01 .right {
			float:left;
			width: 70%;
		}
		#sns .cont01 .right .fb-page {
			margin: 0 auto 0 auto;
			width: 400px;
		}
	}

	#sns .cont01 p img {
		-webkit-transition: opacity 0.3s ease-out;
		-moz-transition: opacity 0.3s ease-out;
		-ms-transition: opacity 0.3s ease-out;
		-o-transition: opacity 0.3s ease-out;
		transition: opacity 0.3s ease-out;
	}
	#sns .cont01 p:hover img {
		-webkit-opacity: 0.5;
		-moz-opacity: 0.5;
		-o-opacity: 0.5;
		filter: alpha(opacity=50);	/* IE lt 8 */
		-ms-filter: "alpha(opacity=50)"; /* IE 8 */
		opacity: 0.5;
	}

	#sns a{
		text-decoration: none;
	}
	#sns .ease a {
			transition: 0.4s ease-in-out;
			-webkit-transition: 0.4s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.4s ease-in-out;
			-o-transition: 0.4s ease-in-out;
	}
	#sns .ease a:hover {
			transition: 0.4s ease-in-out;
			-webkit-transition: 0.4s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.4s ease-in-out;
			-o-transition: 0.4s ease-in-out;
	}

/* ■ 求人サイト　----------------------------------------------*/

	#toJobsite {
		position: fixed;
		bottom: 25px;
		right: 10%;
		width : 292px;
		height: 68px;
		display	: block;
		text-indent: -99999px;	/* テキスト非表示 */
		border	: 0px;
		z-index:999999;
	}
	#toJobsite a {
		overflow: hidden;	 /* 内容を非表示にする。*/
		width : 292px;
		height: 0 !important;
		height /**/:68px;
		padding-top: 68px;
		display	: block;
		background: url(../images/menu/jobinf.png) no-repeat;
		background-size:292px 68px;
		background-position:  0 0;
	}
	#toJobsite a:hover {
		display: block;
		background: url(../images/menu/jobinf_ov.png) no-repeat;
		background-size:292px 68px;
		background-position:  0 0;
	}
	@media only screen and (min-width: 993px) and (max-width: 1400px) {	/*◇ PC-S */

		#toJobsite {
			display: block;
			position: fixed;
			bottom: 0;
			right:7%;
			z-index:9;
		}
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toJobsite {
			display:none;
		}
	}
	@media only screen and (max-width: 768px) {

		#toJobsite {
			display:block;
			position: fixed;
			bottom:0;
			right:0;
			width : 194px;
			height: 46px;
			display	: block;
			text-indent: -99999px;	/* テキスト非表示 */
			border	: 0px;
			z-index:9;
		}
		#toJobsite  a {
			overflow: hidden;	 /* 内容を非表示にする。*/
			width : 194px;
			height: 0 !important;
			height /**/:46px;
			padding-top: 46px;
			display	: block;
			background: url(../images/menu/jobinf.png ) no-repeat;
			background-size:266px 63px;
			background-size:194px 46px;	/* 80% */
			background-position:  0 0;
		}
		#toJobsite  a:hover {
			display: block;
			width: 194px;
			height:46px;
			background: url(../images/menu/jobinf_ov.png ) no-repeat;
			background-size:194px 46px;	/* 80% */
			background-position:  0 0;
		}
	}

/* ■ サービスお問い合わせ　CONTACT -----*/

	#svcontact {
		margin: 0 auto 0 auto;
		width: 100%;
		height:130px;
		background-color:#F5F5F5;
		position:relative; 
	}
	#svcontact .contbanner {			/*  CONTACT */
		margin: 30px auto 0 auto;
		width : 301px;
		height: 78px;
		display	: block;
		text-indent: -99999px;	/* テキスト非表示 */
		border	: 0px;
	}
	#svcontact .contbanner  a{
		overflow: hidden;	 /* 内容を非表示にする。*/
		width : 301px;
		height: 0 !important;
		height /**/:78px;
		padding-top: 78px;
		display	: block;
		background	: url("../images/banner/contact_sp.png") no-repeat;
		background-size:701px 181px;
		background-size:301px 78px;		/* 43% */
		background-position:  0 0;
	}
	#svcontact .contbanner  a:hover{
		display	: block;
		background	: url("../images/banner/contact_sp.png") no-repeat;
		background-size:301px 78px;		/* 43% */
		background-position:  0 0;
	}

	@media only screen and (min-width:992px) {	/*■ PC Layout  ■ */

		#svcontact {
			margin: 0 auto 0 auto;
			width: 100%;
			height:230px;
			background-color:#F5F5F5;
			position:relative; 
		}
		#svcontact .contbanner {			/*  CONTACT */
			margin: 60px auto 50px auto;
			width : 895px;
			height: 121px;
			display	: block;
			text-indent: -99999px;	/* テキスト非表示 */
			border	: 0px;
		}
		#svcontact .contbanner  a{
			overflow: hidden;	 /* 内容を非表示にする。*/
			width : 895px;
			height: 0 !important;
			height /**/:121px;
			padding-top: 121px;
			display	: block;
			background	: url("../images/banner/contact.png") no-repeat;
			background-size:895px 121px;
			background-position:  0 0;
		}
		#svcontact .contbanner  a:hover{
			display	: block;
			background	: url("../images/banner/contact_ov.png") no-repeat;
			background-size:895px 121px;
			background-position:  0 0;
		}
	}

	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

	}

/* ■ お電話はこちらから ------------------------------------------------*/

	#toTel {
		position: fixed;
		bottom: 200px;
		right: 4px;
		width: 52px;
		height:205px;
	}
	#toTel a {
		display: block;
		width: 37px;
		height:300px;
		font-size:18px;
		font-family: "Noto Serif JP", serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		font-display: swap;
		color: #BDC3C7;		/* Siver */
		color:#AAA;
		line-height:18px;
		padding-top:50px;
		padding-right:11px;
			-webkit-writing-mode: vertical-rl;
			-ms-writing-mode: tb-rl;
			  writing-mode: vertical-rl;
		background: url(../images/icon/tel.png) no-repeat;
		background-size:	31px 35px;
		background-position:	left 0 top 0;
	}
	@media only screen and (max-width: 768px) {
		#toTel {
			display:none;
		}
	}

/* ■ 採用情報のご案内　------------------------------------------------------*/

	#toRecruit {
		position: fixed;
		bottom: 10px;
		right: 8%;
		z-index:9;
	}
	#toRecruit a {
		display: block;
		width: 320px;
		background: url(../images/menu/recruit_ov.png) no-repeat;
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	#toRecruit a:hover img {
		visibility: hidden;
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toRecruit {
			position: fixed;
			bottom: 20px;
			right: 50%;
			z-index:9;
		}
	}
/*	@media only screen and (max-width: 768px) {*/
	@media only screen and (max-width: 992px) {

		#toRecruit {
			display:none;
			position: fixed;
			bottom: 5px;
			right: 10px;
			z-index:9;
		}
	}

/* ■ facebook　-------------------------------------------------------*/

	#toFacebook {
		position: fixed;
		top: 100px;
		left: 16.5px;
		z-index:9999;
	}
	#toFacebook a {
		display: block;
		width: 36px;
		background: url(../images/menu/facebook.png) no-repeat;
	}
	#toFacebook a:hover img {
		visibility: hidden;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toFacebook {
			position: fixed;
			top: 150px;
			left: 16.5px;
			z-index:9;
		}
	}
	@media only screen and (max-width: 992px) {

		#toFacebook {
			display:none;
		}
	}

/* ■ Twitter　----------------------------------------------------------*/

	#toTwitter {
		position: fixed;
		top: 150px;
		left: 16.5px;
		z-index:9999;
	}
	#toTwitter a {
		display: block;
		width: 36px;
		background: url(../images/menu/twitter.png) no-repeat;
	}
	#toTwitter a:hover img {
		visibility: hidden;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toTwitter {
			position: fixed;
			top: 200px;
			left: 16.5px;
			z-index:9;
		}
	}
	@media only screen and (max-width: 992px) {

		#toTwitter {
			display:none;
		}
	}

/* ■ LINE　------------------------------------------------------------*/

	#toLine {
		position: fixed;
		top: 300px;
		left: 16.5px;
		z-index:9999;
	}
	#toLine a {
		display: block;
		width: 36px;
		background: url(../images/menu/line.png) no-repeat;
	}
	#toLine a:hover img {
		visibility: hidden;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toLine {
			position: fixed;
			top: 250px;
			left: 16.5px;
			z-index:9;
		}
	}
	@media only screen and (max-width: 992px) {

		#toLine {
			display:none;
		}
	}

/* ■ Instagram　-------------------------------------------------------*/

	#toInsta {
		position: fixed;
		top: 200px;
		left: 16.5px;
		z-index:9999;
	}
	#toInsta a {
		display: block;
		width: 36px;
		background: url(../images/menu/instagram.png) no-repeat;
	}
	#toInsta a:hover img {
		visibility: hidden;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toInsta {
			position: fixed;
			top: 250px;
			left: 16.5px;
			z-index:9;
		}
	}
	@media only screen and (max-width: 992px) {

		#toInsta {
			display:none;
		}
	}

/* ■ お問い合わせ　----------------------------------------------*/

	#toContact {
		position: fixed;
		bottom: 100px;
		right: 0px;
		z-index:9999999;
	}
	#toContact a {
		display: block;
		width: 66px;
		background: url(../images/menu/contact_ov.png) no-repeat;
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	#toContact a:hover img {
		visibility: hidden;
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toContact {
			position: fixed;
			bottom: 250px;
			right: 0px;
			z-index:9999;
		}
	}
/*	@media only screen and (max-width: 768px) {*/
	@media only screen and (max-width: 992px) {

		#toContact {
			display:none;
			position: fixed;
			bottom: 150px;
			right: 0px;
			z-index:99;
		}
	}

/* ■ ToPageTop -----------------------------------------------------*/

	#toPageTop {
		position: fixed;
		bottom: 5px;
		right: 9px;
		z-index:9999999;
	}
	#toPageTop a {
		display: block;
		width: 45px;
		background: url(../images/com/toTop_ov.png) no-repeat;
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	#toPageTop a:hover img {
		visibility: hidden;
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toPageTop {
			position: fixed;
			bottom: 30px;
			right: 0px;
			z-index:9999;
		}
	}
	@media only screen and (max-width: 768px) {
		#toPageTop {
			position: fixed;
			bottom: 25px;
			right: 1px;
			z-index:9999;
		}
		#toPageTop img {
			zoom:0.8;
		}
		#toPageTop a {
			display: block;
			width: 35px;
			background: url(../images/com/toTop.png) no-repeat;
			background-size:35px 35px;
		}
	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#toPageTop {
			position: fixed;
			bottom: 5px;
			right: 5px;
			z-index:9999;
		}
	}

/* ■ side symbole ----------------------------------------------*/

	#FG {
		position: fixed;
		bottom: 5px;
		left: 10px;
		z-index:9999;
	}
	#FG a {
		display: block;
		width: 14px;
		background: url(../images/menu/logo10.png) no-repeat;
	}
	#FG a:hover img {
		visibility: hidden;
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#FG {
			position: fixed;
			bottom: 130px;
			left: 0;
		}
	}
	@media only screen and (max-width: 768px) {

		#FG {
			display:none;
		}
	}
	@media only screen and (min-width: 993px) and (max-width: 1400px) {	/*◇ PC-S */

		#FG {
			position: fixed;
			bottom: 0px;
			left: 10px;
		}

	}
/* ■ contact section ---------------------------------------------*/

	#contact {
		margin:0 auto 0 auto;
		width:100%;
		padding-top:130px;
		padding-bottom:180px;
		background-color: #0F1419;		/* cacielo-blk */
		background:linear-gradient(180deg, #F3F3F3 0%,#F3F3F3 20%,#0F1419 20%,#0F1419 80%,#F3F3F3 80%,#F3F3F3 100% );	/* cacielo-blk */
		background:linear-gradient(180deg, #F3F3F3 0%,#F3F3F3 20%,#221815 20%,#221815 80%,#F3F3F3 80%,#F3F3F3 100% );	/* fujico-blk */
	}
	#contact h2 {
		margin:0 auto 0 auto;
		width:100%;
		font-size: 19px;
		text-align: center;
		color: #FFF;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		font-display: swap;
	}
	#contact .nlall {
		display: block;
		margin: 30px auto 0 auto;
		width:100%;
		position:relative;
	}
	#contact .nlall a {
		display: block;
		position:absolute;
		top:0;
		left:0;
		right:0;
		margin:auto;
		width:200px;
		font-size:15px;
		line-height:1.8em;
		font-weight:bold;
		font-family: "Futura Heavy font";
		font-display: swap;
		color: #FFF;
		background	: url("../images/icon/btn-arrow03.png") no-repeat;
		background-size:8px 8px;
		background-position: 15px  18px;
	}
	#contact .nlall a:hover {
		color: #FFF;
		background	: url("../images/icon/btn-arrow03.png") no-repeat;
		background-size:8px 8px;
		background-position: 170px 18px; 
	}

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

		#contact{
			margin:0 auto 0 auto;
			padding-top:60px;
			padding-bottom:70px;
		}
		#contact h2 {
			margin:0 auto 0 10%;
			width:80%;
			font-weight:bold;
			text-align:left;
			font-size:12px;
			line-height:1.7em;
		}
		#contact .nlall {
			display: block;
			margin: 20px auto 45px auto;
			position:relative;
		}
		#contact .nlall a {
			display: block;
			position:absolute;
			top:0;
			left:0;
			right:0;
			margin:auto;
			width:160px;
			font-size:12px;
			line-height:1.5em;
			color: #FFF;
			background	: url("../images/icon/btn-arrow03.png") no-repeat;
			background-size:8px 8px;
			background-position: 10px  12px; 
		}
	}

/* ■Relation Company contents  */

	.relationc {		/* ◇SP layout */
		margin: -20px auto 0 auto;
		width: 100%;
		padding-bottom:5px;
/*		background-color:linear-gradient(180deg,white 0%,white 5%,#F4F4F4 5%,#F4F4F4 85%,white 85%,white 100%);	*/	/* ★ */
			background:linear-gradient(180deg,#F4F4F4 20%,#F4F4F4 80%,white 100%);
	}
	.relationc ul {
		margin:0 auto 0 auto;
		width: 100%;
		display:flex;
		flex-wrap:wrap;
		justify-content: flex-start;
		width: 100%;
		padding-top:20px;
		padding-bottom:20px;
	}
	.relationc ul li {
		display:block;
		margin: 0 0 20px 0;
		width :50%;
	}
	.relationc ul li a {
		display:block;
		margin: 0 auto 0 auto;
		width :261px;
		height:71px;	/* 65% */
		width :170px;
		height:46px;
	}
	.relationc ul li img {
		display:block;
		margin: 0 auto 0 auto;
		width :170px;
		height:46px;
	}
	.relationc ul li img:hover {
		transform:scale(1.1,1.1);
		transition: 0.8s ease-in-out;
		-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
		-moz-transition: 1.8s ease-in-out;
		-o-transition: 1.8s ease-in-out;
	}

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

	@media only screen and (min-width:768px) {	/* ◆PC layout */

		.relationc {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:10px;
			background-color:#F4F4F4;
/*			background:linear-gradient(180deg,white 0%,white 20%,#F4F4F4 20%,#F4F4F4 100%);	*/	/* ★ */
			background:linear-gradient(180deg,#F4F4F4 20%,#F4F4F4 80%,white 100%);
		}
		.relationc ul {
			margin: 0 auto 0 auto;
			display:flex;
			flex-wrap:wrap;
			justify-content: space-between;	
			justify-content: flex-start;
			width: 70%;
			padding-top:50px;
			padding-bottom:20px;
		}
		.relationc ul li {
			display:block;
			margin: 0 0 30px 0;
			width :25%;
			height:71px;
			padding-bottom:0;
		}
		.relationc ul li a {
			margin: 0 auto 0 auto;
			display:block;
			width :261px;
			height:71px;
		}
		.relationc ul li img {
			display:block;
			margin: 0 auto 0 auto;
			width :261px;
			height:71px;
		}
		.relationc ul li img:hover {
			transform:scale(1.1,1.1);
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 1.8s ease-in-out;
			-o-transition: 1.8s ease-in-out;
		}
	}

	@media only screen and (min-width: 993px) and (max-width: 1680px) {	/*◇ PC-S */

		.relationc ul li {
			display:block;
			margin: 0 0 30px 0;
			width :25%;
			height:50px;
			padding-bottom:0;
		}
		.relationc ul li a {
			margin: 0 auto 0 auto;
			display:block;
			width :183px;
			height:50px;
		}
		.relationc ul li img {
			display:block;
			margin: 0 auto 0 auto;
			width :183px;	/* 70% */
			height:50px;
		}
	}
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		.relationc ul li {
			display:block;
			margin: 0 0 30px 0;
			width :25%;
			height:50px;
			padding-bottom:0;
		}
		.relationc ul li a {
			margin: 0 auto 0 auto;
			display:block;
			width :183px;
			height:50px;
		}
		.relationc ul li img {
			display:block;
			margin: 0 auto 0 auto;
			width :183px;	/* 70% */
			height:50px;
		}
	}

	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		.relationc {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:0px;
			background-color:#FFF;
			background:linear-gradient(90deg,#F4F4F4 0%,#F4F4F4 40%,white 40%,white 100%);	/* ★ */
		}
	}

/* ■banner contents  */

	#banner {
		margin: 0 auto 0 auto;
		width: 100%;
		padding-bottom:20px;
/*		background-color:#FFF;
		background:linear-gradient(180deg,white 0%,white 37%,#F5F5F5 37%,#F5F5F5 100%);	/* ★ */
*/
	}
	#banner h1,h2,h3,h4,h5,h6{
		font-size:100%;
		font-weight:normal;
	}
	#banner ul.bn02 {
		margin: 0 auto 0 auto;
		width: 100%;
	}
	#banner ul.bn02 li {
		margin: 20px auto 0 auto;
		width :301px;
	}
	#banner ul.bn02 li a img {
		margin: 0 auto 0 auto;
		display:block;
		max-width:85%;
		height:auto;
	}

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

	@media only screen and (min-width:768px) {

		#banner {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:0px;
/*			background-color:#FFF;
			background:linear-gradient(180deg,white 0%,white 25%,#F5F5F5 25%,#F5F5F5 100%);
*/
		}
		#banner ul.bn02 {
			margin: 50px auto 0px auto;
			display:flex;
			flex-wrap:nowrap;
			justify-content: space-between;	/* 両端のアイテムを余白を空けずに配置し、他の要素は均等に間隔を空けて配置 */
			width: 65%;
		}
		#banner ul.bn02 li {
			margin: 0 auto 0 auto;
			width :376px;
			padding-bottom:0px;
		}
		#banner ul.bn02 li a {
			display:block;
		}
		#banner ul.bn02 li a img {
			display:block;
			max-width:100%;
			height:auto;
		}
		@media only screen and (min-width: 993px) and (max-width: 1400px) {	/*◇ PC-S */

			#banner ul.bn02 {
				margin: 80px auto 40px auto;
				width: 70%;
			}
			#banner ul.bn02 li {
				margin: 0 auto 0 auto;
				width :280px;
				padding-bottom:0px;
			}
		}
	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 768px) and (max-width: 992px) {

		#banner {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:0px;
			background-color:#FFF;
			background:linear-gradient(90deg,#F5F5F5 0%,#F5F5F5 40%,white 40%,white 100%);	/* ★ */
		}
		#banner ul.bn02 {
			margin: 20px auto 20px auto;
			width: 85%;
		}
		#banner ul.bn02 li a img {
			display:block;
			max-width:70%;
			height:auto;
		}
	}

/* ■ RECRUIT ----------------------------------------------*/

	#recruit {			/* ◇ SP layout */
		margin:0 auto 0 auto;
		width: 100%;
		background:linear-gradient(90deg, #F3F3F3 0%,#F3F3F3 30%,#FFFFFF 30%,#FFFFFF 100%);
		position:relative;
		padding-bottom:30px;
	}
	#recruit h2 {
		margin:0 auto 0 auto;
		padding-top:50px;
	}
	#recruit .h2sub {
		margin: -70px auto 0 auto;
		width: 90%;
		font-size:12px;
		text-align:center;
		font-weight:bold;
		color:#333;
		padding-left:0;
	}
	#recruit .h2line  {
		margin: 10px auto 20px auto;
		width: 90%;
		height:2px;
		text-indent: -99999px;	/* テキスト非表示 */
		background-color:#0F1419;		/* cacielo-blk */
	}
	#recruit .content {
		margin:20px auto 0 auto;
		width: 100%;
		background-image:
			url("../images/bg/brline01.svg"),
			url("../images/bg/brline02.svg");
		background-size:
			contain,
			contain;
		background-position:
			center top 42%,
			center top 47%;
		background-repeat:
			no-repeat,
			no-repeat;
	}
	#recruit .txt01 {
		margin:20px auto 0 auto;
		width: 80%;
		font-size:13px;
		line-height:1.7em;
		color:#222;
	}
	#recruit #recbn {
		margin: 20px auto 0 auto;
		width:300px;
		height:133px;
		background:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
		url("../images/top/bn04.jpg") no-repeat;
		background-size: cover;
		background-position: center top 0;
		padding-bottom:30px;
	}
	#recruit #recbn a {
		display:block;
		width:100%;
		height:133px;
	}
	#recruit #recbn dl,dt,dd {
		display:block;
	}
	#recruit #recbn dt {
		padding-top:20px;
		text-align:center;
		font-size:17px;
		font-weight:bold;
		font-family: "Antro_Vectra";
		font-weight:700;
		font-display: swap;
		transform: rotate(-7deg);	/* テキストを傾ける ◇ */
		color:#fff;
	}
	#recruit #recbn dd.txt02 {
		text-align:center;
		font-size:13px;
		line-height: 1.5em;
		letter-spacing: 0.1em;
		font-weight:bold;
		color:#fff;
		padding-top:15px;
		text-shadow: 1px 2px 2px #555;
	}
	#recruit>.circlesym {		/* ◎ */
		position:absolute;
		top:-50px;
		right:2%;
		width:127px;
		height:127px;
		background: url( "../images/bg/sym02.png" ) no-repeat;
		background-size: 182px 182px;
		background-size: 127px 127px;	/* 70% */
		background-position:center 0;
		z-index:0;
	}
	#recruit>.circlesym .circle {
		margin: 0 auto 0 auto;
		width:127px;
		height:127px;
		background: url( "../images/bg/sym0202.png" ) no-repeat;
		background-size: 157px 154px;
		background-size: 110px 110px;		/* 70% */
		background-position:center center;
	}
	#recruit>.circlesym .circle::before {
	 	content: '';
	 	padding-top: 50%;
	}
	/* 回転 */
	#recruit>.circlesym .circle {
		animation-name: rotate;
		animation-duration: 15s;
		animation-timing-function: cubic-bezier(0.5, 0.51, 0.51, 0.52);
		animation-iteration-count: infinite;
	}
	@keyframes rotate {
		 0% {
		 	transform: rotateZ(0);
		 }
		 100% {
			transform: rotateZ(360deg);
		}
	}

	@media only screen and (min-width:767px) {	/* ◆PC layout */

		#recruit {
			margin:0 auto 0 auto;
			width: 100%;
			background:linear-gradient(90deg, #F3F3F3 0%,#F3F3F3 30%,#FFFFFF 30%,#FFFFFF 100%);
			padding-bottom:80px;
			position:relative;
		}
		#recruit h2 {
			margin:0 auto 0 auto;
			padding-top:30px;
		}
		#recruit .h2sub {
			margin:-100px auto 0 auto;
			width: 50%;
			font-size:20px;
			text-align:center;
			font-weight:normal;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 600;
			font-style: normal;
			font-display: swap;
			color:#333;
		}
		#recruit .h2line  {
			margin: 30px auto 0 auto;
			width: 30%;
			height:4px;
			text-indent: -99999px;	/* テキスト非表示 */
			background-color:#0F1419;		/* cacielo-blk */
		}
		#recruit .content {
			margin:50px auto 0 auto;
			width: 100%;
			background-image:
				url("../images/bg/brline01.svg"),
				url("../images/bg/brline02.svg");
			background-size:
				contain,
				contain;
			background-position:
				center top 20%,
				center top 25%;
			background-repeat:
				no-repeat,
				no-repeat;
		}
		#recruit .txt01 {
			margin:50px auto 0 auto;
			width: 50%;
			font-size:17px;
			line-height:2.0em;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
		}
		#recruit #recbn {
			margin: 50px auto 0 auto;
			width:450px;
			height:200px;
			background:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
			url("../images/top/bn04.jpg") no-repeat;
			background-size: contain;
			background-position: center top 0;
			padding-bottom:80px;
		}
		#recruit #recbn:hover {
			transform: scale(1.1);
		}
		#recruit #recbn a {
			display:block;
			width:100%;
			height:200px;
		}
		#recruit #recbn dl,dt,dd {
			display:block;
		}
		#recruit #recbn dt {
			padding-top:30px;
			text-align:center;
			font-size:30px;
			font-weight:bold;
			font-family: "Antro_Vectra";
			font-weight:700;
			font-display: swap;
			transform: rotate(-7deg);	/* テキストを傾ける ◇ */
			color:#fff;
		}
		#recruit #recbn dd.txt02 {
			text-align:center;
			font-size:19px;
			line-height: 1.8em;
			letter-spacing: 0.2em;
			font-weight:normal;
			font-family: "NotoSansCJKjp";
			font-weight:500;
			color:#fff;
			padding-top:10px;
		}
		#recruit>.circlesym {		/* ◎ */
			position:absolute;
			top:5%;
			left:75%;
			width:192px;
			height:192px;
			background: url( "../images/bg/sym02.png" ) no-repeat;
			background-size: 192px 192px;
			background-position:center 0;
			z-index:1;
		}
		#recruit>.circlesym .circle {
			margin: 0 auto 0 auto;
			width:192px;
			height:192px;
			background: url( "../images/bg/sym0202.png" ) no-repeat;
			background-size: 166px 164px;
			background-position:center center;
		}
		#recruit>.circlesym .circle::before {
		 	content: '';
		 	padding-top: 50%;
		}
		/* 回転 */
		#recruit>.circlesym .circle {
			animation-name: rotate;
			animation-duration: 15s;
			animation-timing-function: cubic-bezier(0.5, 0.51, 0.51, 0.52);
			animation-iteration-count: infinite;
		}
		@keyframes rotate {
			 0% {
			 	transform: rotateZ(0);
			 }
			 100% {
				transform: rotateZ(360deg);
			}
		}
	}
	@media only screen and (min-width: 1020px) and (max-width: 1680px) {	/*◇ PC-S */

		#recruit h2 {
			font-size: 4rem;
			letter-spacing: 0.05em;
		}
		#recruit .h2sub {
			margin:-80px auto 0 auto;
			font-size:17px;
		}
		#recruit .h2line  {
			margin: 15px auto 0 auto;
			width: 35%;
			height:2px;
			text-indent: -99999px;	/* テキスト非表示 */
			background-color:#0F1419;		/* cacielo-blk */
		}
	}
	@media only screen and (min-width: 767px) and (max-width: 1020px) {

		#recruit {
			margin:0 auto 0 auto;
			width: 100%;
			padding-bottom:30px;
			position:relative;
		}
		#recruit h2 {
			font-size:10px;
		}
		#recruit .h2sub {
			margin:-60px auto 0 auto;
			font-size:17px;
		}
		#recruit .h2line  {
			margin: 15px auto 0 auto;
			width: 40%;
			height:2px;
			text-indent: -99999px;	/* テキスト非表示 */
			background-color:#0F1419;		/* cacielo-blk */
		}
		#recruit #recbn {
			margin: 30px auto 0 auto;
		}
	}

	@media screen and (max-width:768px){		/* ◇ SP layout */

	}

/*==========================================
	フッター 情報領域
===========================================*/

/* ■ footer ------------------------*/

	#footer {
		margin: 0 auto 0 auto;
		width:100%;
		padding-top:0;
		padding-bottom:0;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		background-color: #FFF;
	}
	#footer dl {
		margin: 30px auto 0 15%;
		width:15%;   
	}
	#footer dl dt {
		text-align:center;
		font-size: 0.8rem;
		font-family: 'Futura medium bt', sans-serif;
		font-display: swap;
		letter-spacing:0px;
	}
	#footer dl dd {
		font-size: 1.6rem;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		font-display: swap;
		color: #0F1419;		/* cacielo-blk */
	}
	#footer dl dd .ex {
		font-size: 2.0rem;
		font-family: 'Futura medium bt', sans-serif;
		font-display: swap;
		padding-left:10px;
	}
	#footer dl dd img {
		display:block;
		margin:10px auto 0 auto;
		width:85%;
	}
	#footer .footer-list {
		margin: 0 auto 0 auto;
		width:70%; 
		text-align:center;
	}
	#footer ul li {
		display: inline-block;
		padding: 0 10px;
		font-size: 0.8rem;
		line-height: 3;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		font-display: swap;
	}
	#footer ul li a {
	}
	#footer small {
		text-align: right;
		margin: 0 auto 0 auto;
		display: block;
		width: 100%;
		text-align:center;
		font-size: 0.7rem;
		color:#fff;
		padding:10px;		
		background-color:#221815;	/* fujico-blk */
	}
	#footer #page-top span {
		display: inline-block;
		width: 12px;
		height: 12px;
		border-top: 1px solid #fff;
		border-left: 1px solid #fff;
		transform: rotate(45deg);
	}
	#footer #waveCanvas {
		margin: -20px auto 0 auto;
		width:100vw;
	}

	@media only screen and (min-width: 1020px) and (max-width: 1400px) {	/*◇ PC-S */

		#footer .footer-list{
			margin:-30px auto 0 12%;
			width:80%; 
			text-align:center;
		}
	}


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

		#footer dl,
		#footer .footer-list,
		#footer small{
			width:100%;
			text-align: center;
		}
		#footer {
			margin: 0 auto 0 auto;
			width:100%;
			padding-top:0;
			padding-bottom:0;
			border-top:none;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			justify-content: space-between;
			background-color: #FFF;
		}
		#footer dl {
			margin: 20px auto 0 15%;
			width:70%;
		}
		#footer dl dt {
			font-size: 0.8rem;
			font-family: 'Futura medium bt', sans-serif;
			font-display: swap;
		}
		#footer dl dd {
			font-size: 1.3rem;
			letter-spacing:0.5px;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 700;
			font-style: normal;
			font-display: swap;
			color: #0F1419;		/* cacielo-blk */
		}
		#footer dl dd .ex {
			font-size: 1.4rem;
			font-family: 'Futura medium bt', sans-serif;
			font-display: swap;
			padding-left:10px;
		}
		#footer dl dd img {
			display:block;
			width:40%;
		}
		#footer .footer-list{
			margin: -25px auto 0 auto;
			width:100%; 
			text-align:center;
		}
		#footer small {
			margin: -50px auto 0 auto;
			text-align:left;
			display: block;
			width: 100%;
			font-size: 0.7rem;
			padding:13px 0 0 20px;		
			background-color:#221815;	/* fujico-blk */
		}
		#footer #waveCanvas {
			margin: -50px auto 0 auto;
			width:100vw;
		}
	}
	@media screen and (max-width:767px) {

		#footer {
			margin: 0 auto 0 auto;
			width:100%;
			padding-top:0;
			padding-bottom:0;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			justify-content: space-between;
			background-color: #FFF000;
		}
		#footer dl {
			margin:20px auto 0 15%;
			width:70%;
		}
		#footer dl dd img {
			display:block;
			margin:5px auto 0 auto;
			width:50%;
		}
		#footer .footer-list{
			margin: -30px auto 0 auto;
			width:100%; 
			text-align:center;
		}
		#footer ul li {
			display: inline-block;
			padding: 0 10px;
			font-size: 0.7rem;
			line-height: 3;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
		}
	}

/* ◆Other Style ---------------------------------*/

	/* ◇ Flexible Images ------------------------*/

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

	/* ◇ placeholder ------------------------*/

	/*Webkit*/
	::-webkit-input-placeholder {color: #AAA}
	 
	/*Firefox 19以降*/
	::-moz-placeholder  {color: #AAA}
	 
	/*Firefox 18以前*/
	:-moz-placeholder   {color: #AAA}
	 
	/*Windows IE*/
	:-ms-input-placeholder  {color: #AAA} 

	h1,h2,h3,h4,h5,h6{
		font-size:100%;
		font-weight:normal;
	}

	.h2invisible {
		display:none;
	}

/* ■ Others --------------------------------*/

	/* common effect */
	.ease  a{
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	 .ease a:hover {
			transition: 0.8s ease-in-out;
			-webkit-transition: 0.8s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.8s ease-in-out;
			-o-transition: 0.8s ease-in-out;
	}
	.ease02  a{
			transition: 0.2s ease-in-out;
			-webkit-transition: 0.2s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.2s ease-in-out;
			-o-transition: 0.2s ease-in-out;
	}
	 .ease02 a:hover {
			transition: 0.2s ease-in-out;
			-webkit-transition: 0.2s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.2s ease-in-out;
			-o-transition: 0.2s ease-in-out;
	}

	a:hover img {
		-webkit-opacity: 0.5;
		-moz-opacity: 0.5;
		-o-opacity: 0.5;
		filter: alpha(opacity=50);	/* IE lt 8 */
		-ms-filter: "alpha(opacity=50)"; /* IE 8 */
		opacity: 0.5;
	}
	a img {
		-webkit-transition: opacity 0.5s ease-out;
		-moz-transition: opacity 0.5s ease-out;
		-ms-transition: opacity 0.5s ease-out;
		-o-transition: opacity 0.5s ease-out;
		transition: opacity 0.5s ease-out;
	}

/* ■ Color material ------------------------*/

	.subt {
		color: #A4966A;		/* Gold01 */
		font-size:13px;
		text-align:center;
	}
	.subt01 {
		color: #A4966A;		/* Gold01 */
		font-size:15px;
	}
	@media only screen and (max-width:768px) {
		.subt01 {
			font-size:12px;
		}
	}

	/* ■local colors --------------------------------------------- */

	.fujico-blk {
		color: #221815;		/* fujico-blk 15 20 25 */
	}
	.fujico-blk {
		color: #221815;		/* fujico-blk */
	}
	.cacielo-red01 {
		color: #D9142B;		/* cacielo-red01 */
	}
	.cacielo-red02 {
		color: #BD1A20;		/* cacielo-red02 */
	}
	.cacielo-beige {
		color: #DAD1BB;		/* cacielo-beigegray */
	}
	.bk-gray01 {
		color: #e9f3f8;		/* background-gray01, dealers-blue03 */
	}
	.bk-gray02 {
		color: #EFEFEF;		/* background-gray02 */
	}

/* ◇ Parts Colors ------------------------*/
	.gold {
		color: #A4966A;		/* Gold01 */
	}
	.goldc02 {
		color: #B27C04;		/* Gold02 */
	}
	.silver {
		color: #BDC3C7;		/* Siver */
	}
	.uline {
		border-bottom: 1px solid #B27C04;
	}
	.coment01 {
		font-size:12px;
		color: #FFF;
	}
	@media only screen and (max-width:768px) {
		.coment01 {
			font-size:11px;
	}
	.beige {
		color: #E7DDD2;		/* beige */
	}
	.formc01 {
		color: #777;
		font-size:12px;
		padding-left:10px;
	}
	.bold01 {
		font-weight:bold;
		font-size:15px;
		color: #A4966A;		/* Gold01 */
	}
	.bold02 {
		font-weight:bold;
		font-size:17px;
		color: #A4966A;		/* Gold01 */
	}
	@media only screen and (max-width:768px) {
		.bold01 {
			font-size:13px;
		}
		.bold02 {
			font-size:13px;
		}
	}
	.goldc {
		color: #A4946C;		/* Gold01 */
	}
	.goldc02 {
		color: #B27C04;		/* Gold02 */
	}
	.goldc03 {
		color: #B27C04;		/* Gold02 */
		font-size:13px;
	}
	.uline {
		border-bottom: 1px solid #B27C04;
	}
	.price01 {
		color: #B27C04;		/* Gold02 */
		padding-left:5px;
		padding-right:5px;
	}
	.silver {
		color: #BDC3C7;		/* Siver */
	}
	.mtext {
		color: #666;
	}

/* ■ Others --------------------------------*/

	/* common effect */
	.ease  a{
			transition: 0.5s ease-in-out;
			-webkit-transition: 0.5s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.5s ease-in-out;
			-o-transition: 0.5s ease-in-out;
	}
	 .ease a:hover {
			transition: 0.5s ease-in-out;
			-webkit-transition: 0.5s ease-in-out;	/* Ease in-out */
			-moz-transition: 0.5s ease-in-out;
			-o-transition: 0.5s ease-in-out;
	}