@charset "UTF-8";

/* ================================== */
/* 今回のサンプル(A～D)の共通デザイン */
/* ================================== */
/* 以下のCSSは、描画領域の横幅に関係なく、常に適用されます。 */
/* 描画領域の横幅が600px・850px以上になった際には、別途HTMLソース側に記述したCSSで装飾を上書きする形(＝モバイルファースト)でレスポンシブ・ウェブデザインを実現しています。 */

	/* -------------------------- */
	/* ▼ページ周囲の余白をなくす */
	body {
		padding: 				0;
		margin: 				0 auto;

		width:  				60%;				/* 追加 */

	}


	/* -------------------- */
	/* ▼メインカラムの装飾 */
	.main-column {
		margin: 				0 auto;
		padding: 				1px 0px;			/* 内側の余白(上下に1px) */
	}



	.main-box {
		margin: 				1em;
		line-height: 			1.5;
	}

	.main-box ul li {
		line-height: 			1.5;
	}


	.main-box h2 {
	margin-top: 				1em;
	margin-bottom: 				0.25em;
	padding-top: 				0;
	padding-bottom: 			0;
	font-size: 					x-large;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic", sans-serif;
	}


	.main-box h3 {
		margin-top: 			0;
		margin-bottom: 			0.25em;
		padding-top: 			0;
		padding-bottom: 		0;
		line-height: 			normal;
	}


	/* ---------------------- */
	/* ▼メインメニューの装飾 */
	.main_nv {
			margin: 			0;
			padding: 			0;
			padding-bottom: 	2em;
			clear: 				both;
	}

	.main_nvfl {
			margin: 			0;
			padding: 			0;
			width: 				25%;
			float: 				left;
	}

	.main_nvfl img {
			width: 				98%;
	}

	.main_nvfl:hover img {
			opacity: 			0.6;
			filter: 			alpha(opacity=60);
	}


	/* ------------------------ */
	/* ▼メイン内の画像表示定義 */
	.picfull {
			margin: 			0;
			padding: 			0;
	}

	.picfull img{
			width: 				100%;
	}

	.picfull:after {
    content:""; 
    display:block; 
    clear:both;

	}


	/* ------------------------ */
	/* ▼メイン内の画像表示定義 */
	.piccnt {
			margin: 			0;
			padding: 			0;
			text-align: 		center;
	}

	.piccnt img{
			width: 				50%;
	}

	.piccnt75 {
			margin: 			0;
			padding: 			0;
			text-align: 		center;
	}

	.piccnt75 img{
			width: 				75%;
	}



	.picfull6 {
	}

	.picfull6 img{
			width: 				60%;
			float: 				left;
	}

	.picfull6:after {
			display: 			none;
			clear: 				both;
	}

	.picfull4 {
	}

	.picfull4 img{
			width: 				40%;
	}

	.picfull6:after {
			display: 			none;
			clear: 				both;
	}


	/* -------------------------- */
	/* ▼キャンペーンリンクエリア */
	.sublink {
			font-size: 			small;
			padding: 			0;
			text-align: 		center;
			width: 				100%;
			clear: 				both;
	}

	.linkspc {
			color: 				#FF0000;
			background-color: 	#FFF5C9;
			width: 				50%;
			float: 				left;
	}

	.linkspc img {
			text-align: 		center;
			width:				80%;
	 }

	.linkspc:hover img {
			opacity: 			0.6;
			filter: 			alpha(opacity=60);
	}

	.sublink:after {
			clear: 				both;
	}


	/* -------------------------- */
	/* ▼キャンペーンリンクエリア */
	.sblk {
			font-size: 			small;
			margin: 			0;
			padding: 			0;
			text-align: 		center;
			width: 				100%;
			clear: 				both;
	}

	.lkspc {
			color: 				#FF0000;
			width: 				50%;
			float: 				left;
	}

	.lkspc img {
			text-align: 		center;
			width:				100%;
	 }


	.sblk:after {
			clear: 				both;
	}



	/* -------------------------- */
	/* ▼テキストエリア　４カラム */
	.txtFourCell {
			font-size: 			normal;
			margin: 			0;
			padding: 			0;
			text-align: 		center;
			width: 				100%;
			clear: 				both;
	}

	.txtFourCellBox {
			color: 				#552200;
			width: 				25%;
			float: 				left;
	}



	.txtFourCellBox img{
			width: 				100%;
	}


	.txtFourCell:after {
			display: none;
			clear: 				both;
	}


	/* -------------------------- */
	/* ▼テキストエリア　３カラム */
	.txtThreCell {
			font-size: 			small;
			margin: 			0;
			padding: 			0;
			text-align: 		left;
			width: 				100%;
			clear: 				both;
	}

	.txtThreCellBox {
			margin-top: 		2%;
			margin-bottom: 		2%;
			margin-left: 		2%;
			margin-right: 		2%;
			padding-left: 		2%;
			padding-right: 		2%;
			color: 				#552200;
			width: 				25%;
			float: 				left;
	}


	.txtThreCellBox img{
			text-align: 		center;
			width: 				75%;
	}


	.txtThreCell:after {
			display: none;
			clear: 				both;
	}


	/* -------------------------- */
	/* ▼テキストエリア　２カラム */
	.txtTwoCell {
			font-size: 			normal;
			padding: 			0;
			text-align: 		left;
			width: 				100%;

			border-radius: 		0px 0px 10px 10px;
			background-color: 	#fff7ef;

			clear: 				both;
	}

	.txtTwoCellBox {
			color: 				#552200;
/*
			border-radius: 		0px 0px 10px 10px;
			background-color: 	#fff7ef;
*/
			width: 				50%;
			float: 				left;
	}



	.txtTwoCellBox ul{
			margin: 0;

	}

	.txtTwoCellBox li{
			vertical-align: top;
	}


	.txtTwoCellBoxTtl{
			text-align: 		center;
			font-weight: 		bold;
			font-size: 			large;
			color: 				#ff4500;
	}

	.txtTwoCell:after {
			display: 			none;
			clear: 				both;
	}


	/* -------------------------- */
	/* ▼テキストエリア　１カラム */
	.txtOne {
			margin-left: 		auto;
			font-size: 			normal;
			padding: 			0;
			text-align: 		left;
			width: 				45%;
			clear: 				both;
	}


	/* -------------------------- */
	/* ▼テキストエリア　１カラム */
	.txtOneFull {
/*
			margin-left: 		auto;
*/
			margin-bottom: 		2em;
			font-size: 			normal;
			padding: 			0;
			width: 				100%;
			clear: 				both;
	}

	.txtOneFull img{
			text-align: 		center;
			width: 				100%;
	}


	/* ------------------------------ */
	/* ▼メイン内のサブリンクエリア   */
	/* ------------------------------ */
	.txtRpic {
			margin: 			0;
			padding: 			0;
 			margin-right: 		auto;
 	}


	.txtRpic img{
			float: 				right;
	}

	.txtRpic:after {
			content: 			"";
			display: 			block;
			clear: 				both;
	}


	/* -------------------------- */
	/* ▼画像（Left）＆テキストエリア　１カラム */
	.pictxtCell {
			font-size: 			normal;

			text-align: 		left;
			background-color: 	#FFF5C9;
			width: 				100%;
	}

	.pictxtCell img{
			text-align: 		left;
			float: 				left;
			width: 				30%;
	}


	/* ------------------------------ */
	/* ▼メイン内のサブリンクエリア   */
	/* ------------------------------ */
	.otherlink {
			margin: 0px 0px 0px 0px;
			padding: 			0;
			text-align: 		center;
			width: 				100%;
	}

	.otherlink:after {
			content: 			"";
			display: 			block;
			clear: 				both;
	}

	.otherspc {
			margin: 			0 0 10px 0;
			padding: 			0.5em;
			width: 				46%;
			float: 				left;
	}

	.otherspc img{
			width: 				100%;
	}

	/* -------------- */
	/* ▼求人募集詳細 */
	/* -------------- */
	.recSpc {
			width: 				100%;
			line-height: 		1em;
			clear: 				both;
	}

	.recSpcTtl {
			text-align: 		center;
			width: 				18%;			
			float: 				left;
	}

	.recSpcCel {
			margin-bottom: 		1em;
			width: 				82%;
			float: 				left;
	}

	/* -------------- */
	/* ▼画像表示50％ */
	/* -------------- */
	.picHalf {
			margin-bottom: 		5%;
			width: 				100%;
			text-align: 		center;
			line-height: 		1em;
			clear: 				both;
	}

	.picHalf img {
			text-align: 		center;
			width: 				50%;
	}


/* ============================== */
/* ▼各アプリレスポンシブ対応設定 */
/* ============================== */
/* --------- */
	/* ▼youtube */
	.youtube2 {
			margin: 			2px 5px 2px 5px;
			position: 			relative;
			width: 				100%;
			padding-top: 		56.25%;
	}

	.youtube2 iframe {
			position: 			absolute;
			top: 				0;
			right: 				0;
			width: 				100% !important;
			height: 			100% !important;
	}


	/* --------------------------- */
	/* ▼googlemapレスポンシブ対応 */
	.google-maps {
			position: 			relative;
			padding-bottom: 	56%; 				/* これが縦横比	*/
			height: 			0;
			overflow: 			hidden;
	}

	.google-maps iframe {
			position: 			absolute;
			top: 				0;
			left: 				0;
			width: 				100% !important;
			height: 			100% !important;
	}


	/* -------------------------- */
	/* ▼Facebookレスポンシブ対応 */
	.fb_iframe_widget,
	.fb_iframe_widget[style],
	.fb_iframe_widget iframe[style],
	.fb_iframe_widget span{
			width: 				100% !important;
	}

	.fbcomments,
	.fb_iframe_widget,
	.fb_iframe_widget[style],
	.fb_iframe_widget iframe[style],
	.fbcomments iframe[style],
	.fb_iframe_widget span{
			width: 				100% !important;
	}


	/* -------------------- */
	/* ▼企業情報部分の装飾 */
	.compny {
			margin:				5px 5px;
			line-height:		1.5;
			min-height:			0;
			align-items:		center;
			align-self:			center;
			color:				#5A2F00;
			font-size:			small;
			font-family:		'Noto Sans Japanese', sans-serif;
			font-weight:		normal;
			text-align:			center;
			clear: 				both;
	}

	/* -------------------------------- */
	/* ▼企業情報部分のリスト情報の装飾 */
	ul.footer_ul {
	    	font-size: 			0;
			list-style-type:    none;
			list-style-position:outside;
			font-weight: 		normal;
	}

	ul.footer_ul li{
    		display: 			inline-block;
			font-size: 			small;
			width: 				18%;
			margin-right: 		3px;
	}

	ul.footer_ul li a {
			text-decoration:	none;
			color:				#762f07;
	}

	ul.footer_ul a:hover {							/*	アンダーライン	*/
			border-bottom:		dotted 1px #fff;
	}



	/* -------------------- */
	/* ▼サイドカラムの装飾 */
	/* -------------------- */
	.side-column {
			padding: 			1px 0px;			/* 内側の余白(上下に1px) */
	}
	.side-box {
			margin: 			1em;
			border: 			1px solid white;
			border-radius: 		0px 0px 10px 10px;
			background-color: 	#fff7ef;
	}
	.side-box h2 {
			margin: 			0px;
			padding: 			0px 5px;
			font-size: 			1.1em;
			background-color: 	#ff9933;
			color: 				white;
	}

	.side-box p {
			padding: 			0px 0.5em;
	}

	.side-box_bn {
			text-align: 		center;
			margin: 			1em 2.5em 1em;
	}

	.side-box_bn img{
			text-align: 		center;
			width: 				100%;
	}

	/* ------------------ */
	/* ▼ヘッダ部分の装飾 */
	.pageheader {
			margin: 			0px;
			padding: 			0;
	}

	.pageheader img{
			width: 				100%;
	}


	.pageheader_shop {
			font-size: 			6px;
			float:				left;
	}

	.pageheader_img {
			float:				left;
	}

	.pageheader_tel {
			color:				#762f07;
			font-size:			xx-large;
			font-weight:		bold;
			float:				right;
	}


	/* ------------------ */
	/* ▼フッタ部分の装飾 */
	.pagefooter {
			margin: 			0px;
			padding: 			1em;
	}



	/* ------------------ */
	/* ▼リンクカラー設定 */
	a:link { 										/* 未訪問 	*/
			color: 				#762f07;
	}

	a:visited { 						 			/* 訪問済	*/
			color:				#008000;
	}

	a:hover {						 				/*リンクにマウスがる時 	*/
			color:				#ff00ff;
	}

	a:active { 										/*リンクを選択した時 */
			color:				#ffff00;
	}


	/* ------------------ */
	/* ▼カラー設定 */
	.smlBro {
		font-size: 				small;
		color: 					#a52a2a;
	}

	.lrgBroBld {
		font-size: 				large;
		font-weight: 			bold;
		color: 					#a52a2a;
	}

	.smlBlk {
		font-size: 				small;
		color: 					BLACK;
	}

	.norBlk {
		font-size: 				medium;
		font-weight: 			bold;
		color: 					BLACK;
	}

	.Blk_center_Ll {
		font-size: 				x-large;
		font-weight: 			bold;
		text-align: 			center;
		color: 					BLACK;
	}

	.Bl_center_Ll {
		font-size: 				x-large;
		font-weight: 			bold;
		text-align: 			center;
		color: 					#0066ff;
	}


	.txtCnt {
		align: 					center;
		text-align: 			center;
	}


	.lbr_center_bold {
		font-weight: 			lighter;
		text-align: 			center;
		color: 					#cc6600;
	}

	.bl_center {
		text-align: 			center;
		color: 					#0000ff;
	}

	.bl_center_bold {
		font-weight: 			bold;
		text-align: 			center;
		color: 					#0000ff;
	}

	.lbl_center {
		font-weight: 			lighter;
		text-align: 			center;
		color: 					#0066ff;
	}

	.lbl_center_bold {
		font-weight: 			lighter;
		text-align: 			center;
		color: 					#0066ff;
	}

	.rd_center_s {
		font-size: 				small;
		font-weight: 			lighter;
		text-align: 			center;
		color: 					#ff0000;
	}




.clearfix:after {
	    content: '';
    	display: block;
    	clear: both;
}



.navi	{
		margin: 				0.25em 5px;

		background-color: 		#762f07;

		border: 				none;
		line-height: 			180%;

		min-height: 			0;
		color: #5A2F00;
		font-size: 21px;
		font-family: 'Noto Sans Japanese', sans-serif;
		font-weight: normal;
		text-align: center;
	}

p.navi_box {
		margin: 		0;
		padding: 		0;
}


p.navi_box img {
		margin-left: 			0.5em;
		margin-right: 			0.5em;
		margin-bottom: 			0.25em;
		margin-top: 			0.25em;
/*
		margin: 			1px 1% 1px 1%;
*/
		padding: 			0px 0px;
		width: 				12%;
		background-color:rgba(255,254,215,1.00);
		float: 					left;
}

.navi:after {
		content: "";
		display: block;
		clear: both;

}

.navi_box a { text-decoration: none; }
.navi_box a:link { color: #fff; }
.navi_box a:visited { color: #ffff00; }

/* hover時に、画像を透過させる(IE用→alpha その他→opacity) */
.navi_box a:hover img {
    filter:alpha(opacity=50);
    -moz-opacity: 1;
    opacity: 0.5;
}

.navi_box a:active { color: #ff8000; }



/* ================================================================================================================ */
/* 以下は、サンプル掲載用の装飾・説明用の装飾であり、記述は必須ではありません。（本記事のテクニックとは無関係です） */
/* ================================================================================================================ */
body {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic", sans-serif;

}