@charset "UTF-8";
img, object, embed, video {
	max-width: 100%;
}
/*
Dreamweaver 可変グリッドプロパティ
	----------------------------------
	dw-num-cols-mobile:	6;
	dw-num-cols-tablet:		6;
	dw-num-cols-desktop:	16;
	dw-gutter-percentage:	25;
*/
/* htmlのフォントデフォルトサイズ・75%=12px */
/*html {font-size : 75%;}*/
/* Firefoxのmouseover点線削除 */
a {
	outline: none;
}
a:focus {
	outline: none;
	text-decoration: underline;
}
/*
▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼
　モバイルレイアウト480pxおよびそれ以下 
▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲
*/
/*▼親要素グリッドコンテナ.item-list・子要素グリッドアイテム.item-list li ▼*/
.item-list {
	display: grid;
	justify-content: center;
	/*↓↓↓食パン設定*/
  /*grid-template-columns: 1fr 1fr 1fr;*/
  /*↓↓↓菓子パン・調理パン設定*/
	grid-template-columns: repeat(auto-1fr, 360px);
	/*grid-template-columns: repeat(auto-fit, 240px);*/
  /*	column-gap: 150px;*/
	column-gap: 95px;
	row-gap: 40px;
	/*width: 930px;*/
	width: 1150px;
	/*max-width: 90%を指定するのは、1150px以下の小さいブラウザで見た時にも左右の余白を5%ずつ確保するため*/
	max-width: 90%;
	/*	width: 1200px;*/
  /*max-width: 100%;*/
/*  margin-top: 75px;*/ 
	margin-top: 45px;
	margin-left: auto;
	margin-right: auto; /*background-color: #FFC;*//*padding: 10px 10px;*/
}
.item-list dl {
	margin-top: 20px;
}
/*商品名*/
.item-list dt {
	font-weight: bold;
	line-height: 1.5em;
	letter-spacing: 0.2em;
}
.item-list dd {
	/*font-size: 13px;*/
  /*font-weight: bold;*/
	margin-top: 15px;
	letter-spacing: 0.1em;
	line-height: 20px;
	margin-top: 10px;
}
/*値段*/
.item-list .price {
	font-weight: bold;
	margin-top: 10px;
	text-align: right;
	letter-spacing: 0.1em;
}
.item-list li {
	position: relative;
	margin-bottom: 40px;
}
.item-list .item-label {
	position: absolute;
	top: 0;
	left: calc(100% + 18px);
	font-size: 10px;
	white-space: nowrap;
	transform-origin: top left;
	transform: rotate(90deg);
}

/*
▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼
　タブレットレイアウト481 px ～ 768 px
　モバイルレイアウトからスタイルを継承。
▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲
*/
@media only screen and (min-width: 481px) {
/*▼親要素グリッドコンテナ.item-list・子要素グリッドアイテム.item-list li ▼*/
.item-list {
	display: grid;
	justify-content: center;
	/*↓↓↓食パン設定*/
  /*grid-template-columns: 1fr 1fr 1fr;*/
  /*↓↓↓菓子パン・調理パン設定*/
	grid-template-columns: repeat(auto-fit, 300px);
	/*grid-template-columns: repeat(auto-fit, 240px);*/
  /*	column-gap: 150px;*/
	column-gap: 95px;
	row-gap: 70px;
	/*width: 930px;*/
	width: 1150px;
	/*max-width: 90%を指定するのは、1150px以下の小さいブラウザで見た時にも左右の余白を5%ずつ確保するため*/
	max-width: 90%;
	/*	width: 1200px;*/
  /*max-width: 100%;*/
	margin-top: 75px;
	margin-left: auto;
	margin-right: auto; /*background-color: #FFC;*//*padding: 10px 10px;*/
}
.item-list dl {
	margin-top: 20px;
}
/*商品名*/
.item-list dt {
	font-weight: bold;
	line-height: 1.5em;
	letter-spacing: 0.2em;
}
.item-list dd {
	/*font-size: 13px;*/
  /*font-weight: bold;*/
	margin-top: 15px;
	letter-spacing: 0.1em;
	line-height: 20px;
	margin-top: 10px;
}
/*値段*/
.item-list .price {
	font-weight: bold;
	margin-top: 10px;
	text-align: right;
	letter-spacing: 0.1em;
}
.item-list li {
	position: relative;
}
.item-list .item-label {
	position: absolute;
	top: 0;
	left: calc(100% + 18px);
	font-size: 10px;
	white-space: nowrap;
	transform-origin: top left;
	transform: rotate(90deg);
}
}

/*
▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼
　デスクトップレイアウト769px～最大1232px
　モバイルレイアウトとタブレットレイアウトから
　スタイルを継承
▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲
*/
@media only screen and (min-width: 768px) {
/*▼親要素グリッドコンテナ.item-list・子要素グリッドアイテム.item-list li ▼*/
.item-list {
	display: grid;
	justify-content: center;
	/*↓↓↓食パン設定*/
  /*grid-template-columns: 1fr 1fr 1fr;*/
  /*↓↓↓菓子パン・調理パン設定*/
	grid-template-columns: repeat(auto-fit, 300px);
	/*grid-template-columns: repeat(auto-fit, 240px);*/
  /*	column-gap: 150px;*/
	column-gap: 95px;
	row-gap: 70px;
	/*width: 930px;*/
	width: 1150px;
	/*max-width: 90%を指定するのは、1150px以下の小さいブラウザで見た時にも左右の余白を5%ずつ確保するため*/
	max-width: 90%;
	/*	width: 1200px;*/
  /*max-width: 100%;*/
	margin-top: 75px;
	margin-left: auto;
	margin-right: auto; /*background-color: #FFC;*//*padding: 10px 10px;*/
}
.item-list dl {
	margin-top: 20px;
}
/*商品名*/
.item-list dt {
	font-weight: bold;
	line-height: 1.5em;
	letter-spacing: 0.2em;
}
.item-list dd {
	/*font-size: 13px;*/
  /*font-weight: bold;*/
	margin-top: 15px;
	letter-spacing: 0.1em;
	line-height: 20px;
	margin-top: 10px;
}
/*値段*/
.item-list .price {
	font-weight: bold;
	margin-top: 10px;
	text-align: right;
	letter-spacing: 0.1em;
}
.item-list li {
	position: relative;
}
.item-list .item-label {
	position: absolute;
	top: 0;
	left: calc(100% + 18px);
	font-size: 10px;
	white-space: nowrap;
	transform-origin: top left;
	transform: rotate(90deg);
}
}