@charset "utf-8";

/* -------------------------------------

ホーム　index.php　用

------------------------------------*/



/*------------------------------------
共通
------------------------------------*/
/* 写真
--------------------------*/
#home .contents-box div section section img {
	float: left;
	padding-right: 30px;
}

/* パーツ配置用
--------------------------*/
#home .contents-box div {
	position: relative;
}

/* モバイル用パーツの非表示
--------------------------*/
/* 飾りパーツ配置用 */
#home .contents-box div img.decoration-mb {
	display: none;
}
/* 雪パーツ配置用 */
#home .contents-box div img.snow-mb {
	display: none;
}

/* 下にnoteがあるときのfloat崩れ回避用
--------------------------*/
#home .contents-box div section section div {
	overflow: hidden;
}

/* noteの中の写真
--------------------------*/
#home .contents-box div section section div + section.note img {
	float: left;
	padding-right: 20px;
}



/*------------------------------------
#itonoen　伊藤農園のシュトーレン エリア
------------------------------------*/
/* 全体
--------------------------*/
#home #itonoen.contents-box {/* cssで背景画像を制御　参考 https://coliss.com/articles/build-websites/operation/css/css-responsive-full-background-image-by-sixrevisions.html */
	background: url(../img/home/itonoen-bg.jpg) center center / cover no-repeat fixed;
}
/* 飾りパーツ配置用 */
#home #itonoen.contents-box div img.decoration {
	position: absolute;
		top: -30px;
		left: -80px;
}
/* 雪パーツ配置用 */
#home #itonoen.contents-box div img.snow {
	position: absolute;
		top: -20px;
		right: -55px;
}
/* 画像下の回り込み防止用 */
#home #itonoen.contents-box div section section div > img {
	padding-bottom: 20px;
}
/* ベッカラ画像下の回り込み防止用 */
#home #itonoen.contents-box div section section section.note > img {
	padding-right: 12px;
}



/*------------------------------------
#about　シュトーレンとは エリア
------------------------------------*/
/* 全体
--------------------------*/
#home #about.contents-box {/* cssで背景画像を制御　参考 https://coliss.com/articles/build-websites/operation/css/css-responsive-full-background-image-by-sixrevisions.html */
	background: url(../img/home/about-bg.jpg) center center / cover no-repeat fixed;
}
/* 飾りパーツ配置用 */
#home #about.contents-box div img.decoration {
	position: absolute;
		top: -25px;
		left: -60px;
}
/* 雪パーツ配置用 */
#home #about.contents-box div img.snow {
	position: absolute;
		top: -35px;
		right: -90px;
}
/* 画像下の回り込み防止用 */
#home #about.contents-box div section section > img {
	padding-bottom: 20px;
}



/*------------------------------------
#eat　おいしい食べ方 エリア
------------------------------------*/
/* 全体
--------------------------*/
#home #eat.contents-box {/* cssで背景画像を制御　参考 https://coliss.com/articles/build-websites/operation/css/css-responsive-full-background-image-by-sixrevisions.html */
	background: url(../img/home/eat-bg.jpg) center center / cover no-repeat fixed;
}
/* 飾りパーツ配置用 */
#home #eat.contents-box div img.decoration {
	position: absolute;
		top: -40px;
		left: -70px;
}
/* 雪パーツ配置用 */
#home #eat.contents-box div img.snow {
	position: absolute;
		top: -30px;
		right: -75px;
}
/* 作り方の上空ける */
#home #eat.contents-box div section section section.note section + section {
	margin-top: 10px;
}

/* リストのリセット解除と設定
--------------------------*/
/* ul */
#home #eat.contents-box div section section section.note section h5 + ul li {
	/*list-style: inside;*/
	list-style: outside;
	/*text-indent: -0.2em;*/
	padding-bottom: 3px;
	margin-left: 0.2em;
}
#home #eat.contents-box div section section section.note section h5 + ul {
	padding-left: 20px;
	display: inline-block;
}
/* ol */
#home #eat.contents-box div section section section.note section h5 + ol li {
	/*list-style: inside;*/
	list-style: outside decimal;
}
#home #eat.contents-box div section section section.note section h5 + ol {
	margin-left: 1.5em;
	/*text-indent: -0.3em;*/
}



/*------------------------------------
#order　ご注文 エリア
------------------------------------*/
/* 全体
--------------------------*/
#home #order.contents-box {/* cssで背景画像を制御　参考 https://coliss.com/articles/build-websites/operation/css/css-responsive-full-background-image-by-sixrevisions.html */
	background: url(../img/home/order-bg.jpg) center center / cover no-repeat fixed;
}
/* 飾りパーツ配置用 */
#home #order.contents-box div img.decoration {
	position: absolute;
		top: -40px;
		left: -70px;
}
/* 雪パーツ配置用 */
#home #order.contents-box div img.snow {
	position: absolute;
		top: -30px;
		right: -115px;
}

/* h3
--------------------------*/
#home #order.contents-box div section section h3 {
	
}

/* h4
--------------------------*/
#home #order.contents-box div section section h4 {
	margin-top: 15px;
	font-weight: normal;
	/* font-size: 112%;18px */
	font-size: 118%;/* 19px */
}

/* 限定商品の囲み */
#home #order.contents-box div section section span.limit {
	border: 1px solid #FFF;
	line-height: 1;
	padding: 5px 5px 4px 5px;
	margin-right: 10px;
}

/* 価格
--------------------------*/
/* 全体 */
#home #order.contents-box div section section ul.price-box {
	margin-top: 10px;
	margin-bottom: 20px;
}
/* 価格の色 */
#home #order.contents-box div section section  ul.price-box li span.price {
	color: #C03;
	margin-left: 3px;
	font-size:  162%;/* 26px */
	font-weight: bold;
}
/* 円 */
#home #order.contents-box div section section  ul.price-box li span.price span {
	margin-left: 2px;
	font-size:  75%;/* 24px */
	font-weight: normal;
}
/* まとめ買いがお得のエリア */
#home #order.contents-box div section section ul.price-box li.deals {
	display: block;
	margin-top: 5px;
	float: left;
}
#home #order.contents-box div section section ul.price-box li.deals ul {
	margin-top: 5px;
}
#home #order.contents-box div section section ul.price-box li.deals ul li {
	list-style: none;
	float: left;
	margin-top: -10px;
	margin-left: -1.2em;
	padding: 0;
}
/* 割引％ */
#home #order.contents-box div section section ul.price-box span.off {
	line-height: 1;
	padding: 4px 5px 3px 5px;
	border-radius: 5px;
	margin-right: 10px;
	background: #900;
}

/* 購入ボタン
--------------------------*/
#home #order.contents-box div section section p.orderbtn a {
	display: inline-block;
	line-height: 1.5;
	padding: 15px 15px;
	width: 300px;
	height: 55px;
	border: none;
	background: rgba(255,102,0,1.00) url(../img/home/arrow-order.png) no-repeat 295px  50% ;
	margin-bottom: 5px;
	font-size: 118%;/* 19px */
	border-radius: 5px;
}
#home #order.contents-box div section section p.orderbtn a:hover {
	color: #FFF;
	background: rgba(255,102,0,0.70) url(../img/home/arrow-order.png) no-repeat 295px  50% ;
		text-shadow:
		0 -2px 6px rgba(255,255,255,0.40),/* 横 縦 ぼかし 色 ※「,」区切りで複数指定可能 */
		2px 0 6px rgba(255,255,255,0.40),
		0 2px 6px rgba(255,255,255,0.40),
		-2px 0 6px rgba(255,255,255,0.40);
	font-weight: bold;
}

/* 注文リンクの制御
--------------------------*/
#home #order.contents-box div section section ul.order {
	margin-top: 15px;
}
#home #order.contents-box div section section ul.order li {
	padding-bottom: 15px;
}

/* 注釈のリストのリセットと制御
--------------------------*/
/* ul */
#home #order.contents-box div section section ul:last-of-type li {
	/*list-style: inside;*/
	list-style: outside;
	/*text-indent: -0.2em;*/
	padding-bottom: 3px;

}
#home #order.contents-box div section section ul:last-of-type {
	margin-top: 20px;
	padding-left: 20px;
	display: inline-block;
}