@charset 'utf-8';/*　*/


/* 初期化
------------------------------------------------*/

#bodyZoneA {
	color: #2d2d2d;
	font-family: '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Meiryo UI', 'MS UI Gothic', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}

#bodyZoneA h1, #bodyZoneA h2, #bodyZoneA h3,
#bodyZoneA h4, #bodyZoneA h5, #bodyZoneA h6,
#bodyZoneA dl, #bodyZoneA dt, #bodyZoneA dd,
#bodyZoneA ul, #bodyZoneA li {
	margin: 0;
	padding: 0;
}

#bodyZoneA ul {list-style: none;}

#bodyZoneA .cf {zoom: 1;}

#bodyZoneA .cf::after {
	clear: both;
	content: '';
	display: block;
}


/* PC
------------------------------------------------*/

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


#bodyZoneA {
	min-width: 960px;
	width: 100%;
	width: expression(document.body.clientWidth < 961? '960px' : 'auto');
}


	/* Home
	--------------------------------------------*/
	#bodyZoneA .home {
		background-color: #ece1cb;
		width: 100%;
	}

		#bodyZoneA .home a {
			background: url(../img/pc/hm_img_trademark.png) no-repeat 50% 52px;
			display: block;
			padding: 52px 0 48px;
			position: relative;
			text-align: center;
			width: 100%;
		}

		#bodyZoneA .home a:hover {
			opacity: 0.3;
			background-color: rgba(255, 255, 255, 0.8);
		}

		#bodyZoneA .home a::before {
			background: url(../img/pc/hm_ico_prev.png) no-repeat 0 0;
			content: '';
			display: block;
			height: 38px;
			left: 50%;
			margin: -19px 0 0 -374px;
			position: absolute;
			top: 50%;
			width: 20px;
		}

			#bodyZoneA .home a img {
				width: 374px;
				height: 100px;
				opacity: 0;
			}


	/* Product
	--------------------------------------------*/
	#bodyZoneA .product {
		background-color: #1c1c1c;
		padding: 110px 0 40px;
		width: 100%;
	}

		#bodyZoneA .product .prop {
			background: url(../img/pc/prd_img_product.jpg) no-repeat 98px 0;
			margin: 0 auto;
			min-height: 590px;
			_height: 590px;
			padding-left: 380px;
			width: 570px !important;
			width /**/: 950px;
		}

			#bodyZoneA .product .name {
				color: #d4b579;
				padding: 42px 0 32px;
				position: relative;
			}

			#bodyZoneA .product .name::after {
				background-color: #d4b579;
				bottom: 0;
				content: '';
				display: block;
				height: 2px;
				left: 2px;
				position: absolute;
				width: 84px;
			}

				#bodyZoneA .product .name dt,
				#bodyZoneA .product .name dd {
					font-size: 18px;
					line-height: 1.67;
				}

				#bodyZoneA .product .name dd {padding-top: 14px;}

					#bodyZoneA .product .name span {
						font-size: 22px;
						font-weight: bold;
					}

			#bodyZoneA .product .intro {
				color: #fff;
				font-size: 18px;
				line-height: 1.67;
				padding-top: 30px;
			}

			#bodyZoneA .product .relation {
				padding-top: 66px;
				width: 570px;
			}

				#bodyZoneA .product .relation li {
					float: left;
					padding-right: 30px;
				}

					#bodyZoneA .product .relation a {
						background: url(../img/pc/prd_ico_link.gif) no-repeat 87.27% 50%;
						border: 2px solid #fff;
						color: #fff;
						display: block;
						font-size: 16px;
						padding: 10px 0;
						line-height: normal;
						text-align: center;
						width: 216px !important;
						width /**/: 220px;
					}

					#bodyZoneA .product .relation a:hover {
						background: #fff;
						color: #1c1c1c;
					}

					#bodyZoneA .product .relation a[href^="http"]:after {
						background: none;
						content: none;
						margin: 0;
					}

}


/* SP
------------------------------------------------*/

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


#sapporo-topicpath-area {display: none;}

#bodyZoneA img {
	height: auto;
	vertical-align: top;
	width: 100%;
}


	/* Home
	--------------------------------------------*/
	#bodyZoneA .home {
		background-color: #ece1cb;
		width: 100%;/* 640px */
	}

		#bodyZoneA .home a {
			display: block;
			padding: 6.25% 0 5.94%;
			position: relative;
			text-align: center;
			width: 100%;/* 640px */
		}

		#bodyZoneA .home a::before {
			background: url(../img/sp/hm_ico_prev.png) no-repeat 0 0;
			background-size: 100% auto;
			content: '';
			display: block;
			left: 0;
			margin: -2.19% 0 0 12.5%;
			padding-bottom: 4.38%;/* 28px */
			position: absolute;
			top: 50%;
			width: 2.5%;/* 16px */
		}

			#bodyZoneA .home a img {width: 43.75%;/* 280px */}


	/* Product
	--------------------------------------------*/
	#bodyZoneA .product {
		background-color: #1c1c1c;
		padding: 14.38% 0 14.06%;
		width: 100%;/* 640px */
	}

		#bodyZoneA .product .prop {}

			#bodyZoneA .product .name {
				background: url(../img/sp/prd_img_product.jpg) no-repeat 50% 0;
				background-size: 24.34% auto;
				color: #d4b579;
				margin: 0 auto;
				padding: 79.38% 0 7.81%;
				position: relative;
				text-align: center;
				width: 95%;/* 608px */
			}

			#bodyZoneA .product .name::after {
				background-color: #d4b579;
				bottom: 0;
				content: '';
				display: block;
				padding-bottom: 0.33%;
				margin-left: -6.91%;
				left: 50%;
				position: absolute;
				width: 13.82%;/* 84px */
			}

				#bodyZoneA .product .name dt,
				#bodyZoneA .product .name dd {
					font-size: 12px;
					line-height: 1.8;
					letter-spacing: -0.06em;
				}


				#bodyZoneA .product .name dd {padding-top: 6.25%;}

					#bodyZoneA .product .name span {
						font-size: 16px;
						font-weight: bold;
					}

			#bodyZoneA .product .intro {
				color: #fff;
				font-size: 16px;
				line-height: 1.64;
				margin: 0 auto;
				padding-top: 7.5%;
				width: 95%;/* 608px */
			}

			#bodyZoneA .product .relation {
				margin: 0 auto;
				width: 95%;/* 608px */
			}

				#bodyZoneA .product .relation li {
					padding-top: 8.22%;
					text-align: center;
				}

					#bodyZoneA .product .relation a {/* 14x20 */
						background: url(../img/sp/prd_ico_link.gif) no-repeat 78.95% 50%;
						background-size: 2.3% auto;
						border: 2px solid #fff;
						color: #fff;
						display: block;
						font-size: 16px;
						line-height: normal;
						padding: 4.93% 0;
					}


					#bodyZoneA .product .relation a[href^="http"]:after {
						background: none;
						content: none;
						margin: 0;
					}


}