@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ 宅配弁当 ◇◆◇
  
  
========================================================================================================================*/

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

  hero
  
----------------------------------------------------------------------------------------------------*/

.hero {
  width:100%;
  background:url(../image/hero.jpg) no-repeat center center;
}

.hero h2 {
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
}

@media print,screen and (min-width:641px) {
  .hero { height:400px; }
}

@media screen and (max-width:640px) {
  .hero {
    height:0;
    padding-top:34%;
    background-size:cover;
  }
}


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

  宅配クック123について
  
----------------------------------------------------------------------------------------------------*/

.about .eiyo {
  text-align:center;
}

.about .eiyoushi {
  background:#fbe681;
  text-align:center;
  padding-top:0.5rem;
  padding-bottom:0.5rem;
}

@media print,screen and (min-width:641px) {
  .about {
    padding-top:50px;
  }
  
  .about .eiyo {
    margin-bottom:2rem;
  }
  
  .about .eiyoushi {
    margin-top:2rem;
    margin-bottom:2rem;
  }
}

@media screen and (max-width:640px) {
  .about {
    padding-top:1.75rem;
  }
  
  .about .eiyo {
    margin-bottom:1.5rem;
  }
  
  .about .eiyoushi {
    margin-top:1.25rem;
    margin-bottom:1.25rem;
  }
}


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

  宅配クック123のお弁当
  
----------------------------------------------------------------------------------------------------*/

.menu-txt { text-align:center; }
  
@media print,screen and (min-width:641px) {
  .menu-warp {
    padding-top:60px;
    padding-bottom:0px;
  }
}

@media screen and (max-width:640px) {
  .menu-warp {
    padding-top:2rem;
    padding-bottom:2rem;
  }
  
  .menu-txt { padding-bottom:0.75rem; }
}

.menu_col {
  float:left;
  background-color:#fef8dc;
}

@media print,screen and (min-width:641px) {
  .menu_col {
    width:430px;
    margin-top:40px;
  }
  
  .menu_col:nth-child(even) {
    margin-left:40px;
  }
}

@media screen and (max-width:640px) {
  .menu {
    width:800px;
  }
  
  .menu_col {
    width:390px;
    margin-top:1rem;
  }
  
  .menu_col:nth-child(even) { margin-left:20px; }
}

.menu__name {
  display:block;
  background-color:#57b462;
  color:#fff;
  text-align:center;
  padding-top:0.5rem;
  padding-bottom:0.5rem;
  font-size:118.8%;
}

.menu__come {
  padding:1.25rem;
  line-height:1.6;
}

ul.menu__come { list-style:none; }
ul.menu__come li { padding-left:1.25rem; padding-top:0.25rem; }
ul.menu__come li:first-child { padding-top:0; }
ul.menu__come li:before {
  content:"●";
  font-size:80%;
  color:#57b462;
  margin-left:-1rem;
  margin-right:0.25rem;
}

.menu__price {
  padding:0 1rem 1rem 1rem;
}

.menu__price dl {
  width:50%;
  float:left;
  text-align:center;
  box-sizing:border-box;
}

.menu__price dl:first-child { border-right:1px solid transparent; }
.menu__price dl:last-child { border-left:1px solid transparent; }

.menu__price dt {
  padding:0.25rem;
  font-size:87.5%;
  background-color:#fae061;
}
.menu__price dd {
  padding:0.5rem;
  background-color:#fff;
  color:#ea282d;
}
.menu__price dd b { font-size:137.5%; }


/* 今週の献立バナー */
.menu-weeklyBnr { display:block; }

@media print,screen and (min-width:641px) {
  .menu-weeklyBnr { margin-top:40px; }
}
@media screen and (max-width:640px) {
  .menu-weeklyBnr { margin-top:1.25rem; }
}


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

  安否確認
  
----------------------------------------------------------------------------------------------------*/

.anpi-warp {
  background-color:#ffe7e8;
}

@media print,screen and (min-width:641px) {
  .anpi-warp {
    padding-top:50px;
    padding-bottom:60px;
  }
}

@media screen and (max-width:640px) {
  .anpi-warp {
    padding-top:2rem;
    padding-bottom:1.5rem;
  }
}

.anpi-list { 
  list-style:none;
  line-height:1.6;
  margin-top:0.75rem;
}
.anpi-list li { padding-left:1.25rem; padding-top:0.25rem; }
.anpi-list li:first-child { padding-top:0; }
.anpi-list li:before {
  content:"●";
  font-size:80%;
  color:#f94b4f;
  margin-left:-1rem;
  margin-right:0.25rem;
}

.anpi-case_hd {
  background-color:#f94b4f;
  color:#fff;
  padding:0.75rem 1rem;
  font-size:118.8%;
  font-weight:bold;
  position:relative;
  cursor:pointer;
}

.anpi-case_hd:before,
.anpi-case_hd:after {
  content:"";
  position:absolute;
  top:50%;
  right:1.15rem;
  left:inherit;
  margin:auto;
}
  
.anpi-case_hd:before {
  bottom:0;
  display:block;
  width:20px;
  height:20px;
  margin-top:-10px;
  -webkit-border-radius:100%;
  border-radius:100%;
  background:#fff;
  border:1px solid #fff;
}
  
.anpi-case_hd:after {
  content:"";
  display:inline-block;
  width:5px;
  height:5px;
  position:absolute;
  margin-top:-3px;
  margin-right:8px;
  border-right:1px solid #f33b3f;
  border-bottom:1px solid #f33b3f;
  -webkit-transform:rotate(45deg);
  transform:rotate(45deg);
}

.anpi-case_hd.active:after {
  margin-top:-1px;
  border-right:0;
  border-bottom:0;
  border-left:1px solid #f33b3f;
  border-top:1px solid #f33b3f;
  -webkit-transform:rotate(45deg);
  transform:rotate(45deg);
}

.anpi-case_body {
  background-color:#fff;
  display:none;
}

.anpi-case_body ul {
  list-style:none;
  counter-reset:number;
  margin-left:1.5em;
}

.anpi-case_body li:first-child {
  padding-top:0.25rem;
}

.anpi-case_body li:before {
  width:1.25em;
  display:inline-block;
  counter-increment:number;
  content:counter(number)".";
  margin-left:-1.25em;
  color:#ea282d;
}

.anpi-case_body dt {
  margin-left:-0.5em;
  padding-bottom:0.25rem;
  font-weight:bold;
  font-size:112.5%;
  color:#ea282d;
}

.anpi-case_body p:last-child {
  border:1px solid #f1cf2b;
  background-color:#fef8dc;
  padding:1rem;
}

@media print,screen and (min-width:641px) {
  .anpi-case {
    margin-top:1.75rem;
    margin-bottom:1.75rem;
  }
  
  .anpi-case_body {
    padding:1.5rem;
  }

  .anpi-case_body li,
  .anpi-case_body dl {
    padding-top:1.25rem;
  }
  
  .anpi-case_body p:last-child {
    margin-top:1.5rem;
  }
}

@media screen and (max-width:640px) {
  .anpi-case {
    margin-top:1.25rem;
    margin-bottom:1.25rem;
  }
  
  .anpi-case_body {
    padding:1rem;
  }

  .anpi-case_body li,
  .anpi-case_body dl {
    padding-top:1rem;
  }
  
  .anpi-case_body p:last-child {
    margin-top:1.25rem;
  }
}


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

  ご利用事例
  
----------------------------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .jirei-warp {
    padding-top:60px;
  }
}

@media screen and (max-width:640px) {
  .jirei-warp {
    padding-top:1rem;
  }
}

.jirei-warp .l-headline:after {
  content:"";
  display:block;
  width:100%;
  height:0.5rem;
}

.jirei ul {
  list-style:none;
  border:2px solid #76c27f;
  background-color:#eef7ef;
  padding:1.5rem;
  box-sizing:border-box;
}

.jirei li {
  margin-top:0.5rem;
  padding-left:2rem;
  position:relative;
  line-height:1.6;
}

.jirei li:first-child {
  margin-top:0;
}

.jirei li:before {
  content:"";
  display:inline-block;
  width:1.65rem;
  height:1.65rem;
  background:url(../image/ic-check.png) no-repeat left top;
  background-size:contain;
  position:absolute;
  left:0;
  top:0.15rem;
}

.jirei p { padding-top:1rem; }

@media screen and (max-width:640px) {
  .jirei ul { padding:1.25rem; }
}


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

  八戸店のこだわり
  
----------------------------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .kodawari-warp {
    padding-top:60px;
	  padding-bottom:60px;
  }
}

@media screen and (max-width:640px) {
  .kodawari-warp {
    padding-top:2rem; padding-bottom:1.5rem;
  }
}

.kodawari_box {
  background-color:#fef8dc;
  box-sizing:border-box;
  display:block;
}
  
.kodawari .kodawari_box:first-child {
  margin-top:0;
}

.kodawari_box .photo {
  display:inline-block;
  float:right;
  margin-left:1rem;
}

.kodawari_box b {
  color:#eb860c;
  font-size:137.5%;
}

.kodawari_box p {
  padding-top:0.25rem;
}

@media print,screen and (min-width:641px) {
  .kodawari { padding-top:1rem;}
  
  .kodawari_box {
    padding:1.5rem;
    margin-top:15px;
  }
}

@media screen and (max-width:640px) {
  .kodawari { padding-top:0.75rem; }
  
  .kodawari_box {
    padding:1.25rem;
    margin-top:0.75rem;
  }
  
  .kodawari_box .photo {
    max-width:35%;
    margin-top:0.25rem;
  }
  
  .kodawari_box b {
    display:block;
  }
}


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

  契約の流れ
  
----------------------------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .order-warp {
    padding-top:60px;
    padding-bottom:60px;
  }
}

@media screen and (max-width:640px) {
  .order-warp {
    padding-top:2rem;
    padding-bottom:2rem;
  }
}

.order dt {
  width:300px;
  background-color:#ffe7e8;
  border:2px solid #f94b4f;
  border-right:none;
  border-radius:4px 0 0 4px;
  padding:2rem 1.25rem 1.25rem 1.25rem;
  float:left;
  font-weight:bold;
  text-align:center;
  font-size:118.8%;
  color:#ea282d;
  position:relative;
}

.order dd {
  margin:0 0 0 300px;
  border:2px solid #f94b4f;
  border-left:none;
  border-radius:0 4px 4px 0;
  padding:1.25rem;
  margin-bottom:34px;
  position:relative;
}

.order dd:last-child {
  margin-bottom:0;
  background-color:#f94b4f;
  margin:0 0 0 0;
  color:#fff;
  border-radius:4px;
  text-align:center;
  font-weight:bold;
  font-size:137.5%;
  padding:1rem;
}

.order dt,
.order dd {
  box-sizing:border-box;
  line-height:1.6;
}

.order dt:after,
.order dt:before,
.order dd:last-child:after,
.order dd:last-child:before {
  border:solid transparent;
  content:" ";
  height:0;
  width:0;
  position:absolute;
  pointer-events:none;
  left:450px;
  z-index:2;
}

.order dt:after,
.order dd:last-child:after {
  border-color:rgba(255,255,255,0);
  border-width:34px;
  margin-left:-34px;
  top:-22px;
  border-top-color:#fae061;
}

.order dt:before,
.order dd:last-child:before {
  width:34px;
  height:8px;
  background-color:#fae061;
  margin-left:-20px;
  top:-36px;
}

.order dt:first-child:after,
.order dt:first-child:before {
  display:none;
}

.order dt .no {
  display:inline-block;
  background-color:#f94b4f;
  color:#fff;
  position:absolute;
  left:50%;
  top:-1em;
  margin-left:-1em;
  width:1.5em;
  height:1.5em;
  line-height:1.5em;
  border-radius:100%;
  padding:0.25rem;
}

@media print,screen and (min-width:641px) {
  .order { padding-top:1rem; }
}

@media screen and (max-width:640px) {
  .order { padding-top:0.75rem; }
  
  .order dt {
    width:100%;
    float:none;
    border-bottom:none;
    border-right:2px solid #f94b4f;
    border-radius:4px 4px 0 0;
    padding:0.75rem 1rem;
    font-size:125.0%;
  }
  
  .order dt br {
    display:none;
  }
  
  .order dd {
    margin-left:0;
    border-top:none;
    border-left:2px solid #f94b4f;
    border-radius:0 0 4px 4px;
    padding:1rem;
    margin-bottom:32px;
  }
  
  .order dt:after,
  .order dt:before,
  .order dd:last-child:after,
  .order dd:last-child:before {
    left:50%;
  }

  .order dt:after,
  .order dd:last-child:after {
    border-width:30px;
    margin-left:-30px;
    top:-22px;
  }

  .order dt:before,
  .order dd:last-child:before {
    width:26px;
    height:6px;
    margin-left:-16px;
    top:-34px;
  }

  .order dd:last-child:after {
    top:-20px;
  }
  
  .order dd:last-child:before {
    top:-32px;
  }
  
  .order dt .no {
    position:inherit;
    left:inherit;
    top:inherit;
    font-size:62.5%;
    margin-left:0;
    margin-right:0.5rem;
    vertical-align:text-bottom;
  }
}


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

  宅配クック123のここが便利！
  
----------------------------------------------------------------------------------------------------*/

.benri-warp {
  background-color:#fef8dc;
}

@media print,screen and (min-width:641px) {
  .benri-warp {
    padding-top:50px;
    padding-bottom:60px;
  }
}

@media screen and (max-width:640px) {
  .benri-warp {
    padding-top:2rem;
    padding-bottom:2.25rem;
  }
}

#benriSlide {
  position:relative;
  max-width:1180px;
  margin-left:auto;
  margin-right:auto;
}

#benriSlide__slider {
  list-style:none;
  display:inline-block;
}

#benriSlide__slider li {
  float:left;
  text-align:left;
  box-sizing:border-box;
  line-height:1.6;
}

#benriSlide__slider li p {
  background-color:#fff;
}

#benriSlide__slider li p b {
  color:#eb860c;
  display:inline-block;
  width:100%;
  text-align:center;
  margin-bottom:0.5rem;
  margin-top:-0.25rem;
  line-height:1.5;
}

@media print,screen and (min-width:641px) {
  #benriSlide { padding-top:1rem; }
  
  #benriSlide__slider {
    width:1170px;
  }
  
  #benriSlide__slider li {
    width:370px;
    margin-left:10px;
    margin-right:10px;
  }
  
  #benriSlide__slider li p {
    padding:1.5rem;
  }
  
  #benriSlide__slider li p b {
    font-size:118.8%;
  }
}

@media screen and (max-width:640px) {
  #benriSlide { padding-top:0.75rem; }
  
  #benriSlide__slider {
    width:100%;
    padding-bottom:2.25rem;
    padding-left:0.375rem;
    padding-right:0.375rem;
    box-sizing:border-box;
  }
  
  #benriSlide__slider li {
    width:50%;
    padding-left:0.375rem;
    padding-right:0.375rem;
  }
  
  #benriSlide__slider li p {
    padding:1rem;
  }
  
  #benriSlide__slider li p b {
    font-size:106.3%;
  }
}


/*-----------------------------------------------------------------------------------
  arrows
-----------------------------------------------------------------------------------*/

#benriSlide__slider_arrow .slick-prev,
#benriSlide__slider_arrow .slick-next {
  font-size:0;
  line-height:0;
  color:#fff;
  display:inline-block;
  z-index:9;
  border-radius:100%;
  box-sizing:border-box;
  border-width:2px;
  border-style:solid;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
  vertical-align:middle;
  background:url(../../image/icon/ar-orange.png) no-repeat center center;
  background-size:52% auto;
  background-color:#fff;
  border-color:#f3921d;
  position:absolute;
  top:50%;
}

#benriSlide__slider_arrow .slick-prev {
  -webkit-transform:rotate(180deg);
  transform:rotate(180deg);
}

@media print,screen and (min-width:641px) {
  #benriSlide__slider_arrow .slick-prev,
  #benriSlide__slider_arrow .slick-next {
    width:40px;
    height:40px;
    margin-top:-20px;
  }
  
  #benriSlide__slider_arrow .slick-prev:hover,
  #benriSlide__slider_arrow .slick-next:hover {
    background:url(../../image/icon/ar-white.png) no-repeat center center;
    background-size:52% auto;
    background-color:#f3921d;
  }

  #benriSlide__slider_arrow .slick-prev { left:-48px; }
  #benriSlide__slider_arrow .slick-next { right:-48px; }
}

@media screen and (max-width:640px) {
  #benriSlide__slider_arrow {
    width:100%;
    position:relative;
  }
  
  #benriSlide__slider_arrow .slick-prev,
  #benriSlide__slider_arrow .slick-next {
    width:2rem;
    height:2rem;
    margin-top:-1rem;
  }
  
  #benriSlide__slider_arrow .slick-prev { left:0; margin-left:0.75rem; }
  #benriSlide__slider_arrow .slick-next { right:0; margin-right:0.75rem; }
}


/*-----------------------------------------------------------------------------------
  dots
-----------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  #benriSlide__slider_dot { display:none; }
}

@media screen and (max-width:640px) {
  #benriSlide__slider_dot {
    position:absolute;
    top:-1.5rem;
    left:50%;
    transform:translate(-50%,0);
  }
}


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

  宅配クック123バナー
  
----------------------------------------------------------------------------------------------------*/

.bnr123 { text-align:center; }

@media print,screen and (min-width:641px) {
  .bnr123 { padding-top:60px; padding-bottom:40px; }
}

@media screen and (max-width:640px) {
  .bnr123 { padding-top:2rem; padding-bottom:1.75rem; }
}


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

  サービス詳細
  
----------------------------------------------------------------------------------------------------*/

.svDetail { text-align:left; }

@media print,screen and (min-width:641px) {
  .svDetail { padding-top:60px; padding-bottom:60px; }
}

@media screen and (max-width:640px) {
  .svDetail { padding-top:1.5rem; padding-bottom:2rem; }
}

.svDetail_Tbl th,
.svDetail_Tbl td {
  box-sizing:border-box;
}

.svDetail_Tbl tr:first-child th,
.svDetail_Tbl tr:first-child td {
  border-top:0;
}

.svDetail_Tbl th {
  background-color:#57b462;
  color:#fff;
  line-height:1.4;
}

.svDetail_Tbl td {
  line-height:1.6;
}

@media print,screen and (min-width:641px) {
  .svDetail_Tbl {
    border:2px solid #57b462;
  }

  .svDetail_Tbl th,
  .svDetail_Tbl td {
    border-top:1px solid #9ad2a1;
    padding:1rem;
  }

  .svDetail_Tbl th {
    width:25%;
    font-size:112.5%;
    text-align:center;
    vertical-align:top;
  }
}

@media screen and (max-width:640px) {
  .svDetail_Tbl th,
  .svDetail_Tbl td {
    display:block;
    width:100%;
    padding:1rem;
  }
  
  .svDetail_Tbl th {
    font-size:106.3%;
    text-align:left;
    padding:0.75rem 1rem;
  }
  
  .svDetail_Tbl td {
    border-left:1px solid #79c381;
    border-right:1px solid #79c381;
    border-bottom:1px solid #79c381;
  }
  
  .svDetail_Tbl tr:before {
    content:"";
    display:block;
    background-color:#fff;
    height:1rem;
  }
  
  .svDetail_Tbl tr:first-child:before  {
    display:none;
  }
}

