body,
section .haikei01,.haikei02{
  height: 100%; /* 「div.background」に対してはmin-heightに対応していないブラウザ用 */
}
/*-----共通部分-----*/
.body_1 *{
    margin: 0;
    box-sizing: border-box;
    font-family:メイリオ, Meryo, sans-serif;
    target:
}

.center{
    margin: auto;
    max-width: 900px;
    text-align: center;
}
.item_title{
  padding-top:60px;
}
.item-list{
  margin: auto;
  width: 95%;
  text-align: center;
}
.page_top{
  z-index: 999;
}
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 10px;
  bottom: -50px;
  background: #ef3f40;
  opacity: 0.8;
  border-radius: 50%;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f0d8';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 20px;
  top: -5px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

/*----- 背景全体 -----*/
.haikei01{
  min-height:100vh;
  width:100%;
  background: linear-gradient(90deg,#fff 3%, #ffd800 3%, #ffd800 97%, #fff 90%);
  z-index :0;
}

.haikei02{
  width:100%;
  background:url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20210726/haikei_border01.png);
  background-repeat:round;
  position: relative;
  z-index :1;
}


/*----- ヘッダー -----*/
.header{
  margin: auto;
  max-width: 100%;
  padding-top:30px;
  }


/*----- トップ制作写真 -----*/
.top_photo{
  max-width: 90%;
  padding: 10px 0px;
  text-align: center;
  margin: auto;
}
img.seisaku_photo{
  width: 100%;
max-width: 1000px;
padding: 10px 0px;
text-align: center;
margin: auto;
}
/*----- わくわく素材ラインナップトップ -----*/
.top_wakuwaku_lineup img{
  max-width: 72%;
  padding: 40px 0px 20px 0px;
  text-align: center;
  margin: auto;
}
/*----- 制作レシピ一覧トップ -----*/
.seisaku_title_gazo{
  padding: 35px 0px 0px 0px;
  width: 70%;
}
/*----- 制作レシピ一覧 -----*/
.seisaku_container {  /*-- 親要素 --*/
  display: flex;
  flex-direction: row;  /*-- 子要素の並ぶ向き --*/
  flex-wrap: wrap;  /*-- 子要素の折り返し --*/
  justify-content: space-around;  /*-- 垂直方向の揃え・均等に --*/
  align-content: space-between;  /*-- 複数行にした時の揃え--*/
  margin:0px 10px;
}
.seisaku {  /*-- 子要素 --*/
  width: 100%;
  max-width: 350px;
  margin: 20px 0px;
}
img.seisaku_gazo {
width: 100%;
padding-bottom:20px;
padding-top:20px;
}

.btn-reshipi,.btn-items,.btn-back{
  display: inline-block;
  text-decoration: none;
  color: white;
  border-radius: 25px;/*左側の角を丸く*/
  width: 40%;
  height: 30px;
  text-align:center;
  line-height: 30px;
  font-weight:bold;
}
.btn-reshipi {
  background: #004097;
  font-size: 17px;
  width: 80%;
  padding: 0px 15px;
  margin: 10px 0px;
  text-decoration: none;
  color: #fff!important;
  border: 1px solid #004097;
  border-radius: 25px;
  text-align: center;
}
.btn-reshipi:hover {
  background:#005cc1;
  color: #fff!important;
}
.btn-items {
  background:#e50012;
  font-size: 17px;
  width: 80%;
  padding: 0px 15px;
  margin: 10px 0px;
  text-decoration: none;
  color: #fff!important;
  border: 1px solid #e50012;
  border-radius: 25px;
  text-align: center;
}
.btn-items:hover {
  background:#ff3939;
  color: #fff!important;
}
.btn-reshipi:active, .btn-items:active{
  transform: translateY(2px);
}
.btn-back {
  background: #009fe8;
  margin-bottom:70px;
  font-size: 18px;
}
/*----- 商品一覧 タイトル部分 -----*/
.item-list_title {
	position: relative;
	padding: 9px;
  background-color: #e40012 ;
  border-radius: 50px;
  margin-top: 90px;
  margin-bottom: 10px;
}
.item-list_title:after {
  position: absolute;
	content: '';
	top: 100%;
	border: 10px solid transparent;
	border-top: 15px solid #e40012 ;
	width: 0;
	height: 0;
}
.copy_s{
	text-align: center;
  color:white;
  font-size: 16px;
  padding-bottom: 7px;
  font-weight: bold;
}
.copy_m{
	text-align: center;
  color:white;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 2px;
}

.span_bt{
  font-size: 16px !important;
  color: red !important;
}

.span_bten{
  font-size: 11px !important;
  color: red !important;
}

.span_at{
  font-size: 11px !important;
}

/*----- 商品一覧 -----*/
.fa-shopping-cart:before{
  padding-right: 6px !important;
}

.item-list1,.item-list2,.item-list3,.item-list4,.item-list5,.item-list6,.item-list7,.item-list8
 {  /*-- 親要素 --*/
  display: flex;
  flex-direction: row;  /*-- 子要素の並ぶ向き --*/
  flex-wrap: wrap;  /*-- 子要素の折り返し --*/
  justify-content: space-around;  /*-- 垂直方向の揃え・均等に --*/
  align-content: space-between;  /*-- 複数行にした時の揃え--*/
}



/*----- チラシダウンロード -----*/
.chirashi_DL{
  transition: all 0.3s;
  margin:10px auto;
  border-radius: 5px;
  padding-bottom: 100px;
}
.chirashi_DL:hover{
transition: all 0.6s;
filter:drop-shadow(0px 15px 0px #fff);
}

.chirashi_DL_sp{
  transition: all 0.3s;
  margin:50px auto;
  border-radius: 5px;
  padding-bottom: 100px;
}
.chirashi_DL_sp:hover{
transition: all 0.6s;
filter:drop-shadow(0px 15px 0px #fff);
}


#contentInner{width:100%;padding:0;margin:0}


/*商品リスト*/
div .business_pack_list{
  margin:0 auto;
  position: inherit;
  display: flex!important;
  justify-content: center;
  width:50%;
}
.desc{
  font-size:13px;
  font-weight:bold;
}
span.price{
  color:#ED7802 !important;
  font-size:14px !important;
}
span.price_no{
  white-space: initial;
  color:000000 !important;
  font-size:12px !important;
}

/*
span.taxUnit{
  color:#000;
  font-size:11px !important;
}
span.taxPrice{
  color:#000;
  font-size:11px !important;
}
*/

/*ダウンロード*/
.dl_btn{
background: #006E38;
text-align: center;
padding: 5% 0;
}
.dl_btn img{
  width: 90%;
  max-width: 800px;
  margin: auto;
}
.dl_btn a:hover{
opacity: 0.8;
}







































/*EC-CUBE対策*/
#contentInner{
  width: 100%;
  padding: 0px;
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important;
  margin: 0 auto; }
.sp { display: none !important; }

@media (max-width: 1260px) {/*------------------------------------------- */


@media (max-width: 1080px) {/*------------------------------------------- */


@media (max-width: 780px) {/*------------------------------------------- */

  #loginBar {
  display: none !important;
  }
