@charset "utf-8";

/*////////////////////////////////////////////////////////////////////

  有限会社デジコム

////////////////////////////////////////////////////////////////////*/


/*====================================================================
  導入事例
====================================================================*/

.caseHeader {
	border-bottom: 2px solid #000;
	margin-bottom: 30px;
	overflow: hidden;
}
	.caseHeader .title {
		font-size: 200%;
		font-weight: bold;
		margin-bottom: 5px;
	}




.caseList {
	margin-bottom: 30px;
	overflow: hidden;
}
	.caseList .image {
		width: 300px;
		float: left;
	}
	.caseList .text {
		margin-left: 340px;
		position: relative;
	}
		.caseList .text .title {
			font-size: 150%;
			font-weight: normal;
			padding-bottom: 10px;
			margin-bottom: 15px;
			border-bottom: 1px solid #000;
		}
		.caseList .text .date {
			position: absolute;
			bottom: 20px;
			left: 0;
		}
		.caseList .text .logo {
			text-align: right;
			padding-top: 20px;
		}


.caseWrapper {
	margin-bottom: 30px;
	overflow: hidden;
}
.caseWrapper:last-child { margin-bottom: 0; }
	.caseWrapper .text {
		width: 620px;
		float: left;
	}
	.caseWrapper .photo {
		width: 300px;
		float: right;
	}
		.caseWrapper .photo img { max-width: 100%; }


.caseWrapper450 {
	margin-bottom: 30px;
	overflow: hidden;
}

.caseWrapper450:last-child { margin-bottom: 0; }
	.caseWrapper450 .text450 {
		width: 450px;
		height:182px;
		float: left;
  	}
.caseWrapper450 .photo470 {
		width: 470px;
		float: right;
 		}
		.caseWrapper450 .photo470 img { max-width: 100%; }





.photos {
	overflow: hidden;
}
	.photos li {
		list-style-type: none;
		width: 212px;
		height: 140px;
		text-align: center;
		float: left;
		margin: 0px 10px 10px 0px;
		padding: 10px;
		overflow: hidden;
		background: #fff;
		line-height: 1.3;
	}
	.photos li:nth-child(4n) { margin-right: 0px; }
		.photos li img {
			max-width: 100%;
			max-height: 140px;
		}

  figure.poedsp {
		float: left;
		padding-right: 10px;
		padding-left: 10px;
		display: inline-block;
		margin: 0px 0px 50px 0px;
	}

	figure.sushiButton {
		float: right;
		padding-right: 10px;
		padding-bottom: 20px;
		display: inline-block;
		cursor: pointer;
	}

	figure.sushiButton_l {
		float: right;
		padding-right: 50px;
		padding-bottom: 20px;
		display: inline-block;
		cursor: pointer;
	}


	/*====================================================================
	  スマホ表示
	====================================================================*/

	.sp_caseHeader {
		border-bottom: 2px solid #000;
		margin-bottom: 30px;
		overflow: hidden;
	}
		.sp_caseHeader .sp_title {
			font-size: 300%;
			font-weight: bold;
			margin-bottom: 5px;
		}

		.dsp_title {
			font-size: 100%;
			font-weight: bold;
			margin-bottom: 5px;
		}




	.sp_caseList {
		margin-bottom: 30px;
		overflow: hidden;
	}
		.sp_caseList .sp_image {
			width: 300px;
			float: left;
		}
		.sp_caseList .sp_text {
			margin-left: 340px;
			position: relative;
		}
			.sp_caseList .sp_title {
				font-size: 150%;
				font-weight: normal;
				padding-bottom: 10px;
				margin-bottom: 15px;
				border-bottom: 1px solid #000;
			}
			.sp_text {
				font-size: 32px;
				font-weight: normal;
				padding-bottom: 10px;
				margin-bottom: 15px;
				border-bottom: 1px solid #000;
			}
			.sp_text450 {
				font-size: 32px;
			}
			.sp_text950 {
				font-size: 32px;
				width: 940px;
				height:280px;
				margin: auto;
			}
			.sp_caseList .sp_text .sp_date {
				position: absolute;
				bottom: 20px;
				left: 0;
			}
			.sp_caseList .sp_text .sp_logo {
				text-align: right;
				padding-top: 20px;
			}




	.sp_caseWrapper {
		margin-bottom: 30px;
		overflow: hidden;
	}
	.sp_caseWrapper:last-child { margin-bottom: 0; }
		.sp_caseWrapper .text {
			width: 620px;
			float: left;
		}
		.sp_caseWrapper .sp_photo {
			width: 300px;
			float: right;
		}
			.sp_caseWrapper sp_.photo img { max-width: 100%; }


	.sp_caseWrapper450 {
		margin-bottom: 0px;
		overflow: hidden;
	}

	.sp_caseWrapper450:last-child { margin-bottom: 0; }
		.sp_caseWrapper450 .sp_text450 {
			width: 940px;
			height:210px;
			margin: 0 auto;
	  	}
	.sp_caseWrapper450 .sp_photo470 {
			width: 600px;
			float: right;
	 		}
			.sp_caseWrapper450 .sp_photo470 img { max-width: 100%; }





	.sp_photos {
		overflow: hidden;
	}
		.sp_photos li {
			list-style-type: none;
			width: 212px;
			height: 140px;
			text-align: center;
			float: left;
			margin: 0px 10px 10px 0px;
			padding: 10px;
			overflow: hidden;
			background: #fff;
			line-height: 1.3;
		}
		.sp_photos li:nth-child(4n) { margin-right: 0px; }
			.sp_photos li img {
				max-width: 100%;
				max-height: 140px;
			}

	  figure.sp_poedsp {
			float: left;
			padding-right: 5px;
			display: inline-block;
			margin: 0px 0px 50px 0px;
			width: 320px;
			height: 350px;
		}



		figure.sp_sushiButton {
			float: right;
			padding-right: 10px;
			display: inline-block;
			cursor: pointer;
		}

		.sp_sushiButton ul,.sp_sushiButton ul li ol {
			list-style-type:none;
		}

		.sp_sushiButton ul li {
			display:inline-block;
			vertical-align:top;
		}

		.sp_sushiButton ul li ol li {
			  display:list-item;
				padding:30px;
		}

		.sp_sushiButton ul li ol li img {
			width:300px;
			height:auto;
		}

		figure.sp_sushiButton_l {
			float: right;
			padding-right: 20px;
			display: inline-block;
			cursor: pointer;
		}



		/*====================================================================
		  スマホ表示切替
		====================================================================*/

		/*--パソコンとスマホの切替--*/
		/* パソコンで見たときは"pc"のclassがついた画像が表示される */
		.sp { display: none; }

		/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
		@media screen and (max-width: 990px) {
		.pc { display: none; }
		.sp { display: inline;}
		}



		.sp_caseHeader { display: none; }

		/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
		@media screen and (max-width: 990px) {
		.caseHeader { display: none; }
		.sp_caseHeader { display: block;}
		}