html,body { margin:0; padding:0; font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; }
body { background:#FFF url("./images/body_bk.png") repeat center top; }
img { vertical-align:bottom; }
#contents,.ctsFrame { width:1000px; margin:0 auto; position:relative; }
#btnOrderBox { position:fixed; top:8px; right:0; z-index:9999; }
#btnOrderBox div { width:1000px; margin:0 auto; }
header { background: url("./images/header_bk2.jpg") repeat-x 0 0; width:100%; min-width:1000px; position:relative; }
 header .ctsFrame {  width:100%; max-width:1515px; height:auto; max-height:515px; margin:0 auto; text-align:center; }
 #idx h1 { position:absolute; top:-500px; left:0; }
 img#tpImg { width:100%; height:auto; }
 img#tpImgSP { display:none; }
  #btnOrder { position:fixed; top:0; right:0; }

.flexBox { display:flex; justify-content:space-between; }
#pheader { width:100%; background-color:#FFF; }
  #pheader h1 { margin:0; padding:0; }

#memberBox { position:absolute; top:12px; right:260px; border:4px solid #A5040D; text-align:center;  border-radius:14px;  font-size:14px;  }
#memberBox div { background-color:#A5040D; color:#FFF; padding:4px; }
#memberBox a { text-decoration:none; display:block; }

#contents {  padding-bottom:48px; }

section { padding:24px; background-color:#FFF; }

section h2  { margin:0; padding:0; }

  #tpAboutBox { margin-top:24px;  }
  #tpAboutBox a { text-decoration:none; display:inline-block; }

#tpConcept,.menuT { background-color:#FF9D00; color:#FFF; text-align:center; padding:6px; margin:24px 0; }

  #howtoBox ul { display:flex; justify-content: space-between; list-style-type:none; margin:24px 0; padding:0; }
  #howtoBox ul > li { margin:0; padding:0 16px; width:33%; height:auto; box-sizing:border-box; border-left:1px solid #FF9D00; }
  #howtoBox ul > li:first-child { border:0; padding:0 16px 0 0; }
  #howtoBox ul > li:last-child { padding:0 0 0 16px; }


    #howtoBox ul > li ul    { display:block; margin:8px 0; padding:8px; color:#FFF; font-size:80%; background-color:#FF9D00; }
    #howtoBox ul > li ul li { width:100%; text-indent:-1em; border:0; margin:0; padding:0 0 0 1em; }
    #howtoBox ul > li ul li:first-child { padding:0 0 0 1em; }

  .weekMenuBox { position:relative; margin-top:24px; }
  .weekMenuBox h2       { color:#FFF; display:inline-block; padding:0 6px; }
  .weekMenuBox h2.typeA { background-color:#FF0000; }
  .weekMenuBox h2.typeB { background-color:#2EA7E0; }
  .weekMenuBox h2.typeC { background-color:#FFBF0D; }
  .cmt { position:absolute; top:18px; left:160px; line-height:52px }
  .weekMenuBox ul { display:flex; justify-content:space-between; width:100%; margin:24px auto 0; padding:0; }
  .weekMenuBox li { list-style-type:none; font-size:14px;  margin:0; padding:0; width:20%; text-align:center; }
    .weekMenuBox li:first-child { border:0; }
  .weekMenuBox li div { position:relative; border:1px solid #A5040D; width:142px; margin:0 auto 8px; }

  .weekMenuBox li span { position:absolute; bottom:-6px; right:-6px; display:inline-block; width:32px; height:32px; line-height:32px; font-size:18px; border-radius:50%; background-color:#A5040D; color:#FFF; text-align:center;  }

  #aboutUL {  width:860px; display:flex; justify-content:space-between; margin:0 auto 24px; padding:0; position:relative; }
  #aboutUL li { list-style-type:none; box-sizing:border-box; margin:0; padding:28px; background:url("images/about_bk.png") no-repeat 0 0; background-size:cover; width:295px; height:513px; }
    #aboutUL li strong { color:#E25B20; font-size:26px; }
    #aboutUL li p { font-weight:bold; margin:0; font-size:18px; }
	#aboutUL li img.ic { margin-top:14px; }
    #aboutUL a { display:block; text-decoration:none; color:#FFF; background-color:#A5040D; border-radius:14px; text-align:center; font-size:22px; line-height:42px; margin:14px 0; }
	#aboutUL a img { vertical-align:middle; }

  #btmContents { display:flex; justify-content:space-between; width:840px; margin:0 auto; position:relative; }
    #delivMap,#notesBox { background-color:#FFF; width:410px; position:relative;  }
	#delivT { position:absolute; top:-24px; left:-24px; }
	#MapImg { float:left; margin:32px 8px 0 24px; }
	#delivMap div { margin:32px 24px 0 232px; font-size:14px; }
    #notesBox ul { list-style: none; font-size:14px; margin:32px 16px; padding:0; }
    #notesBox li { text-indent:-1em;  margin:0 0 1em 1em;; padding:0; }
    #notesBox li:before { content: "●"; color:#A5040D; }


  #telOrder { margin-top:24px; }
  #telOrder a { display:block; text-align:center; color:#FFF; text-align:center; text-decoration:none; margin-top:24px; }


  #tpBnBox { display:flex; justify-content:space-between; flex-wrap: wrap; margin:24px 0 0 0; padding:0;  }
  #tpBnBox li { list-style-type:none; padding:12px; margin-bottom:12px; background-color:#FFF;}

  section#tpNotesBox { background-color:transparent; padding:0 }
  section#tpNotesBox ul { margin:0; padding:0; width:100%; }
  section#tpNotesBox li { list-style-type:none; margin:0; padding:0; }

footer { width:100%; background-color:#FFF; padding:18px 0 0 0; box-sizing:border-box;  position: absolute; bottom:0; }
  #copyright { margin-top:18px; width:100%; text-align:center; background-color:#FF9D00; color:#FFF; padding:4px 0; }
  #ftLogo { float:left; }
  #ftContents { margin:0 0 0 272px; }
  #ftTel { border-bottom:2px solid #000; padding-bottom:6px; display:flex;  }
     #ftTel div { margin-right:6px; }
  #ftEtime { display:flex; justify-content:space-between; padding-top:6px; }
  #ftAdr { padding-top:8px; display:flex; }

/* ************** */
.footerFixed{
    min-height: 100vh;
    position: relative;
    padding-bottom: 200px; 
    box-sizing: border-box;
}
.ctsBox { background-color:#FFF; margin:32px 0; padding:24px; border-radius:14px;  }
.ctsBox h2 { margin:0; background-color:#A5040D; color:#FFF; padding:0 16px; border-radius:4px; }


dl.dlEdit { box-shadow: 4px 4px 4px rgba(0,0,0,0.4); }
dl.dlEdit { display:flex; flex-wrap: wrap; border:4px solid #E25B20; border-radius:8px; margin:0 0 1.5em 0; padding:0; }
dl.dlEdit dt { width:20%; box-sizing: border-box; background-color:#FFBF0D; padding:8px; border-bottom:1px solid #E25B20; }
dl.dlEdit dd { width:80%; box-sizing: border-box; background-color:#FFF; margin:0; padding:3px; border-bottom:1px solid #E25B20;  }
dl.dlEdit dd input[type="text"],dl.dlEdit dd input[type="email"],dl.dlEdit dd input[type="password"] { width:100%; padding:8px; box-sizing: border-box; border:1px solid #AAA; }
dl.dlEdit dd input[type="text"]#zipcode { width:6.5em; margin-bottom:3px;  text-align:center; }
dl.dlEdit dd input[type="tel"] { width:9em; padding:8px; box-sizing: border-box; border:1px solid #AAA; text-align:center;}
dl.dlEdit dd input[type="number"] { width:4em; padding:8px; box-sizing: border-box; border:1px solid #AAA; text-align:center; font-size:18px; }
dl.dlEdit dd textarea { width:100%; height:8em; padding:8px; box-sizing: border-box; border:0;}
dl.dlEdit dt:last-of-type,dl.dlEdit dd:last-of-type { border:0; }

dl.dlEdit dd.itmNotes { padding:8px 24px; }

.itmName { background-color:#A5040D; color:#FFF; border-radius:8px; margin-bottom:6px; text-indent:14px; }


#btnBox { text-align:center; }

/* 注文確認 */
dl.orderDL { box-shadow: 4px 4px 4px rgba(0,0,0,0.4); margin-top:24px; }
dl.orderDL { display:flex; flex-wrap: wrap; border:4px solid #CCC; border-radius:8px; margin:0 0 1.5em 0; padding:0; }
dl.orderDL dt { width:20%; box-sizing: border-box; background-color:#E7E7E7; padding:8px; border-bottom:1px solid #CCC; }
dl.orderDL dd { width:80%; box-sizing: border-box; background-color:#FFF; margin:0; padding:8px; border-bottom:1px solid #CCC;  }

dl.orderDL table { width:100%; border-collapse:collapse; }
dl.orderDL td { border-bottom:1px dotted #999; padding:6px; }
dl.orderDL td.num { text-align:right; } 
dl.orderDL td.noborder { border:0; }

/* */
#loginOKbox { display:flex; justify-content: center; }
#loginOKbox a { display:block; border:1px solid #333; padding:8px; text-decoration:none; border-radius:8px; margin:24px; color:#000; }

ul#orderNav { display:flex; justify-content: center; margin:12px 24px; padding:0; }
ul#orderNav li { list-style-type:none; border:3px solid #999; padding:6px; margin:0; width:25%; text-align:center; color:#999; position:relative; }
ul#orderNav li.arw { color:#000; font-size:32px; line-height:32px; font-weight:normal; color:#A5040D; width:12.5%; border:0; }
ul#orderNav li.on { background-color:#FFBF0D; color:#FFF; border:3px solid #E25B20; font-weight:bold; } 



/* マイページ */
ul.btnUL { width:80%; margin:24px auto; padding:0; }
ul.btnUL li { list-style-type:none; margin:12px 0; padding:0; }

ul.btnUL li button { width:100%; font-size:22px;}

div.tblCap { display:flex; justify-content: space-between; margin-top:24px; }


/* 一覧用テーブル*/
table.tblList { border-collapse:collapse; width:100%; }
table.tblList th,table.tblList td { border:1px solid #999; text-align:center; }
table.tblList td.num { text-align:right; } 
table.tblList tr:nth-child(2n+1) { background-color:#FFF; }


/* 献立管理用 */
table#tblMenu { border-collapse:collapse; width:80%; margin-bottom:0; }
table#tblMenu th,table#tblMenu td { border:1px solid #999; text-align:center; }
table#tblMenu td select { width:100%; overflow:hidden; }
table#tblMenu tr:nth-child(2n+1) { background-color:#FFF; }
#tblMenu td.sat { color:blue; }
#tblMenu td.sun { color:red; }
#tblMenu td input[type="number"] { padding:2px; text-align:center; width:100%; box-sizing:border-box; }

#btnLump { position:absolute; top:30px; right:30px; }

.msgBox { color:#0000FF; font-weight:bold; }

.spOnly { display:none; }




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

	.spOnly { display:block; }
	.pcOnly { display:none; }

	#contents { padding-bottom:0px; }

	#contents,.ctsFrame { width:100%; }

	header { width:100%; min-width:100%; height:auto; position:relative; }

	 header .ctsFrame { width:100%; height:auto; padding-bottom:0;}
	 img#tpImg { display:none; }
	 img#tpImgSP { display:block; width:100%; height:auto; }

	 header div { position:static; width:100%; text-align:center; }
	 header div img { width:80%; height:auto; }
	 #btnOrderBox { display:none; }

	 #spOrderBtn { background-color:#A5040D; color:#FFF; width:100%; text-align:center; text-decoration:none; margin-bottom:36px; font-size:5.0vw; font-weight:bold; position:relative; top:-12px; }
	 #spOrderBtn img { width:auto; height:14vh; vertical-align:middle; }

	 #spBtmOrderBtn { background-color:#A5040D; color:#FFF; width:100%; text-align:center; text-decoration:none; font-size:5.0vw; font-weight:bold; position:fixed; bottom:0; z-index:99999; } 
	 #spBtmOrderBtn img { width:100%; height:auto; vertical-align:middle; }



	footer { position:static; margin:0; }
	footer .ctsFrame { text-align:center; }
	  #ftLogo { float:none; }
	  #ftContents { width:90%; margin:0 auto; }

	  #ftTel   { display:block; text-align:center; }
	  #telno img { width:100%; height:auto; margin-top:6px; }
	  #ftEtime { display:block; text-align:center; }
	  #ftAdr   { display:block; text-align:center; }
  	  #copyright { font-size:3.2vw; }

	#contents { position:relative; z-index:99; }

	section { padding:12px; width:90%; margin:0 auto; }

	#tpConcept { width:90%; margin:16px auto; text-align:center; }
	#tpConcept img { width:90%; height:auto; margin:0 auto; }
	
	#tpAboutBox h2 { margin:0; padding:0; font-size:4.2vw; }
	#tpAboutBox .flexBox { display:block; }
	#tpAboutBox img { width:100%; height:auto; }
	#tpAboutBox p { font-size:3.2vw; }

	#howtoBox h2 { margin:0; padding:0; font-size:4.2vw; }
	#howtoBox ul { display:block; margin:0; width:100%; }
	#howtoBox ul > li { width:100%; border-left:0; margin:0 auto 16px; padding:16px 0; border-bottom:1px solid #FF9D00; }
	#howtoBox ul > li:first-child { border-bottom:1px solid #FF9D00; width:100%;  padding-bottom:16px; }
	#howtoBox ul > li:last-child { padding:0 0 16px 0; }

	    #howtoBox ul > li ul    { width:100%; box-sizing:border-box; }
	    #howtoBox ul > li ul li { margin:0; padding:0 0 0 1em; }
	    #howtoBox ul > li ul li:last-child { margin:0; padding:0 0 0 1em; }


	.menuT { width:90%; margin:16px auto; }
	.menuT img { width:90%; height:auto; margin:0 auto; }



	  .weekMenuBox { width:96%; margin:0 auto 24px; padding:24px 0; text-align:center; overflow:hidden; }

	  .weekMenuBox h2 { font-size:3.6vw; margin:0 auto; }
	  .weekMenuBox h3 { font-size:3.6vw; text-indent:0; }
	     .weekMenuBox h3 img { display:none; }
	  .cmt { position:static; }
	  .weekMenuBox ul { margin:14px 0; padding:0; }
	  .weekMenuBox li { border:0; text-align:center; margin:0; padding:0; }
	  .weekMenuBox li div { width:142px; margin:0 auto 14px; }
	  .weekMenuBox li div.itmTxt { border:0; width:80%; text-align:center; color:#A5040D; font-weight:bold; margin-bottom:6px; }



	#telOrder h2 { font-size:4.2vw; text-align:center; }



	#tpBnBox { width:90%; display:block; margin:16px auto; }
  	#tpBnBox li { padding:4px; margin-bottom:12px; background-color:#FFF; }
	#tpBnBox li img { width:100%; height:auto; }

  	section#tpNotesBox { width:90%; margin:0 auto; padding:0; font-size:3.4vw; }
  	section#tpNotesBox ul { margin:0; padding:0; }
  	section#tpNotesBox li { list-style-type:none; text-indent:-1em; padding-left:1em; }


	.footerFixed{ padding-bottom:76px; } 


	dl.dlEdit { display:block; }
	dl.dlEdit dt { width:100%; }
	dl.dlEdit dd { width:100%; }


	#memberBox { position:absolute; top:12px; right:12px; }

	/* 注文確認 */
	dl.orderDL { display:block; }
	dl.orderDL dt { width:100%; }
	dl.orderDL dd { width:100%; }

	.ctsBox { width:96%; box-sizing:border-box; margin:32px auto; }

	/* 献立管理用 */
	table#tblMenu { width:100%; }

	/* 注文ナビ */
	ul#orderNav { display:flex; justify-content: center; margin:12px 0; padding:0; font-size:12px; line-height:32px;  }
	ul#orderNav li { list-style-type:none; border:3px solid #999; padding:0 6px; margin:0; width:26.6%; text-align:center; color:#999; position:relative; }
	ul#orderNav li.arw { color:#000; font-size:24px; font-weight:normal; color:#A5040D; width:10%; border:0; }
	ul#orderNav li.on { background-color:#FFBF0D; color:#FFF; border:3px solid #E25B20; font-weight:bold; } 


/* swiper */
/* 前ページ、次ページボタン共通のスタイル */
	.swiper-button-next::after, .swiper-button-prev::after {
	  content: none !important;
	}
	.swiper-button-prev,
	.swiper-button-next {
		width: 48px; /* ボタンの幅 */
		height: 48px; /* ボタンの高さ */
		background-size: 48px 48px; /* 背景画像としてのサイズ（＝表示したい画像サイズ） */
		margin-top: -100px; /* 縦中央配置用：ボタンの高さの半分のネガティブマージン（top:50%がすでに設定されている） */
	}
	/* 次ページボタンのスタイル */
	.swiper-button-next {
		background-image: url("images/btnNext.png");
	}
	/* 前ページボタンのスタイル */
	.swiper-button-prev {
		background-image: url("images/btnNext.png");
		transform: scale(-1, 1); /* 左右反転 */
	}

}