@charset "utf-8";

/*====================================
* 共通パーツ
====================================*/
body {
  overflow-x: hidden;
}
#loader-bg {
  background: rgba(255,255,255,0.7);
  z-index: 1002;
}
#main-container {
  padding-top: 0;
}
.wrap {
  max-width: 1200px;
  margin: 0 auto;
}
.wrap-s {
  max-width: 1000px;
  margin: 0 auto;
}
.clr-green{
  color: #00A728;
}
.clr-gray{
  color: #888;
}
.clr-red{
  color: #E90000;
}
.hidden-block {
  display: none;
}
.pc { 
  display: block !important; 
}
.sp {
  display: none !important;
}
.logind .logind-hidden {
  display: none;
}
.logind .logind-visible {
  display: block;
}
.indent {
  text-indent: -1em;
  padding-left: 1em;
}
input,
select,
button {
  font-size: 1.4rem;
  -webkit-appearance: none;
  appearance: none;
  border: none;
  background: transparent;
  cursor: pointer;
  color:#000;
}
:disabled {
  color: #ccc !important;
  background: #f5f5f5 !important;
}
option {
  -webkit-appearance: none;
  appearance: none;
}
[href^="tel:"] {
    pointer-events: none;
}
[href^="tel:"]:hover {
  opacity: 1;
}

/*背景*/
.bg-ly {
  background: #FFFBF0;
}

.bg-gray {
  background: #F5F5F5;
}

.wide-yellow {
  position: relative;
}
.wide-yellow::after {
  content:"";
  position: absolute;
  display: block;
  width: 100vw;
  height: 100%;
  top:0;
  left:calc(50% - 50vw);
  background: #FFFBF0;
  z-index: -1;
}
.wide-border {
  position: relative;
}
.wide-border::after {
  content:"";
  position: absolute;
  display: block;
  width: 100vw;
  height: 1px;
  top:0;
  left:calc(50% - 50vw);
  background: #DDDDDD;
  z-index: -1;
}

.wide-gray {
  position: relative;
}
.wide-gray::after {
  content:"";
  position: absolute;
  display: block;
  width: 100vw;
  height: 100%;
  top:0;
  left:calc(50% - 50vw);
  background:#F5F5F5;
  z-index: -1;
}

/*アプリバナー*/
.app-dl {
  display: none;
}
.paragraph {
  margin: 0 0 35px;
}

.paragraph.right {
  text-align: right;
}

.paragraph.center {
  text-align: center;
}
@media screen and (max-width:768px) {
  .paragraph {
    margin: 0 0 25px;
  }

}

/*タイトル*/
.headline-l {
  position: relative;
  font-size: 4.4rem;
  line-height: 1.334em;
  font-weight: normal;
  text-align: center;
  margin-bottom: 50px;
}
.headline {
  position: relative;
  font-size: 3.6rem;
  line-height: 1.334em;
  font-weight: normal;
  text-align: center;
  padding-bottom: 25px;
  margin-bottom: 40px;
}
.headline::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -20px;
  width: 40px;
  height: 2px;
  background: #00A728;
}
.headline::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: 0px;
  width: 20px;
  height: 2px;
  background: #E90000;
}
.headline-m {
  position: relative;
  font-size: 3.2rem;
  line-height: 1.406em;
  font-weight: normal;
  text-align: center;
  margin-bottom: 35px;
}

.headline-m.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.headline-m.center .icon{
  display: inline-block;
  width:40px;
  height: 60px;
  margin-right: 15px;
  background-repeat:  no-repeat;
  background-position: center;
}

.headline-m.center .icon.faq{
  background-image: url(../../common/image/icon-faq.png);
  background-size:  40px auto;
  background-position:  50% 40%;
}

.headline-ms {
  font-size: 2.4rem;
  font-weight: normal;
  margin-bottom: 30px;
}
.headline-s {
  font-size: 1.8rem;
  margin-bottom: 15px;
}
.headline-catch {
  text-align: center;
  margin-bottom: 5px;
}
.headline-catch>span {
  position: relative;
  display: inline-block;
  padding: 0 1em;
  font-size: 1.8rem;
  color: #00a728;
}
.headline-catch>span::before {
  content:'';
  position: absolute;
  display: block;
  width: 1px;
  height: 18px;
  top:0;
  left:0;
  background: #00a728;
  transform: rotate(-15deg);
}
.headline-catch>span::after {
  content:'';
  position: absolute;
  display: block;
  width: 1px;
  height: 18px;
  top:0;
  right:0;
  background: #00a728;
  transform: rotate(15deg);
}
/*リンク矢印*/
.arrow {
  position: relative;
  padding-left: 16px;
  display: inline-block;
}
.arrow::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0.35em;
  border: 5px solid transparent;
  border-left: 7px solid #00a728;
}
.arrow.arrow-red::after {
  border-left: 7px solid #e90000;
}
.arrow-down {
  position: relative;
  padding-left: 16px;
  margin-bottom: 35px;
  display: inline-block;
}
.arrow-down::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0.35em;
  border: 5px solid transparent;
  border-top: 7px solid #00a728;
}

.arrow-back {
  position: relative;
  padding-left: 16px;
  display: inline-block;
}
.arrow-back::after {
  content:"";
  position: absolute;
  top:50%;
  left:0px;
  width: 7px;
  height: 7px;
  margin-top: -1px;
  border-left:2px solid #00a728;;
  border-bottom:2px solid #00a728;;
  transform: translate(0,-50%) rotate(45deg);
}
@media screen and (max-width:768px){
  .arrow::after {
    top: 0.36em;
  }

}

/*窓*/
.blank {
  position: relative;
  padding-right: 23px;
}
.blank i {
  margin-left: 9px;
  display: inline-block;
  width: 14px;
  height: 11px;
  background: url(../svg/target-blank_black.svg) no-repeat;
  background-size: 100%;
  -webkit-backface-visibility:hidden;
}

/*pdf*/
.pdf {
  position: relative;
}

.pdf i {
  position: relative;
  display: inline-block;
  padding-right: 20px;
}

.pdf i::after {
  position: relative;
  content: '';
  right:0;
  top:3px;
  display: inline-block;
  width: 12px;
  height: 14px;
  margin-left: 8px;
  background: url(../svg/pdf.svg) no-repeat;
  background-position: 100% 50%;
  background-size: 100%;
}
.button.pdf::after {
  display: none;
}

/*ボタン*/
.button {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 48px;
  max-width: 340px;
  background: #fff;
  border: 1px solid #00A728;
  border-radius: 24px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 48px;
  font-weight: bold;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition-duration: 0.5s;
}
.button.over {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
  min-height: 48px;
  padding: 9.5px 15px;
  border-radius: 50px;
  line-height: 22px;
}
.button:hover {
  opacity: 0.5;
}
.button.noactive {
  opacity: 0.5;
  cursor: auto;
}
.button.button-size-auto {
  min-width: 340px;
  max-width: 100%;
  width: auto;
  height: auto;
  padding: 0.9em 1.5em;
  line-height: 1.57em;
}
.button[target="_blank"]::after,
.button.button-pdf[target="_blank"]::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 19px;
  height: 15px;
  background-size: 100%;
  background-repeat: no-repeat;
  transform: translateY(-50%);
}
.button.button-red {
  background: #E90000;
  border: 1px solid #E90000;
  color: #fff;
}
.button.button-green {
  background: #00A728;
  border: 1px solid #00A728;
  color: #fff;
}

.button[target="_blank"]::after {
  background-image: url(../svg/target-blank_green.svg);
  background-size: 14px auto;
  height: 12px;
}
.button.button-pdf[target="_blank"]::after {
  background-image: url(../svg/pdf-green.svg) ;
  background-size: 13px auto;
  height: 15px;
}
.button.button-pdf::after {
  display: block;
}
/*スマホ*/
@media screen and (max-width: 425px) {
  .button.button-pdf[target="_blank"]::after {
    background-image: url(../svg/pdf-green.svg) ;
    background-size: 15px auto;
    height: 19px;
  }
  /*media 425*/
}
.button[target="_blank"].button-copy::after ,
.button[target="_blank"].button-green::after {
  background-image: url(../svg/target-blank.svg);
  background-size: 18px auto;
  height: 15px;
}
.button.button-orange {
  background: #ff7e47;
  border: 1px solid #ff7e47;
  color: #fff;
}
.button.gps::before {
  content: '';
  position: absolute;
  left: 20px;
  top: 50%;
  width: 16px;
  height: 20px;
  background: url(../svg/icon-gps.svg) no-repeat;
  backgroudn-size: 100%;
  transform: translateY(-50%);
}
.button.search::before {
  content: '';
  position: absolute;
  left: 20px;
  top: 50%;
  width: 18px;
  height: 19px;
  background: url(../svg/icon-search-white.svg) no-repeat;
  backgroudn-size: 100%;
  transform: translateY(-50%);
}

.button-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.button-area .button {
  margin: 0 14px;
}
.button.button-copy {
  position: relative;
  background: #00a728;
  max-width: 441px;
  border: 2px solid #00a728;
  color: #fff; 
  overflow:hidden;
  padding-left:165px;
}
.button.button-copy .copy {
  position: absolute;
  display: block;
  width: 165px;
  left:0;
  top:0;
  height: 100%;
  font-size: 1.4rem;
  line-height: 2.42em;
  font-weight: bold;
  background: #ffffff;
  color: #00A728;
  padding-top: 8px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.18);
}
.button.button-copy .copy::before {
  content:'';
  position: absolute;
  display: block;
  right:-14px;
  top:50%;
  margin-top: -7px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 0 7px 14px;
  border-color: transparent transparent transparent #ffffff;
}

.button.button-buck::after {
    content:"";
    position: absolute;
    top:50%;
    left:20px;
    width: 8px;
    height: 8px;
    border-left: 2px solid #00A728;
    border-bottom: 2px solid #00A728;
    transform: translate(0,-50%) rotate(45deg);
}


/*もっと見る*/
.button-more {
  display: block;
  border-radius: 25px;
  text-align: center;
  font-size: 1.6rem;
  height: 48px;
  line-height: 46px;
  font-weight: bold;
  box-shadow: 0 3px 7px rgba(0,0,0,0.06);
  border:1px solid #dddddd;
  cursor: pointer;
  transition-duration: 0.5s;
}
.button-more:hover {
  opacity: 0.5;
}
.button-more .text {
  display: inline-block;
  padding-right: 30px;
  padding-top: 1px;
  background-image: url(../../common/svg/button-plus.svg);
  background-position: 100% 50%;
  background-repeat: no-repeat;
}

@media screen and (max-width: 768px) {
  .button {
    font-size: 1.4rem;
  }
  .button.button-size-auto {
    min-width: 100%;
  }
  [href^="tel:"] {
      pointer-events: auto;
  }
  .button-more {
    font-size: 1.4rem;
  }
  .button-more .text {
    padding-right: 26px;
    background-image: url(../../common/svg/button-plus.svg);
    background-size: 14px auto;
  }
}

/*パン屑リスト*/
.breadcrumb {
  padding: 9px 0;
  background: #f5f5f5;
  transition: all .3s ease;
}
.breadcrumb.noactive {
  min-height: 39px;
}
.breadcrumb>ol {
  max-width: 1200px;
  display: flex;
  margin: 0 auto;
}
.breadcrumb>ol>li {
  position: relative;
  font-size: 1.2rem;
  line-height: 1.833em;
  margin-right: 5px;
  display: block;
}
.breadcrumb>ol>li::after {
  position: relative;
  content: '>';
  padding-left: 4px;
}

.breadcrumb>ol>li:last-child::after {
  display: none;
}
.breadcrumb>ol>li>a {
  text-decoration: none;
}

.dot-list>li {
  position: relative;
  padding-left: 18px;
}
.dot-list>li::after {
    position: absolute;
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    left: 0;
    top: 7px;
    margin-top: 0;
    background: #000;
}

/*dashed-list*/
.dashed-list {
  border-top:1px solid #DDDDDD;
}
.dashed-list>li {
  border-bottom: 1px dashed #DDDDDD;
}
.dashed-list>li:last-child{
  border-bottom: 0;
}
.dashed-list>li>a {
  padding: 20px 0 16px;
  display: block;
}

/*dashed-list*/
.dashed-arrow-list {
  border-top:1px solid #DDDDDD;
  border-top: 1px dashed #DDDDDD;
}
.dashed-arrow-list >li{
  border-bottom: 1px dashed #DDDDDD;
}
.dashed-arrow-list:last-child{
  border-bottom: 0;
}
.dashed-arrow-list > li > a{
  position: relative;
  padding: 20px 30px 16px 0px;
  display: block;
}
.dashed-arrow-list a .arrow{
  display: block;
  padding-right: 10px;
}

.dashed-arrow-list a .arrow::after{
  left: auto;
  right: -10px;
}

.section-block{
  padding:45px 0;
  margin-bottom: 20px;
}

.section-block:last-child{
  padding-bottom: 100px;
  margin-bottom: 0px;
}

/*メニューメタアイコン*/
.meta-icon-wrap {
  position: relative;
  width: 100%;
  padding: 0 25px;
}
.meta-icon-link {
  display: inline-block;
  padding-left: 27px;
  background: url(../../common/svg/icon-note.svg) no-repeat;
  background-position: left center;
  background-size: 18px auto;
  font-weight:  normal;
  margin-bottom: 35px;
  cursor: pointer;
  transition-duration: 0.5s;
}
.meta-icon-link:hover {
  opacity: 0.5;
}

/*シェアボタン*/
.sns-share {
  display: flex;
}
.sns-share >li.tw iframe{
  background: #1d9bf0;
  border-radius: 3px;
}

/*注記*/
.note-list>li {
  position: relative;
  /*font-size: 1.3rem;*/
  font-size: 1.2rem;
  line-height: 1.54em;
  padding-left: 19px;
  margin-bottom: 5px;
  color: #888888;
}
.note-list>li::after {
  content: '※';
  position: absolute;
  left: 0;
  top: 0;
  width: 1em;
  height: 1em;
}
/*reCAPTCHA*/
.grecaptcha-badge {
  z-index: 5;
}
@media screen and (max-width: 1200px) {
  .wrap {
    padding: 0 10px;
  }
  .breadcrumb {
      padding-left: 20px;
  }
  /*media 1200*/
}
@media screen and (max-width: 1000px) {
  #main-container {
    padding-top: 0;
  }
  /*media 1000*/
}

/*スマホ*/
@media screen and (max-width: 768px) {
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }

  .wrap {
    padding: 0 20px;
  }
  .wrap-s {
    padding: 0 20px;
  }

  /*タイトル*/
  .headline {
    position: relative;
     font-size: 2.8rem;
    line-height: 1.32em;
    padding-bottom: 15px;
    margin-bottom: 30px;
  }
  .headline-l {
    font-size: 2.8rem;
    margin-bottom: 35px;
  }
  .headline-m {
    font-size: 2.2rem;
    margin-bottom: 25px;
  }
  .headline-ms {
    font-size: 2.0rem;
    margin-bottom: 15px;
  }
  .headline-s {
    font-size: 1.6rem;
    margin-bottom: 12px;
  }
  .headline-catch>span {
    font-size: 1.4rem;
  }

  /*リンク矢印*/
  .arrow {
    position: relative;
    padding-left: 16px;
  }
  .arrow::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0.35em;
    border: 5px solid transparent;
    border-left: 7px solid #00a728;
  }
  .arrow.arrow-red::after {
    border-left: 7px solid #e90000;
  }
  /*窓*/
  .blank {
    padding-right: 0
  }
  .blank i {
    margin-left: 10px;
    display: inline-block;
    width: 14px;
    height: 11px;
    background: url(../svg/target-blank_black.svg) no-repeat;
    background-size: 100%;
    -webkit-backface-visibility:hidden;
  }
  /*ボタン*/
  .button[target="_blank"]::after {
    right: 20px;
    width: 14px;
    height: 11px;
  }
  .button[target="_blank"].button-copy::after ,
  .button[target="_blank"].button-green::after {
    background-size: 14px auto;
    height: 11px;
  }
  .button-area .button {
    margin: 0 0 20px;
  }
  .button-area .button:last-child {
    margin-bottom: 0;
  }
  .button-area.two-line {
    justify-content: space-between;
  }
  .button-area.two-line .button {
    width: calc(50% - 10px);
    margin: 0 0 20px;
  }
  .button-area.two-line .button[target="_blank"]::after {
    right: 12px;
  }
  .button-area.two-line .button:nth-last-child(-n+2) {
    margin-bottom: 0;
  }
  .button.button-copy {
      max-width: 335px;
      padding-left: 137px;
      padding-right: 16px;
  }
  .button.button-copy .copy {
    width: 137px;
    padding-top: 10px;
    font-size: 1.2rem;
  }
  .button.button-copy .copy::before {
    content: '';
    right: -13px;
  }

  /*パン屑リスト*/
  .breadcrumb {
    display: none;
  }
  
  /*アイコン説明*/
  .meta-icon-wrap {
    position: relative;
    width: 100%;
    padding: 0;
  }

  .headline-m.center .icon {
      width: 40px;
      height: 35px;
      margin-right: 10px;
  }

  .dashed-list>li>a {
    padding: 20px 7px 16px;
    display: block;
  }

  .dashed-arrow-list > li > a{
    position: relative;
    padding: 20px 0px 16px 7px;
    display: block;
  }

  .dashed-arrow-list a .arrow {
      display: block;
      padding-left: 0px;
      padding-right: 20px;
  }

  .dashed-arrow-list a .arrow::after{
    left: auto;
    right: 0px;
  }

  .section-block {
      padding: 35px 0 20px;
      margin-bottom: 10px;
  }

/*media 768*/
}

/*
トグル
*/
.toggle-section {
  padding-bottom: 100px;
}

.toggle-block {
  margin-bottom: 60px;
}

.toggle-group {
  position: relative;
  border-top: 1px solid #DDDDDD;
}

.toggle-group:last-child::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background: #DDDDDD;
}

.toggle-group>.toggle-head {
  position: relative;
  padding: 22px 60px 18px 20px;
  cursor: pointer;
  min-height: 62px;
}

.toggle-group>.toggle-body {
  display: none;
  padding: 40px 20px 50px;
}

.toggle-group .toggle-body>:last-child{
  margin-bottom: 0;
}

.toggle-group>.toggle-head .icon {
  right: 20px;
  top: 22px;
  position: absolute;
  display: inline-block;
  width: 21px;
  height: 20px;
  background-image: url(../../common/svg/button-plus.svg);
  background-position: 50%;
  background-repeat: no-repeat;
  font-size: 2.6rem;
  background-size: 21px;
}
.toggle-group>.toggle-head.open {
  color: #00A728;
}

.toggle-group>.toggle-head.open .icon {
  background-image: url(../../common/svg/button-minus.svg);
}




/*toggle faq */
.toggle-group>.toggle-head.open .question-initial {
  color: #00A728;
}

.toggle-group>.toggle-head .question-text {}


.toggle-group>.toggle-head .question {
    position: relative;
    padding-left: 25px;
    padding: 0 0 0 30px;
}

.toggle-group>.toggle-head .question-initial {
  position: absolute;
  left: 0;
  top: -12px;
  font-size: 2.6rem;
}

.toggle-group>.toggle-body .answer-initial {
  position: absolute;
  left: 0px;
  top: -10px;
  font-size: 2.6rem;
  font-weight: bold;
  color: #FF7E47;
  vertical-align: middle;
}

.toggle-group>.toggle-body .answer {
  position: relative;
  padding: 0 0 0 30px;
}



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

  .toggle-section {
    padding-bottom: 70px;
  }

  .toggle-block .wrap {
    padding: 0;
  }

  .toggle-block {
    margin-bottom: 40px;
  }

  .toggle-group>.toggle-head {
    position: relative;
    padding: 17px 60px 14px 20px;
    cursor: pointer;
    min-height: 50px;
  }

  .toggle-group>.toggle-body {
    display: none;
    padding: 30px 20px 30px;
  }



}

/**********
 フォーム系
**********/
.input {
  width: 100%;
  height: 45px;
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid #ccc;
  padding: 0 20px;
  border-radius: 10px;
  background: #fff;
}
::placeholder {
  color: #CCCCCC;
}
.checkbox {
  position: relative;
  display: inline-block;
  text-align: left;
  cursor: pointer;
  padding: 4px 0 3px 44px;
}
.checkbox input {
  opacity: 0;
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
}
.checkbox span::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 29px;
  height: 29px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
  box-sizing: border-box
}
.checkbox input:checked + span::after {
  content: '';
  position: absolute;
  left: 9px;
  top: 3px;
  width: 7px;
  height: 15px;
  border-bottom: 4px solid #00A728;
  border-right: 4px solid #00A728;
  transform: rotate(45deg);
}
.selectbox {
  position: relative;
}
.selectbox span {
  content: '';
  position: absolute;
  right: 20px;
  top: calc(50% - 2px);
  width: 0;
  height: 0;
  border: 7px solid transparent;
  border-top: 8px solid #00A728;
  user-select: none;
  pointer-events: none;
}
.selectbox select {
  cursor: pointer;
  width: 100%;
  height: 45px;
  padding: 0px 20px;
  border: 1px solid #ccc;
  border-radius: 10px;
  background: #fff;
  text-align: left;
  font-weight: bold;
}
.selectbox select option {
  padding: 20px;
}

.selectbox.normal {
  max-width: 588px;
}
.selectbox select:disabled + span{
  border-top: 8px solid #ccc;
}

@media screen and (max-width: 768px) {
  .input {
    height: 48px;
  }
  .checkbox {
    padding: 2px 0 2px 36px;
  }
  .checkbox span::before {
    width: 26px;
    height: 26px;
  }
  .checkbox input:checked + span::after {
    width: 6px;
    height: 12px;
    border-bottom: 3px solid #00A728;
    border-right: 3px solid #00A728;
  }
  .selectbox {
    overflow: hidden;
    height: 45px;
  }
  .selectbox select {
    font-size: 1.6rem;
    transform: scale(0.875);
    transform-origin: top left;
    width: 114.28%;
    height: 51px;
  }
}
@media screen and (max-device-width: 768px) {
  .input {
    font-size: 1.6rem;
  }
}

/******************
 エラー
******************/
.error {
  position: relative;
  padding: 30px 30px 30px;
  margin-bottom: 50px;
  color:#E90000;
  z-index: 2;
  background: #FFEBEB;
}
.error.noactive {
  display: none;
}
.error-title{
  font-weight: bold;
  text-align: center;
  margin-bottom: 25px !important;
  font-size: 1.8rem;
}
.error.error-wide {
  padding: 30px 0px 30px;
  margin-bottom: 40px;
}
.error.error-wide.pgno {
  padding: 0; 
}

.error-wide::after {
  content:"";
  position: absolute;
  display: block;
  width: 100vw;
  height: 100%;
  top:0;
  left:0;
  margin-left:calc(50% - 50vw);
  z-index: -1;
  background: #FFEBEB;
}
.main .error-message,
.main .error p{
  margin-bottom: 0;
}
.error-area-message {
  color:#E90000;
  margin-bottom: 25px;
}
.error-area-message.noactive {
  display: none;
}

@media screen and (max-width:1200px){
  .error {
    padding: 30px 20px 30px;
    margin-bottom: 30px;
  }
  .error-wide::after{
    margin-left:-20px;
  }
  .error-area-message {
    margin-bottom: 15px;
  }
}
@media screen and (max-width:768px){
  .error.error-wide {
    padding: 30px 0px 35px;
    margin-bottom: 35px;
  }
  .error-title {
    font-size: 1.6rem;
  }
}
/******************
 noscript
******************/
.noscript{
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  background: #f2f2f2;
  z-index: 101;
}
.noscript>div{
  margin: 0 auto;
  width: calc(100% - 50px * 2);
  max-width: 1200px;
  padding: 50px 0;
}
.noscript>div>div:first-child{
  font-size: 1.6rem;
  font-weight: bold;
  color: #e90000;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .noscript>div{
    width: 100%;
    padding: 30px;
  }
}
/******************
 IE エラー
******************/
#ie-error {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100vw;
  height: 100vh;
  background: #fff;
  z-index: 2000;
}
#ie-error>div{
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -300px;
  transform: translateY(-50%);
  width: 600px;
}
#ie-error .text {
  display: flex;
  align-items: center;
  margin-bottom: 40px;
}
#ie-error .text img {
  width: 70px;
}
#ie-error .text p {
  position: relative;
  font-size: 2.0rem;
  font-weight: bold;
  margin-left: 20px;
}
#ie-error .text::after {
}
#ie-error .button {
  max-width: 380px;
}

/******************
 下層メニュー(SP開閉式)
******************/
.lower-nav {
  background: #FFFBF0;
  border-bottom: 1px solid #DDDDDD;
}
.lower-nav ul {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}
.lower-nav ul::before {
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 0;
  top: 44px;
  left: 0;
  border-bottom: 1px dashed #dddddd;
}
.lower-nav ul::after {
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 0;
  top: 87px;
  left: 0;
  border-bottom: 1px dashed #dddddd;
}
.lower-nav ul>li>a {
  position: relative;
  display: block;
  height: 43px;
  padding: 17px 20px 15px;
  line-height: 1em;
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
  white-space: nowrap;
}
.lower-nav ul>li>a.active {
  color: #00A728;
}
.lower-nav ul>li>a.active::before {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 4px;
  bottom:-1px;
  left:0;
  background: #00A728;
}
.lower-nav ul>li>a::after {
  content: '';
  position: absolute;
  display: block;
  width: 1px;
  height: 23px;
  top: 11px;
  right: 0;
  background: #dddddd;
}
.lower-nav ul>li>a .icon {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 100%;
}
.lower-nav ul>li>a .icon::after {
  content: '';
  position: absolute;
  display: block;
  width: 30px;
  height: 39px;
  top: -16px;
  left: 0;
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: 0 center;
}
.lower-nav ul>li>a .icon.key::after {
  background-image: url(../svg/icon-key.svg);
}
@media screen and (max-width: 768px) {
  .lower-nav {
    background: #fff;
  }
  .lower-nav .button-toggle {
    position: relative;
    line-height: 50px;
    font-weight: bold;
    height: 50px;
    padding-left: 60px;
    border-top: 1px solid #ddd;
  }
  /*店舗系*/
  .lower-nav.shop .button-toggle {
    background: url(../svg/icon-shop.svg) 20px center no-repeat;
    background-size: 32px;
  }
  /*キッズ系*/
  .lower-nav.kids .button-toggle {
    background: url(../svg/icon-kids.svg) 20px center no-repeat;
    background-size: 29px;
  }
  /*マイページ系*/
  .lower-nav.mypage .button-toggle {
    background: url(../svg/header-login_green.svg) 20px center no-repeat;
    background-size: 32px;
  }
  /*サービス系*/
  .lower-nav.service .button-toggle {
    background: url(../image/icon-service.png) 20px center no-repeat;
    background-size: 29px;
  }
  /*モスのこだわり系*/
  .lower-nav.omoi .button-toggle {
    background: url(../image/icon-omoi.png) 20px center no-repeat;
    background-size: 26px;
  }
  /*お問い合わせ系系*/
  .lower-nav.faq .button-toggle {
    background: url(../svg/icon-contact.svg) 20px center no-repeat;
    background-size: 26px;
  }
  .lower-nav .button-toggle.open {
    color: #00A728;
  }
  .lower-nav .button-toggle::before {
    content: '';
    width: 18px;
    height: 2px;
    background: #00A728;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -1px;
  }
  .lower-nav .button-toggle::after {
    content: '';
    width: 2px;
    height: 18px;
    background: #00A728;
    position: absolute;
    top: 50%;
    right: 28px;
    margin-top: -9px;
  }
  .lower-nav .button-toggle.open::after {
    display: none;
  }
  .lower-nav nav {
    display: none;
  }
  .lower-nav ul {
    background: #F5F5F5;
    display: block;
    padding: 0 20px;
    border-top: 1px solid #ddd;
  }
  .lower-nav ul::before,
  .lower-nav ul::after {
    display: none;
  }
  .lower-nav ul li {
    border-bottom: 1px dashed #ddd;
  }
  .lower-nav ul li:last-child {
    border-bottom: none;
  }
  .lower-nav ul>li>a {
    height: auto;
    padding: 13px 1em 13px 0;
    line-height: 24px;
    text-align: left;
    font-size: 1.4rem;
    font-weight: normal;
    white-space: normal;
  }
  .lower-nav ul>li>a.active {
    color: #000;
  }
  .lower-nav ul>li>a.active::before {
    display: none;
  }
  .lower-nav ul>li>a::after {
    background: none;
    right: 0px;
    top: 50%;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-left: 7px solid #00a728;
    transform: translateY(-50%);
  }
  .lower-nav ul>li>a .icon {
    height: auto;
  }
  .lower-nav ul>li>a .icon::after {
    top: -25px;
  }
}

/**********
 モーダルウィンドウ
**********/
.modal {
  position: fixed;
  background: rgba(0,0,0,0.5);
  left:0;
  top:0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  display: none;
}
.modal-wrap {
  position: absolute;
  width:100%;
  max-height: calc(100% - 40px);
  top: 50%;
  left: 0;
  -webkit-transform: translate(0, -50.1%);
  transform: translate(0, -50.1%);
  text-align:center;
  overflow :hidden;
}
.modal-block {
  max-width: 940px;
  margin: 0 auto;
  padding: 0 20px;
}
.modal-inner {
  position: relative;
  background: #fff;
  padding: 0 30px;
}
.modal-head {
  position: relative;
  font-size: 1.8rem;
  display: flex;
  width: 100%;
  height: 68px;
  padding-top: 10px;
  align-items: center;
  justify-content: center;
}
.modal-close {
  position: absolute;
  right: -5px;
  top: 50%;
  width: 30px;
  height: 30px;
  display: block;
  z-index: 2;
  cursor: pointer;
  transform: translateY(-50%);
}
.modal-close::before,
.modal-close::after {
  content: '';
  top: 50%;
  left: 2px;
  position: absolute;
  width: 25px;
  height: 2px;
  background: #00A728;
}
.modal-close::before {
  transform: rotate(45deg);
}
.modal-close::after {
  transform: rotate(-45deg);
}
.modal-body-wrap {
  border-top: 1px solid #ddd;
  padding: 10px 0;
}
.modal-body {
  position: relative;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-height: calc(100vh - 128px);
  width: calc(100% + 15px);
  padding-right: 15px;
}
.modal-body::-webkit-scrollbar {
  width: 8px;
}
.modal-body::-webkit-scrollbar-track {
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
.modal-body::-webkit-scrollbar-thumb {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: rgba(0,0,0,0.1);
}
.modal-body::-webkit-scrollbar:hover {
  opacity: 0;
}
@media screen and (max-width: 768px) {
  .modal-inner {
    padding: 0 20px;
  }
  .modal-head {
    height: 50px;
    padding-top: 8px;
    font-size: 1.6rem;
  }
  .modal-body-wrap {
    padding: 5px 0;
  }
  .modal-body {
    max-height: calc(100vh - 98px);
  }
  .modal-body::-webkit-scrollbar {
    width: 2px;
  }
}
/*モーダルのアクティブ（アレルギー検索）*/
.modal.noactive {
  position: relative;
  background: none;
  left:0;
  top:0;
  width: auto;
  height: auto;
  z-index: 1;
  display: block;
}
.modal-wrap.noactive {
  position: relative;
  width:100%;
  max-height: none;
  top: 0;
  left: 0;
  transform: translate(0,0);
  text-align: left;
  overflow: visible;
}
.modal-block.noactive {
  max-width: 100%;
  padding: 0;
}
.modal-inner.noactive {
  padding: 0;
}
.modal-head.noactive {
  display: none;
}
.modal-close.noactive,
.modal-close.noactive::before,
.modal-close.noactive::after {
  display: none;
}
.modal-body-wrap.noactive {
  border-top: none;
  padding: 0;
}
.modal-body.noactive {
  position: relative;
  overflow: visible;
  -webkit-overflow-scrolling: touch;
  max-height: none;
  width: 100%;
  padding-right: 0;
}
@media screen and (max-width: 768px) {
  .modal-inner.noactive {
    padding: 0;
  }
  .modal-body-wrap.noactive {
    padding: 0;
  }
  .modal-body.noactive {
    max-height: none;
  }
}

/*アイコン説明*/
.info-icon-list {
  display: flex;
  flex-wrap: wrap;
  padding: 30px;
}
.info-icon-list li {
  width: calc((100% - 60px)/ 4);
  display: flex;
  text-align: left;
  align-items: center;
  margin-bottom: 20px;
  margin-right: 20px;
}
.info-icon-list li:nth-child(4n) {
  margin-right: 0;
}
.info-icon-list li img {
  max-width: 46px;
}
.info-icon-list li p {
  width: calc(100% - 56px);
  margin-left: 10px;
  margin-bottom: 0;
}
@media screen and (max-width: 768px) {
  .info-icon-list {
    padding: 15px 0;
  }
  .info-icon-list li,
  .info-icon-list li:nth-child(4n) {
    width: calc((100% - 20px)/ 2);
    margin-right: 20px;
  }
  .info-icon-list li:nth-child(2n) {
    margin-right: 0;
  }
  .info-icon-list li img {
    max-width: 35px;
  }
  .info-icon-list li p {
    width: calc(100% - 45px);
    margin-left: 10px;
    font-size: 1.2rem;
  }
}

/*====================================
/* 緊急告知
====================================*/
#emergency {
  position: relative;
  background: #FFEBEB;
  max-height: 0;
  overflow: hidden;
  animation-name: active;
  animation-duration: 5s;
  animation-timing-function: ease-in-out;
  animation-play-state: paused;
}
#emergency.active{
  max-height: 150vh;
  animation-duration: 0.5s;
  animation-play-state: running;
}
@keyframes active {
  0% { max-height: 0; }
  100% { max-height: 150vh; }
}

.emergency-title {
  border-bottom: 2px solid #fff;
  cursor: pointer;
}
.emergency-title .wrap {
  position: relative;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 18px 0 14px 50px;
  background: url(../svg/emergency.svg) left 12px no-repeat;
  background-size: 38px;
  cursor: pointer;
}
.emergency-title .wrap::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 26px;
  height: 3px;
  background: #E90000;
  transform: translateY(-50%);
}
.emergency-title .wrap::before {
  content: '';
  position: absolute;
  top: calc(50% - 13px); 
  right: calc((26px / 2) - (3px/2));
  width: 3px;
  height: 26px;
  background: #E90000;
}
.emergency-title.open .wrap::before {
  display: none;
}
.emergency-box {
  display: none;
  padding: 15px 0;
}
.emergency-box time {
  display: block;
  font-size: 1.3rem;
  color: #888888;
  margin-bottom: 10px;
}
.emergency-box .title {
  font-size: 1.6rem;
  line-height: 1.5em;
  color: #E90000;
  margin-bottom: 5px;
}
.emergency-box .message {
  margin-bottom: 15px;
}
@media screen and (max-width: 1000px) {
  #emergency {
    background: #FFEBEB;
  }
  .emergency-title {
    border-bottom: 2px solid #fff;
  }
  .emergency-title .wrap {
    position: relative;
    font-size: 1.4rem;
    padding: 17px 20px 13px 60px;
    background: url(../svg/emergency.svg) 20px 12px no-repeat;
    background-size: 31px;
    cursor: pointer;
  }
  .emergency-title .wrap::after {
    right: 20px;
    width: 18px;
    height: 2px;
  }
  .emergency-title .wrap::before {
    content: '';
    position: absolute;
    top: calc(50% - 9px); 
    right: calc(20px + (18px / 2) - (2px/2));
    width: 2px;
    height: 18px;
    background: #E90000;
  }
  .emergency-box {
    padding: 15px 0;
  }
  .emergency-box time {
    display: block;
    font-size: 1.3rem;
    color: #888888;
    margin-bottom: 10px;
  }
  .emergency-box .title {
    font-size: 1.6rem;
    line-height: 1.5em;
    color: #E90000;
    margin-bottom: 5px;
  }
  .emergency-box .message {
    margin-bottom: 15px;
  }
/*768*/
}

/**********
 下層コンテンツ
**********/
/*共通コンテンツ*/
.main-contents {
  padding-top: 55px;
  padding-bottom: 55px;
  overflow: hidden;
}
@media screen and (max-width:768px){
  .main-contents{
    padding-top: 35px;
    padding-top: 35px;
  }
/*media 768*/
}

/*banner*/
.banner-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 0 10px;
}

.banner-list li{
  position: relative;
  width: 23.5% ;
  min-width: 282px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  background: #fff;
  margin-bottom: 28px;
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
}

.banner-list li:nth-child(4n) {
  margin-right: 0;
}
.banner-list li:last-child{
  margin-right: 0;
}
 /*5以上左寄せ*/
.banner-list li:nth-child(n + 5):last-child{
  margin-right: auto;
}

.banner-list li a {
  display: block;
  height: 100%;
  padding-bottom: 10px;
}
.banner-list li .image {
  position: relative;
  text-align: center;
  margin-bottom: 15px;
}
.banner-list li .image img {
  width: 100%;
}
.banner-list li .title {
  font-size: 1.6rem;
  font-weight: bold;
  padding: 0 15px;
  margin-bottom: 8px;
}
.banner-list li .message {
  margin-bottom: 0.5em;
  padding: 0 15px;
}
@media screen and (max-width:1024px) {

 /*メニューリスト*/
 .banner-list  {
      padding: 0 0 25px;
  }
 .banner-list  li {
    width: 31%;
    min-width: 0;
    margin-right: 3.5%;
  }
 .banner-list  li:nth-child(4n) {
    margin-right: 3.5%;
  }
 .banner-list  li:nth-child(3n) {
    margin-right: 0;
  }
  /*3以上左寄せ*/
  .banner-list li:nth-child(n + 3):last-child{
    margin-right: auto;
  }

}
@media screen and (max-width:768px) {
 .banner-list  li {
    width: 48%;
    margin-right: 4%;
    margin-bottom: 15px;
  }
 .banner-list  li:nth-child(4n) {
    margin-right: 4%;
  }
 .banner-list  li:nth-child(3n) {
    margin-right: 4%;
  }
 .banner-list  li:nth-child(2n) {
    margin-right: 0;
  }

  .banner-list li .title {
    font-size: 1.4rem;
    margin-bottom: 5px;
  }
  .banner-list li .message {
    font-size: 1.3rem;
  }
}
@media screen and (max-width:425px) {
 .banner-list  li {
  width: 100%;
    margin-right: 0;
    margin-bottom: 15px;
  }
 .banner-list  li:nth-child(4n) {
    margin-right: 0;
  }
 .banner-list  li:nth-child(3n) {
    margin-right: 0;
  }
 .banner-list  li:nth-child(2n) {
    margin-right: 0;
  }
   .banner-list  li:last-child{
    margin-bottom: 0;
   }
}


/*====================================
/* ヘッダー
====================================*/
#header {
  position: relative;
  padding-bottom: 74px;
  transition: all .5s ease-in-out;
}
#header.noactive {
  opacity: 0;
}
#page-top #header {
  padding-bottom: 0;
}
header {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 74px;
  z-index: 1000;
  background: rgba(255,255,255,0.95);
}
#page-top header {
  background: transparent;
  bottom: -88px;
}
.fixed header,
#page-top.fixed header {
  position: fixed;
  bottom: auto;
  top: 0;
  box-shadow: 0 0 4px rgba(0,0,0,0.15);
  background: rgba(255,255,255,0.95);
}
header .wrap {
  display: flex;
  align-items: center;
}
.header-logo {
  display: inline-block;
  padding: 14px 0 15px;
}
@media screen and (min-width: 1001px) {
  #page-top:not(.fixed) .header-logo.white {
    background: url(../svg/logo-white.svg) center center no-repeat;
    background-size: 100%;
  }
  #page-top:not(.fixed) .header-logo.white img {
    opacity: 0;
  }
}
header #header-navi {
  position: relative;
  width: calc(100% - 66px);
  /*padding-left: 50px; until:2023-05-11*/
  padding-left: 30px;
}
header .menu {
  height: 74px;
  display: flex;
  align-items: center;
}
header .menu li {
  /*padding: 0 20px; until:2023-05-11*/
  padding: 0 15px;
}
#page-top:not(.fixed) header.white .menu li a {
  color: #fff;
}
header .menu-user {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  height: 74px;
  align-items: center;
}
header .menu-user li {
  padding: 0 0 0 15px;
}
header .menu-user-login,
header .menu-user-mypage {
  /*border-right: 1px solid #ddd;*/
  border-right: none;
}
header .menu-user-regist,
header .menu-user-info,
header .menu-user-mypage {
  display: none;
}
header .menu-user li a {
  position: relative;
  padding-left: 20px;
}
header .menu-user-login a::after,
header .menu-user-mypage a::after,
header .menu-user-global a::after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 14px;
  height: 15px;
  background: url(../svg/header-login.svg) no-repeat;
  background-size: 100%;
  transform: translateY(-59%);
}
header .menu-user-global a::after {
  width: 15px;
  height: 15px;
  background: url(../svg/header-global.svg) no-repeat;
  background-size: 100%;
}
header.logind .menu-user-login {
  display: none;
}
header.logind .menu-user-mypage {
  display: block;
}
#page-top:not(.fixed) header.white .menu-user-login,
#page-top:not(.fixed) header.white .menu-user-mypage,
#page-top:not(.fixed) header.white .menu-user-global {
  color: #fff;
}
#page-top:not(.fixed) header.white .menu-user-login a::after,
#page-top:not(.fixed) header.white .menu-user-mypage a::after {
  background: url(../svg/header-login_white.svg) no-repeat;
  background-size: 100%;
}
#page-top:not(.fixed) header.white .menu-user-global a::after {
  background: url(../svg/header-global_white.svg) no-repeat;
  background-size: 100%;
}
header .link-banner,
header .link-global,
header .link-corporation,
header .sp-navi,
header #menu-button {
  display: none;
}

@media screen and (max-width: 1150px) {
  header #header-navi {
    /*padding-left: 25px; until:2023-05-11*/
    padding-left: 15px;
  }
  header .menu li {
    /*padding: 0 10px; until:2023-05-11*/
    padding: 0 6px;
  }
/*@media 1150*/
}

/*スマホ*/
@media screen and (max-width: 1000px) {
  #header {
    padding-bottom: 60px;
  }
  #page-top #header {
    padding-bottom: 0;
  }
  header,
  #page-top header {
    height: 60px;
    background: rgba(255,255,255,0.95);
  }
  #page-top header {
    bottom: -60px;
  }
  header.block,
  #page-top header.block {
    position: fixed;
    bottom: auto;
    top: 0;
  }
/*
  .show-app-dl header,
  #page-top.show-app-dl header {
    height: 140px;
  }
  .fixed.show-app-dl header,
  #page-top.fixed.show-app-dl header {
    height: 60px;
  }
*/
  #header .app-dl {
    display: none;
    height: 80px;
  }
  .show-app-dl #header .app-dl {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid #ccc;
    padding: 0 15px;
  }
  .webapp #header .app-dl {
    display: none;
  }
  #header .app-dl-del {
    position: relative;
    width: 25px;
    height: 25px;
    cursor: pointer;
  }
  #header .app-dl-del::before,
  #header .app-dl-del::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 25px;
    height: 2px;
    background: #000;
  }
  #header .app-dl-del::before {
    transform: translate(-50%,-50%) rotate(45deg);
  }
  #header .app-dl-del::after {
    transform: translate(-50%,-50%) rotate(-45deg);
  }
  #header .app-dl img {
    width: 52px;
  }
  #header .app-dl-info {
    font-size: 1rem;
  }
  #header .app-dl-info strong {
    font-size: 1.4rem;
  }
  #header .app-dl .button {
    font-size: 1rem;
    width: 84px;
    height: 32px;
    line-height: 30px;
    white-space: nowrap;
  }
  #header .app-dl .button[target="_blank"]::after {
    display: none;
  }

  header .wrap {
    position: relative;
    padding: 0 20px;
  }
  .header-logo {
    position: relative;
    padding: 13px 0;
    width: 50px;
    z-index: 120;
  }
  header #header-navi {
    position: fixed;
    background: #fff;
    top: 60px;
    left: 0;
    width: 100%;
    height: calc(100vh - 60px);
    padding-left: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    transition: all 0.3s ease;
    z-index: 110;
    animation: gradient 15s ease infinite;
    opacity: 0;
    display: none;
  }
  /*scroll css*/
  header #header-navi::-webkit-scrollbar {
    width: 2px;
    background: none;
  }
  header #header-navi::-webkit-scrollbar-track {
    -webkit-border-radius: 10px;
    border-radius: 10px;
  }
  header #header-navi::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(0,0,0,0.1);
  }
  header #header-navi::-webkit-scrollbar:hover {
    opacity: 0;
  }
  header #header-navi.block {
    display: block;
  }
  header #header-navi.block.active {
    opacity: 1;
    right:0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  header #header-navi::after {
    content: '';
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 60px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    background: #fff;
  }
  header .menu {
    height: auto;
    display: block;
    padding: 0 20px;
    border-bottom: 1px solid #ddd;
  }
  header .menu li {
    padding: 0;
    border-bottom: 1px dashed #ddd;
  }
  header .menu li:last-child {border :none;}
  header .menu li a {
    display: block;
    font-weight: bold;
    padding: 14px 5px;
    color: #000 !important;
  }
  header .menu-user {
    position: relative;
    width: 100%;
    height: auto;
    align-items: center;
    justify-content: space-between;;
    padding: 30px 20px;
    border-bottom: 1px solid #ddd;
  }
  header .menu-user li {
    padding: 0;
    width: calc(50% - 7.5px);
  }
  header .menu-user-login,
  header .menu-user-mypage {
    border: none;
  }
  header .menu-user-global {
    display: none;
  }
  header .menu-user-regist {
    display: block;
  }
  header.logind .menu-user-regist {
    display: none;
  }
  header .menu-user li a {
    display: block;
    position: relative;
    padding-left: 0;
    text-align: center;
    line-height: 46px;
    font-weight: bold;
    border: 1px solid #00A728;
    border-radius: 25px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    color: #000 !important
  }
  header .menu-user li.menu-user-regist a {
    background: #00A728;
    color: #fff !important;
  }
  header .menu-user-login a::after,
  header .menu-user-mypage a::after,
  header .menu-user-regist a::after {
    content: '';
    position: absolute;
    left: 16px;
    top: 12px;
    width: 18px;
    height: 19px;
    background: url(../svg/header-login_green.svg) no-repeat !important;
    background-size: 100%;
    transform: translateY(0);
  }
  header .menu-user-regist a::after {
    left: 16px;
    top: 14px;
    width: 20px;
    height: 19px;
    background: url(../svg/header-regist.svg) no-repeat !important;
    background-size: 100%;
  }
  header.logind .menu-user-info {
    display: flex;
  }
  header .menu-user-info {
    position: relative;
    height: 48px;
    align-items: center;
  }
  header .menu-user-info.calc,
  header .menu-user-info.gold,
  header .menu-user-info.silver,
  header .menu-user-info.bronze {
    padding-left: 35px !important;
  }
  header .menu-user-info::after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 20px;
    height: 37px;
    transform: translateY(-50%);
  }
  header .menu-user-info.calc::after {
    background: url(../mypage/svg/icon-medal-calc.svg) no-repeat;
    background-size: 100%;
  }
  header .menu-user-info.gold::after {
    background: url(../mypage/svg/icon-medal-gold.svg) no-repeat;
    background-size: 100%;
  }
  header .menu-user-info.silver::after {
    background: url(../mypage/svg/icon-medal-silver.svg) no-repeat;
    background-size: 100%;
  }
  header .menu-user-info.bronze::after {
    background: url(../mypage/svg/icon-medal-bronze.svg) no-repeat;
    background-size: 100%;
  }
  header .menu-user-info .name {
    font-size: 1.3rem;
    line-height: 1.3846em;
  }
  header .menu-user-info .name span {
    font-weight: bold;
  }
  header .menu-user-info .rank {
    font-size: 1.2rem;
    line-height: 2em;
  }
  header .link-banner {
    display: block;
    text-align: center;
    padding: 20px 20px 10px;
    background: #f5f5f5;
  }
  header .link-banner a {
    display: block;
    margin-bottom: 20px;
  }
  header .link-global {
    display: flex;
    background: #f5f5f5;
    justify-content: center;
    padding-bottom: 30px;
  }
  header .link-global li {
    padding: 0 8px;
    border-right: 1px solid #ddd;
  }
  header .link-global li:last-child {border: none;}
  header .link-global a {
    position: relative;
    padding-left: 20px;
    font-size: 1.2rem;
    background: url(../svg/header-global.svg) no-repeat;
    background-size: 13px 13px;
    text-decoration: underline;
  }

  header .link-corporation {
    display: flex;
    flex-wrap: wrap;
    background: #f5f5f5;
  }
  header .link-corporation li {
    width: 50%;
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
  }
  header .link-corporation li:nth-child(2n) {
    border-right: none;
  }
  header .link-corporation li a {
    padding: 10px 20px;
    display: flex;
    align-items: center;
    min-height: 65px;
  }
  header #menu-button {
    position: absolute;
    display: block;
    right: 0;
    top: 0;
    width: 60px;
    height: 60px;
    cursor: pointer;
    z-index: 16;
    margin-top: 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 120;
  }
  header #menu-button>div {
    width: 25px;
    height: 2px;
    background: #000;
    position: absolute;
    transition: all .3s;
  }
  header.on #menu-button>div {
    background: #59493f;
  }
  header #menu-button>div:nth-child(1) {
    top: 33.33%;
    left: 15px;
    transform: translate(0%,0%);
  }
  header #menu-button.active>div:nth-child(1)  {
    top: 50%;
    transform: translate(0,-50%) rotate(45deg);
  }
  header #menu-button>div:nth-child(2) {
    top: 50%;
    left: 15px;
    margin-top: -1px;
  }
    header #menu-button.active>div:nth-child(2)  {
      opacity: 0;
    }
  header #menu-button>div:nth-child(3) {
    top: 63.33%;
    left: 15px;
    transform: translate(0%,0%);
  }
  header #menu-button.active>div:nth-child(3)  {
    top: 50%;
    transform: translate(0,-50%) rotate(-45deg);
  }
  header .sp-navi {
    position: absolute;
    right: 65px;
    top: 0;
    display: flex;
    z-index: 120;
  }
  header.block .sp-navi {
    display: none;
  }
  header .sp-navi a {
    font-size: 1.2rem;
    display: block;
    margin: 0 10px;
    line-height: 60px;
  }
  .sp-navi-login {
    display: none;
  }
  .sp-navi-mypage {
    display: none !important;
  }
  .logind .sp-navi-login {
    display: none;
  }
  .logind .sp-navi-mypage {
    display: block !important;
  }
/*@media 1000*/
}

/*====================================
/* フッター
====================================*/
footer {
  background: #f5f5f5;
  padding: 50px 0 0;
}
footer .copyright {
  font-family: Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.4;
  color :#fff;
  text-align: center;
  background: #002614;
  padding: 28px 10px;
}
.footer-corporate-link {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 15px;
}
.footer-corporate-link img {
  width: 200px;
  margin-bottom: 10px;
}
.footer-corporate-link>li {
  width: 25%;
  padding-right: 5%;
}
.footer-corporate-link>li>a {
  display: inline-block;
  margin-bottom: 20px;
}
.footer-corporate-link .title {
  font-size: 1.6rem;
  font-weight: bold;
}
.footer-corporate-link>li li {
  margin-bottom: 10px;
}
.footer-link {
  padding: 30px 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  border-top: 1px solid #ddd;
}
.footer-link li {
  padding: 0 30px;
}
.footer-link li {
  border-right: 1px solid #ddd;
}
.footer-link li:last-child {
  border: none;
}
.footer-link li a {
  font-size: 1.2rem;
}

/*スマホ*/
@media screen and (max-width: 768px) {
  footer {
    padding: 30px 0 0;
  }
  footer .copyright {
    padding: 20px;
  }
  footer .wrap { padding: 0;}
  .footer-corporate-link {
    margin-bottom: 0;
  }
  .footer-corporate-link img { width: 200px; margin-bottom: 10px;}
  .footer-corporate-link li {
    display: none;
    padding-right: 0;
  }
  .footer-corporate-link li:nth-child(1) {
    width: 100%;
    display: flex;
    border-bottom: 1px solid #ddd;
  }
  .footer-corporate-link li:nth-child(1) a {
    padding: 0 7px 15px 20px;
    width: 50%;
    margin-bottom: 0;
  }
  .footer-corporate-link li:nth-child(1) a:last-child {
    padding: 0 20px 15px 7px;
  }
  .footer-corporate-link li:nth-child(1) a p {
    display: block;
  }
  .footer-corporate-link li:nth-child(5),
  .footer-corporate-link li:nth-child(6) {
    width: 50%;
  }
  .footer-corporate-link li:nth-child(5) {
    border-right: 1px solid #ddd;
  }
  .footer-corporate-link li:nth-child(5) a,
  .footer-corporate-link li:nth-child(6) a {
    display: block;
    width: 100%;
    padding: 15px 20px;
    margin-bottom: 0;
  }
  .footer-link {
    padding: 20px 0 5px;
  }
  .footer-link li {
    width: 50%;
    margin-bottom: 15px;
    text-align: right;
  }
  .footer-link li:nth-child(2n) {
    border-right: none;
    text-align: left;
  }
/*media 768*/
}


/*====================================
/* 01.TOP (HOME)
====================================*/
#top-visual {
  position: relative;
  transition: opacity .8s ease;
}
#top-visual a:hover{
  opacity: 1;
}
#top-visual.noactive {
  opacity: 0;
}
#top-visual .swiper-container,
#top-visual .visual {
  width: 100%;
  height: 100vh;
}
.top-visual-prev,
.top-visual-next {
  width: 48px;
  height: 48px;
  background: #fff;
}
.top-visual-prev {
  left: 0;
  border-top-right-radius : 24px;
  border-bottom-right-radius : 24px;
}
.top-visual-next {
  right: 0;
  border-top-left-radius : 24px;
  border-bottom-left-radius : 24px;
}
.top-visual-prev::after {
  content: '';
  width: 15px;
  height: 15px;
  border-top: 3px solid #00A728;
  border-left: 3px solid #00A728;
  transform: rotate(-45deg);
}
.top-visual-next::after {
  content: '';
  width: 15px;
  height: 15px;
  border-top: 3px solid #00A728;
  border-right: 3px solid #00A728;
  transform: rotate(45deg);
}
#top-visual .swiper-pagination {
  bottom: 24px;
  text-align: right;
  padding-right: 34px;
}

#top-visual .visual-scroll {
  position: absolute;
  left: 50%;
  bottom: 32px;
  font-size: 1.2rem;
  color: #666;
  z-index: 100;
  transform: translateX(-50%);
}
#top-visual .visual-scroll::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -50px;
  width: 1px;
  height: 50px;
  background: #666;
}
@media screen and (max-width: 1000px){
  #top-visual .visual.pc {
    display: none !important;
  }
  #top-visual .visual.sp {
    display: block !important;
  }
  .top-visual-prev,
  .top-visual-next {
    display: none;
  }
  #top-visual .swiper-pagination {
    bottom: 24px;
    text-align: center;
    padding-right: 0;
  }
  #top-visual .visual-scroll {
    display: none;
  }
}
/*緊急告知エリア*/
#top-attention-area {
  background: #f5f5f5;
  padding: 50px 0 15px;
  margin-bottom: 40px;
}
#top-attention-area .wrap>div:nth-child(1) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  padding-bottom: 30px;
}
.top-alert-list {

}
.top-alert-list li {
  border-bottom: 1px dashed #ddd;
  padding: 20px 10px;
}
.top-alert-list li:last-child {
  border-bottom: none;
}
.top-alert-list .title {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 10px;
}
.top-alert-list a {
  margin-top: 10px;
}
.top-alert-list .title + a {
  margin-top: 0;
}

/*お知らせ*/
#top-news-area {
  margin-bottom: 110px;
}
.news-list {
  border-bottom: 1px solid #ddd;
  padding-bottom: 50px;
}
.news-list li {
  border-bottom: 1px dashed #ddd;
  margin-bottom: 20px;
}
.news-list li:last-child {
  border: none;
  margin-bottom: 0;
}
.news-list li a {
  display: block;
  padding: 0 10px 15px;
}
.news-list li time {
  display: block;
  font-size: 1.3rem;
  color: #888;
  margin-bottom: 5px;
}
#top-news-area .news-list {
  display: flex;
  flex-wrap: wrap;
  border-bottom: none;
  padding-bottom: 30px;
}
#top-news-area .news-list li {
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
  margin-right: 24px;
  width: calc((100% - 48px) / 3);
}
#top-news-area .news-list li:nth-child(3n) {
  margin-right: 0;
}
.slider-box {
  position: relative;
  margin-top: -10px;
}
#page-top section {
  margin-bottom: 110px;
}

/*メニュースライダー*/
.menu-slider .swiper-container {
  max-width: 1064px;
  margin: 0 auto;
  padding: 0 10px;
}
.menu-slider .menu-slider-list {
  padding: 10px 0 100px;
}
.menu-slider .menu-slider-list li {
  position: relative;
  max-width: 246px;
  min-height: 267px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
}
.menu-slider .menu-slider-list li a {
  display: block;
  min-height: 267px;
}
.menu-slider .menu-slider-list li .image {
  position: relative;
  padding: 25px;
  text-align: center;
  margin-bottom: 15px;
}
.menu-slider .menu-slider-list li .image img {
  width: 160px;
}
.menu-slider .menu-slider-list li .image::after {
  content: '';
  left: 50%;
  bottom: 0;
  position: absolute;
  width: 222px;
  height: 1px;
  background: #f5f5f5;
  transform: translateX(-50%);
}
.menu-slider .menu-slider-list li p {
  margin-bottom: 0.5em;
  padding: 0 17px;
}
.menu-slider .menu-slider-list li .menu-title {
  font-weight: bold;
}
.menu-slider .menu-slider-list li .menu-icon {
  position: absolute;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.3rem;
  color: #fff;
  line-height: 28px;
  padding: 0 0.75em;
  margin-bottom: 0;
}
.menu-slider .menu-slider-list li .image .icon {
  position: absolute;
  left: 10px;
  bottom: 7px;
  display: flex;
}
.menu-slider .menu-slider-list li .image .icon img {
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
.menu-slider .swiper-button-next, .menu-slider .swiper-button-prev {
  top: 37%;
}
.menu-slider .swiper-pagination {
  bottom: 34px;
}

/*キャンペーン*/
.campaign-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 50px;
}
.campaign-list li {
  width: 32%;
  max-width: 383px;
  min-height: 304px;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  overflow: hidden;
  margin-right: 1.5%;
}
.campaign-list li:last-child {
  margin-right: 0;
}
.campaign-list li a {
  display: block;
}
.campaign-list li p {
  padding: 15px;
}
.campaign-list li .image {
  position: relative;
  text-align: center;
  padding-top: 56.318%;
}
.campaign-list li .image img {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  object-fit: cover;
}

/*トピックススライダー*/
.topics-slider .swiper-container {
  max-width: 1064px;
  margin: 0 auto;
  padding: 0 10px;
}
.topics-slider-list {
  padding: 10px 0 90px;
  height: auto !important;
}
.topics-slider-list li {
  position: relative;
  max-width: 246px;
  min-height: 232px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
}
.topics-slider-list li a {
  display: block;
  min-height: 232px;
}
.topics-slider-list li .image {
  position: relative;
  text-align: center;
  padding-top: 56.318%;
}
.topics-slider-list li .image img {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  object-fit: cover;
}
.topics-slider-list li p {
  padding: 15px;
}
.topics-slider .swiper-button-next, .topics-slider .swiper-button-prev {
  top: 37%;
}
.topics-slider .swiper-pagination {
  bottom: 34px;
}
.topics-slider.noactive .topics-slider-list {
  justify-content: center;
}
.topics-slider.noactive .topics-slider-list li:first-child {
  margin-left: 20px;
}
.topics-slider.noactive .topics-slider-prev,
.topics-slider.noactive .topics-slider-next,
.topics-slider.noactive .swiper-pagination {
  display: none;
}

  /*おすすめコンテンツ*/
  .recommend-contents-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 50px;
    padding: 10px 0 90px;
    height: auto !important;
  }
  .recommend-contents-list li {
    position: relative;
    max-width: 246px;
    min-height: 232px;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    margin-right: 20px;
    border-radius: 10px;
    overflow: hidden;
  }
  .recommend-contents-list li .image {
    position: relative;
    text-align: center;
  }
  .recommend-contents-list li p {
    padding: 15px;
  }
  .recommend-contents-list li a {
    display: block;
    min-height: 232px;
  }
  .recommend-pc { 
    display: block !important; 
  }
  .recommend-sp {
    display: none !important;
  }
  @media screen and (max-width:1084px) {
    .recommend-pc {
      display: none !important;
    }
    .recommend-sp {
      display: block !important;
    }
  }

/*サービス*/
#top-service-area .line-wrap {
  width: 100%;
  height: 137px;
  overflow: hidden;
  margin-bottom: 5px;
}
#top-service-area .line {
  display: flex;
  width: 2290px;
  height: 137px;
  transform: translateX(-6%);
}
#top-service-area .line>div {
  width: 224px;
  height: 137px;
  margin-right: 5px;
  background-size:cover; 
  background-repeat: no-repeat;
  background-position: center;
}
#top-service-area .line>div:nth-child(1) {background-image: url(/common/top/image/top-line1.jpg);}
#top-service-area .line>div:nth-child(2) {background-image: url(/common/top/image/top-line2.jpg);}
#top-service-area .line>div:nth-child(3) {background-image: url(/common/top/image/top-line3.jpg);}
#top-service-area .line>div:nth-child(4) {background-image: url(/common/top/image/top-line4.jpg);}
#top-service-area .line>div:nth-child(5) {background-image: url(/common/top/image/top-line5.jpg);}
#top-service-area .line>div:nth-child(6) {background-image: url(/common/top/image/top-line6.jpg);}
#top-service-area .line>div:nth-child(7) {background-image: url(/common/top/image/top-line7.jpg);}
#top-service-area .line>div:nth-child(8) {background-image: url(/common/top/image/top-line1.jpg);}
#top-service-area .line>div:nth-child(9) {background-image: url(/common/top/image/top-line2.jpg);}
#top-service-area .line>div:nth-child(10) {background-image: url(/common/top/image/top-line3.jpg);}

#top-service-area .three-box {
  display: flex;
  justify-content: center;
  max-width: 1366px;
  margin: 0 auto 110px;
  text-align: center;
}
.top-mos-net {
  width: calc((100% - 393px)/2);
  max-width: 476px;
  background: #f5f5f5;
  padding: 0 10px 40px;
}
.top-mos-net-headline {
  margin-bottom: 25px;
}
.top-mos-net p {
  font-size: 1.8rem;
  line-height: 1.888em;
  font-weight: bold;
  margin-bottom: 20px;
}
.top-mos-net .stripe {
  display: inline-block;
  position: relative;
  font-size: 1.4rem;
  line-height: 1.42em;
  font-weight: normal;
  color: #00A728;
  margin-bottom: 10px;
}
  #top-service-area .stripe::before {
    content: '';
    position: absolute;
    left: -10px;
    top: 2px;
    width: 1px;
    height: 14px;
    background: #00A728;
    transform: rotate(-17deg);
  }
  #top-service-area .stripe::after {
    content: '';
    position: absolute;
    right: -10px;
    top: 2px;
    width: 1px;
    height: 14px;
    background: #00A728;
    transform: rotate(17deg);
  }
.top-mos-app {
  position: relative;
  width: 393px;
  margin: 0 10px;
  background: url(/common/top/image/mos-bg-borad.jpg) no-repeat;
  padding-bottom: 40px;
}
.top-mos-app::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  mix-blend-mode: color-dodge;
  background: rgba(0,100,54,0.6);
}
.top-mos-app-head {
  background: #D9F2DF;
  position: relative;
  margin-bottom: 40px;
  overflow: hidden;
}
.top-mos-app-head::before,
.top-mos-app-head::after {
  content: '';
  position: absolute;
  right: 80px;
  bottom: -40px;
  width: 50px;
  height: 50px;
  border-radius: 5px;
  background: url(/common/top/image/mos-bg-borad.jpg) no-repeat;
  transform: rotate(45deg);
}
.top-mos-app-head::after {
  mix-blend-mode: color-dodge;
  background: rgba(0,100,54,0.6);
}
.top-mos-app-headline {
  font-size: 2.2rem;
  font-weight: bold;
  color: #006436;
  position: absolute;
  left: 18%;
  top: 12%;
}
.top-mos-app-apple {
  position: absolute;
  left: 52%;
  top: 39%;
  display: block;
  width: 31%;
  max-width: 118px;
}
.top-mos-app-google {
  position: absolute;
  left: 52%;
  top: 64%;
  display: block;
  width: 38.2%;
  max-width: 146px;
}
.top-mos-app ul {
  display: flex;
  padding: 0 20px;
  justify-content: space-between;
  margin-bottom: 25px;
}
.top-mos-app ul li {
  font-size: 1.3rem;
  line-height: 1.38em;
  color: #fff;
}
.top-mos-app ul li img {
  margin-bottom: 10px;
}
.top-mos-app ul li span {
  color: #00A724;
  font-weight: bold;
}

.top-mos-web {
  width: calc((100% - 393px)/2);
  max-width: 477px;
  background: #f5f5f5;
  padding: 40px 10px;
}
.top-mos-web .stripe {
  display: inline-block;
  position: relative;
  font-size: 1.4rem;
  line-height: 1.42em;
  color: #00A728;
  margin-bottom: 10px;
}
.top-mos-web-headline {
  font-size: 2.2rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.545em;
  margin-bottom: 40px;
}
.top-mos-web ul {
  display: flex;
  justify-content: center;
  margin-bottom: 35px;
}
.top-mos-web ul li {
  margin: 0 14px;
}
.top-mos-web ul li img {
  margin-bottom: 10px;
}
.top-mos-web ul li p {
  font-size: 1.3rem;
  line-height: 1.39em;
}
.top-mos-web .button-area .button {
  margin-bottom: 30px;
}
.top-mos-web .button-area .button:last-child {margin-bottom: 0;}

@media screen and (max-width:1000px) {
  .top-mos-app {
    width: 300px;
    margin: 0 5px;
  }
  .top-mos-net,
  .top-mos-web {
    width: calc((100% - 300px)/2);
  }
/*media 1000*/
}

.service-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 50px;
}
.service-list li {
  width: 23%;
  max-width: 282px;
  min-height: 200px;
  margin: 0 1%;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  overflow: hidden;
}
.service-list li a {
  display: block;
}
.service-list-image {
  background-repeat: no-repeat;
  background-position: center;
  height: 100px;
  border-bottom: 1px solid #f5f5f5;
  margin-bottom: 10px;
}
.service-list-headline {
  font-weight: bold;
  text-align: center;
}
.service-list li p {
  padding: 10px 15px;
  font-size: 1.3rem;
  line-height: 1.54em;
}
/*モスのおいしさ*/
#top-delicious {
  position: relative;
  background: url(/common/top/image/mos-bg-borad.jpg) no-repeat;
  background-size: cover;
  padding: 70px 10px;
  text-align: center;
}
#top-delicious::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  mix-blend-mode: color-dodge;
  background: rgba(0,100,54,0.6);
}
.top-delicious-headline {
  position: relative;
  font-size: 3rem;
  line-height: 1.3em;
  font-weight: bold;
  color: #fff;
  text-align: center;
  margin-bottom: 45px;
}
#top-delicious ul {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  max-width: 1040px;
  margin: 0 auto;
  padding-bottom: 30px;
}
#top-delicious ul li {
  width: calc(50% - 20px);
  margin: 0 10px 20px;
}
#top-delicious ul li a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 173px;
  color: #fff;
}
#top-delicious ul li:nth-child(1) a {
  background-position: 50% 5%;
}
#top-delicious ul li:nth-child(2) a {
  background-position: 50% 70%;
}
#top-delicious ul li:nth-child(3) a {
  background-position: 50% 40%;
}
#top-delicious ul li:nth-child(4) a {
  background-size: 240%;
  background-position: 100% 40%;
}
#top-delicious ul li a::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.28);
  mix-blend-mode: multiply;
}
#top-delicious ul li a::after {
  content: '';
  position: absolute;
  left: 25px;
  top: 20px;
  width: calc(100% - 50px);
  height: calc(100% - 40px);
  border: 1px solid #fff;
}
#top-delicious ul li a>div::before {
  content: '';
  position: absolute;
  right: 24px;
  bottom: 19px;
  width: 30px;
  height: 30px;
  background: #fff;
  z-index: 2;
}
#top-delicious ul li a>div {
  z-index: 2;
}
#top-delicious ul li a>div::after {
  content: '';
  position: absolute;
  right: 35px;
  bottom: 27px;
  width: 10px;
  height: 10px;
  border-top: 2px solid #00A728;
  border-right: 2px solid #00A728;
  transform: rotate(45deg);
  z-index: 2;
}
.top-delicious-title {
  font-size: 2.0rem;
  line-height: 1.65;
  font-weight:bold;
  margin-bottom: 10px;
  text-shadow: 0 0 6px rgba(0,0,0,1);
}
#top-delicious ul li p {
  text-shadow: 0 0 6px rgba(0,0,0,1);
}

/*バナー*/
.top-banner-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 80px;
}
.top-banner-list li {
  width: calc((100% - 120px)/6);
  max-width: 180px;
  min-height: 200px;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  overflow: hidden;
  margin-right: 24px;
}
.top-banner-list li:nth-child(6n) {
  margin-right: 0;
}
.top-banner-list li a {
  display: block;
}
.top-banner-list li p {
  padding: 15px;
}
.top-banner-list li p.title {
  font-weight: bold;
  text-align: center;
  padding-bottom: 0;
}
.top-banner-list li p.title + p {
  padding-top: 5px;
}
.top-banner-list li .image {
  position: relative;
  padding-top: 56.111%;
}
.top-banner-list li .image img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: cover;
}
/* SNS */
.sns-link {
  border-top: 1px solid #ddd;
  padding: 40px 10px;
  display: flex;
  justify-content: center;
}
  .sns-link li {
    margin: 0 25px;
  }

@media screen and (max-width: 1000px) {
  .top-banner-list {
    max-width: 600px;
    margin: 0 auto 80px;
  }
  .top-banner-list li {
    width: 33%;
    margin-bottom: 24px;
    margin-right: 1%;
  }
/*media 1000*/
}
@media screen and (max-width: 768px) {
  #page-top.show-app-dl main {
    padding-top: 0;
  }
  #page-top.fixed main {
    padding-top: 0;
  }
  .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    margin: 0 8px;
  }
  /*緊急告知エリア*/
  #top-attention-area {
    padding: 20px 0 0;
    margin-bottom: 20px;
  }
  #top-attention-area .wrap>div:nth-child(1),
  #top-attention-area .wrap>div:nth-child(2) {
    width: 100%;
  }
  #top-attention-area .wrap>div:nth-child(1) {
    padding-bottom: 20px;
  }
  .top-alert-list {
    border-top: none;
  }
  .top-alert-list li {
    border-bottom: none;
    border-top : 1px dashed #ddd;
    padding: 15px 0;
  }

  /*お知らせ*/
  #top-news-area {
    margin-bottom: 75px;
  }
  .news-list {
    margin-bottom: 40px;
  }
  .news-list li a {
    padding: 0 0 15px;
  }
  #top-news-area .news-list {
    display: block;
    padding-bottom: 0;
  }
  #top-news-area .news-list li,
  #top-news-area .news-list li:nth-child(3n) {
    width: 100%;
    border-bottom : 1px dashed #ddd;
    margin-right: 0;
  }
  #top-news-area .news-list li:last-child {
    border-bottom : 1px solid #ddd;
  }

  .slider-box {
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  #page-top section {
    margin-bottom: 75px;
  }

  /*メニュースライダー*/
  .menu-slider .swiper-container {
    padding: 0 20px;
  }
  .menu-slider .menu-slider-list {
    padding: 10px 0 40px;
  }
  .menu-slider .menu-slider-list li {
    width: 190px !important;
    margin-right: 15px;
  }
  .menu-slider .menu-slider-list li:last-child {margin-right: 0;}

  .menu-slider .menu-slider-list li .image {
    padding: 10px;
    margin-bottom: 10px;
  }
  .menu-slider .menu-slider-list li .image::after {
    width: 170px;
  }
  .menu-slider .menu-slider-list li p {
    padding: 0 12px;
  }
  .menu-slider .menu-slider-list li .menu-icon {
    line-height: 23px;
    font-size: 1.2rem;
  }
  .menu-slider .menu-slider-list li .image .icon img {
    width: 18px;
    height: 18px;
    margin-right: 10px;
  }
  .menu-slider .swiper-button-next, .menu-slider .swiper-button-prev,
  .menu-slider .swiper-pagination {
    display: none;
  }

  /*キャンペーン*/
  .campaign-list {
    display: block;
    margin-bottom: 40px;
  }
  .campaign-list li {
    width: 100%;
    max-width: 100%;
    margin-bottom: 15px;
  }
  .campaign-list li:last-child {
    margin-bottom: 0;
  }

  /*トピックススライダー*/
  .topics-slider .swiper-container {
    margin: 0 auto;
    padding: 0 20px;
  }
  .topics-slider-list {
    padding: 10px 0 10px;
  }
  .topics-slider.noactive .topics-slider-list {
    justify-content: start;
  }
  .topics-slider-list li {
    width: 275px !important;
    margin-right: 15px;
  }
  .topics-slider.noactive .topics-slider-list li:first-child {
    margin-left: 0;
  }
  .topics-slider-list li:last-child {
    margin-right: 0;
  }
  .topics-slider .swiper-button-next,
  .topics-slider .swiper-button-prev,
  .topics-slider .swiper-pagination {
    display: none;
  }

  /*サービス*/
  #top-service-area .line-wrap {
    height: 98px;
    margin-bottom: 4px;
  }
  #top-service-area .line {
    width: 1620px;
    height: 98px;
    transform: translateX(-5%);
  }
  #top-service-area .line>div {
    width: 158px;
    height: 98px;
    margin-right: 4px;
  }

  #top-service-area .three-box {
    display: block;
    margin: 0 auto 75px;
  }
  .top-mos-net {
    width: 100%;
    max-width: 100%;
    padding: 0 20px 50px;
    margin: 0 auto 10px;
  }
  .top-mos-net p {
    font-size: 2rem;
    line-height: 1.7em;
  }
  .top-mos-app {
    width: 100%;
    max-width: 100%;
    margin: 0  auto 10px;
  }
  .top-mos-app-head {
    margin-bottom: 30px;
  }
  .top-mos-app-head img {width: 100%;}
  .top-mos-app-apple {
    max-width: 100%;
  }
  .top-mos-app-google {
    max-width: 100%;
  }
  .top-mos-app ul {
    max-width: 393px;
    margin: 0 auto 30px;
  }
  .top-mos-app ul li {
    width: 30.2%;
    letter-spacing: -1px;
  }
  .top-mos-web {
    width:100%;
    max-width: 100%;
    padding: 20px 0 40px;
  }
  .top-mos-web-headline {
    font-size: 2.4rem;
    line-height: 1.75em;
    margin-bottom: 15px;
  }
  .top-mos-web ul {
    display: flex;
    padding: 0 13px;
  }
  .top-mos-web ul li {
    margin: 0 7px;
  }
  .top-mos-web .button-area {
    padding: 0 20px;
  }

  .service-list {
    width: calc(100% + 14px);
    margin-left: -7px;
    flex-wrap: wrap;
    margin-bottom: 35px;
  }
  .service-list li {
    width: calc(50% - 14px);
    margin: 0 7px 14px;
  }

  /*モスのおいしさ*/
  #top-delicious {
    padding: 40px 0 60px;
    text-align: center;
    margin-bottom: 40px !important;
  }
  .top-delicious-headline {
    font-size: 2.4rem;
    line-height: 1.3em;
    margin-bottom: 35px;
  }
  #top-delicious ul {
    display: block;
    margin: 0 auto;
    padding-bottom: 35px;
  }
  #top-delicious ul li {
    width: 100%;
    margin: 0;
  }
  #top-delicious ul li a {
    height: 135px;
  }
  #top-delicious ul li a::after {
    content: '';
    position: absolute;
    left: 20px;
    top: 10px;
    width: calc(100% - 40px);
    height: calc(100% - 30px);
    border: 1px solid #fff;
  }
  #top-delicious ul li a>div::before {
    right: 19px;
    bottom: 19px;
    width: 23px;
    height: 23px;
  }
  #top-delicious ul li a>div::after {
    right: 28px;
    bottom: 26px;
    width: 7px;
    height: 7px;
    border-top: 1px solid #00A728;
    border-right: 1px solid #00A728;
  }
  .top-delicious-title {
    font-size: 1.8rem;
    line-height: 1.45;
    margin-bottom: 5px;
  }
  /*バナー*/
  .top-banner-list {
    margin-bottom: 0;
    padding-bottom: 25px;
    justify-content: space-between;
  }
  .top-banner-list li,
  .top-banner-list li:nth-child(6n) {
    width: calc((100% - 15px)/2);
    margin-bottom: 15px;
    margin-right: 0px;
  }
  .top-banner-list li p {
    padding: 15px;
    font-size: 1.3rem;
    line-height: 1.54;
  }
  .top-banner-list li p.title {
    font-size: 1.4rem;
  }
  /* SNS */
  .sns-link li {
    margin: 0 15px;
  }
  .sns-link img {
    height: 22px;
  }
/*media 768*/
}
@media screen and (max-width: 620px) {
  .top-banner-list {
    max-width: 400px;
  }
/*media 620*/
}

/*====================================
/* 02.メニュー系
====================================*/
.menu-nav {
  background: #FFFBF0;
  border-bottom: 1px solid #DDDDDD;
}
.menu-nav ul {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}
/*1段目 dashed*/
.menu-nav ul::before { 
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 0;
  top: 44px;
  left: 0;
  border-bottom: 1px dashed #dddddd;
}
/*2段目 dashed*/
.menu-nav ul::after {
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 0;
  top: 87px;
  left: 0;
  border-bottom: 1px dashed #dddddd;
}
.menu-nav ul>li>a {
  position: relative;
  display: block;
  height: 43px;
  padding: 17px 25px 15px;
  line-height: 1em;
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
  white-space: nowrap;
}
.menu-nav ul>li>a.active {
  color: #00A728;
}
.menu-nav ul>li>a.active::before {
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 4px;
  bottom:-1px;
  left:0;
  background: #00A728;
}
.menu-nav ul>li>a::after {
  content:'';
  position: absolute;
  display: block;
  width: 1px;
  height: 23px;
  top: 11px;
  right: 0;
  background: #dddddd;
}

/*メニュートップ*/
#menu-top-visual {
  margin-top: 20px;
  margin-bottom: 70px;
  min-height: 227px;
}
#menu-top-visual .swiper-pagination {
  width: 100%;
  margin-top: 15px;
}
#menu-top-visual img {
  width: 100%;
}
#menu-top-visual .swiper-slide {
  opacity: 0.5;
  width: 670px;
  height: 258px;
  min-width: 670px;
}
#menu-top-visual .swiper-slide img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
#menu-top-visual.noactive .swiper-slide {
  opacity: 1;
  margin: 0 auto;
  text-align: center;
}
#menu-top-visual.noactive .top-visual-prev,
#menu-top-visual.noactive .top-visual-next {
  display: none;
}
#menu-top-visual .swiper-slide-active {
  opacity: 1;
}
.menu-button-copy {
  max-width: 481px;
  text-align: center;
  margin: 0 auto 75px;
  padding: 0 20px;
}
.menu-button-copy .copy {
  position: relative;
  display: inline-block;
  font-size: 1.5rem;
  font-weight: bold;
  color: #00A728;
  margin-bottom: 18px;
}
.menu-button-copy .copy::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 264px;
  height: 1px;
  background: #00A728;
  transform: translate(-50%,-50%);
}
.menu-button-copy .copy i {
  position: relative;
  background: #fff;
  padding: 0 1em;
}
.menu-button-copy .button {
  max-width: 441px;
}
.menu-recommend {
  padding-bottom: 85px;
}

/*メニューリスト*/
.menu-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0 10px;
}
.menu-list li {
  position: relative;
  width: 23.5% ;
  min-height: 246px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
  margin-bottom: 24px;
  background: #fff;
}
.menu-list li:nth-child(4n) {
  margin-right: 0;
}
.menu-list li a {
  display: block;
  min-height: 246px;
  height: 100%;
  padding-bottom: 5px;
}
/*一覧画像サイズ：160x148*/
.menu-list li .image {
  position: relative;
  padding: 25px;
  text-align: center;
  margin-bottom: 15px;
}
.menu-list li .image img {
  width: 160px;
}
.menu-list li .image::after {
  content: '';
  left: 10px;
  bottom: 0;
  position: absolute;
  width: calc( 100% - 20px );
  height: 1px;
  background: #f5f5f5;
}
.menu-list li .image .icon {
  position: absolute;
  left: 10px;
  bottom: 7px;
  display: flex;
}
.menu-list li .image .icon img {
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
.menu-list li p {
  margin-bottom: 0.5em;
  padding: 0 17px;
}
.menu-list li .descrip {
  font-size: 1.2rem;
  margin-bottom: 0.5em;
  padding: 0 17px;
}
.menu-list li .descrip p {
  padding: 0;
  margin-bottom: 0;
}
.menu-list li .menu-title {
  font-weight: bold;
}
.menu-list li .menu-price {
  display: flex;
  flex-wrap: wrap;
}
.menu-list li .menu-price span {
  padding-right: 1em;
}
.menu-list li .menu-text {
  color: #666666;
  font-size: 1.3rem;
  line-height: 1.538em;
}
.menu-list li .menu-icon {
  position: absolute;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.3rem;
  color: #fff;
  line-height: 28px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
}

/*メニューリスト 5列*/
.menu-five-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0 10px;
}
.menu-five-list li {
  position: relative;
  width: 18.3% ;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2.12%;
  margin-bottom: 24px;
  background: #fff;
}
.menu-five-list li:nth-child(5n) {
  margin-right: 0;
}
.menu-five-list li a {
  display: block;
  min-height: 168px;
  height: 100%;
  padding-bottom: 5px;
}
.menu-five-list li .image {
  position: relative;
  padding: 5px 27px;
  text-align: center;
  margin-bottom: 15px;
}
.menu-five-list li .image img {
  max-width: 141px;
  width: 100%;
}
.menu-five-list li .image::after {
  content: '';
  left: 0;
  bottom: 0;
  position: absolute;
  width: 100%;
  height: 1px;
  background: #f5f5f5;
}
.menu-five-list li p {
  margin-bottom: 0.5em;
  padding: 0 17px;
}
.menu-five-list li .menu-title {
  font-weight: normal;
}
.menu-five-list li .menu-text {
  color: #666666;
  font-size: 1.3rem;
  line-height: 1.538em;
}
.menu-five-list li .menu-icon {
  position: absolute;
  top: 0;
  left: 0;
  background: #00a728;
  font-size: 1.3rem;
  color: #fff;
  line-height: 28px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
}

/*もっと見る*/
.menu-more-btn {
  display: block;
  border-radius: 25px;
  text-align: center;
  font-size: 1.6rem;
  height: 48px;
  line-height: 46px;
  font-weight: bold;
  box-shadow: 0 3px 7px rgba(0,0,0,0.06);
  border:1px solid #ddd;
  cursor: pointer;
  transition: .3s all ease;
}
.menu-more-btn:hover {
  opacity: 0.5;
}
.menu-more-btn>.text {
  display: inline-block;
  padding-right: 30px;
  padding-top: 1px;
  background-image: url(../../common/svg/button-plus.svg);
  background-position: 100% 50%;
  background-repeat: no-repeat;
}

/*メニュートップ メイン*/
.menu-main .headline-m {
  text-align:left;
  margin-bottom: 32px;
}
.menu-block {
  display: flex;
  justify-content: space-between;
  margin-bottom: 25px;
}
.menu-block-left,
.menu-block-right {
  background: #FFFBF0;
  padding: 45px 40px 40px;
}
.menu-block-left {
  width: 26.91%;
}
.menu-block-right {
  width: 71.08%;
}
.menu-main-list {
  display: flex;
  flex-wrap:wrap;
}
.menu-main-list>li {
  width: 31.3%;
  margin-right: 3.05%;
  margin-bottom: 25px;
}
.menu-main-list>li:nth-child(3n) {
  margin-right: 0;
}
.menu-block-left .menu-main-list>li {
  width: 100%;
  margin-right: 0;
}
.menu-main-box {
  position: relative;
  display: block;
  height: 100%;
  min-height: 174px;
  box-shadow: 0 0 10px rgb(0 0 0 / 9%);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.menu-main-box .image {
    position: relative;
    padding: 0px 10px;
    text-align: center;
    margin-bottom: 12px;
}
.menu-main-box .image::after {
  content: '';
  left: 0;
  bottom: 0;
  position: absolute;
  width:100%;
  height: 1px;
  background: #f5f5f5;
}
.menu-main-box p {
  margin: 0 0 10px 0;
  padding: 0 5px 0 14px;
  font-size: 1.3rem;
  line-height: 1.38em;
}
.menu-main-box .image img {
  max-width: 184px;
  width: 100%;
}
.menu-main-box .image.small img {
  max-width: 147px;
}
.menu-other-block {
  background: #FFFBF0;
  padding: 45px 40px;
  margin-bottom: 50px;
}
.menu-other-list {
  display: flex;
  flex-wrap:wrap;
}
.menu-other-list>li {
  margin-right: 0;
  width: 22% ;
  margin-right: 2.143%;
}
.menu-other-list>li:nth-child(4n) {
  margin-right: 0;
}
.menu-top-button {
  margin-bottom: 70px;
}
.menu-top-button > div {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}
.menu-top-button .button {
  margin:0 14px;
}
.menu-top-detail {
  display: flex;
  justify-content: space-between;
  margin-bottom: 45px;
}
.menu-top-detail>li {
  width: 48.83%;
}
.menu-top-detail>li>a {
  display: flex;
  align-items: center;
  min-height: 120px;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 10px rgb(0 0 0 / 9%);
}
.menu-top-detail>li>a .image {
  width:204px;
}
.menu-top-detail>li>a .text {
  width:calc(100% - 204px);
  padding:0px 21px 0;
}
.menu-top-detail>li>a .title {
  font-size: 1.4rem;
  line-height: 2.14em;
  margin-bottom: 5px;
  font-weight: bold;
  color:#00A728;
}
.menu-top-detail>li>a .message {
  font-size: 1.3rem;
  line-height: 1.538em;
}
.menu-top-note {
  padding-bottom: 70px;
}
.menu-note-link {
  position: relative;
  margin-bottom: 30px;
}
.menu-note-link>li {
  position: relative;
  padding-left: 18px;
  margin-bottom: 17px;
}
.menu-note-link>li::after {
  content: '';
  position: absolute;
  display: block;
  width: 7px;
  height: 11px;
  top: 4px;
  left: 2px;
  background: url(../../common/svg/list-mark.svg);
  background-size: 7px auto;
}
.menu-note-link>li>a {
  line-height: 1.57em;
}
.menu-note-list.bottom {
  display: none;
}
.menu-note-list.bottom.active {
  display: block;
}
.menu-note-list>li {
  position: relative;
  font-size: 1.3rem;
  line-height: 1.54em;
  padding-left: 19px;
  margin-bottom: 10px;
  color: #888888;
}
.menu-note-list>li.red {
  color: #E90000;
}
.menu-note-list>li::after {
  content: '※';
  position: absolute;
  left:0;
  top:0;
  width: 1em;
  height: 1em;
}
.menu-note-list>li.red::after {
  color: #E90000;
}
.menu-note-list.type2 li {
  padding-left: 1em;
  text-indent: -1em;
}
.menu-note-list.type2>li::after {
  display: none;
}
.menu-note-list.type2 li a {
  text-decoration: underline;
}
.menu-note-tax {
  margin-bottom: 80px;
}
.menu-note-tax .frame-red {
  padding: 35px 25px;
  background: #FFEBEB;
}
.menu-note-tax .frame-red .indentList {
  position: relative;
  padding-left: 1em;
  line-height: 1.714;
  text-indent: -1em;
  color: #E90000;
}

@media screen and (max-width: 1200px) {
  .menu-nav ul>li>a {
    font-size: 1.1rem;
  }
  /*メニューリスト*/
  .menu-list {
    padding: 0 10px 10px;
  }
  .menu-more-btn {
    width:calc(100% - 20px);
    margin-left:10px;
  }
  .menu-top-detail {
    padding: 0 20px;
  }
  .menu-top-note {
    padding:  0 20px 60px;
  }
/*@media 1200*/
}
@media screen and (max-width: 1150px) {
  .menu-nav ul>li>a {
    padding: 17px 16px 15px;
  }
  .menu-list li .image::after {
    left: 10px;
    bottom: 0;
    width: calc(100% - 20px);
    transform: translateX(0%);
  }
  .menu-main .headline-m {
    position: relative;
    font-size: 2.2rem;
  }

/*@media 1150*/
}
@media screen and (max-width: 1000px) {
  #menu-top-visual {
    margin-top: 6px;
    margin-bottom: 60px;
  }
   #menu-top-visual .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    margin: 0 8px;
  }
  .menu-nav {
    border-top: 1px solid #DDDDDD;
    border-bottom: none;
    overflow-y:hidden;
  }
  .menu-button-copy {
    text-align: center;
    margin: 0 auto 40px;
  }
  .menu-top-detail {
    display: block;
    padding: 0 20px;
  }
  .menu-top-detail>li {
    width: 100%;
    margin-bottom: 20px;
  }

  .menu-block-left,
  .menu-block-right,
  .menu-other-block {
    padding: 45px 20px 40px;
  }
/*@media 1000*/
}

/*スマホ*/
@media screen and (max-width: 768px) {
  #menu-top-visual {
    min-height: 100px;
  }
  #menu-top-visual .swiper-slide {
    width: 100%;
    height: 37.87vw;
    min-width: 0;
  }
  .menu-recommend {
    padding-bottom: 50px;
  }
  .menu-top-button {
    padding: 0 14px;
  }
  .menu-top-button .button {
     margin:0;
  }
  /*scroll css*/
  .menu-nav {
    overflow-x: scroll;
  }
  .menu-nav::-webkit-scrollbar {
    width: 2px;
    background: none;
  }
 .menu-nav ul {
   overflow:visible;
  }
  .menu-nav ul::before,
  .menu-nav ul::after {
    display: none;
  }
  .menu-nav::-webkit-scrollbar:horizontal {
    height:3px;
  }
  .menu-nav::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(0,0,0,0.1);
  }
  .menu-nav::-webkit-scrollbar:hover {
    opacity: 0;
  }
  .menu-nav ul {
    flex-wrap:nowrap;
  }
  .menu-nav ul>li>a {
    height: 50px;
    padding: 20px 20px;
    font-size: 1.3rem;
  }
  .menu-button-copy .copy {
    font-size: 1.3rem;
    margin-bottom: 10px;
  }
  .menu-button-copy .copy::before {
    width: 217px;
  }
  /*メニューリスト*/
  .menu-list {
      padding: 0 0 25px;
  }
  .menu-list li {
    position: relative;
    width: 48%;
    min-height: 217px;
    margin-right: 4%;
    margin-bottom: 15px;
  }
  .menu-list li:nth-child(4n) {
    margin-right: 4%;
  }
  .menu-list li:nth-child(2n) {
    margin-right: 0%;
  }
  .menu-list li a {
    display: block;
    min-height: 217px;
  }
  .menu-list li .image {
    position: relative;
    padding: 10px 15px 20px;
    text-align: center;
    margin-bottom: 15px;
  }
  .menu-list li .image img {
    height: auto;
  }
  .menu-list li .image .icon img {
    width: 18px;
    height: 18px;
    margin-right: 10px;
  }
  .menu-list li p {
    margin-bottom: 0.5em;
    padding: 0 17px;
  }
  .menu-list li .menu-title {
    font-weight: bold;
  }
  .menu-list li .menu-icon {
    position: absolute;
    top: 0;
    left: 0;
    background: #00A728;
    font-size: 1.3rem;
    color: #fff;
    line-height: 24px;
    padding: 0 0.75em;
    margin-bottom: 0;
    font-weight: bold;
  }

  .menu-more-btn {
    font-size: 1.4rem;
    width: 100%;
    margin-left: 0;
  }
  .menu-more-btn>.text {
    background-image: url(../../common/svg/button-plus.svg);
    background-size: 14px auto;
  }

  /*メニューリスト 5列*/
  .menu-five-list li {
    width: 47.8% ;
    margin-right: 4.4%;
    margin-bottom: 15px;
    background: #fff;
  }
  .menu-five-list li:nth-child(5n) {
    margin-right: 4.4%;
  }
  .menu-five-list li:nth-child(2n) {
    margin-right: 0;
  }
  .menu-five-list li a {
    display: block;
    min-height: 168px;
    height: 100%;
    padding-bottom: 5px;
  }
  .menu-five-list li .image {
    position: relative;
    padding: 5px 27px;
    text-align: center;
    margin-bottom: 15px;
  }
  .menu-five-list li .image img {
    max-width: 141px;
  }

  /*メニュートップ メイン*/
  .menu-main .wrap {
    padding: 0;
  }
  .menu-block {
     display: block;
  }
  .menu-block-left {
      width: 100%;
  }
  .menu-block-right {
      width: 100%;
      background: #ffffff;
  }
  .menu-main .headline-m {
    margin-bottom: 25px;
    text-align: center;
  }
  .menu-block {
    margin-bottom: 0;
  }
  .menu-block-left,
  .menu-block-right {
      padding: 40px 20px 35px;
  }
  .menu-other-list>li,
  .menu-main-list>li {
    position: relative;
    width: 48%;
    margin-right: 4%;
    margin-bottom: 15px;
  }

  .menu-other-list>li:nth-child(4n) {
    margin-right: 4%;
  }
  .menu-main-list>li:nth-child(3n) {
    margin-right: 4%;
  }
  .menu-other-list>li:nth-child(2n),
  .menu-main-list>li:nth-child(2n) {
    margin-right: 0;
  }
  .menu-block-left .menu-main-list {
    justify-content: center;
  }
  .menu-block-left .menu-main-list>li {
    width: 48%;
    margin-right: 4%;
  }
  .menu-main-box {
    position: relative;
    display: block;
    min-height: 152px;
    height: 100%;
    margin-right: 0%;
  }
  .menu-main-box .image {
      position: relative;
      padding: 0px 10px;
      text-align: center;
      margin-bottom: 12px;
  }
  .menu-main-box .image::after {
    content: '';
    left: 0;
    bottom: 0;
    position: absolute;
    width:100%;
    height: 1px;
    background: #f5f5f5;
  }
  .menu-main-box p {
    margin: 0 0 10px 0;
    padding: 0 14px;
    font-size: 1.3rem;
    line-height: 1.38em;
  }
  .menu-main-box .image img {
    max-width: 141px;
    width: 100%;
  }
  .menu-top-button {
    display: block;
    margin-bottom: 70px;
    text-align: center;
  }
  .menu-top-button > div {
  display: block;
  margin-bottom: 0;
  }
  .menu-top-button .button {
    display: block;
    margin: 0 auto 20px;
  }
  .menu-top-detail {
      display: block;
      padding: 0 20px;
      margin-bottom: 30px;
  }
  .menu-top-detail>li>a .image {
    width:100%;
  }
  .menu-top-detail>li>a .image picture {
      width: 100%;
      display: block;
  }
  .menu-top-detail>li>a {
    display: block;
    min-height: 0;
  }
  .menu-top-detail>li>a .title {
    text-align: center;
  }
  .menu-top-detail>li>a .text {
      width: 100%;
      padding: 8px 15px 15px;
  }
  .menu-note-list>li {
    font-size: 1.3rem;
  }
  .menu-note-tax {
    margin-bottom: 60px;
  }
  .menu-note-tax .frame-red {
    padding: 30px 18px;
  }
  /*media 768*/
}
/*スマホ*/
@media screen and (max-width: 425px) {
  .menu-nav::-webkit-scrollbar:horizontal {
    height:1px;
  }
  .menu-top-button .button {
    max-width: 100%;
  }
  /*media 425*/
}

/*アプリナビ*/
.app-nav {
  position: relative;
}
.logind .app-nav {
  background: #D9F2DF;
}
.app-nav::before {
  content:"";
  position: absolute;
  display: block;
  width: 50%;
  height: 100%;
  top:0;
  left:0%;
  background: #007749;
  z-index: 1;
}
.app-nav::after {
  content:"";
  position: absolute;
  display: block;
  width: 50%;
  height: 1px;
  top:0;
  right:0%;
  background: #dddddd;
  z-index: 1;
}
.app-nav-block {
  position: relative;
  z-index: 2;
  display: flex;
  max-width: 1366px;
  margin: 0 auto;
  background: #ffffff;
  text-align: center;
}
.app-nav-order {
  width: calc(50% - 200px);
  background: #007749;
  padding:30px 20px;
}
.app-nav-order p {
  color:#fff;
}
.app-nav-order .app-nav-head .title {
  width: 182px;
}
.app-nav-official {
  width:400px;
  padding:30px 20px;
  background: #D9F2DF;
}
.logind .app-nav-order,
.logind .app-nav-official {
  width: 50%;
}
.app-nav-member {
  width: calc(50% - 200px);
  border-top:1px solid #dddddd;
  padding:30px 20px;
}
.logind .app-nav-member {
  display: none;
}
.app-nav-box {
  display: inline-block;
  max-width: 335px;
  width: 100%;
}
.app-nav-official .app-nav-box {
  max-width: 300px;
}
.app-nav-member .app-nav-box {
  padding-right: 30px;
}
.app-nav-box .button {
  width: 100%;
  display: block;
  max-width: none;
}

.app-nav-head {
  display: flex;
  margin-bottom: 25px;
  align-items: center;
}
.app-nav-head .image {
  width: 65px;
}
.app-nav-head .image img {
  width: 100%;
}
.app-nav-head .title {
  font-size: 1.8rem;
  line-height: 1.22em;
  margin-bottom: 5px;
  text-align: left;
  font-weight: bold;
  white-space: nowrap;
}
.app-nav-head .text {
  padding-left: 15px;
  width: calc(100% - 65px);
}
.app-nav-head .message {
    font-size: 1.3rem;
    line-height: 1.83em;
    text-align: left;
}
.app-nav-list {
  display: flex;
}
.app-nav-list>li {
  margin-right: 15px;
}
.app-nav-list>li:nth-child(1) {
  width: 104px;
}
.app-nav-list>li:nth-child(2) {
  width: 126px;
}

@media screen and (max-width: 1000px) {
  .app-nav-block {
    display: block;
  }
  .app-nav-block::after {
    display: none;
  }
  .app-nav-order {
    width: 100%;
    padding:30px 20px;
  }
  .app-nav-order .app-nav-head .title {
    width: 182px;
  }
  .app-nav-official {
    width: 100%;
    padding:30px 20px;
  }
  .webapp .app-nav-official {
    display: none;
  }
  .logind .app-nav-order,
  .logind .app-nav-official {
    width: 100%;
  }
  .app-nav-member {
    width: 100%;
    border-top:1px solid #DDDDDD;
    padding:30px 20px;
  }
  .app-nav-head .message {
    font-size: 1.4rem;
    padding-right: 1em;
  }
  .app-nav-member .app-nav-box {
      padding-right: 0;
  }
  .app-nav-official .app-nav-box {
    max-width: 335px;
  }
  .app-nav-list>li img {
    width: 100%;
  }
  .app-nav-list>li:nth-child(1) {
    width: 143px;
  }
  .app-nav-list>li:nth-child(2) {
    width: 176px;
    margin-right: 0;
  }
}

/*カテゴリートップ*/
.menu-category {
  padding-top: 55px;
}
.menu-category-head.noactive {
  min-height: 800px;
}
.menu-category-head + section {
  margin-top: 55px;
}
.menu-upper-area {
}
.menu-upper-area>* {
  display: none;
}
.menu-upper-area>*.active {
  display: block;
}
.menu-upper-area>*.active>:last-child {
  margin-bottom: 60px;
}
.category-note .noteText li,
.category-note .indentList li,
.menu-detail-notearea .noteText li,
.menu-upper-area .noteText li,
.menu-detail-notearea .indentList li,
.menu-upper-area .indentList li {
  padding-left: 1em;
  text-indent: -1em;
}
@media screen and (max-width: 768px) {
  .menu-upper-area>*.active>:last-child {
    margin-bottom: 40px;
  }
}
.menu-category>section {
  padding: 55px 0;
}
.menu-category>section:last-of-type {
  border-bottom: 1px solid #dddddd;
}
.menu-category>section:nth-child(even) {
  background: #FFFBF0;
  border: none;
}
.menu-category-note {
  padding-top: 30px;
}
.menu-note-title {
  font-size: 1.4rem;
  margin-bottom: 25px;
}

/*メニューボトム*/
.menu-bottom-nav {
  padding-top: 60px;
  padding-bottom: 55px;
  background: #f5f5f5;
}
.menu-bottom-nav ul {
  display: flex;
  flex-wrap: wrap;
}
.menu-bottom-nav ul>li {
  width:23.5%;
  margin-right: 2%;
  border-radius: 10px;
  box-shadow: 0 0 10px rgb(0 0 0 / 9%);
  overflow: hidden;
  margin-bottom: 22px;
  background: #fff;
}
.menu-bottom-nav ul>li>a {
  display: flex;
  height: 100%;
  align-items: center;
}
.menu-bottom-nav ul>li>a .image {
  width: 85px;
  text-align: center;
  padding: 9px 6px;
  min-height: 70px;
  border-right:1px solid #f5f5f5;
}
.menu-bottom-nav ul>li>a .image.small {
  padding: 0 6px
}
.menu-bottom-nav ul>li>a p {
  width: calc(100% - 85px);
  padding: 0 18px;
  font-size: 1.3rem;
  line-height: 1.53em;
}
.menu-bottom-nav ul>li:nth-child(4n) {
  margin-right: 0;
}

@media screen and (max-width:1150px) {
  .menu-bottom-nav ul>li {
    width: 32%;
    margin-right: 2%;
  }
  .menu-bottom-nav ul>li:nth-child(4n) {
    margin-right: 2%;
  }
  .menu-bottom-nav ul>li:nth-child(3n) {
    margin-right: 0;
  }

  /*media 1150*/
}

@media screen and (max-width:768px) {
  .menu-category {
      padding-top: 35px;
  }
  .menu-category-head + section {
    margin-top: 15px;
  }
  .menu-category>section {
    padding: 45px 0 15px;
  }
  .menu-category>section:nth-child(even) {
    padding: 35px 0 10px;
  }
  .menu-category>section .headline-m {
    font-size: 1.8rem;
    margin-bottom: 30px;
  }
  .menu-note-title {
      font-size: 1.4rem;
      margin-bottom: 20px;
  }
  .menu-bottom-nav {
    padding-top: 45px;
    padding-bottom: 45px;
  }
  .menu-bottom-nav ul>li {
    width: 31.26%;
    margin-right: 3.1%;
    margin-bottom: 10px;
  }
  .menu-bottom-nav ul>li:nth-child(4n) {
    margin-right: 3.1%;
  }
  .menu-bottom-nav ul>li:nth-child(3n) {
    margin-right: 0;
  }
  .menu-bottom-nav ul>li>a {
    display: block;
    padding: 10px;
  }
  .menu-bottom-nav ul>li>a .image {
    width: 100%;
    padding: 0;
    border-right: 0;
    border-bottom: 1px solid #f5f5f5;
  }
  .menu-bottom-nav ul>li>a .image.small {
    padding: 0 2vw;
  }
  .menu-bottom-nav ul>li>a p {
    width: 100% ;
    padding: 13px 0 0 0;
    font-size: 1.3rem;
  }
/*media 768*/
}

/*メニュー詳細*/
.menu-detail-main {
  padding-top: 35px;
}
.menu-detail-notearea{
  padding: 0 20px 30px;
}
.menu-detail-block {
  display: flex;
  padding-bottom: 40px;
  border-bottom: 1px solid #ddd;
}
/*詳細画像：390px * 316px*/
.menu-detail-visual {
  width: 50%;
  padding-top: 33px;
  text-align: center;
}
.menu-detail-visual .visual-wrap {
  position: relative;
  padding: 0 35px;
  max-width: 460px;
  margin: 0 auto;
}
/*詳細画像：390px * 316px*/
.menu-detail-visual .visual-wrap>img {
  width: 390px;
}
.meta-icon {
  position: absolute;
  display: flex;
  flex-direction: column;
  left:0px;
  bottom:0px;
}
.meta-icon>li {
  width: 34px;
  margin-top: 10px;
}
.menu-detail-text {
  width: 50%;
  padding-left: 15px;
}
.menu-detail-inner {
  max-width: 485px;
}
.menu-detail-inner .title {
  font-size:  2.4rem;
  margin-bottom: 10px;
}
.menu-detail-inner .price-area {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 30px;
}
.special .menu-detail-inner .price-area {
  padding-bottom: 27px;
}
.menu-detail-inner .price {
  display: flex;
  margin-right: 22px;
  align-items: flex-end;
  margin-bottom: 10px;
}
.menu-detail-inner .price:nth-child(3) {
  margin-right: 0;
}
.menu-detail-inner .price .yen {
  font-size: 1.8rem;
  font-weight:  bold;
  line-height: 1em;
  padding-right: 15px;
}
.menu-detail-inner .price .kcal {
  font-size:  1.4rem;
  line-height: 1.25em;
  color: #666666;
  margin-top: -2px;
}
.menu-detail-inner .message {
  margin-bottom: 45px;
  font-size: 1.4rem;
  line-height: 1.57;
}
.special .menu-detail-inner .message {
  border-top: 1px dashed #ddd;
  font-size: 1.8rem;
  font-weight: bold;
  color: #6A430A;
  padding-top: 27px;
  margin-bottom: 35px;
}
.menu-detail-inner .button-box {
  margin-bottom: 35px;
}
.menu-detail-inner .button-box .button {
  margin-bottom: 20px;
}
.menu-detail-inner .modal-button {
  display: flex;
  align-items: center;
  margin-bottom: 26px;
  cursor: pointer;
}
.menu-detail-inner .modal-button i {
  margin-right: 10px;
}
.menu-detail-inner .note {
  margin-bottom: 40px;
  font-size: 1.2rem;
  line-height: 1.54em;
/*  padding-left: 1em;*/
  text-indent: -1em;
  color: #888888;
}
.menu-detail-inner .note>li {
  position: relative;
  font-size: 1.2rem;
  line-height: 1.54em;
  padding-left: 19px;
  margin-bottom: 10px;
  color: #888888;
}
.menu-detail-inner .note>li a {
  text-decoration: underline;
}
.menu-detail-inner .menu-link {
  position: relative;
  display: flex;
  background: #f5f5f5;
  padding: 15px;
}
.menu-detail-inner .menu-link::after {
   content:'';
   position: absolute;
   top:50%;
   right:20px;
   width: 12px;
   height: 12px;
   border-right:2px solid #00a728;
   border-bottom:2px solid #00a728;
   transform: translate(0,-50%) rotate(-45deg);
}
.menu-detail-inner .menu-link-image {
  width: 110px;
  background: #fff;
}
.menu-detail-inner .menu-link-text {
  width: calc(100% - 110px);
  padding-left: 23px;
}
.menu-detail-inner .menu-link-text .link-message {
  margin-bottom: 5px;
}
.menu-detail-inner .menu-link-text .link-message i {
  display: inline-block;
  text-emphasis: filled;
  -webkit-text-emphasis: filled;
}
.menu-detail-inner .menu-link-text .link-message em {
    color: #00a728;
}
.menu-detail-inner .menu-link-text .link-title {
  font-weight:  bold;
  font-size:  1.6rem;
  margin-bottom: 5px;
}
.menu-detail-inner .menu-link-text .link-price {
  font-size:  1.8rem;
}
.menu-detail-inner .menu-detail-sns {
  margin-bottom: 40px;
}
.menu-detail-set {
  padding: 95px 0 100px;
}
.category-set-list .menu-detail-set {
  padding: 40px 0 0;
}
.menu-detail-set .list {
  position: relative;
  display: flex;
  flex-wrap:wrap;
  border-top:1px solid #ddd;
  margin-bottom: 30px;
}
.menu-detail-set .list::after {
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 1px;
  bottom:0;
  left:0;
  background: #ddd;
}
.menu-detail-set .list>li {
  width: 50%;
  min-height: 131px;
  display: flex;
  align-items: center;
  border-right:1px dashed #ddd;
  border-bottom:1px dashed #ddd;
}
.menu-detail-set .list>li:nth-child(2n) {
  border-right:0;
}
.menu-detail-set .list>li .plus {
  position: absolute;
  width: 30px;
  left:0px;
  top:50%;
  margin-top: -15px;
}
.menu-detail-set .list>li>.box {
  position: relative;
  display:flex;
  align-items: center;
  max-width: 450px;
  width: 100%;
  height: 100%;
  margin:0 auto;
  padding-left: 50px;
}
.menu-detail-set .list>li .text {
  width: calc(100% - 105px);
  padding: 15px 10px 10px 0;
}
.menu-detail-set .list>li .image {
  width: 105px;
}
.menu-detail-set .list>li .image img {
  width: 100%;
}
.menu-detail-set .list>li .title {
  font-size: 1.4rem;
  font-weight: bold;
  margin-bottom: 5px;
}
.menu-detail-set .list>li .message {
  font-size: 1.3rem;
  margin: 5px 0 5px;
  color: #888888;
}
.menu-detail-drink {
  padding: 0 0 30px;
}
.menu-detail-drink:first-child{
  padding-top: 90px;
}
.menu-detail-drink.asamos {
  padding-top: 85px;
}
.menu-detail-set .menu-detail-add {
  max-width: 670px;
  margin: 0 auto;
  border:1px solid #ddd;
}
.menu-detail-set .menu-detail-add .add-head {
  background: #fffbf0;
  padding:10px 40px;
}
.menu-detail-set .menu-detail-add .add-head span{
  color:#fff;
  background-color:#00a728;
  padding: 0 10px;
  margin-right:10px;
  font-weight:normal;
}
.menu-detail-set .menu-detail-add .add-block {
  display: flex;
  align-items: center;
}
.menu-detail-set .menu-detail-add .add-box {
  display: flex;
  width: 350px;
  justify-content: center;
  align-items: center;
  padding: 25px 30px 25px 40px;
}
.menu-detail-set .menu-detail-add .add-note {
  width: calc(100% - 315px);
}
.menu-detail-set .menu-detail-add .add-box-text {
  width: calc(100% - 90px);
}
.menu-detail-set .menu-detail-add .message {
  font-size: 1.3rem;
  margin: 5px 0 5px;
  color: #888888;
}
.menu-detail-set .menu-detail-add .add-box-image {
  width: 90px;
}
.menu-detail-set .menu-detail-add .add-box-title {
  font-weight: bold;
}
.menu-detail-set .menu-detail-add .add-box-price {
  display: flex;
  align-items: baseline;
}
.menu-detail-set .menu-detail-add .add-box-price .normal p {
  display:inline-block;
  position: relative;
  color: #666666;
  padding: 0 3px;
}
.menu-detail-set .menu-detail-add .add-box-price .normal p::after {
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 1px;
  top:50%;
  left:0;
  margin-top: -1px;
  background: #00a728;
}
.menu-detail-set .menu-detail-add .add-box-price .set {
  position: relative;
  color: #00a728;
  font-size: 1.9rem;
  padding-left: 28px;
  background-image: url(../svg/arrow-gray.svg);
  background-repeat: no-repeat;
  background-position: 13px 55%;
  background-size: 6px auto;
  font-weight: bold;
}
.menu-detail-set .menu-detail-add .add-box-price .set2 {
  position: relative;
  color: #00a728;
  font-size: 1.9rem;
  padding-left: 28px;
  background-repeat: no-repeat;
  background-position: 13px 55%;
  background-size: 6px auto;
  font-weight: bold;
}
.menu-detail-set .menu-detail-add .add-note ul>li {
  position: relative;
  font-size: 1.3rem;
  line-height: 1.54em;
  padding-left: 19px;
  margin-bottom: 10px;
  color: #888888;
}
.menu-detail-set .menu-detail-add .add-note ul>li::after {
  content: '※';
  position: absolute;
  left:0;
  top:0;
  width: 1em;
  height: 1em;
}

/*セットドリンク*/
.menu-detail-drink {
  padding: 0 0 6px;
}
.menu-detail-drink .tab-head {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 30px;
}
.menu-detail-drink .tab-head>li {
  width: 16.4%;
  margin-right: 0.32%;
  margin-bottom: 5px;
}
.menu-detail-drink .tab-head>li>a {
  display: block;
  padding: 13px 10px;
  text-align: center;
  background: #f5f5f5;
  width: 100%;
  font-weight: bold;
  color: #666;
}
.menu-detail-drink .tab-head>li.active >a {
  background: #00a728;
  color:#fff;
}
.menu-detail-drink .tab-head>li:nth-child(6n) {
  margin-right: 0;
}

.menu-detail-drink .tab-body {

}
.menu-detail-drink .tab-group {
  display: none;
}
.menu-detail-drink #tab-group1 {
  display: block;
}
.menu-detail-drink #tab-group2_morningset {
  display: block;
}
.menu-detail-drink .drink-size {
  display: flex;
  align-items: center;
  margin: 0 0 35px;
}
.menu-detail-drink .drink-size-title {
  position: relative;
  font-size: 1.8rem;
  line-height: 1.22em;
  font-weight: bold;
  padding-right: 18px;
  margin-right: 18px;
}
.menu-detail-drink .drink-size-title::after {
  content:'';
  position: absolute;
  display: block;
  width: 1px;
  height: 20px;
  top:0;
  right:0;
  background: #dddddd;
}
.menu-detail-drink .drink-size-title.noborder::after {
  display: none;
}
.menu-detail-drink .drink-size-message {
  position: relative;
  color: #888888;
  font-size: 1.3rem;
}
.menu-detail-drink .drink-size-message strong {
  font-weight: bold;
}
.menu-detail-drink .drink-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0 10px;
}
.menu-detail-drink .drink-list li {
  position: relative;
  width: 15% ;
  min-height: 152px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
  margin-bottom: 24px;
  background: #fff;
}
.menu-detail-drink .drink-list li:nth-child(6n) {
  margin-right: 0;
}
.menu-detail-drink .drink-list li a {
  display: block;
  padding-bottom: 5px;
}
.menu-detail-drink .drink-list li .image {
  position: relative;
  padding: 18px 18px 30px;
  text-align: center;
  margin-bottom: 15px;
}
.menu-detail-drink .drink-list li .image::after {
  content: '';
  left: 0;
  bottom: 0;
  position: absolute;
  width:100%;
  height: 1px;
  background: #f5f5f5;
}
.menu-detail-drink .drink-list li .image img {
  width: 84px;
}
.menu-detail-drink .drink-list li .image .icon {
  position: absolute;
  left: 10px;
  bottom: 7px;
  display: flex;
}
.menu-detail-drink .drink-list li .image .icon img {
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
.menu-detail-drink .drink-list li p {
  margin-bottom: 0.5em;
  padding: 0 10px 0 15px;
}
.menu-detail-drink .drink-list li .menu-title {
  font-size: 1.3rem;
}
.menu-detail-drink .drink-list li .menu-text {
  color: #666666;
  font-size: 1.3rem;
  line-height: 1.538em;
}
.menu-detail-drink .drink-list li .menu-icon {
  position: absolute;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.2rem;
  color: #fff;
  line-height: 20px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
}
.menu-detail-message {
  text-align: center;
  margin-top: -10px;
  margin-bottom: 40px;
}
.menu-detail-box {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 75px;
}
.menu-detail-campaign {
  width: 100%;
  order: 2;
  text-align: center;
}
.menu-banner-list{
  display: none;
}
.menu-banner-list.active{
  width: 500px;
  padding-right: 50px;
  display: block;
}
.menu-banner-list li{
  margin-bottom: 30px;
}
.menu-detail-note {
  order: 1;
  width: 100%;
}
.menu-detail-campaign .campaign-ttl {
  font-size: 1.8rem;
  line-height: 1.22em;
  margin-bottom: 30px;
}
.menu-detail-view {
  opacity: 0;
  transition: .3s all ease;
}
.menu-detail-view.active {
  opacity: 1;
}
.menu-detail-view.nodata {
  padding-top: 75px;
}
.menu-detail-other {
  margin-top: -1px;
  padding: 0 0 60px;
  opacity: 0;
}
.menu-detail-other.active {
  opacity: 1;
}
.menu-detail-main + .menu-detail-other {
  border-top: none;
}
.menu-detail-other .menu-detail-box {
  border-bottom: 1px solid #ddd;
  margin-bottom: 95px;
  padding-bottom: 0;
}
.menu-detail-other .menu-detail-note {
  padding-bottom: 75px;
}
.menu-detail-other .menu-banner-list {
  width: 100%;
  padding: 50px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: center;
  border-top: 1px solid #ddd;
}
.menu-detail-other .menu-banner-list li {
  margin-bottom: 0;
  max-width: 380px;
}
@media screen and (max-width: 768px) {
  .menu-detail-other .menu-detail-box {
    margin-bottom: 70px;
    position: relative;
    border: none;
  }
  .menu-detail-other .menu-detail-box::after {
    content: "";
    position: absolute;
    left: -20px;
    bottom: 0;
    width: calc(100% + 40px);
    height: 1px;
    background: #ddd;
  }
  .menu-detail-other .menu-detail-note {
    padding-bottom: 40px;
  }
  .menu-detail-other .menu-banner-list {
    position: relative;
    padding: 40px 0;
    gap: 15px;
    border: none;
  }
  .menu-detail-other .menu-banner-list::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 0;
    width: calc(100% + 40px);
    height: 1px;
    background: #ddd;
  }
}
.menu-detail-other .menu-detail-banner {
  width: 100%;
  padding: 50px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: flex-start;
  border-top: 1px solid #ddd;
}
.menu-detail-other .menu-detail-banner>a {
  display: block;
  max-width: 380px;
  width: calc((100% - 60px)/3);
}
.menu-detail-other .menu-detail-banner>a:nth-child(1) {
  margin-left: auto;
}
.menu-detail-other .menu-detail-banner>a:nth-child(2) {
  margin-right: auto;
}
.menu-detail-other .menu-detail-banner>a:only-child {
  margin: 0 auto;
  width: 380px;
}
@media screen and (max-width: 768px) {
  .menu-detail-other .menu-detail-banner {
    position: relative;
    padding: 40px 0;
    gap: 15px;
    border: none;
  }
  .menu-detail-other .menu-detail-banner>a {
    margin: 0 auto !important;
    width: 100%;
  }
  .menu-detail-other .menu-detail-banner::after {
    content: "";
    position: absolute;
    left: -20px;
    top: 0;
    width: calc(100% + 40px);
    height: 1px;
    background: #ddd;
  }
}

/*カテゴリ一覧*/
.menu-category-note .menu-detail-box {
  padding-bottom: 50px;
}
.menu-category-note .menu-detail-note {
  padding-bottom: 35px;
}
.menu-category-note .menu-banner-list.active {
  position: relative;
  width: 100%;
  padding: 50px 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 30px;
}
.menu-category-note .menu-banner-list::after {
  content: "";
  display: block;
  position: absolute;
  width: 100vw;
  height: 1px;
  top: 0;
  left: 0;
  margin-left: calc(50% - 50vw);
  z-index: -1;
  background: #ddd;
}
.menu-category-note .menu-banner-list li {
  width: calc((100% - 60px)/3);
  margin-bottom: 0;
}
.menu-category-note .menu-banner-list li:nth-child(1){
  margin-left: auto;
}
.menu-category-note .menu-banner-list li:nth-child(2){
  margin-right: auto;
}
.menu-category-note .menu-banner-list li:only-child {
  margin: 0 auto;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .menu-category-note .menu-detail-note {
    padding-bottom: 20px;
  }
  .menu-category-note .menu-banner-list {
    padding: 40px 0 0;
    gap: 15px;
  }
  .menu-category-note .menu-banner-list li {
    width: 100%;
    max-width: 380px;
    margin: 0 auto !important;
  }
}


/*メニュースライダー*/
.menu-slider2 .swiper-container {
  max-width: 1064px;
  margin: 0 auto;
  padding: 0 10px;
}
.menu-slider2 .menu-slider-list {
  padding: 10px 0 90px;
}
.menu-slider2 .menu-slider-list li {
  position: relative;
  max-width: 246px;
  min-height: 217px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
}
.menu-slider2 .menu-slider-list li a {
  display: block;
  min-height: 217px;
}
.menu-slider2 .menu-slider-list li .image {
  position: relative;
  padding: 10px 10px 30px 10px;
  text-align: center;
  margin-bottom: 15px;
}
.menu-slider2 .menu-slider-list li .image img {
  width: 160px;
}
.menu-slider2 .menu-slider-list li .image::after {
  content: '';
  left: 10px;
  bottom: 0;
  position: absolute;
  width: calc(100% - 20px);
  height: 1px;
  transform: 0;
  background: #f5f5f5;
  transform: translateX(0%);
}
.menu-slider2 .menu-slider-list li p {
  margin-bottom: 0.5em;
  padding: 0 17px;
}
.menu-slider2 .menu-slider-list li p.menu-price {
  display: flex;
  flex-wrap: wrap;
}
.menu-slider2 .menu-slider-list li p.menu-price>span {
  margin-right: 1em;
}
.menu-slider2 .menu-slider-list li .menu-title {
  font-weight: bold;
}
.menu-slider2 .menu-slider-list li .menu-icon {
  position: absolute;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.2rem;
  color: #fff;
  line-height: 24px;
  padding: 0 0.75em;
  margin-bottom: 0;
}
.menu-slider2 .menu-slider-list li .image .icon {
  position: absolute;
  left: 10px;
  bottom: 7px;
  display: flex;
}
.menu-slider2 .menu-slider-list li .image .icon img {
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
.menu-slider2 .swiper-button-next,
.menu-slider2 .swiper-button-prev {
  top: 37%;
}
.menu-slider2 .swiper-pagination {
  bottom: 34px;
}

/*分解図モーダル*/
.menu-modal {
  display: none;
  position: fixed;
  background: rgba(0,0,0,0.5);
  left:0;
  top:0;
  width: 100%;
  height: 100%;
  overflow-y:auto;
  -webkit-overflow-scrolling: touch;
  z-index: 1000;
}
.menu-modal-wrap {
  position: absolute;
  width:100%;
  top: 50%;
  left: 0;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  text-align:center;
}
.menu-modal-block {
  max-width: 940px;
  margin: 0 auto;
  padding: 0 20px;
}
.menu-modal-inner {
  position: relative;
  background: #fff;
  padding: 20px 30px 0;
}
.menu-modal-close {
  position: absolute;
  right: 30px;
  top: 18px;
  display: block;
  z-index: 2;
  cursor: pointer;
}

.menu-modal-head {
  position: relative;
  font-size: 1.8rem;
  padding-bottom: 15px;
  border-bottom: 1px solid #ddd;
}
.menu-modal-head {
  position: relative;
  padding-top: 0;
}
.menu-modal-close img {
  width: 19px;
}

/*とびきりハンバーグ*/
.menu-tobikiri-head {
  padding-top: 50px;
}
.menu-tobikiri-top {
  display: flex;
  height: 120px;
  background: #f5f5f5;
}
.menu-tobikiri-top .top-image {
  position: relative;
  display: flex;
  width: 378px ;
  justify-content: space-between;
}
.menu-tobikiri-top .top-image p {
  position: absolute;
  right: 10px;
  top: 50%;
  display: flex;
  align-items: end;
  transform: translateY(-50%);
  color: #fff;
  font-size: 1.6rem;
  font-weight: bold;
}
.menu-tobikiri-top .top-image p strong {
  font-size: 2.2rem;
  letter-spacing: 1px;
}
.menu-tobikiri-top .top-image-box {
  width: 49.6%;
}
.menu-tobikiri-top .top-text {
  position: relative;
  padding: 15px 20px;
  padding-right: 45px;
  width: calc(100% - 378px);
}
.menu-tobikiri-top .top-title {
  display: flex;
  align-items: center;
  margin-bottom: 13px;
}
.menu-tobikiri-top .top-title .icon {
  padding-right: 10px;
}
.menu-tobikiri-top .top-title span {
  font-size: 1.6rem;
}
.menu-tobikiri-top .top-title strong {
  font-size: 2rem;
  font-weight: bold;
}
.menu-tobikiri-top .top-list {
  display: flex;
  flex-wrap:wrap;
  width: 100%;
  margin: 0 auto;
  justify-content: space-between;
}
.menu-tobikiri-top .top-list>li {
  background: #fff;
  padding: 5px;
  width: calc((100% - 30px)/3);
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1px solid #eee;
  white-space: nowrap;
  font-size: 1.6rem;
}
.menu-tobikiri-top .top-list>li em {
  color:#00a728;
  font-weight: bold;
}
.menu-tobikiri-top .top-list>li br {
  display: none;
}
.menu-tobikiri-top .top-more {
  position: absolute;
  right:0;
  bottom:0;
  display: block;
  width: 25px;
  height: 100%;
  background: #00a728;
}
.menu-tobikiri-top .top-more::after {
  content:"";
  position: absolute;
  top:50%;
  right:10px;
  width: 10px;
  height: 10px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform: translate(0,-50%) rotate(-45deg);
}
.menu-tobikiri-top .top-more span {
  position: relative;
  display: none;
}

.menu-tobikiri-bottom {
  padding-top:20px;
}

/*セットメニュー*/
.menu-lower-visual {
  position: relative;
  display: flex;
  flex:wrap;
  justify-content: flex-end;
  background: #F5F5F5;
  margin-top: 2px;
}
.menu-lower-visual .visual-title {
  position: absolute;
  width:100%;
  top: 55%;
  left: 0;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  text-align:center;
}
.menu-lower-visual .visual-title .headline-l {
  display: inline-block;
  margin-bottom: 0;
}
.menu-set-body {
  padding-top: 28px;
}
.menu-set-message {
  margin-bottom: 38px;
}
.menu-set-body .menu-detail-set {
  margin-top: 0;
  padding-top: 0;
}
.menu-set-link {
  border-top: 1px solid #ddd;
  padding-top: 100px;
  margin-bottom: 10px;
}
.menu-set-bottom {
  padding-bottom: 75px;
}
/*セットメニュー_230324*/
.menu-detail-add + .menu-detail-add {
  margin-top: 20px;
}
.menu-detail-add + .headline-catch {
  margin-top: 30px;
}
.list + .menu-detail-message {
  margin-top: 0;
}
.menu-detail-set .list-side>li {
  width: calc(100% / 3);
  border-bottom: none;
}
.menu-detail-set .list-side>li:nth-child(2n) {
  border-right: 1px dashed #ddd;
}
.menu-detail-set .list-side>li:last-child {
  border-right: 0;
}
.list.list-regular {
  border-bottom: 1px dashed #ddd;
}
.list.list-regular:after {
  background: none;
}
.list.list-regular li {
  border-bottom: none;
}
.list.list-side {
  border-top: 1px dashed #ddd;
}
.list.list-other>li {
  border-right: 1px solid #ddd;
  border-bottom: none;
}
.list.list-other>li:nth-child(2n) {
  border-right: 0;
}

/*カフェ*/
.menu-cafe-body {
  padding-top: 30px;
}
.menu-cafe-food {
  margin-top: 90px;
}
.menu-cafe-food .food-list {
  position: relative;
  display: flex;
  flex-wrap:wrap;
  border-top:1px solid #ddd;
  margin-bottom: 30px;
}
.menu-cafe-food .food-list::after {
  content:'';
  position: absolute;
  display: block;
  width: 100%;
  height: 1px;
  bottom:0;
  left:0;
  background: #ddd;
}
.menu-cafe-food .food-list>li {
  width: 50%;
  min-height: 131px;
  display: flex;
}
.menu-cafe-food .food-list>li:nth-child(2n) {
  border-right:0;
}
.menu-cafe-food .food-list>li .plus {
  position: absolute;
  width: 30px;
  left:0px;
  top:50%;
  margin-top: -15px;
}

.menu-cafe-food .food-list>li .text {
  width: calc(100% - 229px);
  padding: 25px 30px 25px 0;
}
.menu-cafe-food .food-list>li .image {
  width: 229px;
}

.menu-cafe-food .food-list>li .image img {
  width: 100%;
}
.menu-cafe-food .food-list>li .title {
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 5px;
}
.menu-cafe-food .food-list>li .price {
  font-size: 1.8rem;
}
.menu-cafe-food .food-list>li .message {
  font-size: 1.3rem;
  margin: 5px 0 5px;
  line-height:  1.571em;
}

.menu-detail-drink {
  padding: 0 0 0px;
}
/* .menu-detail-set .menu-detail-add {
  max-width: 690px;
  margin: 0 auto;
  border:1px solid #ddd;
}
.menu-detail-set .menu-detail-add .add-head {
  background: #fffbf0;
  padding:10px 40px;
}

.menu-detail-set .menu-detail-add .add-block {
  display: flex;
  align-items: center;
}
.menu-detail-set .menu-detail-add .add-box {
  display: flex;
  width: 315px;
  justify-content: center;
  align-items: center;
  padding: 30px 10px 30px 30px;
}
.menu-detail-set .menu-detail-add .add-note {
  width: calc(100% - 315px);
}
.menu-detail-set .menu-detail-add .add-box-text {
  width:160px ;
}
.menu-detail-set .menu-detail-add .add-box-image {
  width: calc(100% - 160px);
}
.menu-detail-set .menu-detail-add .add-box-title {
  font-weight: bold;
}
.menu-detail-set .menu-detail-add .add-box-price {
  display: flex;
  align-items: baseline;
}
.menu-detail-set .menu-detail-add .add-box-price .normal p {
  display:inline-block;
  position: relative;
  color: #666666;
  padding: 0 3px;
}
.menu-detail-set .menu-detail-add .add-box-price .normal p::after {
    content:'';
    position: absolute;
    display: block;
    width: 100%;
    height: 1px;
    top:50%;
    left:0;
    margin-top: -1px;
    background: #00a728;
}

.menu-detail-set .menu-detail-add .add-box-price .set {
  position: relative;
  color: #00a728;
  font-size: 1.9rem;
  padding-left: 28px;
  background-image: url(../svg/arrow-gray.svg);
  background-repeat: no-repeat;
  background-position: 13px 55%;
  background-size: 6px auto;
  font-weight: bold;
}
.menu-detail-set .menu-detail-add .add-note ul>li {
  position: relative;
  font-size: 1.3rem;
  line-height: 1.54em;
  padding-left: 19px;
  margin-bottom: 10px;
  color: #888888;
}
.menu-detail-set .menu-detail-add .add-note ul>li::after {
  content: '※';
  position: absolute;
  left:0;
  top:0;
  width: 1em;
  height: 1em;
}
 */

.menu-cafe-smoothie {
  margin-top: 90px;
}
.menu-cafe-smoothie .smoothie-block {
  position: relative;
  background: #e7e3e0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 38px;
  height: 250px;
}
.menu-cafe-smoothie .smoothie-image {
  position: absolute;
  right:50%;
  top:0;
  width: 600px;
}
.menu-cafe-smoothie .dot-list>li {
  margin-bottom: 20px;
}
.menu-cafe-smoothie .smoothie-image img {
}
.menu-cafe-smoothie .smoothie-text {
  position: relative;
  width: 50%;
  padding:0 30px;
  z-index:  2;
}
.menu-cafe-smoothie .smoothie-list,
.menu-cafe-smoothie .smoothie-list>li {
  margin-bottom: 20px;
}
.menu-cafe-smoothie {
  overflow: hidden;
}
.menu-cafe-smoothie .smoothie-message1 {
  margin-bottom: 20px;
}

@media screen and (max-width:1150px) {
  .menu-lower-visual .visual-image {
    width: 39%;
  }
  .menu-cafe-smoothie .smoothie-text {
    padding: 0 15px;
    z-index: 2;
    width: 60%;
  }
  .menu-cafe-smoothie .smoothie-image {
    position: absolute;
    right: 57%;
  }
  /*media 1150*/
}

@media screen and (max-width:1000px) {
  .menu-detail-drink .tab-head>li {
    font-size: 1.3rem;
  }
  .menu-tobikiri-top {

  }
  .menu-tobikiri-top .top-image {
    width: 320px;
  }
  .menu-tobikiri-top .top-image-box {
    display: block;
    width: 100%;
    margin-bottom: 2px;
  }
  .menu-tobikiri-top .top-text {
    width: calc(100% - 320px);
  }
  .menu-tobikiri-top .top-list>li {
    font-size: 1.3rem;
  }
  .menu-tobikiri-top .top-list>li br {
    display: block;
  }
  /*media 1000*/
}
/*スマホ*/
@media screen and (max-width:768px) {
  .menu-detail-main {
    padding-top: 0;
  }
  .menu-detail-main .wrap {
    padding: 0;
  }
  .menu-detail-notearea{
    padding: 20px 20px 0;
  }
  .menu-detail-block {
    display: block;
    padding-bottom: 40px;
    border-bottom:none;
  }
  .menu-detail-visual {
    width: 100%;
    padding-top: 0;
    text-align: center;
    margin-bottom: 15px;
  }
  .menu-detail-visual .visual-wrap {
      padding: 20px 20px 0;
      max-width:500px;
      margin: 0 auto;
      width: 100%;
  }
  .menu-detail-visual .meta-icon {
    bottom: 10px;
    left: 20px;
  }
  .menu-detail-visual .meta-icon>li {
    width: 25px;
    margin-top: 5px;
  }
  .menu-detail-text {
    width: 100%;
    padding-left: 0;
  }
  .menu-detail-inner {
    margin: 0 auto;
  }
  .menu-detail-main .menu-detail-group {
    padding: 0 20px;
  }

  .menu-detail-inner .note>li {
    position: relative;
    color: #888888;
  }
  .menu-detail-inner .title {
    font-size:  2rem;
    margin-bottom: 9px;
  }
  .menu-detail-inner .price-area {
    padding-bottom: 10px;
  }
  .special .menu-detail-inner .price-area {
    padding-bottom: 5px;
  }
  .menu-detail-inner .price {
    display: flex;
    margin-bottom: 10px;
    align-items: flex-end;
  }
  .menu-detail-inner .price .yen {
    font-size: 2rem;
    line-height: 1em;
  }
  .menu-detail-inner .price .kcal {
    font-size:  1.4rem;
    line-height: 1em;
    color: #666666;
    margin-top: -2px;
  }
  .menu-detail-inner .message {
    margin-bottom: 20px;
  }
  .special .menu-detail-inner .message {
    font-size: 1.6rem;
    padding-top: 20px;
    margin-bottom: 28px
  }
  .menu-detail-inner .button-box {
    margin: 0 auto 10px;
    text-align: center;
  }
  .menu-detail-inner .button-box .button {
    margin-bottom: 20px;
  }

  .menu-detail-inner .modal-button {
    display: flex;
    align-items: center;
    margin:0px auto 30px;
  }
  .menu-detail-inner .modal-button i {
    margin-right: 10px;
  }
  .menu-detail-inner .note {
    margin-bottom: 30px;
  }
  .menu-detail-inner .menu-link {
    padding: 15px;
  }
  .menu-detail-inner .menu-link-image {
    width: 110px;
    background: #fff;
  }
  .menu-detail-inner .menu-link-text {
    width: calc(100% - 110px);
    padding-left: 23px;
  }
  .menu-detail-inner .menu-link-text .link-message {
    margin-bottom: 5px;
  }
  .menu-detail-inner .menu-link-text .link-message i {
    display: inline-block;
    text-emphasis: filled;
    -webkit-text-emphasis: filled;
  }
  .menu-detail-inner .menu-link-text .link-message em {
      color: #00a728;
  }
  .menu-detail-inner .menu-link-text .link-title {
    font-weight:  bold;
    font-size:  1.6rem;
    margin-bottom: 5px;
  }
  .menu-detail-inner .menu-link-text .link-price {
    font-size:  1.8rem;
  }
  .menu-detail-inner .menu-detail-sns {
    margin-bottom: 10px;
  }
  /*セットメニュー*/
  .menu-detail-set {
    padding: 10px 0 55px;
  }
  .menu-detail-set .list {
    margin-bottom: 20px;
  }
  .menu-detail-set .list>li {
    width: 100%;
    min-height: 95px;
    border-right: 0;
    font-size: 1.3rem;
    border-bottom: 1px solid #ddd;
  }
  .menu-detail-set .list>li>.box {
    padding-left: 40px;
  }
  .menu-detail-set .list>li .plus {
    width: 24px;
    margin-top: -12px;
  }
  .menu-detail-set .list>li .text {
    width: calc(100% - 90px);
    padding: 15px 15px 10px 0;
  }
  .menu-detail-set .list>li .price {
    font-size: 1.4rem;
  }
  .menu-detail-set .list>li .message {
    font-size: 1.2rem;
  }
  .menu-detail-set .list>li .image {
    width: 90px;
  }
  .menu-detail-set .menu-detail-add {
    margin-bottom: 0px;
  }
  .menu-detail-set .menu-detail-add .add-head {
    text-align: center;
  }
  .menu-detail-set .menu-detail-add .add-block {
      display: block;
      padding: 15px;
  }
  .menu-detail-set .menu-detail-add .add-box {
    width: 100%;
    padding: 0;
    margin-bottom: 10px;
  }
  .menu-detail-set .menu-detail-add .add-note {
      width:100%;
  }
  .menu-detail-set .menu-detail-add .add-box-text {

  }
  .menu-detail-set .menu-detail-add .add-note ul>li {
    font-size: 1.2rem;
  }
  /*セットメニュー_230324*/
  .list.list-regular {
    border-bottom: none;
  }
  .list.list-side {
    border-top: 1px solid #ddd;
  }
  .menu-detail-set .list-side>li:nth-child(2n) {
    border-right: 0;
  }
  
  /*セットドリンク*/
  .menu-detail-drink {
    padding: 0 0 15px;
  }
  .menu-detail-drink:first-child{
    padding-top: 10px;
  }
  .menu-detail-drink .wrap {
    padding: 0;
  }
  .menu-detail-drink .tab-head {
    padding-bottom: 25px;
  }
  .menu-detail-drink .tab-head>li {
    width: calc((100% - 6px)/3);
    margin-right: 3px;
    margin-bottom: 3px;
  }
  .menu-detail-drink .tab-head>li>a {
    display: block;
    padding: 12px 0;
  }
  .menu-detail-drink .tab-head>li:nth-child(6n) {
    margin-right: 3px;
  }
  .menu-detail-drink .tab-head>li:nth-child(3n) {
    margin-right: 0;
  }
  .menu-detail-drink .tab-body {
    padding: 0 20px;
    min-height: 300px;
  }
  .menu-detail-drink .drink-size {
      margin: 0 0 28px;
  }
  .menu-detail-drink .drink-list {
      padding: 0;
  }

  .menu-detail-drink .drink-list li {
    width: 31.34% ;
    margin-right: 2.99%;
    margin-bottom: 15px;
  }
  .menu-detail-drink .drink-list li:nth-child(6n) {
    margin-right: 2.99%;
  }
  .menu-detail-drink .drink-list li:nth-child(3n) {
    margin-right: 0;
  }
  .menu-detail-drink .drink-list li .menu-icon {
    line-height: 23px;
    font-size: 1.2rem;
    height: 21px;
  }
  .menu-detail-drink .drink-list li .image .icon img {
    width: 18px;
    height: 18px;
    margin-right: 10px;
  }
  .menu-detail-box {
    display: block;
    padding-bottom: 40px;
  }
  .menu-detail-campaign {
    width: 100%;
  }
  .menu-banner-list.active {
    width: 100%;
    padding-right: 0;
  }
  .menu-banner-list li {
    margin-bottom: 40px;
  }
  .menu-detail-note {
    width: 100%;
    padding-left: 0;
  }
  .menu-detail-campaign .campaign-ttl {
    font-size: 1.8rem;
    line-height: 1.22em;
    margin-bottom: 20px;
  }
  .menu-detail-view.nodata {
    padding-top: 0;
  }
  .menu-detail-other {
    padding: 0 0 38px;
  }

  /*メニュースライダー*/
  .menu-slider2 .swiper-container {
    padding: 0 20px;
  }
  .menu-slider2 .menu-slider-list {
    padding: 10px 0 30px;
  }
  .menu-slider2 .menu-slider-list li {
    width: 140px !important;
    margin-right: 15px;
  }
  .menu-slider2 .menu-slider-list li:last-child {
    margin-right: 0;
  }
  .menu-slider2 .menu-slider-list li .image {
    margin-bottom: 10px;
  }
  .menu-slider2 .menu-slider-list li .image::after {
    width: 170px;
  }
  .menu-slider2 .menu-slider-list li p {
    padding: 0 12px;
  }
  .menu-slider2 .menu-slider-list li p.menu-price {
    padding: 0 0 0 12px;
  }
  .menu-slider2 .menu-slider-list li .image .icon img {
    width: 18px;
    height: 18px;
    margin-right: 10px;
  }
  .menu-slider2 .swiper-button-next,
  .menu-slider2 .swiper-button-prev,
  .menu-slider2 .swiper-pagination {
    display: none;
  }

  .menu-modal-wrap {
    position: absolute;
    width:100%;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align:center;
    margin-top: -30px;
  }
  
  /*とびきりハンバーグ*/
  .menu-tobikiri-head {
    padding-top: 38px;
  }
  .menu-detail-drink .tab-head>li {
    font-size: 1.3rem;
  }
  .menu-tobikiri-top {
    display: block;
    height: auto;
  }
  .menu-tobikiri-top .top-image {
    display: block;
    width: 100%;
  }
  .menu-tobikiri-top .top-image img {
    width: 100%;
  }
  .menu-tobikiri-top .top-image p {
    font-size: 1.3rem;
  }
  .menu-tobikiri-top .top-image p strong {
    font-size: 1.7rem;
  }
  .menu-tobikiri-top .top-text {
    width: 100%;
    padding: 15px 15px 39px;
  }
  .menu-tobikiri-top .top-list {
    
  }
  .menu-tobikiri-top .top-list>li {
    padding: 3px;
    width: calc((100% - 20px)/3);
    height: 64px;
  }
  .menu-tobikiri-top .top-more {
    right: 0px;
    bottom: 0;
    width: 100%;
    height: 24px;
    line-height: 24px;
    font-size: 1.2rem;
    text-align: center;
    color: #fff;
  }
  .menu-tobikiri-top .top-more::after {
    display: none;
  }
  .menu-tobikiri-top .top-more span {
    display: inline-block;
  }
  .menu-tobikiri-top .top-more span::after {
    content:"";
    position: absolute;
    top:50%;
    right: -1em;
    width: 6px;
    height: 6px;
    border-right:1px solid #fff;
    border-bottom:1px solid #fff;
    transform: translate(0,-50%) rotate(-45deg);
  }
  .menu-tobikiri-bottom {
    padding-top:0px;
  }

  /*セット*/
  .menu-lower-visual {
    display: block;
    background: transparent;
  }
  .menu-lower-visual .visual-image {
    width: 100%;
    display: block;
  }
  .menu-lower-visual .visual-image img {
      max-width: none;
      width: 100%;
  }
  .menu-lower-visual .visual-title {
    width: 100%;
    position: static;
    text-align:  center;
    transform:translateX(0);
    margin-top: 40px;
    margin-bottom: 0;
  }
  .menu-set-link {
    padding-top: 68px;
  }
  .menu-set-bottom {
    padding-bottom: 60px;
  }

  /*カフェ*/
  .menu-cafe-body {
    padding-top: 30px;
  }
  .menu-cafe-food {
    margin-top: 50px;
  }
  .menu-cafe-food .food-list {
    position: relative;
    display: block;
    margin-bottom: 30px;
    border-bottom: none;
  }
  .menu-cafe-food .food-list::after {
    width: 100%;
    height: 1px;
    bottom:0;
    left:0;
  }
  .menu-cafe-food .food-list>li {
    width: 100%;
    min-height:0;
    padding: 20px 0;
    border-bottom: 1px solid #ddd;
  }
  .menu-cafe-food .food-list>li .text {
    padding: 0 0 0 5%;
    width: 55%;
  }
  .menu-cafe-food .food-list>li .image {
    width: 45%;
  }
  .menu-cafe-food .food-list>li .image img {
    width: 100%;
  }
  .menu-cafe-food .food-list>li .title {
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 5px;
  }
  .menu-cafe-food .food-list>li .price {
    font-size: 1.8rem;
  }
  .menu-cafe-food .food-list>li .message {
    font-size: 1.3rem;
    margin: 5px 0 5px;
    line-height:  1.571em;
  }
  .menu-cafe-smoothie {
    margin-top: 65px;
    display: block;
  }
  .menu-cafe-smoothie .smoothie-block {
    display: block;
    height: auto;
    margin-bottom: 0;
    background: transparent;
  }
  .menu-cafe-smoothie .smoothie-text {
    padding: 20px 0;
    z-index: 2;
    width: 100%;
  }
  .menu-cafe-smoothie .smoothie-image {
    position: static;
    right: 0%;
    width: 100%;
  }

  /*media 768*/
}

/******************
リッチメニュー
******************/

/*delay*/
.detail-contents .dt_2 {
  transition-delay: 0.2s !important;
  -webkit-transition-delay: 0.3s !important;
}
.detail-contents .dt_4 {
  transition-delay: 0.4s !important;
  -webkit-transition-delay: 0.3s !important;
}
.detail-contents .dt_6 {
  transition-delay: 0.6s !important;
  -webkit-transition-delay: 0.3s !important;
}
/*from*/
.detail-contents .init {
  opacity: 0;
  transition-duration: 1.2s;
  transition-property: opacity transform;
  transition-timing-function: cubic-bezier(0.24, 1.00, 0.33, 1.00);
}
/*to*/
.detail-contents .animated .init {
  opacity: 1;
  transform: translate(0, 0) scale(1, 1) rotate(0);
}
/*from*/
.detail-contents .init.move_up {
  transform: translate(0%, 30px);
}
.detail-contents .init.move_left {
  transform: translate(50px, 0px);
  transition-duration: 1.5s;
}
.detail-contents .init.move_right {
  transform: translate(-50px, 0px);
  transition-duration: 1.5s;
}
/*to*/
.detail-contents .animated .init.move_up {
  transform: translate(0, 0) scale(1, 1);
}
.detail-contents .animated .init.move_left {
  transform: translate(0, 0) scale(1, 1);
}
.detail-contents .animated .init.move_right {
  transform: translate(0, 0) scale(1, 1);
}
@media screen and (max-width:768px) {
  /*from*/
  .detail-contents .init.move_up,
  .detail-contents .init.move_left,
  .detail-contents .init.move_right {
    transform: translate(0, 30px);
    transition-duration: 1.2s;
  }
}

.unique .menu-detail-inner {
  padding: 50px 0 20px;
  max-width: 100%;
}
.unique .menu-detail-visual .visual-wrap {
  padding: 0px;
  max-width: 519px;
  margin: 0;
  margin-left: -10px;
}
.unique .menu-detail-visual {
  padding-top: 0;
  width: 47.58%;
  margin-bottom: 0;
  text-align: left;
}

.unique .menu-detail-main {
  padding-top: 0px;
  background-size: 700px;
}

.unique .menu-detail-main .wrap {
  padding-left: 0;
}

.unique .menu-detail-block {
  position: relative;
  padding-top: 0px;
  background-size: 700px;
  background-repeat: no-repeat;
  border-bottom: 0;
  z-index: 1;
}

.unique.detail2 .menu-detail-block {
  background-image: url(../../common/menu/image/detail/detail2-bg.jpg);
}

.unique.detail3 .menu-detail-block {
  background-image: url(../../common/menu/image/detail/detail3-bg.jpg);
}

.unique .menu-detail-text {
  position: relative;
  width: 52.42%;
  z-index: 2;
}

.unique .menu-detail-group {
  padding: 48px 65px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.12);
  background: #fff;
}

.unique .menu-detail-text .title {
  padding: 0 15px;
}

.unique .menu-detail-text .catch {
  font-weight: bold;
  font-size: 1.8rem;
  color: #6A430A;
  line-height: 1.44;
  margin-bottom: 35px;
}

.unique .menu-detail-text .price {
  padding: 0 15px 25px;
  border-bottom: 1px dashed #DDDDDD;
}

.unique .menu-detail-inner .menu-detail-sns {
  margin-bottom: 0;
}

@media screen and (max-width: 1024px) {
  .unique .menu-detail-group {
    padding: 40px 40px;
  }
}

@media screen and (max-width: 768px) {
  .unique .menu-detail-inner {
    padding: 0;
    max-width: 100%;
  }
  .unique .menu-detail-visual .visual-wrap {
    padding: 0px;
    max-width: 100%;
    margin: 0;
    margin-left: 0;
  }
  .unique .menu-detail-visual .visual-wrap>img {
    margin-top: -10%;
  }
  .unique .menu-detail-visual {
    padding-top: 0;
    width: 100%;
    text-align: center;
  }
  .unique .menu-detail-main {
    padding-top: 0px;
  }
  .unique .menu-detail-main .wrap {
    padding-left: 0;
  }
  .unique .menu-detail-text {
    position: relative;
    width: 100%;
    z-index: 2;
    margin-top: -40px;
  }
  .unique .menu-detail-group {
    padding: 0px 20px 0;
    box-shadow: 0 0 0 0;
  }
  .unique .menu-detail-text .title {
    padding: 0;
  }
  .unique .menu-detail-text .catch {
    font-size: 1.6rem;
    margin-bottom: 25px;
  }
  .unique .menu-detail-text .price {
    padding: 0 0 15px;
  }
  .unique .menu-detail-inner .menu-detail-sns {
    margin-bottom: 0;
  }
}
/*個別コンテンツ*/
.detail-contents {
  position: relative;
  padding: 75px 0 96px;
}
.detail-contents::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: calc(100% + 1px);
  top: -1px;
  left: 0;
  background: #FFFBF0;
  z-index: 0;
}
.detail-contents .label {
  position: relative;
  text-align: center;
  margin-bottom: 23px;
}
.detail-contents .label p {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  text-align: center;
  font-weight: bold;
  font-size: 1.8rem;
  color: #6A430A;
  z-index: 1;
}
.detail-contents-title {
  font-weight: bold;
  font-size: 40px;
  white-space: nowrap;
  margin-bottom: 40px;
  font-weight: bold;
  color: #6A430A;
}
.detail-contents-message {
  font-size: 1.6rem;
  line-height: 2;
}
.detail-contents-caption {
  font-size: 2.6rem;
  margin-bottom: 40px;
  color: #6A430A;
}

@media screen and (max-width:1024px) {
  .detail-contents-title {
    text-align: center;
    white-space: normal;
  }
  .detail-contents-caption {
    text-align: center;
  }
  .detail-contents-message {
    margin-bottom: 30px;
  }
}

@media screen and (max-width:768px) {
  .unique .menu-detail-block {
    background-size: 100%;
    display: block;
  }

  .detail-contents-title {
    font-weight: bold;
    font-size: 2.6rem;
    margin-bottom: 25px;
  }
  .detail-contents {
    padding: 0 0 50px;
  }
  .detail-contents-caption {
    font-size: 2.2rem;
    margin-bottom: 25px;
  }
  .detail-contents-message {
    font-size: 1.4rem;
    line-height: 2;
    margin-top: -10px;
    margin-bottom: 57px;
    text-align: center;
  }
  .detail-contents::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 30px;
    left: 0;
    background: #FFFBF0;
    z-index: -1;
  }
  .detail-contents .label {
    position: relative;
    max-width: 294px;
    text-align: center;
    margin: 0 auto 20px;
    font-size: 1.4rem;
  }
  .detail-contents .label p {
    font-size: 1.4rem;
  }
}

/*モスバーガー*/
.detail2-contents-block {
  position: relative;
  display: flex;
}
.detail2-contents-box1,
.detail2-contents-box2 {
  position: relative;
  width: 50%;
}
.detail2-contents-box1 {
  text-align: right;
}
.detail2-contents-box2 {
  text-align: left;
}
.detail2-contents-text {
  max-width: 525px;
  display: inline-block;
  text-align: left;
  padding-left: 25px;
  padding-right: 25px;
}
.detail2-contents-image {
  position: relative;
  min-width: 500px;
  display: inline-block;
  text-align: center;
  margin-top: -40px;
}
.detail2-contents-image.abs {
  position: absolute;
  right: 30px;
  top: -20px;
  width: 100%;
  width: 702px;
  margin-top: 0;
}
.detail2-contents-block.reverse {
  flex-direction: row-reverse;
  margin-bottom: 75px;
}
.detail2-contents-block.reverse .detail2-contents-text {
  max-width: 550px;
  padding-left: 25px;
  padding-right: 25px;
}
.detail2-contents-block.reverse .detail2-contents-box1 {
  text-align: left;
}
.detail2-contents-block.reverse .detail2-contents-box2 {
  text-align: right;
}
.detail2-contents-box1 {
  text-align: right;
}
.detail2-contents-box2 {
  text-align: left;
}
.detail2-contents-block.reverse .detail2-contents-box2 {
  text-align: right;
  min-height: 227px;
}
.detail2-section-image {
  margin-bottom: 0px;
}
@media screen and (max-width:1366px) {
  .detail2-contents-block {
    overflow: hidden;
  }
  .detail2-contents-image.abs {
    position: absolute;
    right: 30px;
    top: 0;
    width: 103%;
  }
}
@media screen and (max-width:1024px) {
  .detail2-contents-block,
  .detail2-contents-block.reverse {
    display: block;
    max-width: 768px;
    margin: 0 auto;
  }
  .detail2-contents-box1,
  .detail2-contents-box2 {
    width: 100%;
    text-align: center;
  }
  .detail2-contents-text {
    max-width: 100%;
    display: block;
    text-align: left;
    padding-left: 0;
    padding: 0 20px;
  }
  .detail2-contents-image {
    margin-bottom: 50px;
    min-width: 0;
  }
  .detail2-contents-image img {
    max-width: 100%;
  }
  .detail2-contents-block.reverse .detail2-contents-box2 {
    position: relative;
    padding-top: inherit;
    padding-top: 179px;
  }
  .detail2-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail2-contents-image.abs img {
    /*width: 149.6%;*/
    width: 100%;
    max-width: none;
  }
  .detail2-contents-block.reverse .detail2-contents-text {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
  .detail2-contents-block.reverse .detail2-contents-box2 {
    min-height: 267px;
  }
}
@media screen and (max-width:768px) {
  .detail2-contents-image {
    margin-bottom: 20px;
    min-width: 0;
    text-align: center;
    display: block;
  }
  .detail2-contents-image-sp2 {
    position: relative;
    padding-top: 179px;
    margin-bottom: 30px;
  }
  .detail2-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail2-contents-block.reverse .detail-contents-message {
    text-align: left;
  }
}
/*モスバーガー ボトム要素*/
.detail2-section {
  text-align: left;
  max-width: 1050px;
  margin: 150px auto 74px;
  padding: 0 25px;
}
.detail2-section-block {
  background: #F8EEE2;
  text-align: center;
  padding: 75px 20px 15px;
  border-radius: 10px;
}
.detail2-section-label {
  position: relative;
}
.detail2-section-label>span {
  position: absolute;
  display: block;
  top: -130px;
  left: 0;
  width: 100%;
  text-align: center;
}
.detail2-section-title {
  position: relative;
  font-size: 2.6rem;
  color: #6A430A;
  padding-bottom: 20px;
  margin-bottom: 30px;
}
.detail2-section-title::after {
  content: "";
  position: absolute;
  display: block;
  width: 36px;
  height: 3px;
  bottom: 0;
  left: 50%;
  margin-left: -18px;
  background: #fff;
}
.detail2-section-message1 {
  font-size: 1.6rem;
  margin-bottom: 30px;
  line-height: 2;
}
.detail2-section-message2 {
  font-size: 1.6rem;
  margin-bottom: 30px;
  line-height: 2;
}
.detail-contents-button {
  text-align: center;
  padding: 0 20px;
}
@media screen and (max-width:1024px) {
  .detail2-section {
    margin: 70px auto 74px;
    padding: 0 20px;
  }
}
@media screen and (max-width:768px) {
  .detail2-section-title {
    position: relative;
    font-size: 2rem;
  }
  .unique .menu-detail-inner .button-box .button {
    margin: 0 auto 20px;
  }
  .detail2-section {
    margin: 24px auto 40px;
    padding: 0 20px;
  }
  .detail2-section-message1,
  .detail2-section-message2 {
    font-size: 1.4rem;
    margin-bottom: 15px;
    line-height: 2;
    text-align: left;
  }
  .detail2-section-block {
    padding: 50px 0 15px;
  }
  .detail2-section-block .inner {
    padding: 0 5%;
  }
  .detail2-section-image {
    padding: 0 1.5% 0 5%;
  }
  .detail2-section-image img {
    width: 100%;
  }
  .detail2-section-label>span {
    position: absolute;
    display: block;
    top: -89px;
    left: 50%;
    text-align: center;
    width: 76px;
    margin-left: -38px;
  }
}

/*てりやきバーガー*/
.detail3-contents-block {
  display: flex;
  margin-bottom: 75px;
}
.detail3-contents-box1,
.detail3-contents-box2 {
  position: relative;
  width: 50%;
}
.detail3-contents-box1 {
  text-align: right;
}
.detail3-contents-box2 {
  text-align: left;
}
.detail3-contents-text {
  max-width: 525px;
  display: inline-block;
  text-align: left;
  padding-left: 25px;
  padding-right: 25px;
}
.detail3-contents-image {
  min-width: 500px;
  position: relative;
  display: inline-block;
  text-align: left;
  padding-left: 0px;
  z-index: 2;
}
#detail3-1 .detail3-contents-image {
  padding-left: 25px;
}
#detail3-2 .detail3-contents-image {
  margin-right: 30px;
}
.detail3-contents-block.reverse {
  flex-direction: row-reverse;
}
.detail3-contents-block.reverse .detail3-contents-text {
  max-width: 525px;
  padding-left: 0px;
  padding-right: 25px;
}
.detail3-contents-block.reverse .detail3-contents-box1 {
  text-align: left;
}
.detail3-contents-block.reverse .detail3-contents-box2 {
  text-align: right;
}
.detail3-contents-box1 {
  text-align: right;
}
.detail3-contents-box2 {
  text-align: left;
  position: relative;
  z-index: 2;
}
.detail3-contents-block.reverse .detail3-contents-box2 {
  text-align: right;
  min-height: 227px;
}
.detail3-inter-block {
  display: flex;
}
#detail3-2 .detail3-contents-image {
  margin-left: -30px;
}
#detail3-2 .detail3-contents-text {
  text-align: left;
  min-width: 500px;
  padding-left: 0;
}
.detail3-contents-text .inline {
  max-width: 380px;
  display: inline-block;
}
#detail3-3 {
  margin-top: -160px;
}
#detail3-3 .detail3-contents-text {
  padding-top: 107px;
  padding-left: 0;
}
#detail3-4 {
  position: relative;
}
#detail3-4 .detail3-contents-image {
  margin-top: 35px;
  text-align: right;
}
#detail3-4 .detail3-contents-text {
  position: relative;
  max-width: 500px;
  width: 100%;
  padding: 60px;
  z-index: 1;
}
#detail3-4 .detail3-contents-text::after {
  content: "";
  position: absolute;
  display: block;
  width: 160%;
  height: 100%;
  top: 0;
  left: 0;
  background: #fff;
  z-index: -1;
}
@media screen and (max-width:1366px) {
  .detail3-contents-block {
    overflow: hidden;
  }
}
@media screen and (max-width:1100px) {
  #detail3-4 {
    position: relative;
  }
}
@media screen and (max-width:1024px) {
  .detail3-contents-block .detail-contents-message {
    font-size: 1.4rem;
    line-height: 2;
    margin-top: 0;
    margin-bottom: 25px;
    text-align: left;
  }
  .detail3-contents-block {
    display: block;
    max-width: 700px;
    margin: 0 auto;
  }
  .detail3-contents-box1,
  .detail3-contents-box2 {
    width: 100%;
    text-align: center;
  }
  .detail3-contents-box2 {
    width: 100%;
    text-align: left;
  }
  .detail3-contents-text {
    max-width: 100%;
    display: block;
    text-align: left;
    padding-left: 0;
    padding: 0px;
  }
  .detail3-contents-image {
    margin-bottom: 50px;
    min-width: 0;
    padding-left: 0;
  }
  .detail3-contents-image img {
    max-width: 100%;
  }
  .detail3-contents-block.reverse .detail3-contents-box2 {
    position: relative;
    padding-top: inherit;
    padding-top: 0;
    text-align: left;
  }
  .detail3-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail3-contents-image.abs img {
    /*width: 149.6%;*/
    width: 100%;
    max-width: none;
  }
  .detail3-contents-block.reverse .detail3-contents-text {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
  .detail3-contents-block.reverse .detail3-contents-box2 {
    min-height: 0;
  }
  .detail3-contents-text .inline {
    max-width: 100%;
    display: inline-block;
  }
  #detail3-1 .detail3-contents-box2 {
    text-align: center;
  }
  #detail3-1.detail3-contents-block .detail-contents-message {
    text-align: center;
  }
  #detail3-2 .detail3-contents-text {
    text-align: left;
    min-width: 0;
    padding-left: 0;
  }
  #detail3-2 .detail3-contents-box2 {
    text-align: right;
  }
  #detail3-2 .detail3-contents-image {
    margin-right: 0;
    margin-left: 0;
  }
  #detail3-3 {
    margin-top: -60px;
  }
  #detail3-3 .detail-contents-caption {
    text-align: left;
    padding: 0 20px;
  }
  #detail3-3 .detail3-contents-image {
    text-align: center;
    margin-bottom: 36px;
  }
  #detail3-3 .detail3-contents-text {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    max-width: none;
  }
  #detail3-4 .detail3-contents-text::after {
    width: 100%;
    height: 100%;
  }
  #detail3-4 .detail3-contents-text {
    position: relative;
    max-width: none;
    width: 90%;
    padding: 40px 40px 60px;
    z-index: 1;
  }
  #detail3-4 .detail3-contents-image {
    margin-top: -60px;
  }
  #detail3-4 .detail3-contents-box2 {
    width: 100%;
    text-align: right;
    margin-bottom: 20px;
  }
  #detail3-4 .detail3-contents-block .detail-contents-message {
    font-size: 1.4rem;
    text-align: left;
  }
}
@media screen and (max-width:768px) {
  .detail3-contents-image {
    margin-bottom: 20px;
    min-width: 0;
    text-align: center;
  }
  .detail3-contents-image-sp2 {
    position: relative;
    padding-top: 0;
    margin-bottom: 30px;
  }
  .detail3-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  #detail3-1.detail3-contents-block .detail-contents-message {
    text-align: left;
  }
  .detail3-contents-block .detail-contents-message {
    padding: 0 20px;
    text-align: left;
    margin-bottom: 30px;
  }
  .detail3-contents-block.reverse .detail-contents-message {
    text-align: left;
  }
  #detail3-1 .detail3-contents-image,
  #detail3-2 .detail3-contents-image {
    padding-left: 25px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width:540px) {
  #detail3-1 .detail3-contents-image,
  #detail3-2 .detail3-contents-image {
    position: relative;
    margin-bottom: 30px;
    min-width: 0;
    width: 100%;
    margin-left: 0%;
    right: 0;
    padding-left: 0;
    transform-origin: 100% 100%;
  }
  #detail3-2 {
    overflow: hidden;
  }
   #detail3-2 .detail3-contents-box2 {
    text-align: right;
    overflow: hidden;
  }
  #detail3-2 .detail3-contents-image {
    position: relative;
    width: 109%;
    margin-left: 0%;
    margin-right: -14%;
  }
  #detail3-3 .detail3-contents-image {
    margin-left: 0;
    width: 89%;
  }
  #detail3-4 .detail3-contents-image {
    margin-left: 0;
    margin-right: 0;
    width: calc(100% - 20px);
  }
  #detail3-4 .detail3-contents-text {
    position: relative;
    max-width: none;
    width: calc(100% - 20px);
    padding: 28px 20px 50px;
    z-index: 1;
  }
  .detail3-contents-image img {
    width: 100%;
  }
}
/*====================================
/* 03.アレルギー情報
====================================*/


/******************
アレルギー情報を調べる
******************/
.search-allergy {
  text-align: left;
}
.search-allergy-group {
  position: relative;
  border-bottom: 1px solid #dddddd;
  padding-bottom: 40px;
  margin-bottom: 60px;
}
.search-allergy-group:last-child {
  border-bottom: 0;
  margin-bottom: 20px;
}
.search-allergy-group:last-child::after,
.search-allergy-group:last-child::before {
  display: none;
}

.search-allergy-group::before {
    content: '';
    position: absolute;
    left: 50%;
    margin-left: -18px;
    bottom: -39px;
    border: 18px solid transparent;
    border-top: 21px solid #dddddd;
}

.search-allergy-group::after {
    content: '';
    position: absolute;
    left: 50%;
    margin-left: -18px;
    bottom: -38px;
    border: 18px solid transparent;
    border-top: 21px solid #ffffff;
}

.search-allergy .search-allergy-list {
  display: flex;
  flex-wrap: wrap;
}
.search-allergy .search-allergy-list>li {
  width: 9.25%;
  margin-bottom: 20px;
  margin-right: 0.83%;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  text-align: center;
  overflow: hidden;
  font-size: 1.3rem;
}
.search-allergy .search-allergy-list>li:nth-child(10n) {
  margin-right: 0;
}
.search-allergy .search-allergy-list>li label{
  position: relative;
  display: block;
  height: 100%;
  padding: 5px;
  z-index: 1;
  cursor: pointer;
}
.search-allergy .search-allergy-list>li input{
  display: none;
}
.search-allergy .search-allergy-list>li input:checked + .item{
  color:#fff;
}

.search-allergy .search-allergy-list>li input:checked + .item::after{
  content:"";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
  background: #00A728;
  display: block;
  z-index: -1;
}

.search-allergy .search-allergy-list>li .item {
  display: block;
  font-size: 1.3rem;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 38px;
  padding-top: 5px;
}

.search-allergy .search-allergy-list>li .item >span{
  line-height: 1.23;

}

.search-allergy .search-allergy-list>li .icon{
  background: #fff;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  align-self: center;
  width: 100%;
  height: 52px;
  padding: 8px 5px;
  z-index: 2;
  background-position: center 35%;
  background-repeat: no-repeat;
  background-size: 55px;
}

.search-allergy .search-allergy-list>li .icon.id-2{
  background-image: url(../../common/menu/image/allergy/id_2.png);
}
.search-allergy .search-allergy-list>li .icon.id-3{
  background-image: url(../../common/menu/image/allergy/id_3.png);
}
.search-allergy .search-allergy-list>li .icon.id-4{
  background-image: url(../../common/menu/image/allergy/id_4.png);
}
.search-allergy .search-allergy-list>li .icon.id-5{
  background-image: url(../../common/menu/image/allergy/id_5.png);
}
.search-allergy .search-allergy-list>li .icon.id-6{
  background-image: url(../../common/menu/image/allergy/id_6.png);
}
.search-allergy .search-allergy-list>li .icon.id-7{
  background-image: url(../../common/menu/image/allergy/id_7.png);
}
.search-allergy .search-allergy-list>li .icon.id-8{
  background-image: url(../../common/menu/image/allergy/id_8.png);
}
.search-allergy .search-allergy-list>li .icon.id-9{
  background-image: url(../../common/menu/image/allergy/id_9.png);
}
.search-allergy .search-allergy-list>li .icon.id-10{
  background-image: url(../../common/menu/image/allergy/id_10.png);
}
.search-allergy .search-allergy-list>li .icon.id-11{
  background-image: url(../../common/menu/image/allergy/id_11.png);
}
.search-allergy .search-allergy-list>li .icon.id-12{
  background-image: url(../../common/menu/image/allergy/id_12.png);
}
.search-allergy .search-allergy-list>li .icon.id-13{
  background-image: url(../../common/menu/image/allergy/id_13.png);
}
.search-allergy .search-allergy-list>li .icon.id-14{
  background-image: url(../../common/menu/image/allergy/id_14.png);
}
.search-allergy .search-allergy-list>li .icon.id-15{
  background-image: url(../../common/menu/image/allergy/id_15.png);
}
.search-allergy .search-allergy-list>li .icon.id-16{
  background-image: url(../../common/menu/image/allergy/id_16.png);
}
.search-allergy .search-allergy-list>li .icon.id-17{
  background-image: url(../../common/menu/image/allergy/id_17.png);
}
.search-allergy .search-allergy-list>li .icon.id-18{
  background-image: url(../../common/menu/image/allergy/id_18.png);
}
.search-allergy .search-allergy-list>li .icon.id-19{
  background-image: url(../../common/menu/image/allergy/id_19.png);
}
.search-allergy .search-allergy-list>li .icon.id-20{
  background-image: url(../../common/menu/image/allergy/id_20.png);
}
.search-allergy .search-allergy-list>li .icon.id-21{
  background-image: url(../../common/menu/image/allergy/id_21.png);
}
.search-allergy .search-allergy-list>li .icon.id-22{
  background-image: url(../../common/menu/image/allergy/id_22.png);
}
.search-allergy .search-allergy-list>li .icon.id-23{
  background-image: url(../../common/menu/image/allergy/id_23.png);
}
.search-allergy .search-allergy-list>li .icon.id-24{
  background-image: url(../../common/menu/image/allergy/id_24.png);
}
.search-allergy .search-allergy-list>li .icon.id-25{
  background-image: url(../../common/menu/image/allergy/id_25.png);
}
.search-allergy .search-allergy-list>li .icon.id-26{
  background-image: url(../../common/menu/image/allergy/id_26.png);
}
.search-allergy .search-allergy-list>li .icon.id-27{
  background-image: url(../../common/menu/image/allergy/id_27.png);
}
.search-allergy .search-allergy-list>li .icon.id-28{
  background-image: url(../../common/menu/image/allergy/id_28.png);
}
.search-allergy .search-allergy-list>li .icon.id-29{
  background-image: url(../../common/menu/image/allergy/id_29.png);
}
.search-allergy .search-allergy-list>li .icon.id-30{
  background-image: url(../../common/menu/image/allergy/id_30.png);
}


.search-allergy .search-allergy-title{
  position: relative;
  margin-bottom: 45px;
  font-size: 2.6rem;
  padding-left: 50px;
  font-weight: normal;
}

.search-allergy .search-allergy-title>span{
  position: absolute;
  display: inline-block;
  left:0;
  top:0;
  width:35px;
  height: 35px;
  border-radius: 50%;
  text-align: center;
  line-height: 35px;
  background: #000;
  color:#fff;
  font-size: 2.4rem;
}
@media screen and (max-width:1024px){

  .search-allergy .search-allergy-list>li {
    width: 12%;
    margin-right: 0.57%;
  }
  
  .search-allergy .search-allergy-list>li:nth-child(10n) {
    margin-right: 0.57%;
  }

  .search-allergy .search-allergy-list>li:nth-child(8n) {
    margin-right: 0;
  }

}

@media screen and (max-width:768px){
  .search-allergy-group {
      padding: 0px 0 30px 0;
      margin-bottom: 40px;
  }

  .search-allergy-group:last-child{
    margin-bottom: 0px;
  }

  .search-allergy-group::before {
    content: '';
    position: absolute;
    left: 50%;
    margin-left: -18px;
    bottom: -37px;
    border: 18px solid transparent;
    border-top: 19px solid #dddddd;
  }

  .search-allergy-group::after {
    content: '';
    position: absolute;
    left: 50%;
    margin-left: -18px;
    bottom: -36px;
    border: 18px solid transparent;
    border-top: 19px solid #ffffff;
  }

  .search-allergy .search-allergy-list>li {
    width: 23%;
    margin-right: 2.6%;
    margin-bottom: 10px;
  }
  .search-allergy .search-allergy-list>li:nth-child(10n),
  .search-allergy .search-allergy-list>li:nth-child(8n) {
    margin-right: 2.6%;
  }
  .search-allergy .search-allergy-list>li:nth-child(4n) {
    margin-right: 0;
  }

  .search-allergy .search-allergy-title{
    margin-bottom: 25px;
    font-size: 2rem;
    padding-left: 40px;
  }
  .modal .search-allergy .search-allergy-title {
    font-size: 1.6rem;
  }
  .search-allergy .search-allergy-title>span{
    width:28px;
    height: 28px;
    border-radius: 50%;
    text-align: center;
    line-height: 28px;
    font-size: 1.9rem;
  }
}
#page-search-allergy .error-block{
  padding: 15px 0;
}
#page-search-allergy .modal .error-block {
  padding: 15px;
}

/*ラジオボックス*/
.radiobox label{
  position: relative;
  display: inline-block;
  margin-bottom: 20px;
  margin-right: 30px;
  display: flex;
}

.radiobox input{
  display: none;
}
.radiobox span{
  position:relative;
  display: inline-block;
  padding-left: 3em;
  padding-top: 6px;
}

/*check枠*/
.radiobox span::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 29px;
  height: 29px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
  border-radius: 50%;
  box-sizing: border-box;
}

/*check ドット*/
.radiobox input:checked + span::after{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 29px;
  height: 29px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #00A728;
  border-radius: 50%;
  transform:scale(0.7);
  box-sizing: border-box;
}

.radiobox  em{
  font-weight: bold;
  font-size: 2rem;
  color: #E90000;
}
@media screen and (max-width:768px){

  .radiobox span {
    padding-left: 38px;
    margin-right:0px;
    padding-top: 3px;
  }

  .radiobox input:checked + span::after,
  .radiobox span::before{
    width: 26px;
    height: 26px;
  }
  .radiobox span em{
    font-weight: bold;
    font-size: 1.8rem;
    margin-top: -2px;
  }
}

.search-allergy-group.step2 .radiobox{
  display: flex;
  flex-wrap:wrap;
}

.search-allergy-note .note-list>li{
  font-size: 1.2rem;
}


.allergy-head {
  padding-top: 35px;
}
.allergy-head-block {
  position: relative;
  display: flex;
  align-items: center;
  margin: 30px 0 40px;
}
.allergy-head-image {
  width: 140px;
}
.allergy-head-image img {
  width: 100%;
}
.allergy-head-text {
  padding: 0 20px;
  width: calc(100% - 140px);
}
.allergy-head-title {
  font-size: 2.2rem;
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 5px;
}
.allergy-head-price {
  font-size: 2rem;
  display: flex;
  flex-wrap: wrap;
}
.allergy-head-price span {
  padding-right: 1.2em;
}
.allergy-nav {
  display: flex;
  flex-wrap:wrap;
  justify-content: space-between;
  margin: 0 auto 50px;
  max-width: 1200px;
}
.allergy-nav>li {
  width: calc((100% - 12px)/3);
}
.allergy-nav.two>li {
  width: calc((100% - 6px)/2);
}
.allergy-nav>li>a {
  padding: 13px 0;
  background: #f5f5f5;
  font-weight: bold;
  color:#666666;
  text-align: center;
  font-size: 1.4rem;
  display: block;
}
.allergy-nav>li.active a {
  background:#00a728;
  color:#fff;
}
.category-note {
  margin: -20px auto 30px;
  max-width: 1200px;
}
/*アレルギー情報*/
.allergy-list {
  display: flex;
  flex-wrap:wrap;
  margin-bottom: 15px;
  font-size: 1.6rem;
}
.allergy-list>li {
  width: calc(100% / 6);
  margin-bottom: 25px;
  border:1px solid #ddd;
  border-right:0;
  overflow:hidden;
}
.allergy-list>li.active {
  background: #fffbf0;
}
.allergy-list>li:last-child {
  border-right:1px solid #ddd;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.allergy-list>li:nth-child(1) {
}
.allergy-list>li:nth-child(6n) {
  border-right:1px solid #ddd;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.allergy-list>li:nth-child(6n + 1) {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.allergy-list>li .list-head {
  display: flex;
  flex-wrap:wrap;
  justify-content: center;
  align-items: center;
  padding: 0 5px;
  min-height: 45px;
}
.allergy-list>li .list-head>i.icon {
  position: relative;
  display: inline-block;
  margin-right: 15px;
}
.allergy-list>li .list-head>span {
  display: inline-block;
}
.allergy-list>li .list-body {
    position: relative;
    text-align: center;
    min-height: 45px;
    padding: 10px 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px dashed #ddd;
}
.allergy-list>li .list-body>i.icon {
  position: relative;
  display: inline-block;
  color:#666;
  font-size: 1.8rem;
  font-weight: bold;
}

/*栄養成分情報*/
.allergy-ingredients-list {
  display: flex;
  flex-wrap:wrap;
  margin-bottom: 15px;
  font-size: 1.6rem;
}
.allergy-ingredients-list>li {
  width:12.5%;
  margin-bottom: 25px;
  border:1px solid #ddd;
  border-right:0;
  overflow:hidden;
}
.allergy-ingredients-list>li:last-child {
  border-right:1px solid #ddd;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.allergy-ingredients-list>li:nth-child(1) {
}
.allergy-ingredients-list>li:nth-child(8n) {
  border-right:1px solid #ddd;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.allergy-ingredients-list>li:nth-child(8n + 1) {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.allergy-ingredients-list>li .list-head {
  display: flex;
  flex-wrap:wrap;
  justify-content: center;
  align-items: center;
  padding: 10px 5px 6px;
  min-height: 45px;
  background: #fffbf0;
}
.allergy-ingredients-list>li .list-head>span {
  display: inline-block;
}
.allergy-ingredients-list>li .list-body {
    position: relative;
    text-align: center;
    min-height: 45px;
    padding: 10px 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/*主要原産地情報*/
.allergy-origin-wrap {
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.allergy-origin-group {
  width: 100%;
  margin-bottom: 38px;
}
.allergy-origin-group.line1 {
  width: calc((100% - 30px)/2);
  margin-right: 30px;
}
.allergy-origin-group.line1 + .allergy-origin-group.line1,
.allergy-origin-group.line1 + .allergy-origin-group.line1  + .allergy-origin-group.line1 + .allergy-origin-group.line1 {
  margin-right: 0;
}
.allergy-origin-group.line1 + .allergy-origin-group.line1  + .allergy-origin-group.line1 {
  margin-right: 30px;
}
.allergy-origin-list {
  display: flex;
  flex-wrap:wrap;
  margin-bottom: 15px;
  border-radius: 10px;
  border:1px solid #ddd;
  overflow: hidden;
  font-size: 1.6rem;
}
.allergy-origin-list>li {
  width:50%;
  margin-bottom: 0;
  border-right:0;
  border-top:1px solid #ddd;
  overflow:hidden;
}
.allergy-origin-group.line1 .allergy-origin-list>li {
  width: 100%;
}
.allergy-origin-list>li.active {
  background: #fffbf0;
}
.allergy-origin-list>li:nth-child(odd) {
  border-right:1px solid #ddd;
}
.allergy-origin-group.line1 .allergy-origin-list>li {
  border-right: 0;
}
.allergy-origin-list>li:nth-child(1),
.allergy-origin-list>li:nth-child(2) {
  border-top:0;
}
.allergy-origin-list>li .list-head {
  display: flex;
  flex-wrap:wrap;
  align-items: center;
  padding: 6px 20px 6px;
  min-height: 45px;
  background: #fffbf0;
}
.allergy-origin-list>li .list-head>span {
  display: inline-block;
}
.allergy-origin-list>li .list-body  {
  position: relative;
  min-height: 45px;
  padding: 10px 20px 6px;
  display: flex;
  align-items: center;
}
.allergy-origin-block {
  display: flex;
  flex-wrap:wrap;
  justify-content: space-between;
}
.allergy-origin-box {
  width: 48.83%;
}
.allergy-origin-box .allergy-origin-list>li {
  width: 100%;
}
.allergy.origin .allergy-note-detail {
  padding-top: 10px;
}

/*アレルギー情報*/
/* .allergy-list>li .list-body>i.icon::after {
  content:'';
  position: absolute;
  width: 100%;
  height: 2px;
  top:50%;
  left:0;
  margin-top: -1px;
  background: #666666;
  z-index: 2;
}
.allergy-list>li .circle .list-body>i.icon::after {
  width:14px;
  height: 14px;
  background: #666666;
  border-radius: 50%;
  margin-top: -7px;
  left:2px;
}
.allergy-list>li .diamond .list-body>i.icon::after {
  width:9px;
  height: 9px;
  border:2px solid #666666;
  margin-top: -6px;
  left:3px;
  transform: rotate(45deg);
  background: transparent;
}
.allergy-list>li .triangle-up .list-body>i.icon::after  {
  width: 100%;
  height: 100%;
  background: transparent;
  background-image: url(../svg/allergy-triangle.svg);
  background-repeat: no-repeat;
  background-size: 18px auto;
  border: 0;
  background-position: center;
  top: 0;
  left: 0;
}
.allergy-list>li .triangle-down .list-body>i.icon::after  {
  width: 100%;
  height: 100%;
  background: transparent;
  background-image: url(../svg/allergy-triangle.svg);
  background-repeat: no-repeat;
  background-size: 18px auto;
  border: 0;
  background-position: center;
  top: 1px;
  left: 0;
  transform: rotate(180deg);
} */

.allergy-note {
  display: flex;
}
.allergy-note-detail {
  padding-top:20px; 
  margin-bottom: 38px;
}
.allergy-note-box {
  width: 586px;
}
.allergy-note-list {
  padding: 20px;
  background: #f5f5f5;
  margin-bottom: 30px;
}
.allergy-note-list>li {
  position: relative;
  display: flex;
  padding-right: 2.1em;
}
.allergy-note-list>li i {
  margin-right: 0.2em;
}
.allergy-caution {
  width: calc(100% - 586px);
  padding-left: 30px;
}
.allergy-caution-list>li {
  display: flex;
  margin-bottom: 15px;
}
.allergy-caution-list>li>span:nth-child(1) {
  white-space: nowrap;
}
.allergy-bottom {
  padding: 0 0 70px;
  margin-top:40px; 
}
.allergy-bottom .wrap {
  border-top:1px solid #ddd;
  padding-top: 40px;
}
.nutrition-box-wrap {
  margin-bottom: 60px;
}
.nutrition-box-wrap:nth-last-child(2) {
  margin-bottom: 0
}
@media screen and (max-width:1050px) {
  .allergy-note-box {
    width: 50%;
  }
  .allergy-caution {
    width: 50%;
  }
  .allergy-list>li .list-head {
    min-height: 50px;
    padding: 2px 5px;
  }
  .allergy-list>li .list-head>span {
      display: inline-block;
      font-size: 1.2rem;
  }
  .allergy-ingredients-list {
    font-size: 1.2rem;
  }
  /*media 1000*/
}

@media screen and (max-width:768px) {
  .allergy-head-title {
    font-size: 1.6rem;
  }
  .allergy-head-price {
    font-size: 1.6rem;
  }
  .allergy-nav {
      margin: 0 auto 30px;
  }
  .allergy-head-text {
    padding: 0 0 0 15px;
  }
  .allergy-nav>li {
    width: calc((100% - 6px)/3);
  }
  .allergy-nav.two>li {
    width: calc((100% - 3px)/2);
  }
  .allergy-nav>li>a {
    font-size: 1.3rem;
  }
  .category-note {
    margin: -10px auto 20px;
    padding: 0 20px;
  }
  .allergy-head {
    padding-top: 25px;
  }
  .allergy-head-block {
    margin: 20px 0 33px;
  }

  /*アレルギー情報*/
  .allergy-list {
    border-top: 1px solid #ddd;
    display: block;
    margin-bottom: 30px;
  }
  .allergy-list>li {
    width: 100%;
    margin-bottom: 0;
    border:0;
    border-bottom: 1px solid #ddd;
  }
  .allergy-list>li:last-child {
    border-right:0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .allergy-list>li:nth-child(1) {
  }
  .allergy-list>li:nth-child(6n) {
    border-right:0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .allergy-list>li:nth-child(6n + 1) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  .allergy-list>li .list-group {
    display: flex;
    padding: 0 10px 0 0;
    justify-content: space-between;
  }
  .allergy-list>li .list-head {
    min-height: 42px;
    padding: 0;
  }
  .allergy-list>li .list-head>span {
    font-size: 1.4rem;
  }
  .allergy-list>li .list-head>i.icon {
    display: block;
    margin-right: 7px;
    text-align: center;
    width: 46px;
    padding: 0 8px;
  }
  .allergy-list>li .list-body {
    position: relative;
    text-align: center;
    min-height: 42px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 0;
  }
  .allergy-list>li .list-body>i.icon::after {
    width: 14px;
    left: 2px;
  }

  /*栄養成分情報*/
  .allergy-ingredients-list {
    border-top: 1px solid #ddd;
    display: block;
    margin-bottom: 30px;
    font-size: 1.4rem;
  }
  .allergy-ingredients-list>li {
    width: 100%;
    margin-bottom: 0;
    border:0;
    border-bottom: 1px solid #ddd;
  }
  .allergy-ingredients-list>li:last-child {
    border-right:0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .allergy-ingredients-list>li:nth-child(8n) {
    border-right:0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .allergy-ingredients-list>li:nth-child(8n + 1) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  .allergy-ingredients-list>li .list-group {
    display: flex;
    padding: 0 16px 0 0;
    justify-content: space-between;
  }
  .allergy-ingredients-list>li .list-head {
    width: 130px;
    display: block;
    text-align: left;
    padding: 14px 15px 9px;
    min-height: 45px;
  }
  .allergy-ingredients-list>li .list-body {
    position: relative;
    min-height: 45px;
    padding: 14px 0 9px;
    border-top: 0;
  }

  /*主要原産地情報*/
  .allergy-origin-group {
    margin-bottom: 35px;
  }
  .allergy-origin-group.line1,
  .allergy-origin-group.line1 + .allergy-origin-group.line1,
  .allergy-origin-group.line1 + .allergy-origin-group.line1  + .allergy-origin-group.line1 + .allergy-origin-group.line1,
  .allergy-origin-group.line1 + .allergy-origin-group.line1  + .allergy-origin-group.line1 {
    width: 100%;
    margin-right: 0;
  }
  .allergy-origin-list {
    display: block;
    margin-bottom: 0;
    border-radius: 0;
    border:0;
    border-top:1px solid #ddd;
    overflow: hidden;
    font-size: 1.4rem;
  }
  .allergy-origin-list>li,
  .allergy-origin-group.line1 .allergy-origin-list>li {
    border-top:0;
    border-bottom:1px solid #ddd;
    width:100%;
    display: flex;
    height: 100%;
    justify-content: space-between;
  }
  .allergy-origin-list>li:nth-child(odd) {
    border-right:0;
  }
  .allergy-origin-list>li:last-child {
    border-right:0;
  }
  .allergy-origin-list>li:nth-child(1),
  .allergy-origin-list>li:nth-child(2) {
    border-top:0;
  }
  .allergy-origin-list>li .list-head {
    padding: 10px 20px 8px;
    min-height:0;
    width: 130px;
    background: #FFFBF0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  .allergy-origin-list>li .list-body {
    position: relative;
    display: block;
    min-height: 0;
    width: calc(100% - 130px);
    padding: 10px 20px 8px;
    background: #fff;
    text-align: left;
  }
  .allergy-origin-block {
    display: block;
  }
  .allergy-origin-box {
    width:100%;
    margin-bottom: 0;
  }
  .allergy-origin-box:nth-child(1) {
    margin-bottom: 38px;
  }
  .allergy-origin-box .allergy-origin-list>li {
    width: 100%;
  }
  .allergy.origin .allergy-note-detail {
    padding-top: 10px;
  }
  .allergy-note {
    display: block;
    margin-bottom: 25px;
  }
  .allergy-note-box {
    width: 100%;
  }
  .allergy-note-list>li {
    padding-right: 0;
  }
  .allergy-caution {
    width: 100%;
    padding-left: 0;
  }
  .allergy-note-detail {
    padding-top: 30px;
    margin-bottom: 30px;
  }
  .allergy.origin .allergy-note-detail,
  .nutrition-box-wrap + .allergy-note-detail,
  .nutrition-box + .allergy-note-detail {
    padding-top: 0;
  }
  .allergy-bottom {
    padding: 0 0 60px;
    margin-top: 30px;
  }
  .allergy-bottom .wrap {
    padding-top: 30px;
  }
  /*media 768*/ 
}

/******************
 栄養成分検索
******************/
.nutrition-calculation li {
  background: #FFFBF0;
  padding: 20px 40px;
  margin-bottom: 20px;
}
.nutrition-calculation li .arrow {
  margin-bottom: 15px;
}
.nutrition-calculation li>.flex>:first-child {
  position: relative;
  width: 588px;
}
.nutrition-calculation li>.flex>:first-child::after {
  content: '';
  position: absolute;
  left: calc(50% - 7px);
  top: calc(50% - 3px);
  width: 0;
  height: 0;
  border: 7px solid transparent;
  border-top: 8px solid #00A728;
  user-select: none;
  pointer-events: none;
}
.nutrition-calculation li>.flex>:first-child>.selectbox:first-child {
  margin-bottom: 20px;
}
.nutrition-calculation li>.flex>:last-child {
  width: calc(100% - 588px);
  padding-left: 40px;
}
.nutrition-calculation li .menu .selectbox {
  display: none;
}
.nutrition-calculation li .menu.id .selectbox.id,
.nutrition-calculation li .menu.id0 .selectbox.id0,
.nutrition-calculation li .menu.id26 .selectbox.id26,
.nutrition-calculation li .menu.id27 .selectbox.id27,
.nutrition-calculation li .menu.id1 .selectbox.id1,
.nutrition-calculation li .menu.id35 .selectbox.id35,
.nutrition-calculation li .menu.id30 .selectbox.id30,
.nutrition-calculation li .menu.id33 .selectbox.id33,
.nutrition-calculation li .menu.id7 .selectbox.id7,
.nutrition-calculation li .menu.id34 .selectbox.id34,
.nutrition-calculation li .menu.id9 .selectbox.id9,
.nutrition-calculation li .menu.id11 .selectbox.id11,
.nutrition-calculation li .menu.id32 .selectbox.id32,
.nutrition-calculation li .menu.id12 .selectbox.id12 {
  display: block;
}
.nutrition-calculation li .image {
  width: 144px;
  padding-right: 60px;
}
.nutrition-calculation li .quantity {
  position: relative;
  width: 150px;
  padding-left: 50px;
}
.nutrition-calculation li .quantity>span {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -15px;
  width: 30px;
  height: 30px;
}
.nutrition-calculation li .quantity>span::before,
.nutrition-calculation li .quantity>span::after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 30px;
  height: 4px;
  margin-top: -2px;
  background: #00A728;
  transform: rotate(45deg);
}
.nutrition-calculation li .quantity>span::after {
  transform: rotate(-45deg);
}
.nutrition-equal {
  padding-top: 20px;
  position: relative;
}
.nutrition-equal::before,
.nutrition-equal::after {
  content: '';
  position: absolute;
  bottom: -38px;
  left: calc(50% - 8px);
  width: 4px;
  height: 20px;
  background: #00A728;
}
.nutrition-equal::after {
  left: calc(50% + 4px);
}
.nutrition-headline {
  position: relative;
  font-size: 1.8rem;
  font-weight: normal;
  text-align: center;
  background: #f5f5f5;
  padding: 5px;
  margin-bottom: 40px;
}
.nutrition-headline::before {
  content: '';
  position: absolute;
  left: calc(50% - 14px);
  bottom: -32px;
  width: 0;
  height: 0;
  border: 14px solid transparent;
  border-top: 18px solid #f5f5f5;
  user-select: none;
  pointer-events: none;
}
@media screen and (max-width: 1050px) {
  .nutrition-calculation li>.flex>:first-child {
    width: calc(100% - 334px);
  }
  .nutrition-calculation li>.flex>:last-child {
    width: 334px;
  }
}
@media screen and (max-width: 768px) {
  .nutrition-calculation li {
    padding: 15px 20px;
    margin-bottom: 15px;
  }
  .nutrition-calculation li>.flex>:first-child {
    width: 100%;
    margin-bottom: 15px;
  }
  .nutrition-calculation li>.flex>:last-child {
    width: 100%;
    padding-left: 0px;
    justify-content: space-between;
  }
  .nutrition-calculation li .image {
    width: 104px;
    padding-right: 20px;
  }
  .nutrition-equal {
    position: relative;
    padding-top: 20px;
  }
  .nutrition-headline {
    font-size: 1.4rem;
    padding: 10px;
    margin-bottom: 30px;
  }
}

/*====================================
/* 04.店舗系 (店舗詳細/店舗を探す)
====================================*/
#view.noactive{
  position: relative;
  min-height: 840px;
  background: url(/common/shop/image/loading.gif) center 40% no-repeat;
}
/******************
  店舗検索TOP
******************/
.shop-search {
  padding-top: 55px;
}
.shop-search .headline-l {
  margin-bottom: 35px;
}
.shop-search-head {
  background: #FFFBF0;
  padding: 30px 0;
}
.shop-search-head .wrap-s {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
}
.shop-search-head .form {
  padding-left: 30px;
  position: relative;
  width: calc(100% - 370px);
}
.shop-search-head button {
  position: absolute;
  top: 50%;
  right: 0;
  width: 45px;
  height: 45px;
  -webkit-appearance: none;
  appearance: none;
  transform: translateY(-50%);
  background: url(../svg/icon-search.svg) 7px center no-repeat;
  background-size: 18px;
}
.shop-search-title {
  font-size: 3.2rem;
  font-weight: normal;
  margin-bottom: 40px;
}
/*768px以下*/
@media screen and (max-width: 768px) {
  .input {
    height: 48px;
  }
  .shop-search {
    padding-top: 37px;
  }
  .shop-search-head .wrap-s {
    display: block;
    padding: 0 20px;
    text-align: center;
  }
  .shop-search-head .form {
    padding-left: 0;
    margin-top: 20px;
    width: 100%;
  }
  .shop-search-title {
    font-size: 2.2rem;
    margin-bottom: 20px;
  }
}

/*エリアから探す*/
.shop-search-map {
  padding: 56px 0 80px;
}
.map-area {
  position: relative;
  padding-left: 25%;
  padding-bottom: 217px;
}
.map-area .map-image {
  position: relative;
  width: 498px;
  height: 428px;
}
.map-area .map-image .line {
  position: absolute;
}
.map-area .map-image .line::after {
  content: '';
  position: absolute;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  transform-origin: center;
  transform: translate(-50%,-50%);
}
.map-area .map-image .line.type1 {
  left: 88%;
  top: 12%;
  width: 170px;
  height: 3px;
  background: #DFE8F5;
}
.map-area .map-image .line.type1::after {
  background: #DFE8F5;
  left: 0;
  top: 1.5px;
}
.map-area .map-image .line.type2 {
  left: 81%;
  top: 12%;
  width: 154px;
  height: 143px;
  border-right: 3px solid #DFE8F5;
  border-bottom: 3px solid #DFE8F5;
}
.map-area .map-image .line.type2::after {
  background: #DFE8F5;
  left: 0;
  top: 100%;
}
.map-area .map-image .line.type3 {
  left: 81%;
  top: 73%;
  width: 200px;
  height: 3px;
  background: #D8F2E0;
}
.map-area .map-image .line.type3::after {
  background: #D8F2E0;
  left: 0;
  top: 1.5px;
}
.map-area .map-image .line.type4 {
  left: 61%;
  top: 94%;
  width: 130px;
  height: 3px;
  background: #E9F5D0;
  transform: rotate(75deg);
}
.map-area .map-image .line.type4::after {
  background: #E9F5D0;
  left: 0;
  top: 1.5px;
}
.map-area .map-image .line.type5 {
  left: 34%;
  top: 52%;
  width: 148px;
  height: 3px;
  background: #FFF7CC;
  transform: rotate(236deg);
}
.map-area .map-image .line.type5::after {
  background: #FFF7CC;
  left: 0;
  top: 1.5px;
}
.map-area .map-image .line.type6 {
  left: 24%;
  top: 104%;
  width: 130px;
  height: 3px;
  background: #F5DFD3;
  transform: rotate(100deg);
}
.map-area .map-image .line.type6::after {
  background: #F5DFD3;
  left: 0;
  top: 1.5px;
}
.map-area .map-image .line.type7 {
  left: -21%;
  top: 55%;
  width: 314px;
  height: 3px;
  background: #FCE5BB;
  transform: rotate(201deg);
}
.map-area .map-image .line.type7::after {
  background: #FCE5BB;
  left: 0;
  top: 1.5px;
}
.map-area .map-image .line.type8 {
  left: -21%;
  top: 81%;
  width: 200px;
  height: 3px;
  background: #FCE4E3;
  transform: rotate(180deg);
}
.map-area .map-image .line.type8::after {
  background: #FCE4E3;
  left: 0;
  top: 1.5px;
}
.map-area .map-image .line.type9 {
  left: -10%;
  top: 81%;
  width: 66px;
  height: 62px;
  border-left: 3px solid #FCE4E3;
  border-bottom: 3px solid #FCE4E3;
}
.map-area .map-image .line.type9::after {
  background: #FCE4E3;
  left: 100%;
  top: 100%;
}
@media screen and (max-width: 1200px) {
  .map-area .map-image .line.type2 {
    width: 104px;
  }
}
@media screen and (max-width: 1120px) {
  .map-area {
    padding-left: 23%;
  }
}
.shop-map-area {
  position: absolute;
  border-radius: 10px;
  padding: 15px 13px 15px;
  max-width: 300px;
  background: #fff;
}
.shop-map-area.area1 {
  background: #DFE8F5;
  top: 0;
  right: 0;
}
.shop-map-area.area2 {
  background: #D8F2E0;
  top: 40%;
  right: 0;
}
.shop-map-area.area3 {
  background: #E9F5D0;
  bottom: 0;
  left: 48%;
}
.shop-map-area.area4 {
  background: #FFF7CC;
  top: 0;
  left: 20%;
}
.shop-map-area.area5 {
  max-width: 210px;
  background: #F5DFD3;
  bottom: 0;
  left: 27%;
}
.shop-map-area.area6 {
  max-width: 210px;
  background: #FCE5BB;
  top: 0;
  left: 0;
}
.shop-map-area.area7 {
  max-width: 210px;
  background: #FCE4E3;
  top: 36%;
  left: 0;
}
.shop-map-area .title {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 5px;
}
.shop-map-area ul {
  display: flex;
  flex-wrap: wrap;
}
.shop-map-area ul li {
  padding: 5px;
}
.shop-map-area ul li a {
  display: block;
  width: 80px;
  line-height: 30px;
  text-align: center;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
@media screen and (max-width: 1120px) {
  .shop-map-area {
    max-width: 240px;
  }
  .shop-map-area.area5,
  .shop-map-area.area6,
  .shop-map-area.area7 {
    max-width: 170px;
  }
  .shop-map-area ul li a {
    width: 60px;
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 1000px) {
  .shop-search-map {
    padding: 27px 0 0;
    border-bottom: 1px solid #ddd
  }
  .shop-search-map .shop-search-title {
    margin-left: 20px;
  }
  .shop-search-map .wrap {
    padding: 0;
  }
  .map-area {
    padding-left: 0;
    padding-bottom: 0;
  }
  .map-area .map-image {
    display: none;
  }
  .shop-map-area {
    position: relative;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    border-radius: 0px;
    padding: 0;
    max-width: 100% !important;
    background: #fff !important;
  }
  .shop-map-area .title {
    display: none;
  }
  .shop-map-area .button-toggle.sp {
    display: block !important;
    position: relative;
    line-height: 50px;
    font-weight: bold;
    height: 50px;
    padding: 0 20px;
    border-top: 1px solid #ddd;
  }
  .shop-map-area .button-toggle.open {
    color: #00A728;
  }
  .shop-map-area .button-toggle::before {
    content: '';
    width: 18px;
    height: 2px;
    background: #00A728;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -1px;
  }
  .shop-map-area .button-toggle::after {
    content: '';
    width: 2px;
    height: 18px;
    background: #00A728;
    position: absolute;
    top: 50%;
    right: 28px;
    margin-top: -9px;
  }
  .shop-map-area .button-toggle.open::after {
    display: none;
  }
  .shop-map-area .button-toggle + div {
    display: none;
  }
  .shop-map-area ul {
    display: block;
    background: #f5f5f5;
    padding: 0 20px;
  }
  .shop-map-area ul li {
    padding: 0;
    border-bottom: 1px dashed #ddd;
  }
  .shop-map-area ul li:last-child {
    border: none;
  }
  .shop-map-area ul li a {
    position: relative;
    width: 100%;
    height: 50px;
    font-size: 1.4rem;
    line-height: 50px;
    text-align: left;
    background: none;
    border-radius: 0;
    box-shadow: none;
  }
  .shop-map-area ul li a::after {
    content: '';
    position: absolute;
    right: 0px;
    top: 50%;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-left: 7px solid #00a728;
    transform: translateY(-50%);
  }
}
/*サービスから探す*/
.shop-search-service {
  background: #FFFBF0;
  padding: 56px 0 80px;
}
.shop-search-flex {
  display: flex;
  align-items: center;
  margin-bottom: 40px;
}
.shop-search-flex * {
  margin-bottom: 0;
}
.shop-search-flex .shop-search-title {
  margin-right: 60px;
}
.service-check-area {
  padding-bottom: 18px;
}
.service-check-area .title {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 22px;
  margin-bottom: 17px;
}
.service-check-area + .button-area {
  padding-top: 28px;
}
.service-checkbox {
  display: flex;
  flex-wrap: wrap;
}
.service-checkbox label {
  position: relative;
  cursor: pointer;
  margin: 0 24px 24px 0;
}
.service-checkbox label:nth-child(5n) {
  margin-right: 0;
}
.service-checkbox label input {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.service-checkbox label span {
  position: relative;
  display: flex;
  align-items: center;
  width: 220px;
  max-width: 100%;
  height: 55px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  line-height: 18px;
  padding: 0 20px 0 70px;
}
.service-checkbox label input:checked + span {
  background: #00A728;
  box-shadow: none;
  color: #fff;
}
.service-checkbox label span::after {
  content: '';
  position: absolute;
  left: 0px;
  top: 0px;
  width: 70px;
  height: 55px;
}
.service-checkbox label.type1 span::after {
  background: url(../shop/svg/search/asamos.svg) center center no-repeat;
}
.service-checkbox label.type1 input:checked + span::after {
  background: url(../shop/svg/search/asamos_on.svg) center center no-repeat;
}
.service-checkbox label.type2 span::after {
  background: url(../shop/svg/search/alcohol.svg) center center no-repeat;
}
.service-checkbox label.type2 input:checked + span::after {
  background: url(../shop/svg/search/alcohol_on.svg) center center no-repeat;
}
.service-checkbox label.type3 span::after {
  background: url(../shop/svg/search/special.svg) center center no-repeat;
}
.service-checkbox label.type3 input:checked + span::after {
  background: url(../shop/svg/search/special_on.svg) center center no-repeat;
}
.service-checkbox label.type4 span::after {
  background: url(../shop/svg/search/cafe.svg) center center no-repeat;
}
.service-checkbox label.type4 input:checked + span::after {
  background: url(../shop/svg/search/cafe_on.svg) center center no-repeat;
}
.service-checkbox label.type5 span::after {
  background: url(../shop/svg/search/goods.svg) center center no-repeat;
}
.service-checkbox label.type5 input:checked + span::after {
  background: url(../shop/svg/search/goods_on.svg) center center no-repeat;
}
.service-checkbox label.type6 span::after {
  background: url(../shop/svg/search/takeout.svg) center center no-repeat;
}
.service-checkbox label.type6 input:checked + span::after {
  background: url(../shop/svg/search/takeout_on.svg) center center no-repeat;
}
.service-checkbox label.type7 span::after {
  background: url(../shop/svg/search/delivery.svg) center center no-repeat;
}
.service-checkbox label.type7 input:checked + span::after {
  background: url(../shop/svg/search/delivery_on.svg) center center no-repeat;
}
.service-checkbox label.type8 span::after {
  background: url(../shop/svg/search/phone.svg) center center no-repeat;
}
.service-checkbox label.type8 input:checked + span::after {
  background: url(../shop/svg/search/phone_on.svg) center center no-repeat;
}
.service-checkbox label.type9 span::after {
  background: url(../shop/svg/search/drive.svg) center center no-repeat;
}
.service-checkbox label.type9 input:checked + span::after {
  background: url(../shop/svg/search/drive_on.svg) center center no-repeat;
}
.service-checkbox label.type10 span::after {
  background: url(../shop/svg/search/credit.svg) center center no-repeat;
}
.service-checkbox label.type10 input:checked + span::after {
  background: url(../shop/svg/search/credit_on.svg) center center no-repeat;
}
.service-checkbox label.type11 span::after {
  background: url(../shop/svg/search/emoney.svg) center center no-repeat;
}
.service-checkbox label.type11 input:checked + span::after {
  background: url(../shop/svg/search/emoney_on.svg) center center no-repeat;
}
.service-checkbox label.type12 span::after {
  background: url(../shop/svg/search/dpoint.svg) center center no-repeat;
}
.service-checkbox label.type12 input:checked + span::after {
  background: url(../shop/svg/search/dpoint_on.svg) center center no-repeat;
}
.service-checkbox label.type13 span::after {
  background: url(../shop/svg/search/barcode.svg) center center no-repeat;
}
.service-checkbox label.type13 input:checked + span::after {
  background: url(../shop/svg/search/barcode_on.svg) center center no-repeat;
}
.service-checkbox label.type14 span::after {
  background: url(../shop/svg/search/parking.svg) center center no-repeat;
}
.service-checkbox label.type14 input:checked + span::after {
  background: url(../shop/svg/search/parking_on.svg) center center no-repeat;
}
.service-checkbox label.type15 span::after {
  background: url(../shop/svg/search/plug.svg) center center no-repeat;
}
.service-checkbox label.type15 input:checked + span::after {
  background: url(../shop/svg/search/plug_on.svg) center center no-repeat;
}
.service-checkbox label.type16 span::after {
  background: url(../shop/svg/search/wifi-free.svg) center center no-repeat;
}
.service-checkbox label.type16 input:checked + span::after {
  background: url(../shop/svg/search/wifi-free_on.svg) center center no-repeat;
}
.service-checkbox label.type17 span::after {
  background: url(../shop/svg/search/wifi-softbank.svg) center center no-repeat;
}
.service-checkbox label.type17 input:checked + span::after {
  background: url(../shop/svg/search/wifi-softbank_on.svg) center center no-repeat;
}
.service-checkbox label.type18 span::after {
  background: url(../shop/svg/search/wifi-docomo.svg) center center no-repeat;
}
.service-checkbox label.type18 input:checked + span::after {
  background: url(../shop/svg/search/wifi-docomo_on.svg) center center no-repeat;
}
.service-checkbox label.type19 span::after {
  background: url(../shop/svg/search/wifi-au.svg) center center no-repeat;
}
.service-checkbox label.type19 input:checked + span::after {
  background: url(../shop/svg/search/wifi-au_on.svg) center center no-repeat;
}
@media screen and (max-width: 768px) {
  .shop-search-service {
    padding: 47px 0 50px;
  }
  .shop-search-flex {
    display: block;
    max-width: 100%;
    margin-bottom: 30px;
  }
  .shop-search-flex .shop-search-title {
    margin: 0 0 20px;
  }
  .service-check-area {
    padding-bottom: 27px;
  }
  .service-check-area .title {
    font-size: 1.6rem;
  }
  .service-check-area + .button-area {
    padding-top: 0;
  }
  .service-checkbox {
    display: flex;
    flex-wrap: wrap;
  }
  .service-checkbox label,
  .service-checkbox label:nth-child(5n) {
    margin: 0 10px 10px 0;
    width: calc((100% - 30px) / 4);
  }
  .service-checkbox label:nth-child(4n) {
    margin-right: 0;
  }
  .service-checkbox label input {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
  }
  .service-checkbox label span {
    justify-content: center;
    text-align: center;
    width: 100%;
    height: 104px;
    font-size: 1.0rem;
    line-height: 1.4em;
    padding: 59px 0.5em 5px;
  }
  .service-checkbox label span::after {
    content: '';
    position: absolute;
    left: 0px;
    top: 13px;
    width: 100%;
    height: 40px;
  }
  .service-checkbox label.type1 span::after {
    background: url(../shop/svg/search/asamos.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type1 input:checked + span::after {
    background: url(../shop/svg/search/asamos_on.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type2 span::after {
    background: url(../shop/svg/search/alcohol.svg) center center no-repeat;
    background-size: auto 40px;
    left: 4px;
  }
  .service-checkbox label.type2 input:checked + span::after {
    background: url(../shop/svg/search/alcohol_on.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type3 span::after {
    background: url(../shop/svg/search/special.svg) center center no-repeat;
    background-size: auto 38px;
  }
  .service-checkbox label.type3 input:checked + span::after {
    background: url(../shop/svg/search/special_on.svg) center center no-repeat;
    background-size: auto 38px;
  }
  .service-checkbox label.type4 span::after {
    background: url(../shop/svg/search/cafe.svg) center center no-repeat;
    background-size: auto 30px;
  }
  .service-checkbox label.type4 input:checked + span::after {
    background: url(../shop/svg/search/cafe_on.svg) center center no-repeat;
    background-size: auto 30px;
  }
  .service-checkbox label.type5 span::after {
    background: url(../shop/svg/search/goods.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type5 input:checked + span::after {
    background: url(../shop/svg/search/goods_on.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type6 span::after {
    background: url(../shop/svg/search/takeout.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type6 input:checked + span::after {
    background: url(../shop/svg/search/takeout_on.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type7 span::after {
    background: url(../shop/svg/search/delivery.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type7 input:checked + span::after {
    background: url(../shop/svg/search/delivery_on.svg) center center no-repeat;
    background-size: auto 40px;
  }
  .service-checkbox label.type8 span::after {
    background: url(../shop/svg/search/phone.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type8 input:checked + span::after {
    background: url(../shop/svg/search/phone_on.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type9 span::after {
    background: url(../shop/svg/search/drive.svg) center center no-repeat;
    background-size: auto 23px;
  }
  .service-checkbox label.type9 input:checked + span::after {
    background: url(../shop/svg/search/drive_on.svg) center center no-repeat;
    background-size: auto 23px;
  }
  .service-checkbox label.type10 span::after {
    background: url(../shop/svg/search/credit.svg) center center no-repeat;
    background-size: auto 28px;
  }
  .service-checkbox label.type10 input:checked + span::after {
    background: url(../shop/svg/search/credit_on.svg) center center no-repeat;
    background-size: auto 28px;
  }
  .service-checkbox label.type11 span::after {
    background: url(../shop/svg/search/emoney.svg) center center no-repeat;
    background-size: auto 28px;
  }
  .service-checkbox label.type11 input:checked + span::after {
    background: url(../shop/svg/search/emoney_on.svg) center center no-repeat;
    background-size: auto 28px;
  }
  .service-checkbox label.type12 span::after {
    background: url(../shop/svg/search/dpoint.svg) center center no-repeat;
    background-size: auto 28px;
  }
  .service-checkbox label.type12 input:checked + span::after {
    background: url(../shop/svg/search/dpoint_on.svg) center center no-repeat;
    background-size: auto 28px;
  }
  .service-checkbox label.type13 span::after {
    background: url(../shop/svg/search/barcode.svg) center center no-repeat;
    background-size: auto 23px;
  }
  .service-checkbox label.type13 input:checked + span::after {
    background: url(../shop/svg/search/barcode_on.svg) center center no-repeat;
    background-size: auto 23px;
  }
  .service-checkbox label.type14 span::after {
    background: url(../shop/svg/search/parking.svg) center center no-repeat;
    background-size: auto 36px;
  }
  .service-checkbox label.type14 input:checked + span::after {
    background: url(../shop/svg/search/parking_on.svg) center center no-repeat;
    background-size: auto 36px;
  }
  .service-checkbox label.type15 span::after {
    background: url(../shop/svg/search/plug.svg) center center no-repeat;
    background-size: auto 38px;
  }
  .service-checkbox label.type15 input:checked + span::after {
    background: url(../shop/svg/search/plug_on.svg) center center no-repeat;
    background-size: auto 38px;
  }
  .service-checkbox label.type16 span::after {
    background: url(../shop/svg/search/wifi-free.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type16 input:checked + span::after {
    background: url(../shop/svg/search/wifi-free_on.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type17 span::after {
    background: url(../shop/svg/search/wifi-softbank.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type17 input:checked + span::after {
    background: url(../shop/svg/search/wifi-softbank_on.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type18 span::after {
    background: url(../shop/svg/search/wifi-docomo.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type18 input:checked + span::after {
    background: url(../shop/svg/search/wifi-docomo_on.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type19 span::after {
    background: url(../shop/svg/search/wifi-au.svg) center center no-repeat;
    background-size: auto 39px;
  }
  .service-checkbox label.type19 input:checked + span::after {
    background: url(../shop/svg/search/wifi-au_on.svg) center center no-repeat;
    background-size: auto 39px;
  }
}

/*グループ店舗を探す*/
.shop-search-group {
  padding: 56px 0 52px;
  border-bottom: 1px solid #ddd;
}
.group-shop-list {
  display: flex;
  flex-wrap: wrap;
}
.group-shop-list li {
  width: calc((100% - 48px) / 3);
  margin: 0 24px 28px 0;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
.group-shop-list li:nth-child(3n) {
  margin-right: 0px;
}
.group-shop-list li a {
  display: flex;
  align-items: center;
  min-height: 55px;
  padding-right: 1em;
}
.group-shop-list .image {
  width: 124px;
  padding: 0 8px;
  text-align: center;
}
.group-shop-list span {
  width: calc(100% - 124px);
}
@media screen and (max-width: 768px) {
  .shop-search-group {
    padding: 47px 0 45px;
  }
  .group-shop-list li {
    width: calc((100% - 20px) / 3);
    margin: 0 10px 15px 0;
  }
  .group-shop-list li:nth-child(3n) {
    margin-right: 0px;
  }
  .group-shop-list li a {
    display: block;
    padding-right: 0;
  }
  .group-shop-list .image {
    width: 100%;
    height: 63px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .group-shop-list span {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5em 0.9em;
    font-size: 1.3rem;
    width: 100%;
    min-height: 62px;
  }
}

/*新店オープン情報、マイ店舗情報*/
.shop-search-open {
  margin-bottom: 80px;
}
.shop-search-open>.wrap {
  background: #f6f6f6;
  padding: 56px 100px 50px;
}
.shop-open-title {
  font-size: 1.8rem;
  margin-bottom: 15px;
}
.shop-open-none {
  padding: 0 30px 30px;
}
.shop-open-list {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #ddd;
  margin-bottom: 35px;
}
.shop-open-list::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 1px;
  background: #ddd;
}
.shop-open-list li {
  width: 50%;
  border-bottom: 1px dashed #ddd;
  position: relative;
}
.shop-open-list li:nth-child(2n-1) {
  border-right: 1px dashed #ddd;
}
.shop-open-list li a {
  display: block;
  padding: 17px 30px;
}
.shop-open-list .time {
  display: block;
  font-size: 1.3rem;
  color: #888;
  margin-bottom: 10px;
}

.shop-search-my {
  padding: 96px 0 120px;
}
.shop-my-list {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #ddd;
  margin-bottom: 50px;
}
.shop-my-list::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 1px;
  background: #ddd;
}
.shop-my-list li {
  width: 50%;
  position: relative;
  border-bottom: 1px dashed #ddd;
}
.shop-my-list li:nth-child(2n-1) {
  border-right: 1px dashed #ddd;
}
.shop-my-list li a {
  display: block;
  padding: 17px 30px;
}
@media screen and (max-width: 768px) {
  .shop-search-open {
    margin-top: 30px;
    margin-bottom: 50px;
  }
  .shop-search-open>.wrap {
    padding: 40px 20px 15px;
    margin: 0 20px;
  }
  .shop-open-title {
    font-size: 1.6rem;
    margin-bottom: 12px;
  }
  .shop-open-none {
    padding: 0 0 30px;
  }
  .shop-open-list {
    display: block;
    border-bottom: 1px solid #ddd;
  }
  .shop-open-list::after {
    display: none;
  }
  .shop-open-list li,
  .shop-open-list li:nth-child(2n-1) {
    width: 100%;
    border: none;
    border-bottom: 1px dashed #ddd;
  }
  .shop-open-list li:last-child {
    border-bottom: none;
  }
  .shop-open-list li a {
    display: block;
    padding: 17px 0px;
  }
  .shop-open-list .time {
    margin-bottom: 5px;
  }
  .shop-search-my {
    padding: 57px 0 70px;
  }
  .shop-my-list {
    display: block;
    margin-bottom: 40px;
  }
  .shop-my-list li {
    width: 100%;
  }
  .shop-my-list li:nth-child(2n-1) {
    border-right: none;
  }
  .shop-my-list li a {
    display: block;
    padding: 17px 0;
  }
}
/*海外のモス＆アルバイト・パート募集*/
.shop-search-box {
  padding: 56px 0 80px;
  background: #F5F5F5;
}
.shop-search-box.overseas {
  background: #FFFBF0;
}
.shop-search-box .image {
  width: 500px;
  padding-left: 100px;
}
.shop-search-box .info {
  width: calc(100% - 500px);
  padding-left: 40px;
}
.shop-search-box .info p {
  line-height: 26px;
  margin-bottom: 45px;
}
.shop-search-box .info .button-area {
  justify-content: start;
}
.shop-search-box .info .button-area a {
  margin-left: 0;
}
@media screen and (max-width: 1000px) {
  .shop-search-box .image {
    width: 400px;
    padding-left: 0px;
  }
  .shop-search-box .info {
    width: calc(100% - 400px);
    padding-left: 20px;
  }
}
@media screen and (max-width: 768px) {
  .shop-search-box {
    padding: 37px 0 50px;
  }
  .shop-search-box .image {
    width: 100%;
    text-align: center;
    margin-bottom: 15px;
  }
  .shop-search-box .info {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    padding-left: 0px;
  }
  .shop-search-box .info p {
    line-height: 22px;
  }
  .shop-search-box .info .button-area {
    justify-content: center;
  }
}

/******************
  店舗検索（都道府県）
******************/
.area-select-message {
  position: relative;
  padding: 16px 0;
  margin-bottom: 35px;
}
.area-select-message::after {
  content: "";
  display: block;
  position: absolute;
  width: 100vw;
  height: 100%;
  top: 0;
  left: 0;
  margin-left: calc(50% - 50vw);
  z-index: -1;
  background: #FFFBF0;
}
.area-message {
  margin-bottom: 35px;
}
.pref-title {
  font-size: 2.2rem;
  line-height: 1.636em;
  font-weight: normal;
  margin-bottom: 20px;
}
.area-pref-wrap {
  padding-bottom: 36px;
}
.area-pref-wrap:last-child {
  padding-bottom: 0;
}
.area-pref-wrap .button-toggle {
  display: none;
}
.area-pref-wrap .title {
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 15px;
}
.pref-list {
  display: flex;
  flex-wrap: wrap;
}
.pref-list li {
  width: 20%;
  border-bottom: 1px dashed #ddd;
  border-right: 1px dashed #ddd;
}
.pref-list li:nth-child(5n),
.pref-list li:last-child {
  border-right: none;
}
.pref-list li:nth-child(-n+5) {
  border-top: 1px solid #ddd;
}
.pref-list li:nth-last-child(-n+5) {
  border-bottom: 1px solid #ddd;
}
.pref-list li a {
  display: flex;
  align-items: center;
  height: 55px;
  padding: 0 15px 0 30px;
}
@media screen and (max-width: 768px) {
  .area-pref-wrap {
    padding-bottom: 0px;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .area-pref-wrap:last-child {
    border-bottom: 1px solid #ddd;
  }
  .area-pref-wrap .button-toggle {
    display: none;
  }
  .area-pref-wrap .title {
    display: none;
  }
  .area-pref-wrap .button-toggle {
    display: block;
    position: relative;
    line-height: 50px;
    font-weight: bold;
    height: 50px;
    padding: 0 20px;
    border-top: 1px solid #ddd;
  }
  .area-pref-wrap .button-toggle.open {
    color: #00A728;
  }
  .area-pref-wrap .button-toggle::before {
    content: '';
    width: 18px;
    height: 2px;
    background: #00A728;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -1px;
  }
  .area-pref-wrap .button-toggle::after {
    content: '';
    width: 2px;
    height: 18px;
    background: #00A728;
    position: absolute;
    top: 50%;
    right: 28px;
    margin-top: -9px;
  }
  .area-pref-wrap .button-toggle.open::after {
    display: none;
  }
  .area-pref-wrap .button-toggle + div {
    display: none;
  }
  .pref-list {
    position: relative;
    border-top: 1px dashed #ddd;
  }
  .pref-list::after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #fff;
  }
  .pref-list li,
  .pref-list li:nth-child(5n),
  .pref-list li:nth-last-child(-n+5),
  .pref-list li:nth-child(-n+5) {
    width: 50%;
    border: none;
    border-bottom: 1px dashed #ddd;
    border-right: 1px dashed #ddd;
  }
  .pref-list li:nth-child(2n) {
    border-right: none;
  }
  .pref-list li a {
    padding: 0 20px;
  }
}

/******************
  店舗検索（市区町村）
******************/
.city-list {
  display: flex;
  flex-wrap: wrap;
}
.city-list li {
  width: 20%;
  border-bottom: 1px dashed #ddd;
  border-right: 1px dashed #ddd;
}
.city-list li:nth-child(5n),
.city-list li:last-child {
  border-right: none;
}
.city-list li:nth-child(-n+5) {
  border-top: 1px solid #ddd;
}
.city-list li:nth-last-child(-n+5) {
  border-bottom: 1px solid #ddd;
}

.city-list li a {
  display: flex;
  align-items: center;
  height: 55px;
  padding: 0 15px 0 30px;
}
@media screen and (max-width: 768px) {
  .city-list {
    position: relative;
    border-top: 1px solid #ddd;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .city-list::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #ddd;
  }
  .city-list li,
  .city-list li:nth-child(5n),
  .city-list li:nth-last-child(-n+5),
  .city-list li:nth-child(-n+5) {
    width: 50%;
    border: none;
  }
  .city-list li a {
    padding: 0 20px;
    border-bottom: 1px dashed #ddd;
    border-right: 1px dashed #ddd;
  }
  .city-list li:nth-child(2n) a {
     border-right: none;
  }
}

/******************
  店舗検索結果
******************/
.shop-result-head {
  padding-top: 55px;
}
.shop-result-head .headline-l {
  margin-bottom: 15px;
}
.result-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.result-info .shop-count .count {
  font-size: 2.2rem;
  font-weight: bold;
  margin-right: 5px;
}
.result-info .shop-count .notfind {
  color: #E90000;
}
.result-info .button-modal {
  width: 170px;
  height: 38px; 
  font-size: 1.4rem;
  line-height: 36px;
  text-align: center;
  border: 1px solid #ddd;
  border-radius: 25px;
  box-shadow: 0 3px 7px rgba(0,0,0,0.06);
}
.result-word {
  background: #FFFBF0;
  margin-bottom: 15px;
  white-space: nowrap;
  overflow: hidden;
}
.result-word .wrap {
  position: relative;
}
.result-word .wrap::after {
  content: '';
  position: absolute;
  right: 0px;
  top: 0px;
  width: 150px;
  height: 100%;
  background: linear-gradient(to right, rgba(250,247,240,0), rgba(250,247,237,1) 75%, rgba(250,251,240,1) 100%);
  z-index: 2;
  pointer-events: none;
}
.result-word .swiper-container {
  padding: 16px 30px;
}
.result-word .swiper-slide {
  width: auto;
}
.result-word .swiper-button-prev {
  left: -10px;
}
.result-word .swiper-button-prev::after {
  width: 15px;
  height: 15px;
  border-top: 2px solid #00A728;
  border-left: 2px solid #00A728;
}
.result-word .swiper-button-next {
  right: -10px;
}
.result-word .swiper-button-next::after {
  width: 15px;
  height: 15px;
  border-top: 2px solid #00A728;
  border-right: 2px solid #00A728;
}
.result-word .swiper-button-disabled {
  display: none;
}
.result-word-bottom {
  padding: 15px 0;
}
.result-word-bottom .meta-icon-link {
  margin-bottom: 0;
}
.shop-result {
  padding-bottom: 30px;
}
.shop-result-group {
  background: #f5f5f5;
  padding: 56px 0 45px;
  margin: 15px 0 30px;
}
.shop-result-bottom {
  padding-bottom: 45px;
}
.shop-result-notfind {
  padding: 42px 0 100px;
}
.shop-result-notfind p {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 47px;
}
.shop-result-banner {
  display: none;
  padding: 50px 0 20px;
  border-top: 1px solid #ddd;
}
.shop-result-banner.active {
  display: block;
}
@media screen and (max-width: 768px) {
  .shop-result-head {
    padding-top: 37px;
  }
  .shop-result-head .headline-l {
    margin-bottom: 37px;
  }
  .result-info .shop-count .count {
    font-size: 1.8rem;
  }
  .result-info .button-modal {
    width: 120px;
    height: 38px; 
  }
  .result-word {
    margin-bottom: 10px;
  }
  .result-word .wrap::after {
    width: 73px;
  }
  .result-word .swiper-container {
    padding: 11px 0px;
  }
  .result-word .swiper-button-prev,
  .result-word .swiper-button-next {
    display: none;
  }
  .result-word-bottom{
    padding: 20px 20px 0;
  }
  .shop-result {
    padding-bottom: 30px;
  }
  .shop-result-group {
    padding: 40px 0 20px;
    margin: 0px 0 30px;
  }
  .shop-result-bottom {
    padding-bottom: 25px;
  }
  .shop-result-notfind {
    padding: 37px 0 60px;
  }
  .shop-result-notfind p {
    font-size: 1.6rem;
    margin-bottom: 37px;
  }
  .shop-result-banner {
    padding: 40px 0 25px;
  }
}

/*店舗一覧リスト*/
.shop-result-list {
  position: relative;
  border-top: 1px solid #dddddd;
}
.shop-result .shop-result-list {
  border-top: none;
}
.shop-result-list + .button-more {
  margin-top: 50px;
}
.shop-result-list>li {
  padding: 35px 0 25px;
  border-bottom: 1px dashed #dddddd;
}
.shop-result-list>li:last-child {
  border-bottom: 1px solid #dddddd;
}
.shop-result .shop-result-list>li:last-child,
.shop-result-group .shop-result-list>li:last-child {
  border-bottom: none;
}
.shop-result-block {
  display: flex;
  align-items: center;
}
.shop-result-block .list-box {
  width: calc(100% - 340px);
}
.shop-result-block .list-button {
  width: 340px;
}
.shop-result-block .list-button a{
  margin-bottom: 28px;
}
.shop-result-block .list-button a:last-child{
  margin-bottom: 0;
}
.shop-result-block .list-head {
  display: flex;
  align-items: center;
  margin-bottom: 28px;
}
.shop-result-block .list-head-icon {
  padding-right: 20px;
}
.shop-result-block .list-head-title {
  font-size: 2.2rem;
  line-height: 1.36em;
}
.shop-result-block .list-head-title .arrow::after {
  top: 9px;
}
.gps-distance {
  margin-left: 40px;
}
.shop-result-block .list-message {
  margin-bottom: 15px;
}
.shop-result-block .list-icon {
  display: flex;
  flex-wrap:wrap;
}
.shop-result-block .list-icon>li {
  margin-right: 10px;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .shop-result-list {
    position: relative;
    border-top: 1px solid #dddddd;
    padding: 0 5px;
  }
  .shop-result-list + .button-more {
    margin-top: 30px;
  }
  .shop-result-list>li {
    padding: 30px 0 20px;
    border-bottom: 1px dashed #dddddd;
  }
  .shop-result-list>li:last-child {
    border-bottom: 1px solid #dddddd;
  }
  .shop-result-block {
    position: relative;
    display: block;
  }
  .shop-result-block .list-box {
    width: 100%;
  }
  .shop-result-block .list-button {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 10px 0;
  }
  .shop-result-block .list-button a {
    margin-bottom: 20px;
  }
  .shop-result-block .list-button .button::after {
    right: 12px;
  }
  .shop-result-block .list-head {
    margin-bottom: 20px;
    align-items: start;
  }
  .shop-result-block .list-head-icon {
    padding-right: 15px;
  }
  .shop-result-block .list-head-icon img {
    max-width: 150px;
  }
  .shop-result-block .list-head-title {
    width: calc(100% - 56px);
    font-size: 1.6rem;
    padding-top: 5px;
    line-height: 22px;
  }
  .shop-result-block .list-head-title .arrow::after {
    top: 5px;
  }
  .gps-distance {
    margin-left: 20px;
    padding-top: 5px;
  }
  .shop-result-block .list-message {
    margin-bottom: 12px;
  }
  .shop-result-block .list-icon {
    display: flex;
    flex-wrap: wrap;
  }
  .shop-result-block .list-icon>li {
    margin-right: 10px;
    margin-bottom: 10px;
  }
}
@media screen and (max-width:425px) {
  .shop-result-block .list-icon>li {
    width: 14.1%;
    margin-right: 3.08%;
  }
  .shop-result-block .list-icon>li img {
    width: 100%;
  }
  .shop-result-block .list-icon>li:nth-child(6n) {
    margin-right: 0;
    margin-bottom: 10px;
  }
}

/*条件の変更*/
.form-search-change {
  padding: 30px 0 50px;
  text-align: left;
}
.form-search-change .checkbox {
  margin-bottom: 20px;
}
.form-search-change .checkbox img {
  margin-right: 7px;
}
.form-search-change .selectbox,
.form-search-change .input {
  max-width: 588px;
  margin-bottom: 50px;
}
.check-area-wrap {
  border-bottom: 1px solid #ddd;
  margin-bottom: 50px;
}
.form-search-change .button-toggle {
  display: block;
  position: relative;
  line-height: 57px;
  font-weight: bold;
  height: 57px;
  padding: 0 20px;
  border-top: 1px solid #ddd;
}
.form-search-change .button-toggle::before {
  content: '';
  width: 18px;
  height: 2px;
  background: #00A728;
  position: absolute;
  top: 50%;
  right: 20px;
  margin-top: -1px;
}
.form-search-change .button-toggle::after {
  content: '';
  width: 2px;
  height: 18px;
  background: #00A728;
  position: absolute;
  top: 50%;
  right: 28px;
  margin-top: -9px;
}
.form-search-change .button-toggle.open::after {
  display: none;
}
.form-search-change .button-toggle + div {
  background: #f5f5f5;
  padding: 37px 20px 26px;
  display: none;
}
@media screen and (max-width: 768px) {
  .form-search-change {
    padding: 25px 0 35px;
  }
  .form-search-change .selectbox,
  .form-search-change .input {
    margin-bottom: 40px;
  }
  .check-area-wrap {
    margin-bottom: 40px;
  }
  .form-search-change .button-toggle {
    line-height: 50px;
    height: 50px;
    padding: 0 10px;
  }
  .form-search-change .button-toggle::before {
    right: 10px;
  }
  .form-search-change .button-toggle::after {
    right: 18px;
  }
  .form-search-change .button-toggle + div {
    padding: 30px 15px 13px;
  }
}

/*サービスチェックボックス（条件の変更）*/
.service-change-area {
  padding-bottom: 13px;
}
.service-change-area .title {
  font-weight: bold;
  margin-bottom: 18px;
}
.service-change-area .service-checkbox label {
  width: calc((100% - 72px) / 4);
}
.service-change-area .service-checkbox label:nth-child(5n) {
  margin-right: 24px;
}
.service-change-area .service-checkbox label:nth-child(4n) {
  margin-right: 0;
}
.service-change-area .service-checkbox label span {
  padding: 0 15px 0 70px
}
@media screen and (max-width: 930px) {
  .service-change-area .service-checkbox label {
    width: calc((100% - 30px) / 3);
    margin: 0 15px 15px 0;
  }
  .service-change-area .service-checkbox label:nth-child(5n),
  .service-change-area .service-checkbox label:nth-child(4n) {
    margin-right: 15px;
  }
  .service-change-area .service-checkbox label:nth-child(3n) {
    margin-right: 0;
  }
  .service-change-area .service-checkbox label span {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .service-change-area {
    padding-bottom: 17px;
  }
  .service-change-area .title {
    margin-bottom: 12px;
  }
  .service-change-area .service-checkbox label {
    width: calc((100% - 10px) / 2);
    margin: 0 10px 10px 0;
  }
  .service-change-area .service-checkbox label:nth-child(5n),
  .service-change-area .service-checkbox label:nth-child(4n),
  .service-change-area .service-checkbox label:nth-child(3n) {
    margin-right: 10px;
  }
  .service-change-area .service-checkbox label:nth-child(2n) {
    margin-right: 0;
  }
  .service-change-area .service-checkbox label span {
    padding: 50px 1.5em 5px;
    height:  84px;
  }
  .service-change-area .service-checkbox label span::after {
    top: 8px;
  }
}

/*グループ店舗チェックボックス*/
.group-checkbox {
  display: flex;
  flex-wrap: wrap;
}
.group-checkbox label {
  position: relative;
  cursor: pointer;
  margin: 0 24px 24px 0;
  width: calc((100% - 48px) / 3);
}
.group-checkbox label:nth-child(3n) {
  margin-right: 0;
}
.group-checkbox label input {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.group-checkbox label span {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 55px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  line-height: 18px;
  padding: 0 12px 0 134px;
}
.group-checkbox label input:checked + span {
  background: #00A728;
  box-shadow: none;
  color: #fff;
}
.group-checkbox label span::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 2px;
  width: 122px;
  height: 51px;
  background: #fff;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.group-checkbox label span::after {
  content: '';
  position: absolute;
  left: 2px;
  top: 2px;
  width: 122px;
  height: 51px;
}
.group-checkbox label.type1 span::after {
  background: url(/common/shop/image/group/1.png) center center no-repeat;
}
.group-checkbox label.type2 span::after {
  background: url(/common/shop/image/group/2.png) center center no-repeat;
}
.group-checkbox label.type3 span::after {
  background: url(/common/shop/image/group/3.png) center center no-repeat;
}
.group-checkbox label.type4 span::after {
  background: url(/common/shop/image/group/4.png) center center no-repeat;
}
.group-checkbox label.type5 span::after {
  background: url(/common/shop/image/group/5.png) center center no-repeat;
}
.group-checkbox label.type6 span::after {
  background: url(/common/shop/image/group/6.png) center center no-repeat;
}
.group-checkbox label.type7 span::after {
  background: url(/common/shop/image/group/7.png) center center no-repeat;
}
.group-checkbox label.type8 span::after {
  background: url(/common/shop/image/group/8.png) center center no-repeat;
}
.group-checkbox label.type9 span::after {
  background: url(/common/shop/image/group/9.png) center center no-repeat;
}
@media screen and (max-width: 935px) {
  .group-checkbox label span {
    justify-content: center;
    width: 100%;
    height: 125px;
    border-radius: 10px;
    font-size: 1.3rem;
    line-height: 18px;
    padding: 65px 10px 0;
  }
  .group-checkbox label input:checked + span {
    background: #00A728;
    box-shadow: none;
    color: #fff;
  }
  .group-checkbox label span::before {
    left: 3px;
    top: 3px;
    width: calc(100% - 6px);
    height: 62px;
    background: #fff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 0;
  }
  .group-checkbox label span::after {
    left: 3px;
    top: 3px;
    width: calc(100% - 6px);
    height: 62px;
  }
}
@media screen and (max-width: 620px) {
  .group-checkbox label,
  .group-checkbox label:nth-child(3n) {
    position: relative;
    cursor: pointer;
    margin: 0 10px 10px 0;
    width: calc((100% - 10px) / 2);
    text-align: center;
  }
  .group-checkbox label:nth-child(2n) {
    margin-right: 0;
  }
}

/******************
  店舗詳細
******************/
.shop-contents {
  position: relative;
  padding-top: 60px;
  padding-bottom: 100px;
  transition: all .3s ease;
}
.shop-contents.detail {
  padding-bottom: 50px;
}
.shop-contents.noactive {
  opacity: 0;
  min-height: 1000px;
}
.shop-detail-wrap {
  transition: all .3s ease;
}
.shop-detail-wrap.noactive {
  min-height: 1500px;
  opacity: 0;
}
.shop-head {
  padding: 0 0 10px;
}
.shop-mypage-icon {
  width: 170px;
  display: flex;
  height: 38px;
  border:1px solid #dddddd;
  justify-content: center;
  border-radius: 25px;
  box-shadow: 0 3px 7px rgba(0,0,0,0.06);
  cursor: pointer;
}
.shop-mypage-icon .icon {
  display: inline-block;
  width: 20px;
  height: 100%;
  background-image: url(../../common/svg/mypage-star.svg);
  background-repeat: no-repeat;
  background-size: 20px auto;
  background-position: 0 50%;
}
.shop-mypage-icon span {
  display: inline-block;
  padding-left: 13px;
  padding-top: 8px;
}
.shop-mypage-icon.active .icon {
  background-image: url(../../common/svg/mypage-star-active.svg);
}

.shop-detail-block {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 58px;
}
.shop-detail-head .head-block {
  display: flex;
  align-items: center;
  margin-bottom: 0;
}
.shop-detail-head .head-title {
  font-size: 3.3rem;
  padding-left: 30px;
  font-weight: normal;
}
.shop-detail-botton {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  margin-bottom: 40px;
}
/*マップ*/
.shop-detail-map {
  margin-bottom: 47px;
}
.shop-detail-map .map-block {
  position: relative;
  padding-top: 41.66%;
  margin-bottom: 20px;
}
.shop-detail-map .map-block iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left:0;
  top:0;
}
.shop-detail-map .map-link {
  display: flex;
}
.shop-detail-map .map-link>li {
  margin-right: 44px;
}
.shop-detail-news {
  display: block;
  background: #FFFBF0;
  padding: 30px 0;
  margin-bottom: 60px;
}
.shop-detail-news .news-title {
  font-weight: bold;
  margin-bottom: 30px;
}
.shop-detail-about {
  padding-bottom: 60px;
}
.shop-detail-about .about-list {
  display: flex;
  flex-wrap:wrap;
}
.shop-detail-about .about-list>li {
  width: 50.8%;
  display: flex;
}
.shop-detail-about .about-list>li:nth-child(2n) {
  width: 49.2%;
}
.shop-detail-about .about-head {
  width: 114px;
  padding-bottom: 45px;
}
.shop-detail-about .about-head>span {
  background: #F5F5F5;
  text-align: center;
  display: block;
  padding: 5px;
  color:#000;
  font-weight: bold;
}
.shop-detail-about .about-body {
  width: calc(100% - 114px);
  padding: 4px 20px 35px;
}
.shop-detail-about .about-message.btm {
  margin-bottom: 7px;
}
.shop-detail-about .about-message.btm:last-child {
  margin-bottom: 0;
}
.shop-detail-about .about-icon {
  display: flex;
  flex-wrap:wrap;
  padding-left: 10px;
  margin-left: -20px;
}
.shop-detail-about .about-icon>li {
  width: 81px;
  margin-bottom: 10px;
  text-align: center;
}
.shop-detail-about .about-icon>li .icon-img {
  display: inline-block;
  width: 56px;
  height: 56px;
  border-radius: 10px;

  background-repeat:  no-repeat;
  background-position: center;
  background-size:  100% auto;
}

.shop-detail-about .about-icon>li .icon-img.asamos {
  background-image: url(../../common/shop/svg/shop-detail-asamos.svg);
}
.shop-detail-about .about-icon>li .icon-img.alcohol {
  background-image: url(../../common/shop/svg/shop-detail-alcohol.svg);
}
.shop-detail-about .about-icon>li .icon-img.special {
  background-image: url(../../common/shop/svg/shop-detail-special.svg);
}
.shop-detail-about .about-icon>li .icon-img.cafe {
  background-image: url(../../common/shop/svg/shop-detail-cafe.svg);
}
.shop-detail-about .about-icon>li .icon-img.goods {
  background-image: url(../../common/shop/svg/shop-detail-goods.svg);
}
.shop-detail-about .about-icon>li .icon-img.takeout {
  background-image: url(../../common/shop/svg/shop-detail-takeout.svg);
}
.shop-detail-about .about-icon>li .icon-img.delivery {
  background-image: url(../../common/shop/svg/shop-detail-delivery.svg);
}
.shop-detail-about .about-icon>li .icon-img.drive {
  background-image: url(../../common/shop/svg/shop-detail-drive.svg);
}
.shop-detail-about .about-icon>li .icon-img.phone {
  background-image: url(../../common/shop/svg/shop-detail-phone.svg);
}
.shop-detail-about .about-icon>li .icon-img.credit {
  background-image: url(../../common/shop/svg/shop-detail-credit.svg);
}
.shop-detail-about .about-icon>li .icon-img.emoney {
  background-image: url(../../common/shop/svg/shop-detail-emoney.svg);
}
.shop-detail-about .about-icon>li .icon-img.dpoint {
  background-image: url(../../common/shop/svg/shop-detail-dpoint.svg);
}
.shop-detail-about .about-icon>li .icon-img.barcode {
  background-image: url(../../common/shop/svg/shop-detail-barcode.svg);
}
.shop-detail-about .about-icon>li .icon-img.plug {
  background-image: url(../../common/shop/svg/shop-detail-plug.svg);
}
.shop-detail-about .about-icon>li .icon-img.wifi {
  background-image: url(../../common/shop/svg/shop-detail-wifi.svg);
}
.shop-detail-about .about-icon>li .icon-img.wifi-free {
  background-image: url(../../common/shop/svg/shop-detail-wifi-free.svg);
}
.shop-detail-about .about-icon>li .icon-img.wifi-softbank {
  background-image: url(../../common/shop/svg/shop-detail-wifi-softbank.svg);
}
.shop-detail-about .about-icon>li .icon-img.wifi-docomo {
  background-image: url(../../common/shop/svg/shop-detail-wifi-docomo.svg);
}
.shop-detail-about .about-icon>li .icon-img.wifi-au {
  background-image: url(../../common/shop/svg/shop-detail-wifi-au.svg);
}
.shop-detail-about .about-icon>li .icon-img.parking {
  background-image: url(../../common/shop/svg/shop-detail-parking.svg);
}

.shop-detail-about .about-icon>li.active .icon-img.asamos {
  background-image: url(../../common/shop/svg/shop-detail-asamos_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.alcohol {
  background-image: url(../../common/shop/svg/shop-detail-alcohol_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.special {
  background-image: url(../../common/shop/svg/shop-detail-special_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.cafe {
  background-image: url(../../common/shop/svg/shop-detail-cafe_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.goods {
  background-image: url(../../common/shop/svg/shop-detail-goods_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.takeout {
  background-image: url(../../common/shop/svg/shop-detail-takeout_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.delivery {
  background-image: url(../../common/shop/svg/shop-detail-delivery_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.drive {
  background-image: url(../../common/shop/svg/shop-detail-drive_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.phone {
  background-image: url(../../common/shop/svg/shop-detail-phone_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.credit {
  background-image: url(../../common/shop/svg/shop-detail-credit_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.emoney {
  background-image: url(../../common/shop/svg/shop-detail-emoney_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.dpoint {
  background-image: url(../../common/shop/svg/shop-detail-dpoint_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.barcode {
  background-image: url(../../common/shop/svg/shop-detail-barcode_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.plug {
  background-image: url(../../common/shop/svg/shop-detail-plug_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.wifi {
  background-image: url(../../common/shop/svg/shop-detail-wifi_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.wifi-free {
  background-image: url(../../common/shop/svg/shop-detail-wifi-free_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.wifi-softbank {
  background-image: url(../../common/shop/svg/shop-detail-wifi-softbank_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.wifi-docomo {
  background-image: url(../../common/shop/svg/shop-detail-wifi-docomo_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.wifi-au {
  background-image: url(../../common/shop/svg/shop-detail-wifi-au_active.svg);
}
.shop-detail-about .about-icon>li.active .icon-img.parking {
  background-image: url(../../common/shop/svg/shop-detail-parking_active.svg);
}

.shop-detail-about .about-icon>li .icon-title {
  text-align: center;
  margin-top: 5px;
  font-size: 1rem;
  color: #cccccc;
}
.shop-detail-about .about-icon>li.active .icon-title {
  color: #000;
}

.shop-detail-about .about-list.wide-block>li {
  width: 100%;
}
.shop-detail-info {
  padding: 35px 0;
  background: url(../../common/shop/image/shop-info-bg.jpg);
  background-position: center;
  min-height: 296px;
  margin-bottom: 30px;
}
.shop-detail-info .info-block {
  display: flex;
}
.shop-detail-info .info-icon {
  width: 150px;
}
.shop-detail-info .info-text {
  width: calc(100% - 150px);
  color:#fff;
  padding-left: 43px;
}
.shop-detail-info .info-title {
  font-weight: bold;
  font-size: 2.2rem;
  margin-bottom: 32px;
}
.shop-detail-info .info-message {
  word-break: break-word;
}
.shop-detail-sns .sns-share {
  justify-content: center;
  margin-bottom: 100px;
}
.shop-detail-sns .sns-share>li {
  margin: 0 2px;
}
.shop-detail-sns .sns-list {}
.shop-detail-campaign {
  max-width: 1200px;
  margin:0 auto;
}
.shop-detail-campaign {
  margin-bottom: 96px;
}
.shop-detail-campaign ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0 24px;
  justify-content: center;
}
.shop-detail-campaign .campaign-banner-list>li {
  width: 384px;
  margin-bottom: 30px;
}
.shop-banner {
  display: flex;
  padding: 80px 0 0;
  border-top: 1px solid #ddd;
}
.shop-banner .wrap {
  width: 100%;
}
.shop-banner-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}
.shop-banner-list>li {
  width: calc((100% - 60px)/3);
  margin-bottom: 30px;
  text-align: center;
}
.shop-banner-list>li:nth-child(3n-1) {
  margin: 0 30px 30px;
}
.shop-banner-list>li:last-child:not(even) {
  margin: 0 0 30px;
}
.shop-banner-list>li img {
/*  width: 100%;*/
}
.shop-newyear {
  display: flex;
}
.shop-newyear-day {
  width: 75px;
  text-align: right;
}
.shop-newyear-time {
  text-align: left;
}

@media screen and (max-width:768px) {
  .shop-contents {
    padding-top: 37px;
    padding-bottom: 80px;
  }
  .shop-contents.detail {
    padding-bottom: 25px;
  }
  .shop-head {
    padding: 0 0 10px;
  }
  .shop-mypage-icon {
    display: block;
    width: 60px;
    height: auto;
    border: none;
    border-radius: 0;
    box-shadow: none;
  }
  .shop-mypage-icon .icon {
    display: inline-block;
    width: 100%;
    height: 30px;
    background-repeat: no-repeat;
    background-size: 30px auto;
    background-position: 80% 0;
    padding-left: 0;

  }
  .shop-mypage-icon .text {
    padding-left: 18px;
    display: block;
  }
  .shop-mypage-icon span {
    display: inline-block;
    padding-left: 0px;
    padding-top: 0px;
    font-size: 10px;
    text-align: center;
  }
  .shop-detail-block {
    margin-bottom: 32px;
    padding-right: 0;
    align-items: flex-start;
  }
  .shop-detail-head {
    width: 100%;
  }
  .shop-detail-head .head-block {
    display: block;
    width: calc(100% - 60px);
    margin-bottom: 0;
    padding-left: 0;
    border-right: 1px dashed #dddddd;
  }
  .shop-detail-head .head-icon {
    min-width: 0;
    max-width: 131px;
    margin-bottom: 17px;
  }
  .shop-detail-head .head-title {
    font-size: 2.2rem;
    padding-left: 0;
    width: 100%;
  }
  .shop-detail-botton {
    text-align: center;
    margin-bottom: 40px;
  }
  /*マップ*/
  .shop-detail-map {
    margin-bottom: 30px;
  }
  .shop-detail-map .map-block {
    padding-top: 61.19%;
    margin-bottom: 20px;
  }
  .shop-detail-map .map-link {
    display: block;
  }
  .shop-detail-map .map-link>li {
    margin-bottom: 15px;
    margin-right: 0;
  }
  .shop-detail-news {
    display: block;
    padding: 30px 0;
    margin-bottom: 30px;
  }
  .shop-detail-news .news-title {
    font-weight: bold;
    margin-bottom: 20px;
  }
  .shop-detail-news .news-message {
    margin-bottom: 40px;
    max-height: 4.8em;
    overflow: hidden;
  }
  .shop-detail-news .news-message.active {
    overflow: auto;
    max-height: none;
    margin-bottom: 0;
  }
  .shop-detail-news .menu-more-btn {
    background: #fff;
    width: 100%;
    margin-left: 0;
    cursor: pointer;
  }
  .shop-detail-news .menu-more-btn.sp.active {
    display: none !important;
  }
  .shop-detail-about {
    padding-bottom: 30px;
  }
  .shop-detail-about .about-list {
    display: block;
  }
  .shop-detail-about .about-list>li {
    display: block;
    width: 100%;
    margin-bottom: 0px;
  }
  .shop-detail-about .about-list>li:nth-child(2n) {
    width: 100%;
  }
  .shop-detail-about .about-head {
    width: 100%;
    padding-bottom: 0;
  }
  .shop-detail-about .about-head>span {
    display: block;
    background: #f5f5f5;
    text-align: center;
    display: block;
    padding: 5px;
    color: #000;
    font-weight: bold;
  }
  .shop-detail-about .about-body {
    width: 100%;
    padding: 18px 15px 30px;
  }
  .shop-detail-about .about-icon {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-left: 0;
  }
  .shop-detail-about .about-icon>li {
    width: 61px;
    margin-bottom: 10px;
    text-align: center;
  }
  .shop-detail-about .about-icon>li .icon-img {
    display: inline-block;
    width: 52px;
    height: 52px;
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
  }
  .shop-detail-about .about-icon>li .icon-title {
    text-align: center;
    margin-top: 0px;
    font-size: 1rem;
    color: #cccccc;
    line-height: 1.3;
  }
  .shop-detail-about .about-icon>li.active .icon-title {
    color: #000;
    padding: 0;
  }
  .shop-detail-about .about-list.wide-block>li {
    width: 100%;
  }
  .shop-detail-info {
    padding: 19px 0 25px;
    background: url(../../common/shop/image/shop-info-bg.jpg);
    background-position: center;
    min-height: 296px;
    margin-bottom: 30px;
  }
  .shop-detail-info .info-block {
    position: relative;
    display: flex;
    padding: 0;
  }
  .shop-detail-info .info-icon {
    position: absolute;
    width: 72px;
    left: 0;
    top: 0;
  }
  .shop-detail-info .info-text {
    width: 100%;
    color: #fff;
    padding-left: 0;
  }
  .shop-detail-info .info-title {
    font-size: 1.8rem;
    margin-top: 26px;
    margin-bottom: 40px;
    padding-left: 88px;
  }
  .shop-detail-sns .sns-share {
    justify-content: center;
    margin-bottom: 80px;
  }
  .shop-detail-sns .sns-share>li {
    margin: 0 2px;
  }
  .shop-detail-sns .sns-list {}
  .shop-detail-campaign {
    max-width: 796px;
    margin: 0 auto;
  }
  .shop-detail-campaign {
    margin-bottom: 73px;
  }
  .shop-detail-campaign ul {
    display: block;
  }
  .shop-detail-campaign .campaign-banner-list>li {
    width: 100%;
    margin-bottom: 15px;
  }
  .shop-detail-campaign .campaign-banner-list>li img {
    width: 100%;
  }
  .shop-banner {
    padding: 40px 0 0;
  }
  .shop-banner-list {
    display: block;
    width: 100%;
  }
  .shop-banner-list>li,
  .shop-banner-list>li:nth-child(3n-1),
  .shop-banner-list>li:last-child:not(even) {
    width: 100%;
    margin: 0 0 15px;
  }
  /*media 768*/
}

/* 店舗詳細エラー表示 */
.shop-detail-error {
margin-bottom: 50px;
}
.shop-detail-error .headingPrimary {
text-align: center;
font-size: 4.4rem;
font-weight: normal;
margin: 50px 0;
}
.shop-detail-error .frame-red {
position: relative;
padding: 50px 30px 50px;
color: #E90000;
z-index: 2;
background: #FFEBEB;
margin-bottom: 50px;
}
.shop-detail-error .frame-red .heading {
font-weight: bold;
text-align: center;
margin-bottom: 25px;
font-size: 1.8rem;
}
.shop-detail-error .noteText-g {
color: #888888;
margin: 20px;
}
@media screen and (max-width:768px) {
  .shop-detail-error .headingPrimary {
  text-align: center;
  font-size: 2.8rem;
  font-weight: normal;
  margin: 35px 0;
  }
}

.shop-campaign-banner {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.shop-campaign-banner>* {
  display: block;
  width: calc((100% - 48px)/3);
  max-width: 384px;
}
.shop-campaign-banner>*:nth-child(1) {
  margin-left: auto;
}
.shop-campaign-banner>*:nth-child(2) {
  margin-right: auto;
}
.shop-campaign-banner>*:only-child {
  width: 384px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .shop-campaign-banner {
    gap: 15px;
  }
  .shop-campaign-banner>* {
    width: 100%;
    margin: 0 auto !important;
  }
}

/******************
  お届けサービスについて
******************/
.shop-delivery .shop-contents {
  padding-top: 25px;
  padding-bottom: 0;
}
.shop-delivery-title {
  position: relative;
  background: #FFFBF0;
  text-align: center;
  padding: 14px 0;
  font-weight: normal;
  margin: 25px 0 40px;
}
.shop-delivery-title::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  left: 50%;
  bottom: -31px;
  border: 15px solid transparent;
  border-top: 19px solid #FFFBF0;
  transform: translateX(-50%);
}
.shop-delivery-about {
  padding-bottom: 150px;
}
.shop-delivery-about .about-box {
  width: 49%;
}
.shop-delivery-about .about-block1 {
  display: flex;
  justify-content: space-between;
}
.shop-delivery-about .about-block1 {
  margin-bottom: 95px;
}
.shop-delivery-about .about-block1 .about-box {
  background: #F5F5F5;
  padding: 30px 3%;
}
.shop-delivery-about .about-block2 {

}
.shop-delivery-about .about-block2 .about-box {
  width: 100%;
}
.shop-delivery-about .about-block2 .about-box:nth-child(2) {
  margin-top: 95px;
}
.shop-delivery-about .about-box-link {
  display: flex;
  justify-content: center;
}
.shop-delivery-about .about-box-title {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}
.shop-delivery-about .about-number-block {
  display: flex;
  justify-content: space-between;
}
.shop-delivery-about .about-number-box1 {
  width: 48%;
}
.shop-delivery-about .about-number-box2 {
  width: 48%;
}
.shop-delivery-about .about-number-title {
  font-weight: bold;
  margin-bottom: 25px;
}
.shop-delivery-about .about-number-message {
    margin-bottom: 5px;
    padding-right: 20px;
}
.shop-delivery-about .about-number-link {
  position: relative;
  font-size: 1.8rem;
  font-weight: bold;
  display: flex;
  align-items: center;
}
.shop-delivery-about .about-number-link:hover {
  opacity: 1;
}

.shop-delivery-about .about-number-link>span {
  line-height: 1em;
}
.shop-delivery-about .about-number-link .icon.tel {
  display: block;
  width: 19px;
  line-height: 1em;
  margin-right: 8px;
}
.shop-delivery-about .about-number-link .icon.mobile {
  display: block;
  width: 14px;
  line-height: 1em;
  margin-right: 11px;
}
.shop-delivery-about .about-hours-list {
  display: flex;
  flex-wrap:wrap;
  justify-content: space-between;
}
.shop-delivery-about .about-hours-list>li {
  width: 48%;
  margin-bottom: 15px;
}
.shop-delivery-about .about-hours-dl {
  display: flex;
}
.shop-delivery-about .about-hours-dl>dt {
  display: block;
  width:76px;
}
.shop-delivery-about .about-hours-dl>dt>span {
  background: #fff;
  display: block;
  font-size: 1.3rem;
  text-align: center;
  padding-top: 3px;
  padding-bottom: 1px;
}
.shop-delivery-about .about-hours-dl>dd {
  width: calc(100% - 76px);
  padding-left: 15px;
}
.shop-delivery-about .about-box-title .title-icon {
  display: flex;
  width: 60px;
  height: 60px;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 50%;
}
.shop-delivery-about .about-box-title .title-icon>span {
  display: block;
}
.shop-delivery-about .about-box-title .title-icon>span img {
  width: 100%;
}
.shop-delivery-about .about-box-title .title-icon>span.net {
  width: 20.62px;
}
.shop-delivery-about .about-box-title .title-icon>span.tel {
  width: 28px;
}
.shop-delivery-about .about-box-title .title-text {
  width: calc(100% - 60px);
  padding-left: 15px;
  font-size: 2.2rem;
  font-weight: normal;
}
.shop-delivery-about .about-box-group {
  border-bottom: 1px dashed #ddd;
  padding-bottom: 30px;
  margin-bottom: 30px;
}
.shop-delivery-about .about-box-group:last-of-type {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}
.shop-delivery-about .about-box-group .group-title {
  margin-bottom: 15px;
}
.shop-delivery-about .area-title {
  text-align: center;
  background: #f5f5f5;
  text-align: center;
  font-weight: bold;
  padding: 4px;
  margin-bottom: 30px;
}
.shop-delivery-about .about-box-group .group-link {
  background: #fff;
  text-align:center;
  display: block;
  padding: 6px 0;
  margin-top: 19px;
}
.shop-delivery-about .about-box-group .group-link>span {
  position: relative;
  display: inline-block;
  padding-right: 24px;
}
.shop-delivery-about .about-box-group .group-link>span::after {
  content:"";
  position: absolute;
  top:50%;
  margin-top: -4px;
  right: 0;
  width: 9px;
  height: 9px;
  border-right:2px solid #00a728;
  border-bottom:2px solid #00a728;
  transform: translate(0,-50%) rotate(45deg);
}
.shop-delivery-about .about-box-area {
  padding: 0 10px;
}
.shop-delivery-about .about-box-area .area-message {
  margin-bottom: 30px;
  text-align: center;
}
.shop-delivery-information {
  position: relative;
  background: #fffbf0;
  padding-top: 95px;
  padding-bottom: 85px;
}
.shop-delivery-information .information-section {
  margin: 0 auto 35px;
  max-width: 1020px;
}
.shop-delivery-information .information-block {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 40px 0 40px;
  background: #ffffff;
  margin-bottom: 30px;
  border-radius: 10px;
}
.shop-delivery-information .information-icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: -50px;
}
.shop-delivery-information .information-icon>span {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 1px solid #faf4e5;
  background: #fff;
  text-align: center;
  padding-top: 15px;
}
.shop-delivery-information .information-icon>span img {
  width: 46px;
}
.shop-delivery-information .headline-m {
  margin-bottom: 75px
}
.shop-delivery-information .headline-m::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -37px;
  margin-left: -20px;
  width: 40px;
  height: 2px;
  background: #00A728;
}
.shop-delivery-information .information-head {
  width: 450px;
}
.shop-delivery-information .information-head-title {
  display: flex;
  align-items: center;
}
.shop-delivery-information .information-head-title .icon {
  width: 87px;
}
.shop-delivery-information .information-head-title .text {
  position: relative;
  width: calc(100% - 87px);
  padding: 20px 0 14px;
  text-align: center;
  font-weight: bold;
  font-size: 2rem;
  line-height: 1.5;
  border-radius: 50px;
  background: #F5F5F5;
  color: #00A728;
}
.shop-delivery-information .information-head-title .text::after {
  content: '';
  position: absolute;
  left: -12px;
  top: 50%;
  margin-top: -7px;
  border: 7px solid transparent;
  border-right: 12px solid #f5f5f5;
  border-left: 0;
}
.shop-delivery-information .information-body {
  padding-left: 40px;
}
.shop-delivery-information .information-block-list {
  width: 330px;
}
.shop-delivery-note {
  margin-bottom: 0px;
}
.shop-delivery-note .note-message {
  margin-bottom: 0.8em;
}
.shop-delivery .app-nav {
  margin-top: 0;
}
.shop-area {
  position: relative;
  border-top: 1px solid #ddd;
}
.shop-area::after {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background: #ddd;
}
.shop-area {
  border-top: 1px solid #ddd;
  display: flex;
  flex-wrap: wrap;
}
.shop-area>li {
  border-bottom: 1px dashed #ddd;
  border-right: 1px dashed #ddd;
}
.shop-area>li>a {
  display: block;
  padding: 16px 10px 16px 30px;
}
.shop-area>li>a .blank {
  padding-right: 0;
}
.shop-delivery-about .shop-area>li {
  width: 20%;
}
.shop-delivery-about .shop-area>li:nth-child(5n) {
  border-right: 0;
}

.shop-delivery-information .menu-note-list {
  margin-bottom: 0;
}
@media screen and (max-width:1160px) {
  .shop-delivery-about .about-block1 .about-box {
      padding: 30px 25px;
  }
  .shop-delivery-about .about-hours-list>li {
      width: 100%;
      margin-bottom: 10px;
  }
  .shop-delivery-about .about-hours-dl>dt>span {
    padding-top: 2px;
    padding-bottom: 0;
  }
  .shop-delivery-about .about-hours-dl>dd{
    padding-top: 2px;
  }
  .shop-delivery-about .about-number-box1 {
    width: 49%;
  }
  .shop-delivery-about .about-number-box2 {
    width: 49%;
  }
  .shop-delivery-about .about-number-message {
      margin-bottom: 5px;
      padding-right: 0px;
  }
}
@media screen and (max-width:980px) {
  .shop-delivery-about .about-box-title .title-text {
      font-size: 2rem;
  }
  .shop-delivery-about .about-number-link {
      font-size: 1.5rem;
  }
}
@media screen and (max-width:768px) {
  .shop-delivery .shop-contents {
    padding-top: 15px;
  }
  .shop-delivery-title {
    margin: 15px 0 35px;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .shop-delivery-about .about-block1 {
    display: block;
  }
  .shop-delivery-about .about-block2 {
    display: block;
  }
  .shop-delivery-about .about-box-group {
    padding-bottom: 20px;
    margin-bottom: 25px;
  }
  .shop-delivery-about .about-box-group .group-title {
    margin-bottom: 15px;
  }
  .shop-delivery-about .about-block1 .about-box,
  .shop-delivery-about .about-block2 .about-box {
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
  }
  .shop-delivery-about .about-block1 .about-box {
    padding: 25px 15px 15px;
  }
  .shop-delivery-about .about-block2 .about-box:nth-child(2) {
    margin-top: 65px;
  }
  .shop-delivery-about .about-box-area {
    padding: 0;
  }
  .shop-delivery-about .about-box-title .title-text {
    font-size: 1.8rem;
  }
  .shop-delivery-about .about-box-title .title-icon>span.net {
      width: 14.09px;
  }
  .shop-delivery-about .about-box-title .title-icon>span.tel {
    width: 18.4px;
  }
  .shop-delivery-about .about-box-title .title-icon {
    width: 41px;
    height: 41px;
  }
  .shop-delivery-about .about-number-block {
    display: block;
  }
  .shop-delivery-about .about-number-box1 {
    margin-bottom: 35px;
    width: 100%;
  }
  .shop-delivery-about .about-number-box2 {
    width: 100%;
  }
  .shop-delivery-about .about-number-title {
    margin-bottom: 15px;
  }
  .shop-delivery-about .about-number-message {
    margin-bottom: 15px;
    padding-right: 0px;
  }
  .shop-delivery-about .about-number-link .icon.tel {
    width: 15px;
    line-height: 1em;
    margin-right: 8px;
  }
  .shop-delivery-about .about-number-link {
    font-size: 1.8rem;
  }
  .shop-delivery-about .about-hours-dl>dt>span {
    font-size: 1.4rem;
  }

  .shop-delivery-about .about-block1 {
    margin-bottom: 65px;
  }
  .shop-delivery-about .area-title {
    padding: 7px 15px 5px;
    margin-bottom: 25px;
    text-align: left;
  }
  .shop-delivery-about .shop-area>li,
  .shop-delivery-about .shop-area>li:nth-child(5n) {
    width: 50%;
    border-right: 1px dashed #ddd;
  }
  .shop-delivery-about .shop-area>li:nth-child(2n) {
    border-right: 0;
  }
  .shop-area>li>a {
    display: block;
    padding-left: 15px;
  }
  #shop-available {
    margin-bottom: 65px;
  }
  .shop-delivery-about .about-box-link {
    margin-top: -10px;
    justify-content: flex-start;
  }
  .shop-delivery-information {
      position: relative;
      background: #fffbf0;
      padding-top: 60px;
      padding-bottom: 35px;
  }
  .shop-delivery-information .headline {
    position: relative;
    font-size: 2.2rem;
    white-space: nowrap;
  }
  .shop-delivery-information .information-icon {
    margin-top: -40px;
  }
  .shop-delivery-information .information-icon>span {
    width: 80px;
    height: 80px;
  }
  .shop-delivery-information .information-icon>span img {
    width: 36px;
  }
  .shop-delivery-about {
    padding-bottom: 90px;
  }
  .shop-delivery-information .headline-m {
    margin-bottom: 60px
  }
  .shop-delivery-information .headline-m::after {
    bottom: -30px;
    height: 1px;
  }
  .shop-delivery-information .information-block {
    display: block;
  }
  .shop-delivery-information .information-body {
    padding-left: 0px;
    margin-top: 20px;
  }
  .shop-delivery-information .information-head-title .icon {
    width: 75px;
  }
  .shop-delivery-information .information-head-title .text {
    width: calc(100% - 75px);
    font-size: 1.6rem;
  }
  .shop-delivery-information .information-head {
    width: 100%;
  }
  .shop-delivery-information .information-block {
    padding: 20px 15px;
  }
}
@media screen and (max-width:375px) {
  .shop-delivery-information .information-head-title .text {
    font-size: 4vw;
  }
}

/*====================================
/* 05.マイページ系
====================================*/
.moscard-confirm{
  padding: 30px 0 0;
}
.moscard-confirm img{
  margin-bottom: 20px;
}
.moscard-confirm .indentList-s{
  text-align: left;
}
/******************
  マイページトップ
******************/
/*2カラムリスト*/
.mypage-three-list {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.mypage-three-list>li {
  width: 31.8%;
  margin-right: 2.3%;
  margin-bottom: 24px;
}
.mypage-three-list>li:nth-child(3n) {
  margin-right: 0;
}
.mypage-three-list>li>a {
  padding: 20px 30px;
  display: block;
  background: #f5f5f5;
}
@media screen and (max-width:1024px) {
  .mypage-three-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 16px;
  }
  .mypage-three-list>li {
    width: 48.8%;
    margin-bottom: 24px;
    margin-right: 0;
  }
  .mypage-three-list>li:nth-child(3n) {
    margin-right: 0;
  }
}
@media screen and (max-width:768px) {
   .mypage-three-list {
    display: block;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    margin-bottom: 40px;
   }
  .mypage-three-list>li {
    width: 100%;
    margin-right: 0%;
    margin-bottom: 0;
    border-bottom: 1px dashed #ddd;
  }
  .mypage-three-list>li:last-child {
    border-bottom: 0;
  }
  .mypage-three-list>li>a {
    padding: 14px 0;
    background: #fff;
  }
}
/*３カラムリスト*/
.mypage-two-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 16px;
}
.mypage-two-list>li {
  width: 48.8%;
  margin-bottom: 24px;
}
.mypage-two-list>li>a {
  padding: 20px 30px;
  display: block;
  background: #f5f5f5;
}
@media screen and (max-width:768px) {
   .mypage-two-list {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    margin-bottom: 40px;
   }
  .mypage-two-list>li {
    width: 100%;
    margin-right: 0%;
    margin-bottom: 0;
    border-bottom: 1px dashed #ddd;
  }
  .mypage-two-list>li:last-child {
    border-bottom: 0;
  }
  .mypage-two-list>li>a {
    padding: 20px 0;
    background: #fff;
  }
}
/*マイページトップ・ヘッド*/
.mypage-contents {
  padding-top: 37px;
}
.mypage-top-head {
  margin-bottom: 90px;
}
.mypage-top-head .rank-title {
  display: flex;
  margin-bottom: 30px;
}
.mypage-top-head .rank-title-icon {
  width: 47px;
  min-height: 85px;
  background-size: 47px auto;
  background-position: 0 center;
  background-repeat: no-repeat;
}
.mypage-top-head.silver .rank-title-icon {
  background-image: url(../mypage/svg/icon-medal-silver.svg);
}
.mypage-top-head.gold .rank-title-icon {
  background-image: url(../mypage/svg/icon-medal-gold.svg);
}
.mypage-top-head .rank-title-box {
  padding-left: 30px;
  padding-top: 10px;
}
.mypage-top-head .rank-title-name {
    font-size: 1.8rem;
    margin-bottom: 5px;
}
.mypage-top-head .rank-title-text {
  font-size: 3rem;
  line-height: 1.2em;
  font-weight: bold;
}
.mypage-top-head.silver .rank-title-text {
  color: #9fa6a6;
}
.mypage-top-head.gold .rank-title-text {
  color: #f7a414;
}
@media screen and (max-width:768px) {
  .mypage-contents {
      padding-top: 20px;
  }
  .mypage-top-head .rank-title-icon {
    width: 36px;
    background-size: 36px auto;
    background-position: 0 0;
  }
  .mypage-top-head .rank-title-box {
    padding-left: 15px;
    padding-top: 3px;
  }
  .mypage-top-head .rank-title-name {
      font-size: 1.4rem;
      margin-bottom: 5px;
  }
  .mypage-top-head .rank-title-text {
      font-size: 2.4rem;
  }
/*media 768*/
}
/*あなたへのお知らせ*/
.mypage-top-head .infomation {
  margin: 0 auto 20px;
}
.mypage-top-head .infomation-banner-wrap {
  position: relative;
    max-width: 1200px;
    margin: 0 auto 30px;
}
.mypage-top-head .infomation-title {
  font-weight: bold;
  line-height: 1em;
  margin-bottom: 18px;
}
.mypage-top-head .infomation-banner>li {
  margin-right: 23px;
  margin-bottom: 0;
  min-width: 250px;
  max-width: 250px;
}
.mypage-top-head .infomation-banner>li a {
  display: block;
}
.mypage-top-head .infomation {
  margin: 0 auto;
}
.mypage-top-head .infomation-banner {
  display: flex;
  padding-bottom: 10px;
  overflow-x: auto;
}
.mypage-top-head .infomation-banner::-webkit-scrollbar:hover {
  opacity: 0;
}
.mypage-top-head .infomation-banner::-webkit-scrollbar {
  width: 8px;
}
.mypage-top-head .infomation-banner::-webkit-scrollbar-track {
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
.mypage-top-head .infomation-banner::-webkit-scrollbar-thumb {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: rgba(0,0,0,0.1);
}
.mypage-top-head .infomation-banner::-webkit-scrollbar:hover {
  opacity: 0;
}
@media screen and (max-width:1200px) {
  .mypage-top-head .infomation-banner-wrap {
      padding: 0 0 0 10px;
  }
  /*media 1200px*/
}
@media screen and (max-width:980px) {

  .mypage-top-head .infomation-banner>li img {
    width: 100%;
  }
}

@media screen and (max-width:768px) {
  .mypage-top-head .infomation-banner-wrap {
      padding: 0 0 0 15px;
  }
  .mypage-top-head .infomation-banner>li {
    margin-right: 15px;
    min-width: 320px;
  }

}
@media screen and (max-width:425px) {
  .mypage-top-head .infomation-banner {
    padding-bottom: 0;
  }
  .mypage-top-head .infomation-banner::-webkit-scrollbar {
    height: 2px;
  }
}
/*マイページトップヘッド メイン*/
.mypage-top-head .rank-main {
    display: flex;
    margin-bottom: 0;
}
.mypage-top-head .rank-main-head {
  position: relative;
  background: #f5f5f5;
  display: flex;
  padding-left: 38px;
  z-index: 1;
}
.mypage-top-head .rank-main-head::after {
    content: "";
    position: absolute;
    display: block;
    width: 19px;
    height: 19px;
    bottom: -7px;
    margin-left: -10px;
    left: 50%;
    background: #f5f5f5;
    border-radius: 3px;
    transform: rotate(45deg);
    z-index: -1;
}
.mypage-top-head .rank-main-head p {
  position: relative;
  padding: 15px;
  font-size: 1.6rem;
}
.mypage-top-head .rank-main-head .icon {
  width: 31px;
  overflow: hidden;
}
.mypage-top-head .rank-main-head .icon img {
  margin-top: -8px;
  overflow: hidden;
}
.mypage-top-head .rank-main-head p em {
  font-weight: bold;
  color: #f7a414;
}
.mypage-top-head .rank-main-block {
  width: 800px;
}
.mypage-top-head .rank-main-box {
  border: 1px solid #ddd;
  padding-bottom: 25px;
  margin-bottom: 40px;
}
.mypage-top-head .rank-main-message {
    padding: 0 40px;
    margin-bottom: 0;
    margin-top: 25px;
}
.mypage-top-head .rank-main-message .inner {
  background: #ffebeb;
  padding: 13px 20px;
}
.mypage-top-head .rank-main-message .inner p {
  color: #e90000;
}
.mypage-top-head .rank-main-row {
  display: flex;
}
.mypage-top-head .rank-main-column {
  position: relative;
  width: 50%;
  padding: 24px 40px 0;
}
.mypage-top-head .rank-main-column .box {
  max-width: 320px;
  margin: 0 auto;
}
.mypage-top-head .rank-main-column:first-child::after {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  height: calc(100% - 24px);
  top: 24px;
  right: 0;
  border-right: 1px dashed #dddddd;
}
.mypage-top-head .rank-main-column .dl {
  display: flex;
  align-items: center;
}
.mypage-top-head .rank-main-column .dl>dt {
  width: 54px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  background: #fffbf0;
  border:1px solid #f8eada;
}
.mypage-top-head .rank-main-column .dl>dd {
  display: flex;
}
.mypage-top-head .rank-main-column .dl>dd strong {
    display: inline-block;
    font-size: 2.6rem;
    color: #00A728;
    padding: 0 7px 0 11px;
    line-height: 1.3;
    margin-bottom: 0;
    margin-top: -8px;
}
.mypage-top-head .rank-main-column .dl>dd {
  padding-top: 5px;
  padding-left: 10px;
}
.mypage-top-head .rank-main-column .dl>dd .slash {
  position: relative;
  display: inline-block;
  width: 9px;
  height: 15px;
  margin-right: 5px;
}
.mypage-top-head .rank-main-column .dl>dd .slash::after {
  content:"";
  position: absolute;
  display: block;
  width: 1px;
  height: 110%;
  top:0;
  left:0;
  transform: rotate(25deg);
  transform-origin: 0 100%;
  background: #000;
}
.mypage-top-head #rank-main-column2 .message {
  margin-bottom: 20px;
}
.mypage-top-head .rank-main-column .message {
  text-align: right;
  color:#666666;
  font-size: 1rem;
}
@media screen and (max-width:1024px) {
  .mypage-top-head .rank-main {
      display: block;
      margin-bottom: 40px;
  }
  .mypage-top-head .rank-main-block {
    width: 100%;
  }
}
@media screen and (max-width:768px) {
  .mypage-top-head {
      margin-bottom: 60px;
  }
  .mypage-top-head .rank-title {
    display: flex;
    margin-bottom: 0;
  }
  .mypage-top-head .rank-main-head {
      padding-left: 0;
      justify-content: center;
  }
  .mypage-top-head .rank-main-head p {
      padding: 11px;
      font-size: 1.4rem;
  }
  .mypage-top-head .rank-main-head .icon {
    width: 18px;
    overflow: hidden;
  }
  .mypage-top-head .rank-main-head .icon img {
    margin-top: 0;
    overflow: hidden;
  }
  .mypage-top-head .rank-main-row {
    display: block;
  }
  .mypage-top-head .rank-main-column {
    width: 100%;
    display: block;
    padding: 30px 15px 0;
  }
  .mypage-top-head .rank-main-column .dl>dd strong {
    font-size: 2rem;
    margin-top: -2px;
  }
  .mypage-top-head .rank-main-column .box {
    padding-bottom: 20px;
  }
  .mypage-top-head .rank-main-column:first-child .box {
    border-bottom: 1px dashed #ddd;
  }
  .mypage-top-head .rank-main-column:last-child .box {
    margin-bottom: 0;
  }
  .mypage-top-head .rank-main-column:first-child::after {
    display: none;
  }
  .mypage-top-head .rank-main-column .message {
      margin-bottom: 5px;
  }
  .mypage-top-head .rank-main-box {
      padding-bottom: 0;
  }
  .mypage-top-head .rank-main-message {
      padding: 0 15px;
      max-width: 360px;
      margin: 0 auto 20px;
  }
  .mypage-top-head .rank-main-message .inner {
      padding: 13px 15px;
  }
  /*media 768px*/
}
@media screen and (max-width:360px) {
  .mypage-top-head .rank-main-column .dl>dt {
    width: 44px;
  }
  .mypage-top-head .rank-main-column .dl {
    font-size: 1.2rem;
  }
  .mypage-top-head .rank-main-column .dl>dd strong {
      font-size: 2rem;
      margin-top: -3px;
  }
  .mypage-top-head .rank-main-column .dl>dd small {
    font-size: 1.1rem;
  }
}
/*来店回数*/
.mypage-top-head .rank-main-stamp {
  display: flex;
  flex-wrap: wrap;
  margin: 10px auto 10px;
}
.mypage-top-head .rank-main-stamp>li {
  position: relative;
  width: 16.528%;
  height: 46px;
  background-image: url(../../common/mypage/image/icon-stamp-off.png);
  background-position: center;
  background-repeat: no-repeat;
  background-position: center;
}
.mypage-top-head .rank-main-stamp>li::after {
  content:"";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url(../../common/mypage/image/icon-stamp-active.png);
}
.mypage-top-head [data-stamp='0']>li::after {
  display: none;
}
.mypage-top-head [data-stamp='1']>li:nth-child(n + 2)::after {
  display: none;
}
.mypage-top-head [data-stamp='2']>li:nth-child(n + 3)::after {
  display: none;;
}
.mypage-top-head [data-stamp='3']>li:nth-child(n + 4)::after {
  display: none;;
}
.mypage-top-head [data-stamp='4']>li:nth-child(n + 5)::after {
  display: none;;
}
.mypage-top-head [data-stamp='5']>li:nth-child(n + 6)::after {
  display: none;;
}
.mypage-top-head [data-stamp='6']>li:nth-child(n + 7)::after {
  display: none;;
}
.mypage-top-head [data-stamp='7']>li:nth-child(n + 8)::after {
  display: none;;
}
.mypage-top-head [data-stamp='8']>li:nth-child(n + 9)::after {
  display: none;;
}
.mypage-top-head [data-stamp='9']>li:nth-child(n + 10)::after {
  display: none;;
}
.mypage-top-head [data-stamp='10']>li:nth-child(n + 11)::after {
  display: none;;
}
.mypage-top-head [data-stamp='11']>li:nth-child(n + 12)::after {
  display: none;;
}
.mypage-top-head [data-stamp='12']>li {
  display: block;
}
/*購入金額*/
.mypage-top-head .rank-main-target {
  position: relative;

  margin: 18px auto 10px;
}
.mypage-top-head .rank-main-target ul {
  display: flex;
  justify-content: space-between;
}
.mypage-top-head .rank-main-target ul>li {
  width:4.4%;
  height: 36px;
  border-radius: 2px;
  background: #f5f5f5;
}
.mypage-top-head .rank-main-target::after {
  content:"";
  position: absolute;
  display: block;
  height: 100%;
  top: 0;
  left: 0;
  background: #00a728;
  border-radius: 2px;
  z-index: 2;
}
/*目標達成比率*/
.mypage-top-head [data-rate='1']::after {
  width: calc(5% - 2px);
}
.mypage-top-head [data-rate='2']::after {
  width: calc(5% * 2 - 2px);
}
.mypage-top-head [data-rate='3']::after {
  width: calc(5% * 3  - 2px);
}
.mypage-top-head [data-rate='4']::after {
  width: calc(5% * 4  - 2px);
}
.mypage-top-head [data-rate='5']::after {
  width: calc(5% * 5  - 2px);
}
.mypage-top-head [data-rate='6']::after {
  width: calc(5% * 6  - 2px);
}
.mypage-top-head [data-rate='7']::after {
  width: calc(5% * 7  - 2px);
}
.mypage-top-head [data-rate='8']::after {
  width: calc(5% * 8  - 2px);
}
.mypage-top-head [data-rate='9']::after {
  width: calc(5% * 9  - 2px);
}
.mypage-top-head [data-rate='10']::after {
  width: calc(5% * 10  - 2px);
}
.mypage-top-head [data-rate='11']::after {
  width: calc(5% * 11  - 2px);
}
.mypage-top-head [data-rate='12']::after {
  width: calc(5% * 12  - 2px);
}
.mypage-top-head [data-rate='13']::after {
  width: calc(5% * 13  - 2px);
}
.mypage-top-head [data-rate='14']::after {
  width: calc(5% * 14  - 2px);
}
.mypage-top-head [data-rate='15']::after {
  width: calc(5% * 15 - 2px);
}
.mypage-top-head [data-rate='16']::after {
  width: calc(5% * 16  - 2px);
}
.mypage-top-head [data-rate='17']::after {
  width: calc(5% * 17  - 2px);
}
.mypage-top-head [data-rate='18']::after {
  width: calc(5% * 18  - 2px);
}
.mypage-top-head [data-rate='19']::after {
  width: calc(5% * 19  - 2px);
}
.mypage-top-head [data-rate='20']::after {
  width: 100%;
}
@media screen and (max-width:768px) {
  .mypage-top-head .rank-main-stamp>li {
    background-size: 100% auto;
    width: 15.5%;
    margin-right: 1.4%;
  }
  .mypage-top-head .rank-main-stamp>li:nth-child(6n) {
    margin-right: 0;
  }
  .mypage-top-head .rank-main-stamp>li::after {
    background-size: 100% auto;
  }
}
/*注記*/
.mypage-top-head .rank-main-note {
  width: calc(100% - 800px);
  padding-left: 25px;
}
.mypage-top-head .rank-main-note.active {
  width: 100%;
  padding-left: 0;
  margin-bottom: 60px;
  background: #FFFBF0;
  padding: 60px 30px;
}
.mypage-note-list>li {
  position: relative;
  font-size: 1.3rem;
  line-height: 1.54em;
  padding-left: 19px;
  margin-bottom: 5px;
  color: #888888;
}
.mypage-note-list>li::after {
  content: '※';
  position: absolute;
  left: 0;
  top: 0;
  width: 1em;
  height: 1em;
}
.mypage-top-head .rank-main-note .range {
  margin-bottom: 30px;
}
.mypage-top-head .rank-main-note.active .range {
  font-weight: bold;
}
@media screen and (max-width:1024px) {
  .mypage-top-head .rank-main-note {
    width: 100%;
    padding-left: 0;
  }
  .mypage-top-head .rank-main-box {
    margin-bottom: 30px;
  }
}
@media screen and (max-width:768px) {

  .mypage-top-head .rank-main-note {
    width:100%;
    border-top:1px solid #dddddd;
    padding-top: 25px;
  }
  .mypage-top-head .rank-main-note.active {
    position: relative;
    padding: 40px 0px;
    margin-bottom: 40px;
  }
  .mypage-top-head .rank-main-note.active::before {
    content: '';
    position: absolute;
    left: -20px;
    top: -1px;
    width: calc(100% + 40px);
    height: 100%;
    background: #FFFBF0;
  }
  .mypage-top-head .rank-main-note .range {
    position: relative;
    margin-bottom: 25px;
  }

}
.mypage-top-head .current-block-head {
  position: relative;
  cursor: pointer;
  padding-left: 27px;
  margin-bottom: 0;
  display: block;
}
.mypage-top-head .current-block-head .icon {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 18px;
  height: 18px;
  background-image: url(../../common/mypage/svg/icon-plus.svg);
  background-repeat: no-repeat;
  background-size: 18px auto;
}
.mypage-top-head .current-block-head.active .icon {
  background-image: url(../../common/mypage/svg/icon-minus.svg);
}
.mypage-top-head .current-block-body {
  display: block;
  background: #f5f5f5;
  text-align: center;
  line-height: 1em;
  padding: 10px;
  margin-top: 10px;
  margin-bottom: 0;
}
/*マイページセクション*/
.mypage-top-section {
  border-top: 1px solid #dddddd;
  padding: 85px 0 90px;
  max-width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width:1200px) {
  .mypage-top-section {
      position: relative;
      border-top: 0;
  }
  .mypage-top-section::after {
      content:"";
      position: absolute;
      display: block;
      width: calc(100% - 40px);
      height: 1px;
      top:0;
      left:20px;
      background: #dddddd;
  }
  /*media 1200*/
}
@media screen and (max-width:768px) {
  .mypage-top-section {
    padding: 55px 0 60px;
    max-width: 1200px;
    margin: 0 auto;
  }
  .mypage-top-head .current-block-head {
    padding-left: 23px;
  }
  /*media 768*/
}

/*マイカードリスト*/
.mypage-top-section .card-list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 797px;
  margin: 0 auto 15px;
}
.mypage-top-section .card-list>li {
  position: relative;
  width: 48.24% ;
  margin-bottom: 24px;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  text-align: center;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
.mypage-top-section .card-list>li .label-icon {
  position: absolute;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.3rem;
  color: #fff;
  line-height: 28px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
}
.mypage-top-section .card-list>li .image {
  padding: 20px 66px;
  border-bottom: 1px solid #f5f5f5;
}
.mypage-top-section .card-list>li .image img {
   max-width: 170px;
    width: 100%;
}
.mypage-top-section .card-list>li .title {
  padding-top: 15px;
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 3px;
}
.mypage-top-section .card-list>li .number {
  font-size: 1.4rem;
  padding-bottom: 15px;
}
@media screen and (max-width:768px) {
  .mypage-top-section .card-list {
      display: block;
      margin: 0 auto 40px;
      max-width: 340px;
  }
  .mypage-top-section .card-list>li {
      width: 100%;
      display: block;
      margin: 0 auto 18px;
  }
  /*media 768px*/
}

/*お気に入りのハンバーガー*/
.mypage-top-section .favorite-block {
  max-width: 559px;
  margin: 0 auto;
}
.mypage-top-section .favorite-list {
  margin-bottom: 40px;
}
.mypage-top-section .favorite-list>li {
  margin-bottom: 25px;
}
.mypage-top-section .favorite-list>li>a {
  display: flex;
  align-items: center;
  font-size: 1.6rem;
  font-weight: bold;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
.mypage-top-section .favorite-list>li .image {
  padding: 9px 15px;
  width: 105px;
  border-right: 1px solid #f5f5f5;
  min-height: 80px;
}
.mypage-top-section .favorite-list>li .title {
  width: calc(100% - 105px);
  padding-left: 18px;
}
.mypage-top-section .favorite-message {
  text-align: center;
  margin-bottom: 25px;
}
.mypage-top-section .favorite-button {
  text-align: center;
  margin-bottom: 25px;
}
.mypage-top-section .favorite-note {
  margin-top: 25px;
}
@media screen and (max-width:768px) {
  .mypage-top-section .favorite-block {
      max-width: 559px;
      margin: 0 auto;
      text-align: left;
  }
  .mypage-top-section .favorite-message {
    text-align: left;
    margin-bottom: 25px;
  }
}
/*クーポン*/
.mypage-top-section .coupon-title {
  text-align: center;
}
.mypage-top-section .coupon-title .headline-m {
  display: inline-block;
  position: relative;
  padding: 0 100px;
}
.mypage-top-section .coupon-title small {
  position: absolute;
  display: inline-block;
  width: 78px;
  line-height: 32px;
  padding:0 10px;
  text-align: center;
  right: 0;
  top: 3px;
  font-size: 1.6rem;
  font-weight: normal;
  background: #f5f5f5;
  border-radius: 5px;
}
.mypage-top-section .coupon-message {
  margin-bottom: 35px;
  text-align: center;
}
.mypage-top-section .coupon-message-red {
  text-align: center;
  color: #E90000;
  margin-bottom: 15px;
}
.mypage-top-section .coupon-link {
  text-align: center;
}
@media screen and (max-width:768px) {
  .mypage-top-section .coupon-title .headline-m {
      padding: 0 70px 0 0;
  }
  .mypage-top-section .coupon-title small {
    width: 60px;
    line-height: 26px;
    font-size: 1.2rem;
  }
  .mypage-top-section .coupon-message {
    margin-bottom: 35px;
    text-align: left;
  }
  .mypage-top-section .coupon-message-red {
    text-align: left;
    margin-bottom: 15px;
  }
  .mypage-top-section .coupon-link {
    text-align: left;
  }
  .mypage-top-section .coupon-title small {
      width: 60px;
      line-height: 26px;
      font-size: 1.2rem;
      top: -1px;
  }
}
/*子供会員*/
.mypage-top-section .child-member-button {
  text-align: center;
  margin-bottom: 25px;
}
.mypage-top-section .child-member-note {
  display: flex;
  justify-content: center;
  margin-top: 25px;
}
@media screen and (max-width:768px) {
  #mypage-top-member .mypage-two-list {
    margin-bottom: 0;
  }
}
/*限定コンテンツ*/
.mypage-top-section .limited-list {
  max-width:559px;
  margin: 0 auto;
}
.mypage-top-section .limited-list>li>a {
  display: flex;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
.mypage-top-section .limited-list>li>a .image {
  width: 105px;
  border-right: 1px solid #f5f5f5;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}
.mypage-top-section .limited-list>li>a .text {
  width: calc(100% - 105px);
  padding: 18px 18px;
}
.mypage-top-section .limited-list>li>a .title {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 5px;
}
@media screen and (max-width:768px) {
   #mypage-top-child {
    padding-bottom: 50px;
   }
}
/*ボタン*/
.mypage-top-button {
  display: flex;
  justify-content: center;
}
.mypage-top-button .button {
  margin: 0 15px;
}
@media screen and (max-width:768px) {
  .mypage-top-button .button {
    margin: 0;
  }
  .mypage-top-button.two {
    display: flex;
    justify-content: space-between;
    max-width: 340px;
    margin: 0 auto;
  }
  .mypage-top-button.two .button {
    display: block;
    max-width: 160px;
    width: 48%;
    font-size: 1.4rem;
    margin: 0;
  }
  .mypage-top-button.two-clear {
    flex-wrap:wrap;
  }
  .mypage-top-button.two-clear .button:nth-child(1) {
    margin-bottom: 20px;
  }
  .mypage-top-button.two-clear .button {
      margin: 0;
  }
}
/******************
目標達成
******************/
.mypage-top-head .rank-goal .goal-box {
  text-align: center;
}
.mypage-top-head .rank-goal .goal-box-title {
  margin-bottom: 15px;
}
.mypage-top-head .rank-goal .goal-box-image {
  max-width: 135px;
  display: block;
  margin: 0 auto 40px;
}
@media screen and (max-width:768px) {
  .mypage-top-head .rank-goal .rank-main-row {
    display: flex;
  }
  .mypage-top-head .rank-goal .goal-box-image {
    max-width: 103px;
    display: block;
    margin: 0 auto 20px;
  }

  .mypage-top-head .rank-goal .rank-main-head {
      padding: 0 15px;
  }
  .mypage-top-head .rank-goal .rank-main-column:first-child::after {
    display: block;
  }
  .mypage-top-head .rank-goal .rank-main-column:first-child .box {
    border: none;
  }

  .mypage-top-head .rank-goal .rank-main-column .box {
    padding-bottom: 0;
  }

  .mypage-top-head .rank-goal .rank-main-column {
      width: 100%;
      display: flex;
      padding: 25px 0 0;
      justify-content: center;
  }
  .mypage-top-head .rank-goal .rank-main-box {
    border: 1px solid #ddd;
    padding-bottom: 25px;
    margin-bottom: 40px;
  }

  .mypage-top-head .rank-goal .rank-main-message {
    padding: 0 15px;
    max-width: none;
    margin: 20px auto 0px;
  }
/*media 768*/
}
@media screen and (max-width:360px) {
  .mypage-top-head .current-block-head {
    font-size: 1.3rem;
  }
  /*media 360*/
}

/******************
モスカード未登録表示
******************/
.mypage-contents .moscard-none {
  padding-bottom: 90px;
}
.mypage-contents .moscard-none-name {
  font-size: 1.8rem;
  margin-bottom: 25px;
}
.mypage-contents .moscard-none-head {
  position: relative;
  background: #f5f5f5;
  text-align: center;
  padding: 14px 10px 12px;
  font-weight: bold;
  z-index: 1;
  margin-bottom: 45px;
}
.mypage-contents .moscard-none-head::after {
  content: "";
  position: absolute;
  display: block;
  width: 19px;
  height: 19px;
  bottom: -7px;
  margin-left: -10px;
  left: 50%;
  background: #f5f5f5;
  border-radius: 3px;
  transform: rotate(45deg);
  z-index: -1;
}
.mypage-contents .moscard-none-block {
  margin-bottom: 35px;
}
.mypage-contents .moscard-none-text {
  text-align: center;
  margin-bottom: 35px;
}
.mypage-contents .moscard-none-note {
  display: flex;
  justify-content: center;
  padding-top: 30px;
}

@media screen and (max-width:768px) {
  .mypage-contents .moscard-none {
    padding-bottom: 60px;
  }
  .mypage-contents .moscard-none-name {
    font-size: 1.4rem;
    margin-bottom: 18px;
  }
  .mypage-contents .moscard-none-head {
    margin-bottom: 25px;
  }
  /*media 768*/
}
@media screen and (max-width:425px) {

  .mypage-contents .moscard-none-text {
      text-align: left;
  }
  /*media 425*/
}

/******************
 モスカード残高移行
/******************/
#transfer .transfer-area {
  background:url(../my/image/bg_arrow_01.png) center center no-repeat;
  display: flex;
  justify-content: space-between;
  max-width: 980px;
  margin: 0 auto;
}
#transfer .transfer-area p {
  margin-bottom: 0;
}
#transfer .card-area {
    width: 45.5%;
}
#transfer .card-area .heading {
    display:block;
    padding:8px 0;
    border-radius: 4px 4px 0 0;
    background:#00a728;
    text-align: center;
    color: #fff;
    font-size: 1.8rem;
}
#transfer .card-area.destination .heading {
    background:#006436;
}
#transfer .card-area.noselect .heading {
    background:#e6e6e6;
}
#transfer .card-area.noselect img {
  opacity: 0.4;
}
#transfer .card-area .box {
    background-color: #ffffff;
    border: 2px solid #e6e6e6 ;
    border-radius: 0 0 4px 4px;
    border-top: none;
}
#transfer .card-area .box .card{
    padding: 15px;
}
#transfer .card-area .box .card-detail {
    border-top: 2px solid #e6e6e6;
}
#transfer .card-area .box .card form input {
  max-width: 100%;
}
#transfer .card-area.noselect .box .card input {
  opacity: 0.4;
}
#transfer .transfer-area .align-c {
  margin-bottom: 15px;
}
#transfer .transfer-area .iconText {
  margin: 0 0 10px;
}
#transfer .transfer-area .user-name {
  font-size: 1.6rem;
  font-weight: bold;
  word-wrap: break-word;
}
#transfer .user-nmb {
  display: block;
  margin-top:5px;
  word-wrap: break-word;
  font-size: 1.4rem;
  line-height: 24px;
}
#transfer .card-detail dl {
  display: flex;
  padding: 15px;
}
#transfer .card-detail dl dt {
  width: 100px;
  padding-left: 28px;
}
#transfer .card-detail dl dd {
  width: calc(100% - 100px);
  text-align: right;
}
#transfer .dot-top {
    border-top: 2px dotted #e6e6e6;
}
#transfer .card-detail dl dt.icn_01 {
    background:url(../my/image/bg_icon_01.png) left center no-repeat;
    font-weight: bold;
}
#transfer .card-detail dl dt.icn_02 {
    background:url(../my/image/bg_icon_02.png) left center no-repeat;
    font-weight: bold;
}
#transfer .card-area.noselect .card-detail dl dt.icn_01 {
    background:url(../my/image/bg_icon_03.png) left center no-repeat;
}
#transfer .card-area.noselect .card-detail dl dt.icn_02 {
    background:url(../my/image/bg_icon_04.png) left center no-repeat;
}
@media screen and (max-width: 768px){
  #transfer .transfer-area .user-name {
    font-size: 1.4rem;
  }
  #transfer .card-detail dl {
    display: block;
    padding: 10px;
  }
  #transfer .card-detail dl dt,
  #transfer .card-detail dl dd {
      width: 100%;
  }
  #transfer .card-detail dl dd {
    padding-top: 5px;
  }
  #transfer .transfer-area{
      background-size: 6%;
  }
  #transfer form + .ta-c,
  #transfer .ta-c + .ta-c {
    margin-top: 0;
  }
}

/*カード選択*/
#transfer li.card-select {
  opacity:0.5;
}
#transfer li .frame-green .solid-lineB {
  position: relative;
  padding: 0px 0 20px;
  border-bottom: 1px solid #ccc;
  cursor: pointer;
}
#transfer li.card-select .frame-green .solid-lineB {
  cursor: auto;
}
#transfer li .frame-green .solid-lineB .mediaBox-auto {
  width: 100%;
  display: block;
  padding-right:22px;
  margin-bottom: 0;
}
#transfer li .frame-green .solid-lineB .mediaBox-auto span {
  display: block;
  text-align: left;
}
#transfer li .frame-green .solid-lineB .mediaBox-auto::after {
  content: '';
  position: absolute;
  right: 5px;
  top: 50%;
  width: 20px;
  height: 20px;
  margin-top: -25px;
  border-top: 3px solid #00A728;
  border-right: 3px solid #00A728;
  transform: rotate(45deg);
}
#transfer li.card-select .frame-green .solid-lineB .mediaBox-auto::after {
  display: none;
}
#transfer li .frame-green .solid-lineB .mediaBox-auto .iconText {
  display: inline-block;
}
#transfer .frameList .flex {
  width: 100%;
}
#transfer .frameList .card-detail {
  width: 50%;
}
#transfer .frameList .card-detail:last-child {
  border-left: 1px dashed #ccc;
}
#transfer .frameList .card-detail dl {
    margin: 10px 0;
    padding: 5px 20px;
    box-sizing: border-box;
}
#transfer .frameList ul.period-list {
  margin: 10px 0 0;
  display: flex;
  padding: 0 20px;
  flex-wrap: wrap;
}
#transfer .frameList ul.period-list li {
    margin:0 0 5px;
    padding-right:20px;
    font-size: 12px;
}
@media screen and (max-width: 768px) {
  #transfer .frameList .card-detail dl {
    padding: 5px 10px;
  }
  #transfer li .frame-green .solid-lineB{
      padding: 0;
  }
  #transfer li .frame-green .solid-lineB .mediaBox-auto {
    padding-bottom: 20px;
  }
  #transfer li .frame-green .solid-lineB .mediaBox-auto::after {
    width: 12px;
    height: 12px;
  }
  #transfer .frameList ul.period-list {
    padding: 0;
  }
}

/*残高移行金額入力&確認*/
#transfer .transfer-point {
  padding-top: 60px;
}
#transfer .point span{
  display: inline-block;
  margin-bottom: 10px;
}
#transfer .point input[type="tel"]{
  margin-right: 10px;
  text-align: right;
}
#transfer .transfer-after .box {
  width: 50%;
  padding: 0 4.5% 0 0;
}
#transfer .transfer-after .box:last-child {
  padding: 0 0 0 4.5%;
  border-left: 1px dashed #ccc;
}
#transfer .transfer-after .box .card p {
  margin-bottom: 0;
}
#transfer .transfer-after .box .image {
  text-align: center;
  padding: 10px;
}
#transfer .transfer-after .box .card .user-name {
  font-size: 1.6rem;
  font-weight: bold;
  margin-top: 10px;
}
#transfer .transfer-after .box .title {
  background: #00A728;
  color: #fff;
  text-align: center;
  padding: 5px;
  font-size: 1.6rem;
  border-radius: 5px;
  margin-bottom: 10px;
}
#transfer .transfer-after .box .title.send {
  background: #006436;
}
#transfer .transfer-after .box .input-point>* {
  width: 50%;
  text-align: right;
  padding: 10px 20px;
  font-size: 1.6rem;
}
#transfer .transfer-after .box .input-point>*:last-child {
  border-left: 1px dashed #ccc;
}
@media screen and (max-width: 768px) {
  #transfer .transfer-point {
    padding-top: 40px;
  }
  #transfer .transfer-after .box {
    padding: 0 10px 0 0;
  }
  #transfer .transfer-after .box:last-child {
    padding: 0 0 0 10px;
  }
  #transfer .transfer-after .box .card {
    padding: 0 10px;
  }
  #transfer .transfer-after .box .title {
    margin-bottom: 10px;
  }
  #transfer .transfer-after .box .input-point {
    flex-wrap: wrap;
  }
  #transfer .transfer-after .box .input-point>* {
    width: 100%;
    text-align: right;
    padding: 10px 0;
    font-size: 1.4rem;
  }
  #transfer .transfer-after .box .input-point>*:last-child {
    border: none;
    border-top: 1px dashed #ccc;
  }
}
/* 残高移行完了 */
#transfer .transfer-after.complete{
  border: 1px solid #ccc;
  padding: 40px;
}
#transfer .transfer-after ul.period-list {
  margin: 20px 0 0;
  display: flex;
  flex-wrap: wrap;
}
#transfer .transfer-after ul.period-list li {
  margin: 0 0 5px;
  padding-right:20px;
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  #transfer .transfer-after.complete{
    padding: 20px;
  }
  #transfer .transfer-after.complete .box {
    width: 100%;
    padding: 0;
  }
  #transfer .transfer-after.complete .box:last-child {
    position: relative;
    border: none;
    margin-top: 20px;
    padding: 20px 0 0;
  }
  #transfer .transfer-after.complete .box:last-child::after {
    content: '';
    position: absolute;
    top: 0;
    left: -20px;
    width: calc(100% + 40px);
    height: 1px;
    background: #ccc;
  }
  #transfer .transfer-after ul.period-list li {
    width: 100%;
    padding: 0;
  }
}


/*====================================
/* 06.モスのネット注文
====================================*/

/*====================================
/* 07.公式アプリ紹介
====================================*/

/*====================================
/* 08.キャンペーン情報
====================================*/

/*====================================
/* 09.キッズお楽しみTOP
====================================*/
.kids-section-title {
  font-weight: normal;
  font-size: 2.4rem;
  margin-bottom: 25px;
}
.kids-top-head{
  border-bottom: 1px solid #ddd;
}
.kids-top-message {
  text-align: center;
  margin-bottom: 40px;
}
.kids-top-image {
  width: 256px;
  margin: 0 auto;
  text-align: center;
}
.kids-top-image img {
  text-align: center;
  width: 100%;
}
.kids-top .kids-top-section {
  position: relative;
  padding: 65px 0 30px;
}
.kids-top .kids-top-section .wrap {
  padding-bottom: 40px;
}
.kids-top #kids-section.kids-top-section .wrap {
  border-bottom: 1px solid #ddd;
}
.kids-top #fun-section.kids-top-section .wrap {
  padding-bottom: 0;
}
.kids-top-group { 
  margin-bottom: 35px;
}

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

  .kids-top #kids-section.kids-top-section {
    padding-bottom: 0;
  }
  .kids-top #kids-section.kids-top-section .wrap {
    position: relative;
    border-bottom: 0;
  }
  .kids-top #fun-section.kids-top-section .wrap::after {
    content:'';
    position: absolute;
    display: block;
    width: calc(100% - 40px);
    height: 1px;
    top:0;
    left:20px;
    background:#ddd;
  }
  .kids-top .kids-top-section .wrap {
    padding-bottom: 0px;
  }
  .kids-top .kids-top-section {
    padding: 55px 0 0;
  }
  .kids-section-title {
    font-size: 1.8rem;
    margin-bottom: 15px;
  }
  .kids-top-group {
    margin-bottom: 55px;
  }
}

/******************
キッズページリスト
******************/
.kids-page-list {
  display: flex;
  flex-wrap:wrap;
}
.kids-page-list li {
  position: relative;
  width: 32% ;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
  margin-bottom: 28px;
  background: #fff;
}
.kids-page-list li:nth-child(3n) {
  margin-right: 0;
}
.kids-page-list li a {
  position: relative;
  display: block;
  height: 100%;
  padding-bottom: 15px;
}
.kids-page-list li .image {
  position: relative;
  text-align: center;
  margin-bottom: 15px;
}
.kids-page-list li .image img {
  width: 100%;
}
.kids-page-list li .box {
  padding: 0 15px;
}
.kids-page-list li .icon {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.2rem;
  color: #fff;
  line-height: 20px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
  z-index: 2;
}
.kids-page-list li .title {
  font-size: 1.6rem;
  font-weight: bold;
  padding: 0px;
  margin-bottom: 8px;
}
.kids-page-list li .message {
  margin-bottom: 0.5em;
}
.kids-page-list li .message-note {
  position: relative;
  padding-left: 1.5em;
  font-size: 1.2rem;
  color:#888888;
}
.kids-page-list li .message-note::after {
  content: '※';
  position: absolute;
  display: block;
  width: 1em;
  height: 1em;
  top:0;
  left:0;
}

@media screen and (max-width:1024px){
  .kids-page-list li {
    position: relative;
    width: 48%;
    margin-right: 4%;
  }
  .kids-page-list   li:nth-child(4n) {
    margin-right: 4%;
  }
  .kids-page-list   li:nth-child(3n) {
    margin-right: 4%;
  }
  .kids-page-list   li:nth-child(2n) {
    margin-right: 0;
  }

}

@media screen and (max-width:425px){
  .kids-page-list {
    display: block;
  }
  .kids-page-list  li {
    position: relative;
    width: 100%;
    display: block;
    margin-right: 0;
    margin-bottom: 20px;
  }
  .kids-page-list  li:nth-child(4n),
  .kids-page-list  li:nth-child(3n),
  .kids-page-list  li:nth-child(2n) {
    margin-right: 0;
  }
}

/******************
キッズメニューリスト
******************/
.kids-menu-list {
  display: flex;
  flex-wrap:wrap;
}
.kids-menu-list li {
  position: relative;
  width: 32% ;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
  margin-bottom: 28px;
  background: #fff;
}
.kids-menu-list li:nth-child(3n) {
  margin-right: 0;
}
.kids-menu-list li a {
  position: relative;
  display: block;
  height: 100%;
  padding-bottom: 15px;
}
.kids-menu-list li .image {
  position: relative;
  text-align: center;
  margin-bottom: 15px;
  padding-bottom: 10px;
  border-bottom: 1px solid #f5f5f5;
}
.kids-menu-list li .image img {
  display: inline-block;
  width: 100%;
  max-width: 217px;
}
.kids-menu-list li .box {
  padding: 0 15px;
}
.kids-menu-list li .icon {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.2rem;
  color: #fff;
  line-height: 20px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
  z-index: 2;
}
.kids-menu-list li .title {
  font-size: 1.6rem;
  font-weight: bold;
  padding: 0px;
  margin-bottom: 8px;
}
.kids-menu-list li .message {
  margin-bottom: 0.5em;
}

.kids-menu-list li .message-note {
  position: relative;
  padding-left: 1.5em;
  font-size: 1.2rem;
  color:#888888;
}
.kids-menu-list li .message-note::after {
    content:"※";
    position: absolute;
    display: block;
    width: 1em;
    height: 1em;
    top:0;
    left:0;
}

@media screen and (max-width:1024px){
  .kids-menu-list li {
    position: relative;
    width: 48%;
    margin-right: 4%;
  }
  .kids-menu-list   li:nth-child(4n) {
    margin-right: 4%;
  }
  .kids-menu-list   li:nth-child(3n) {
    margin-right: 4%;
  }
  .kids-menu-list   li:nth-child(2n) {
    margin-right: 0;
  }

}

@media screen and (max-width:425px){
  .kids-menu-list {
    display: block;
  }
  .kids-menu-list  li {
    position: relative;
    width: 100%;
    display: block;
    margin-right: 0;
    margin-bottom: 20px;
  }
  .kids-menu-list  li:nth-child(4n),
  .kids-menu-list  li:nth-child(3n),
  .kids-menu-list  li:nth-child(2n) {
    margin-right: 0;
  }
}

/******************
キッズバナー
******************/
.kids-banner-list {
  display: flex;
  flex-wrap: wrap;
}
.kids-banner-list li {
  position: relative;
  width: 32% ;
  overflow: hidden;
  margin-right: 2%;
}
.kids-banner-list li a{
  display: block;
}

.kids-banner-list li .box {
  padding:25px;
  display: block;
  background: #fffbf0;
}
.kids-banner-list li .image {
  margin-bottom: 20px;
  border-radius: 3px;
  border:1px solid #ffebd9;
  overflow: hidden;
}
.kids-banner-list li .message {
  text-align: center;
  font-weight: bold;
}
.kids-banner-list li .more {
  position: relative;
  background: #00a728;
  text-align: center;
  color:#fff;
  font-weight: bold;
  padding: 3px 0;
  font-size: 1.3rem;
}
.kids-banner-list li .more::after {
  content: '';
  position: absolute;
  top: 50%;
  right:12px;
  width: 7px;
  height: 7px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform: translate(0,-50%) rotate(-45deg);
}
.kids-banner-list li .more>span {
  padding-right: 25px;
  background-image: url(../svg/target-blank.svg);
  background-size: 14px;
  background-repeat: no-repeat;
  background-position: 100% center;
}

@media screen and (max-width:1024px){
 .kids-banner-list li {
    position: relative;
    width: 48%;
    margin-right: 4%;
  }
 .kids-banner-list li:nth-child(4n) {
    margin-right: 4%;
  }
 .kids-banner-list  li:nth-child(3n) {
    margin-right: 4%;
  }
 .kids-banner-list li:nth-child(2n) {
    margin-right: 0;
  }

}

@media screen and (max-width:425px){
 .kids-banner-list {
    display: block;
  }
 .kids-banner-list li {
    position: relative;
    width: 100%;
    display: block;
    margin-right: 0;
    margin-bottom: 20px;
  }
 .kids-banner-list li:nth-child(4n),
 .kids-banner-list li:nth-child(3n),
 .kids-banner-list li:nth-child(2n) {
    margin-right: 0;
  }
}

/******************
 こども会員
******************/
.kids-top-member {
  padding: 40px;
  background: #fffbf0;
  margin-bottom: 45px;
}
.kids-top-member .block {
  display: flex;
  justify-content: center;
}
.kids-top-member .block .column1 {
  width: 72.15%;
  /*padding-right: 30px;*/
  transition: opacity .3s ease;
}
.kids-top-member .block .column1.noactive {
  opacity: 0;
}
.kids-top-member .block .column2 {
  position: relative;
  width: 27.85%;
  padding-left: 40px;
}
.kids-top-member .block .column2::after {
  content:"";
  position: absolute;
  display: block;
  width: 0;
  height: 100%;
  top: -10px;
  left: 0;
  border-left: 1px dashed #ddd;
}
.kids-top-member .block .column2 .item {
  position: relative;
  display: block;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
  margin-bottom: 28px;
  background:#fff;
}
.kids-top-member .block .column2 .item .image img {
  width: 100%;
}
.kids-top-member .block .column2 .item .box {
  padding: 15px;
}
.kids-top-member .block .column2 .item .title {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 5px;
}
.kids-top-member .block .column2 .item .message {
  font-size: 1.4rem;
}
.kids-top-member .block .column2 .item .icon {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.2rem;
  color: #fff;
  line-height: 20px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
  z-index: 2;
}
.kids-top-member .kids-member-image {
  margin-bottom: 20px;
}
.kids-top-member .kids-member-message {
  margin-bottom: 40px;
}
.kids-top-member .kids-member-block {
  max-width: 708px;
  margin: 0 auto;
}
.kids-top-member .kids-member-button {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.kids-top-member .kids-member-button  .button {
  width: 49%;
}

@media screen and (max-width:1024px){
  .kids-top-member .block .column2 {
      padding-left: 20px;
  }
  .kids-top-member .block .column1 {
      padding-right: 18px;
  }
  .kids-top-member {
      padding: 40px 20px;
  }
}

@media screen and (max-width:768px){
  .kids-top-member {
    margin-bottom: 40px;
    padding: 20px 15px 20px;
  }

  .kids-top-member .block {
    display: block;
  }
  .kids-top-member .block .column1 {
    width: 100%;
    margin-bottom: 30px;
  }
  .kids-top-member .block .column1 {
    width: 100%;
    padding-right: 0px;
    margin-bottom: 30px;
  }
  .kids-top-member .block .column2 {
    position: relative;
    width: 100%;
    padding-left: 0px;
  }
  .kids-top-member .kids-member-message {
    margin-bottom: 30px;
  }
  .kids-top-member .block .column2::after {
    display: none;
  }
  .kids-top-member .block .column2 .item {
    margin-right: 0;
    margin-bottom: 0;
  }
  .kids-top-member .kids-member-button {
    margin-bottom: 20px;
    display: block;
  }
  .kids-top-member .kids-member-button {
    margin: 0 auto;
    display: block;
  }
  .kids-top-member .kids-member-button .button {
    width: 100%;
    max-width: none;
    margin-bottom: 20px;
  }
}

/******************
 会員表示
******************/
.kids-top-member .kids-joined .kids-member-block {
  max-width: 340px;
}
.kids-top-member .kids-joined .kids-member-block .button {
  width: 100%;
}
.kids-joined-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 20px;
}
.kids-joined-list > li:only-child {
  width:377px;
}
.kids-joined-list > li {
  width: 48.5%;
  min-width: 48.5%;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 3%;
  overflow: hidden;
  background: #fff;
  margin-bottom: 20px;
}
.kids-joined-list > li:nth-child(2n) {
  margin-right: 0;
}
.kids-joined-list > li:last-child:not(:only-child) {
  margin-right: auto;
}
.kids-joined-list > li > a {
  display: flex;
  align-items: center;
  height: 100%;
  min-height: 60px;
  padding: 0px 15px 0px 60px;
  background-image: url(../svg/icon-kids.svg);
  background-position: 15px center;
  background-size: 30px;
  background-repeat: no-repeat;
  line-height: 1.4;
}
.kids-joined-list > li > a strong {
  font-weight: bold;
  padding-right: 0.5em;
}
@media screen and (max-width:768px) {
  .kids-joined-list {
    margin-bottom: 10px;
  }
  .kids-joined-list > li:only-child {
    width:100%;
  }
  .kids-joined-list > li {
    width: 100%;
    min-width: 0;
    box-shadow: 0 0 10px rgba(0,0,0,0.09);
    margin-right: 0;
    overflow: hidden;
    background: #fff;
    margin-bottom: 20px;
  }
  .kids-joined-list > li:nth-child(2n) {
    margin-right: 0;
  }
  .kids-joined-list > li:last-child:not(:only-child) {
    margin-right: auto;
  }
}

/*====================================
/* 10.モスWEB会員/新規会員登録
====================================*/
.mosweb-head .message {
  text-align: center;
  margin-bottom: 40px;
}
.mosweb-head .block {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 60px;
}
.mosweb-head .block .column1 {
  padding-right: 30px;
}
.mosweb-head .block .column2 {
  padding-right: 40px;
  width: 380px;
}
.mosweb-head .block .column2 .button {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .mosweb-head .message {
    text-align: center;
    margin-bottom: 25px;
  }
  .mosweb-head .block {
    display: block;
    margin-bottom: 0;
  }
  .mosweb-head .block .column1 {
    padding-right: 0;
    text-align:   center;
    margin-bottom: 30px;
  }

  .mosweb-head .block .column1 .image {}
  .mosweb-head .block .column2 {
    padding-right: 0px;
    max-width: 380px;
    width: 100%;
    margin: 0 auto;
  }
  .mosweb-head .block .column2 .button {
    width: 100%;
    display: block;
    margin:0 auto;
  }
  .mosweb-head .block  {
    display: block;
    margin-bottom: 40px;
  }
  /*media 768*/
}

/******************
 おトクで便利な会員特典
******************/
.mosweb-special {
  padding: 60px 0;
  background: #FFFBF0;
}
.mosweb-special .catch {
  position: relative;
  width: 220px;
  line-height: 30px;
  height: 30px;
  text-align: center;
  border: 1px solid #00a728;
  border-radius: 10px;
  color: #00a728;
  background: #fff;
  margin: -10px auto 34px;
}
.mosweb-special .catch::before {
  position: absolute;
  content: '';
  bottom: -9px;
  left:50%;
  margin-left: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 8px 0 8px;
  border-color: #00a728 transparent transparent transparent;
}
.mosweb-special .catch::after {
  position: absolute;
  content:'';
  bottom: -8px;
  left:50%;
  margin-left: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 8px 0 8px;
  border-color: #ffffff transparent transparent transparent;
}
.mosweb-special-list {
  margin-bottom: 50px;
}
.mosweb-special-list>li {
  display: flex;
  padding: 20px 28px 10px;
  margin-bottom: 20px;
  background: #fff;
  border:1px solid #ffebd9;
}
.mosweb-special-list>li .list-head {
  width: 340px;
}
.mosweb-special-list>li .list-head-inner {
  display: flex;
  align-items: center;
  padding-right: 25px;
}

.mosweb-special-list>li .list-head .number {
  width: 70px;
  margin-top: -5px;
}
.mosweb-special-list>li .list-head .title {
  font-size: 2rem;
  width: calc( 100% - 70px );
  line-height: 1.5;
  padding-top: 0;
  font-weight: bold;
}
.mosweb-special-list>li .list-body {
  position: relative;
  padding-right: 254px;
  width: calc(100% - 340px);
}
.mosweb-special-list>li .list-body .message {
  padding-top: 17px;
  margin-bottom: 1em;
}
.mosweb-special-list>li .list-body .image {
  width: 209.48px;
  position: absolute;
  right: 0;
  top: 9px;
}
.mosweb-special-list>li .list-body .note-list>li {
  font-size: 1.2rem;

}
.mosweb-special-list>li .list-body .arrow {
  display: inline-block;
  margin-bottom: 1em;
}
@media screen and (max-width: 1024px) {

  .mosweb-special-list>li .list-head .number {
    width: 50px;
    margin-top: -5px;
  }
  .mosweb-special-list>li .list-head .number img {
    width: 30px;
  }
  .mosweb-special-list>li .list-head .title {
    font-size: 1.6rem;
    width: calc( 100% - 50px );
  }
  .mosweb-special-list>li .list-head {
    width: 267px;
  }
  .mosweb-special-list>li .list-body .message {
    padding-top: 5px;
    margin-bottom: 1em;
  }
  .mosweb-special-list>li .list-body {
    position: relative;
    padding-right: 170px;
    width: calc(100% - 267px);
  }
  .mosweb-special-list>li .list-body {
    position: relative;
  }
  .mosweb-special-list>li .list-body .image {
    width: 150px;
    top: 5px;
  }
}
@media screen and (max-width: 768px) {
  .mosweb-special {
    padding: 50px 0;
  }
  .mosweb-special .catch {
    margin:0 auto 25px;
  }
  .mosweb-special-list>li {
    display: block;
    padding:15px 23px 25px 23px;
    margin-bottom: 20px;
    background: #fff;
  }
  .mosweb-special-list>li .list-head {
      width: 100%;
      margin-bottom: 10px;
  }
  .mosweb-special-list>li .list-head .number {
    width: 45px;
    margin-top: 0px;
  }
  .mosweb-special-list>li .list-head .title {
    width: calc( 100% - 45px );
  }
  .mosweb-special-list>li .list-body {
    width: 100%;
    padding-right: 0;
  }
  .mosweb-special-list>li .list-body .image {
    position: static;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
  }
  .mosweb-special-list>li .list-head-inner {
    padding-right: 0;
  }
  .mosweb-special-list {
    margin-bottom: 40px;
  }
  /*media 768*/
}
/******************
 登録はかんたん3ステップ*
******************/
.mosweb-step .headline-m {
  display: flex;
  justify-content: center;
  margin-bottom: 55px;
}
.mosweb-step .headline-m > span {
  padding-top: 2px;
}
.mosweb-step .headline-m > em {
  font-size: 4.8rem;
  font-weight: bold;
  color: #00a728;
  display: inline-block;
}
.mosweb-step {
  padding: 65px 0;
}
.mosweb-step-order {
  display: flex;
  justify-content: space-between;
  padding: 0 58px;
  margin-bottom: 30px;
}
.mosweb-step-order>li {
  position: relative;
  text-align: center;
  width: 33.33%;
}
.mosweb-step-order>li .label {
  position: relative;
  display: block;
  width: 75px;
  margin:0 auto 30px;
  z-index:  2;
}
.mosweb-step-order>li .title {
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 30px;
}
.mosweb-step-order>li::after {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 4px;
  top: 38px;
  left: 50%;
  background: #00A728;
}
.mosweb-step-order>li:last-child::after {
  display: none;
}
.mosweb-step-button {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 980px) {
  .mosweb-step-order {
    display: block;
    margin-bottom: 30px;
  }
  .mosweb-step-order>li {
    position: relative;
    width: 100%;
    text-align: left;
    padding-left: 75px;
  }
  .mosweb-step-order>li::after {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    height: 100%;
    top: 30px;
    left: 28px;
    background: #00A728;
  }
  .mosweb-step-order>li .label {
    position: absolute;
    width: 60px;
    left: 0;
    top: 0;
    margin:0 auto 30px;
    z-index:  2;
  }
  .mosweb-step-order>li .title {
      font-size: 1.6rem;
      font-weight: bold;
      text-align: left;
      margin-bottom: 0;
      padding: 18px 0;
  }
  .mosweb-step-order>li br {
    display: none;
  }
  .mosweb-step .headline-m {
      display: flex;
      justify-content: center;
      margin-bottom: 30px;
  }
  /*media 980*/
}
@media screen and (max-width: 768px) {
  .mosweb-step {
    padding: 40px 0 20px;
  }
  .mosweb-step .headline-m > em {
    font-size: 3.3rem;
  }
  .mosweb-step-order {
    display: block;
    padding: 0;
  }
  /*media 768*/
}

/*====================================
/* 11.お知らせ詳細
====================================*/
#page-topics .headingPrimary + .cols .cols-1of2 {
  color: #888;
  margin-bottom: 1.5em;
}
.news-top-block{
  margin-bottom: 60px;
  transition: all .5s ease;
}
.news-top-block.noactive{
  min-height: 700px;
  opacity: 0;
}
.news-top-list {
  max-width: 1200px;
  margin: 0 auto 0;
}

.news-top-list article {
  border-bottom: 1px dashed #DDDDDD;
}

.news-top-list.wide-ly article:last-child {
  border-bottom: 0;
}

.news-top-list article>a {
  display: block;
  padding: 20px 30px;
}

.news-top-list article>a .info {
  margin-bottom: 10px;
}

.news-top-list article>a .info time {
  color: #888888;
  padding-top: 5px;
  margin-right: 15px;
  font-size: 1.2rem;
}

.news-top-list article>a .icon {
  font-size: 1.2rem;
  display: inline-block;
  width: 44px;
  text-align: center;
  border-radius: 3px;
  color: #fff;
  padding: 5px 0 4px;
  line-height: 1em;
  font-weight: bold;
}

.news-top-list article>a .icon.new {
  background: #00A728;
}

@media screen and (max-width:768px){
  .news-top-block{
    margin-bottom: 50px;
  }

  .news-top-list article>a {
    display: block;
    padding: 20px 0;
  }
}

/*
ニュース詳細
*/
.news-visual {
  position: relative;
  min-height: 280px;
  background: #FFFBF0;
}

.news-visual-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  object-fit: cover;
}

.news-visual-bg img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.news-visual-bg::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
}

.news-visual-text {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  text-align: center;
  z-index: 3;
}

.news-visual-bg+.news-visual-text {
  color: #fff;
}

.news-visual-bg+.news-visual-text .news-visual-time time {
  color: #fff;
}

.news-visual-bg+.news-visual-text .news-visual-time time::before,
.news-visual-bg+.news-visual-text .news-visual-time time::after {
  background: #fff;
}

.news-visual-title {
  font-size: 3.2rem;
  padding: 0 20px;
  margin-bottom: 25px;
  font-weight: normal;
}

.news-visual-time {
  font-size: 1.6rem;
  display: flex;
  justify-content: center;
}

.news-visual-time time {
  position: relative;
  display: inline-block;
  padding: 0 65px;
  color: #707070;

}

.news-visual-time time::before {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 1px;
  top: 50%;
  left: 0;
  background: #707070;
}

.news-visual-time time::after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 1px;
  top: 50%;
  right: 0;
  background: #707070;
}

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

  .news-visual-title {
    font-size: 2.2rem;
    margin-bottom: 15px;
  }

  .news-visual {
    height: 48vw;
    min-height: 188px
  }

  .news-visual-time time {
    padding: 0 47px;
  }

  .news-visual-time time::before {
    width: 30px;
  }

  .news-visual-time time::after {
    width: 30px;
  }

}


/*====================================
/* 12.よくある質問詳細
====================================*/

#page-faq {}

#page-faq .faq-block {
  padding-bottom: 100px;
}

#page-faq .main-contents {
  padding-bottom: 0;
}

.faq-note {
  padding-top: 20px;
}

.button-back-area {
  text-align: center;
}

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

  .button-back-area {
    text-align: center;
  }
}

/*====================================
/* 13.緊急告知/注意告知
====================================*/

/*====================================
/* 14.サービスTOP/モスカード紹介
====================================*/
.service-top-block {
  transition: all .3s ease;
}
.service-top-block.noactive {
  min-height: 1000px;
  opacity: 0;
}
/*サービスTOP*/
.service-top-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0 67px;
}
.service-top-list.noactive {
  min-height: 1000px;
  opacity: 0;
}
.service-top-list li {
  position: relative;
  width: 23.5% ;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
  margin-bottom: 28px;
  background: #fff;
}
.service-top-list li:nth-child(4n) {
  margin-right: 0;
}
.service-top-list li a {
  display: block;
  height: 100%;
  padding-bottom: 10px;
}
.service-top-list li .image {
  position: relative;
  text-align: center;
  margin-bottom: 15px;
  padding-top: 56.318%;
}
.service-top-list li .image img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: cover;
}
.service-top-list li .title {
  font-size: 1.6rem;
  font-weight: bold;
  padding: 0 15px;
  margin-bottom: 8px;
}
.service-top-list li .message {
  margin-bottom: 0.5em;
  padding: 0 15px;
}
.service-top-list li .note {
  margin-bottom: 0.5em;
  padding: 0 15px;
  font-size: 1.2rem;
  color: #888;
}
@media screen and (max-width:1024px) {
 /*メニューリスト*/
  .service-top-list  {
      padding: 0 0 25px;
  }
  .service-top-list  li {
    position: relative;
    width: 31%;
    margin-right: 3.5%;
  }
  .service-top-list  li:nth-child(4n) {
    margin-right: 3.5%;
  }
  .service-top-list  li:nth-child(3n) {
    margin-right: 0;
  }
}
@media screen and (max-width:768px) {
  .service-top-list  li {
    position: relative;
    width: 48%;
    margin-right: 4%;
    margin-bottom: 15px;
  }
  .service-top-list  li:nth-child(4n) {
    margin-right: 4%;
  }
  .service-top-list  li:nth-child(3n) {
    margin-right: 4%;
  }
  .service-top-list  li:nth-child(2n) {
    margin-right: 0;
  }
}
@media screen and (max-width:425px) {
  .service-top-list  li {
    position: relative;
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }
  .service-top-list  li:nth-child(4n),
  .service-top-list  li:nth-child(3n),
  .service-top-list  li:nth-child(2n) {
    margin-right: 0;
  }
}

/******************
店舗のサービス
******************/
.service-shop-group {
  margin-bottom: 100px;
}
.service-shop-title {
  display: flex;
  border-bottom: 1px solid #F5F5F5;
  margin-bottom: 30px;
  padding-bottom: 10px;
  align-items: center;
}
.service-shop-title .icons {
  display: flex;
  align-items: center;
}
.service-shop-title i {
  display: block;
  min-width: 60px;
  width:60px;
  height: 60px;
  border-radius: 10px;
  background: #F5F5F5;
  background-position: center;
  background-repeat: no-repeat;
}
.service-shop-title i.asamos {
  background-image: url(../../common/shop/svg/search/asamos.svg)
}
.service-shop-title i.alcohol {
  background-image: url(../../common/shop/svg/search/alcohol.svg)
}
.service-shop-title i.special {
  background-image: url(../../common/shop/svg/search/special.svg)
}
.service-shop-title i.credit {
  background-image: url(../../common/shop/svg/search/credit.svg)
}
.service-shop-title i.cafe {
  background-image: url(../../common/shop/svg/search/cafe.svg)
}
.service-shop-title i.goods {
  background-image: url(../../common/shop/svg/search/goods.svg)
}
.service-shop-title i.takeout {
  background-image: url(../../common/shop/svg/search/takeout.svg)
}
.service-shop-title i.delivery {
  background-image: url(../../common/shop/svg/search/delivery.svg)
}
.service-shop-title i.phone {
  background-image: url(../../common/shop/svg/search/phone.svg)
}
.service-shop-title i.drive {
  background-image: url(../../common/shop/svg/search/drive.svg)
}
.service-shop-title i.emoney {
  background-image: url(../../common/shop/svg/search/emoney.svg)
}
.service-shop-title i.dpoint {
  background-image: url(../../common/shop/svg/search/dpoint.svg)
}
.service-shop-title i.barcode {
  background-image: url(../../common/shop/svg/search/barcode.svg)
}
.service-shop-title i.parking {
  background-image: url(../../common/shop/svg/search/parking.svg)
}
.service-shop-title i.plug {
  background-image: url(../../common/shop/svg/search/plug.svg)
}
.service-shop-title i.docomo {
  background-image: url(../../common/shop/svg/result/sv12.svg)
}
.service-shop-title i.softbank {
  background-image: url(../../common/shop/svg/result/sv03.svg)
}
.service-shop-title i.au {
  background-image: url(../../common/shop/svg/result/sv13.svg)
}
.service-shop-title i.free {
  background-image: url(../../common/shop/svg/result/sv10.svg)
}
.service-shop-title i + i {
  margin-left: 8px;
}
.service-shop-title span {
  font-size: 3.2rem;
  font-weight: normal;
  padding-left: 20px;
}
.service-shop-message {
  margin-bottom: 30px;
}
.service-shop-message.margin {
  margin-bottom: 0;
}
.service-shop-note {
  margin-bottom: 30px;
}
.service-shop-note .note-list>li {
  font-size: 1.2rem;
}
.service-shop-button {
  margin: 35px 0;
  text-align: center;
}
.service-shop-button {
  display: flex;
  justify-content: center;
  text-align: center;
}
.service-shop-figure {
  text-align: center;
  margin-bottom: 30px;
}
@media screen and (max-width:768px) {
  .service-shop-title span {
    font-size: 2.2rem;
    padding-left: 15px;
  }
  .service-shop-title .icons {
    flex-wrap: wrap;
    width: 46px;
  }
  .service-shop-title i {
    min-width: 46px;
    width:46px;
    height: 46px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
  }
  .service-shop-title i + i {
    margin-left: 0;
    margin-top: 5px;
  }
  .service-shop-group {
    margin-bottom: 70px;
  }
}


/******************
モスカードトップ
******************/
.index-box {
  display: block;
  height: 100%;
}
.index-box-image {
  position: relative;
  text-align: center;
  margin-bottom: 15px;
}
.index-box-image img {
  width: 100%;
}
.index-box-title {
  font-size: 1.8rem;
  font-weight: bold;
  padding: 0 15px;
  margin-bottom: 10px;
}
.index-box-message {
  margin-bottom: 0.5em;
  padding: 0 15px;
}
.mosca-top-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0 10px;
}
.mosca-top-list li {
  position: relative;
  width: 23.5% ;
  margin-right: 20px;
  border-radius: 10px;
  overflow: hidden;
  margin-right: 2%;
  margin-bottom: 28px;
  background: #fff;
}
.mosca-top-list li:nth-child(4n) {
  margin-right: 0;
}
@media screen and (max-width:1024px) {
 /*メニューリスト*/
  .mosca-top-list  {
      padding: 0 0 25px;
  }
  .mosca-top-list  li {
    position: relative;
    width: 31%;
    margin-right: 3.5%;
  }
  .mosca-top-list  li:nth-child(4n) {
    margin-right: 3.5%;
  }
  .mosca-top-list  li:nth-child(3n) {
    margin-right: 0;
  }
}
@media screen and (max-width:768px) {
  .index-box-title {
    font-size: 1.6rem;
    font-weight: bold;
    padding: 0px;
    margin-bottom: 0.5em;
  }
  .index-box-message {
    margin-bottom: 0.5em;
    padding: 0;
  }
  .mosca-top-list {
      padding: 0;
  }
  .mosca-top-list  li {
    position: relative;
    width: 48%;
    margin-right: 4%;
  }
  .mosca-top-list  li:nth-child(4n) {
    margin-right: 4%;
  }
  .mosca-top-list  li:nth-child(3n) {
    margin-right: 4%;
  }
  .mosca-top-list  li:nth-child(2n) {
    margin-right: 0;
  }
  .mosca-top-list  li:last-child{
    margin-bottom: 0;
  }
}
@media screen and (max-width:425px) {
  .mosca-top-list  li {
    position: relative;
    width: 100%;
    margin-right: 0;
    margin-bottom: 40px;
  }
  .mosca-top-list  li:nth-child(4n),
  .mosca-top-list  li:nth-child(3n),
  .mosca-top-list  li:nth-child(2n) {
    margin-right: 0;
  }
}

/******************
 モスカードプログラムとは？
******************/
/*mpg-block1*/
.mpgm-block1 .row {
  padding: 30px 0 20px;
  display: flex;
}
.mpgm-block1 .row .image {
  width: 35.8%;
}
.mpgm-block1 .row .text {
  width: 64.2%;
  padding-left: 40px;
}
.mpgm-block1 .row .text .title {
  font-size: 1.6rem;
  margin-bottom: 22px;
  line-height: 1.375;
}
.mpgm-block1 .row .text p {
  margin-bottom: 25px;
  line-height: 1.71;
}
.mpgm-block1 .row .text .link{
  margin-bottom: 15px;
  line-height: 1.71;
}
.mpgm-block1 .row .text .linkList{
  margin-bottom: 0;
}
@media screen and (max-width:768px) {
  .mpgm-block1 .row {
    padding: 30px 0 15px;
    display: block;
  }
  .mpgm-block1 .row .image {
    width: 100%;
    margin-bottom: 30px;
    text-align: center;
  }
   .mpgm-block1 .row .image img{
     width: 100%;
   }
  .mpgm-block1 .row .text {
    width: 100%;
    padding-left: 0px;
  }
  .mpgm-block1 .row .text .title {
    font-size: 1.6rem;
    margin-bottom: 22px;
    line-height: 1.375;
  }
  .mpgm-block1 .row .text p {
    margin-bottom: 40px;
  }

  .mpgm-block1 .row .cmn-button{
    margin: 0 auto;
  }
}

/*mpg-block2*/
.mpgm-block2{
  padding-top: 15px;
  margin-bottom: 70px;
}
.mpgm-block2 .row {
  display: flex;
  align-items: center;
  padding-top: 35px;
}
.mpgm-block2 .row:not(:last-child){
  border-bottom: 1px dashed #ddd;
}
.mpgm-block2 .row .box1 {
  padding-left: 143px;
  width: calc(100% - 340px);
  padding-right: 88px;
}
.mpgm-block2 .row .box2 {
  width: 340px;
}
.mpgm-block2 .row .box1 .row-head {
  position: relative;
}
.mpgm-block2 .row .box1 .row-head .title{
  margin-bottom: 10px;
  font-size: 1.8rem;
}
.mpgm-block2 .row .box1 .row-head .image {
  position: absolute;
  left:-143px;
  top:0;
  width:120px ;
}
.mpgm-block2 .row .box1 .message {
  margin-bottom: 40px;
}
@media screen and (max-width:1024px){
  .mpgm-block2 .row .box1 {
    padding-right: 30px;
  }
}
@media screen and (max-width:768px){
  .mpgm-block2 {
    padding-top: 0;
    margin-bottom: 30px;
  }
  .mpgm-block2 .row {
    display: block;
    padding-bottom: 15px;
  }
  .mpgm-block2 .row .box1 {
    padding-left: 0;
    width: 100%;
    padding-right:0px;
  }
  .mpgm-block2 .row .box2 {
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .mpgm-block2 .row .box1 .row-head {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
  }
  .mpgm-block2 .row .box1 .row-head .title{
    margin-bottom: 0px;
    padding-left: 20px;
    width: calc(100% - 120px);
    font-size: 1.6rem;
  }
  .mpgm-block2 .row .box1 .row-head .image {
    position:static;
    width:120px ;
  }
  .mpgm-block2 .row .box1 .message {
    margin-bottom: 30px;
  }

  .main .mpgm-block2 .indentList-s {
    margin-bottom: 35px;
  }
}

/*mpgm-block3*/
.mpgm-block3 .wide-gray {
    padding: 33px 0 25px;
}
.mpgm-block3 .linkList {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width:1200px){
  .mpgm-block3 .linkList {
    display: flex;
    justify-content: flex-start;
  }
}

@media screen and (max-width:1024px){
  .main .mpgm-block3 .linkList {
    display: block;
  }
  .mpgm-block3 .wide-gray {
    padding: 27px 0 10px;
  }
}

/*mpgm-block4*/
.mpgm-block4 .row {
  display: flex;
  padding: 25px 100px;
  align-items: center;
  margin-bottom: 35px;
}
.mpgm-block4 .image {
  width: 325px;
}
.mpgm-block4 .text {
  width: calc(100% - 325px);
  padding-left: 40px;
}
.mpgm-block4 .text .title {
  font-size: 1.6rem;
  margin-bottom: 10px;
}
.mpgm-block4 .text .message {
  font-size: 1.4rem;
  margin-bottom: 0;
}
@media screen and (max-width:768px){
  .mpgm-block4 .row {
    display: block;
    padding: 20px;
    align-items: center;
    margin-bottom: 30px;
  }
  .mpgm-block4 .image {
    width: 100%;
    text-align: center;
    margin-bottom: 30px;
  }
  .mpgm-block4 .image img{
    width: 100%;
  }
  .mpgm-block4 .text {
    width: 100%;
    padding-left: 0px;
  }
  .mpgm-block4 .text .title {
    font-size: 1.6rem;
    margin-bottom: 10px;
  }
  .mpgm-block4 .text .message {
    font-size: 1.4rem;
    margin-bottom: 0;
  }
}

/*mpgm-block5*/
.mpgm-block5 {
  margin-bottom: 100px;
}
.mpgm-block5 .row1 {
  display: flex;
  margin-bottom: 50px;
}
.mpgm-block5 .row1 .image {
  width: 600px;
  padding-top: 60px;
}
.mpgm-block5 .row1 .text {
  width: calc(100% - 600px);
  padding-left: 50px;
}
.mpgm-block5 .row1 .text .box {
  position: relative;
}
.mpgm-block5 .row1 .text .box::after {
  content:"";
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  top:50%;
  margin-top: -20px;
  left:-26px;
  border-style: solid;
  border-width: 20px 26px 20px 0;
  border-color: transparent #F5F5F5 transparent transparent;
}
.mpgm-block5 .row2 {
  position: relative;
  display: flex;
}
.mpgm-block5 .row2 .text1 {
  width: 100%;
  padding-right: 50%;
}
.mpgm-block5 .row2 .text2 {
  position: absolute;
  width: 50%;
  right: 0;
  top:0;
  padding-left: 50px;
}
.mpgm-block5 .row2 .text2 .box {
  padding: 10px;
}
.mpgm-block5 .row2 .text2 .box-head {
  background:#fff;
  text-align:   center;
  padding-top: 3px;
  margin-bottom: 20px;
}
.mpgm-block5 .row2 .text2 .box-body {
  padding-left: 20px;
}
.main .mpgm-block5 .row2 .text2 .box-body .textList {
  margin-bottom: 0;
}
.mpgm-block5 .row .box {
  padding: 30px 30px;
}
.main .mpgm-block5 .row .box .indentList-s {
  margin-bottom: 0;
}
@media screen and (max-width:1200px){
  .mpgm-block5 .row1 .image {
    width: 50%;
    padding-top: 60px;
  }
  .mpgm-block5 .row1 .text {
    width: 50%;
    padding-left: 50px;
  }
}

@media screen and (max-width:768px){
  .mpgm-block5 {
    margin-bottom: 50px;
  }
  .mpgm-block5 .row1 {
    display: block;
  }
  .mpgm-block5 .row1 .image {
    width: 100%;
    padding-top: 0px;
    margin-bottom: 0px;
  }
  .mpgm-block5 .row1 .text {
    width:100%;
    padding-top: 35px;
    padding-left: 0px;
  }
  .mpgm-block5 .row1 .text .box {
    position: relative;
  }
  .mpgm-block5 .row1 .text .box::after {
    content:"";
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    top:-19px;
    margin-top: 0px;
    left:50%;
    margin-left: -17px;
    border-style: solid;
    border-width: 0 17px 19px 17px;
    border-color: transparent transparent #F5F5F5 transparent;
  }
  .mpgm-block5 .row2 {
    display: block;
  }
  .mpgm-block5 .row2 .text1 {
    width: 100%;
    padding-right: 0;
  }
  .mpgm-block5 .row2 .text2 {
    position: static;
    width: 100%;
    padding-left: 0px;
    margin-bottom: 30px;
  }
  .mpgm-block5 .row2 .text2 .box {
    padding: 10px;
  }
  .mpgm-block5 .row2 .text2 .box-head {
    background:#fff;
    text-align:   center;
    padding-top: 3px;
    margin-bottom: 20px;
  }
  .mpgm-block5 .row2 .text2 .box-body {
    padding-left: 10px;
  }
  .main .mpgm-block5 .row2 .text2 .box-body .textList {
    margin-bottom: 0;
  }
  .mpgm-block5 .row .box {
    padding: 25px 20px;
  }
  .main .mpgm-block5 .row .box .indentList-s {
    margin-bottom: 0;
  }

}

/*mpgm-block6*/
.mpgm-block6.cmn-bg-green {
  padding:50px 50px 50px;
}
.mpgm-block6.cmn-bg-green .headingSecondly {
  margin-top: 0;
  position: relative;
  z-index: 2;
}
.mpgm-block6 .group {
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
  background:#fff;
  padding:0 30px 0px;
  border-radius:10px;
  border:1px solid #FFEBD9;
  margin-bottom: 20px;
  z-index: 2;
}
.mpgm-block6 .group-head {
  position: relative;
  padding-top: 15px;
  padding-bottom: 10px;
  display: flex;
  border-bottom: 1px solid #DDDDDD;
  align-items: center;
  font-size: 2rem;
}
.mpgm-block6 .group-head .box2 {
  padding-left: 20px;
}
.mpgm-block6 .group-head::before {
  content:"";
  position: absolute;
  bottom:-19px;
  left: 50%;
  margin-left: -15px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 19px 15px 0 15px;
  border-color: #DDDDDD transparent transparent transparent;
}
.mpg-block2  .message1 {
  text-align: center;
  margin-top: 43px;
}
.mpgm-block6 .group-head::after {
  content:"";
  position: absolute;
  width: 0;
  height: 0;
  left: 50%;
  bottom:-18px;
  margin-left: -15px;
  border-style: solid;
  border-width: 19px 15px 0 15px;
  border-color: #fff transparent transparent transparent;
}
.mpgm-block6 .group-body>.row {
  padding-left: 144px;
  padding-top: 30px;
  padding-bottom: 30px;
}
.mpgm-block6 .group-body>.row:not(:last-child) {
  border-bottom: 1px dashed #ddd;
}
.main .mpgm-block6 .group-body .row *:last-child {
  margin-bottom: 0;
}
.mpgm-block6 .group-body .row-head {
    position: relative;
    margin-bottom: 10px;
}
.mpgm-block6 .group-body .row-head .image {
  position:absolute;
  left: -144px;
  top: 0;
  width: 120px;
}
.mpgm-block6 .button-box {
  display: flex;
  justify-content: center;
  padding-top: 10px;
  padding-bottom: 50px;
}
.main .mpgm-block6 .headingFourthly {
  margin-bottom: 10px;
}
.main .mpgm-block6 .headingFourthly.pdt {
  padding-top: 10px;
}

@media screen and (max-width:768px){
  .mpgm-block6.cmn-bg-green {
      padding: 38px 0px 50px;
  }
  .mpgm-block6 .wide-yellow{
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  .mpgm-block6 .group {
    padding:0 20px 0px;
  }
  .mpgm-block6 .group1 {
    margin-top: -5px;
  }
  .mpgm-block6 .group-head .box1{
    width: 34px;
  }
  .mpgm-block6 .group-head .box1 img{
    width: 100%;
    max-width: none;
  }
  .mpgm-block6 .group-head .box2 {
    width: calc(100% - 34 px);
    padding-left: 20px;
    font-size: 1.6rem;
  }
  .mpgm-block6 .group-body>.row {
    padding-left: 0;
    padding-top: 30px;
    padding-bottom: 25px;
  }
  .mpgm-block6 .group-body .row-head  {
    display: flex;
    align-items: center;
    margin-bottom: 25px;
  }
  .mpgm-block6 .group-body .row-head .image {
    position:static;
    left: 0;
    top: 0;
    width: 90px;
  }
  .mpgm-block6 .group-body .row-head .headingFourthly{
    width: calc(100% - 90px);
    padding-left: 20px;
  }
  .mpgm-block6 .button-box {
    padding-top: 10px;
    padding-bottom: 35px;
  }
}

/*ランク別特典一覧*/
.get-rank {
  margin-top:25px;
}
.main .get-rank .table tbody th:nth-child(1),
.main .get-rank .table thead th:nth-child(1) {
  width: 252px;
  font-weight: bold;
}
.main .get-rank .table thead tr.tr1 th {
  border-bottom:1px solid #fff;
}
@media screen and (max-width:768px){
  .get-rank {
    margin-top: 10px;
  }
  .main .get-rank .table,
  .main .get-rank .table thead,
  .main .get-rank .table thead tr,
  .main .get-rank .table thead tr th,
  .main .get-rank .table thead tr td,
  .main .get-rank .table thead th:nth-child(1),
  .main .get-rank .table tbody,
  .main .get-rank .table tbody tr,
  .main .get-rank .table tbody tr th,
  .main .get-rank .table tbody tr td,
  .main .get-rank .table tbody th:nth-child(1) {
    display: block;
    border:none;
    border-right: 0;
    border-left: 0;
    border-top: 0;
    border-bottom: 0;
  }
  .main .get-rank .table{
    font-size: 1.2rem;
  }

  .main .get-rank .table thead th:nth-child(1) {
    display: none;
  }
  .main .get-rank .table thead tr {
    display: flex;
    flex-wrap:wrap;
    width: 100%;
  }
  .main .get-rank .table thead tr.tr1 th:nth-child(1) {
    width: 100%;
  }
  .main .get-rank .table thead tr.tr1 th:nth-child(2) {
    width: 25%;
  }
  .main .get-rank .table thead tr.tr1 th:nth-child(3) {
    width: 75%;
    padding-top: 26px;
  }
  .main .get-rank .table thead tr.tr2 th {
    width: 25%;
  }
  .main .get-rank .table thead tr.tr2 th span{
    display: flex;
    align-items: center;
    height: 100%;
  }
/*  .main .get-rank .table thead tr.tr2 th:not(:nth-child(1)) {
    padding-top: 26px;
  }*/
  .main .get-rank .table thead tr th:not(:last-child) {
    border-right:1px solid #fff;
  }
  .main .get-rank .table thead tr.tr1 th {
    border-bottom:1px solid #fff;
  }
  .main .get-rank .table thead tr.tr1 th:not(:last-child) {
    border-right:1px solid #fff;
  }
  .main .get-rank .table tbody tr th:nth-child(1) {
    background: #F5F5F5;
    display: block;
    width: 100%;
  }
  .main .get-rank .table tbody tr {
    display: flex;
    flex-wrap:wrap;
    border:1px solid #DDDDDD;
    border-top: none;
  }
  .main .get-rank .table tbody tr td {
    width: 25%;
    text-align: left;
    padding:10px 10px;
  }
  .main .get-rank .table tbody tr td>span {
    display: flex;
    justify-content: left;
    align-items: center;
    height: 100%;
  }
  .main .get-rank .table tbody tr td.colspan2 {
    width: 50%;
  }
  .main .get-rank .table tbody tr td.colspan3 {
    width: 75%;
  }
  .main .get-rank .table tbody tr td:not(:last-child) {
    border-right:1px solid #DDDDDD;
  }
}

.mpgm-block7 {
  margin-bottom: 100px;
}
.mpgm-block7 .row {
  display: flex;
  justify-content: space-between;
}
.mpgm-block7 .row .box1 {
  width: 46.67%;
}
.mpgm-block7 .row .box2 {
  width: 46.67%;
}
.mpgm-faq {
  padding: 55px 20px 10px;
  text-align: center;
  margin-bottom: 150px;
}
.main .mpgm-faq .headingSecondly {
  margin-top: 0;
}
@media screen and (max-width:768px){
  .mpgm-block7 .row {
    display: block;
  }
  .mpgm-block7 .row .box1 {
    width: 100%;
    margin-bottom: 45px;
  }
  .mpgm-block7 .row .box2 {
    width: 100%;
  }
  .mpgm-block7 {
    margin-bottom: 60px;
  }
  .mpgm-faq {
      padding: 45px 20px 10px;
      text-align: center;
      margin-bottom: 100px;
  }
}

/*indentList-s フォントサイズ*/
@media screen and (max-width:768px){
  .main .mpgm-block1 .indentList-s,
  .main .mpgm-block2 .indentList-s,
  .main .mpgm-block3 .indentList-s,
  .main .mpgm-block4 .indentList-s,
  .main .mpgm-block5 .indentList-s,
  .main .mpgm-block6 .indentList-s,
  .main .mpgm-block7 .indentList-s {
    font-size: 1.4rem;
  }

}

/******************
  モスバーガー公式アプリ
******************/
/*モスバーガー公式アプリ:トップセクション*/
.service-appli-top {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 70px;
}
.service-appli-top .box1 {
  margin-right: 40px;
}
@media screen and (max-width:980px) {
  .service-appli-top {
    display: block;
    max-width: 335px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 40px;
  }
  .service-appli-top .box1 {
    margin-right: 0;
    margin-bottom: 20px;
  }
  /*media 980*/
}
/*モスバーガー公式アプリ:メインセクション*/
.service-appli-main {
  padding: 60px 0;
  margin-bottom: 100px;
}
.appli-main-box {
  display: flex;
}
.appli-main-box>li {
  position: relative;
  width: calc((100% - 96px) / 3);
  margin-right: 48px;
}
.appli-main-box>li:last-child {
  margin-right: 0;
  border-bottom: 0;
}
.appli-main-box>li::after {
  content: "";
  position: absolute;
  display: block;
  width: 1px;
  height: 100%;
  top: 0;
  right: -24px;
  background: #DDDDDD;
}
.appli-main-box>li:last-child::after {
  display: none;
}
.appli-main-box>li::after {
  content: "";
  position: absolute;
  display: block;
  width: 1px;
  height: 100%;
  top: 0;
  right: -24px;
  background: #DDDDDD;
}
@media screen and (max-width:980px) {
  .service-appli-main {
    padding: 0;
    margin-bottom: 50px;
  }
  .appli-main-box {
    display: block;
    max-width: 368px;
    margin: 0 auto;
  }
  .appli-main-box>li {
    position: relative;
    width: 100%;
    margin-right: 0;
    border-bottom: 1px solid #DDDDDD;
  }
  .appli-main-box>li:last-child {
    margin-right: 0px;
  }
  .appli-main-box>li::after {
    display: none;
  }
  .appli-main-box>li:last-child::after {
    display: none;
  }
  /*media 980*/
}
/*モスバーガー公式アプリ:メインセクション 子要素*/
.appli-item-block {
  text-align: center;
}
.appli-item-block .label {
  position: relative;
  display: inline-block;
  min-width: 220px;
  text-align: center;
  margin: 0 auto 18px;
  background: #fff;
  text-align: center;
  border: 1px solid #00A728;
  color: #00A728;
  padding: 3px 1.5em 0;
  border-radius: 10px;
}
.appli-item-block .label::before {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  bottom: -9px;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top: 9px solid #00A728;
  border-bottom: 0;
}
.appli-item-block .label::after {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  bottom: -8px;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top: 9px solid #fff;
  border-bottom: 0;
}
.appli-item-block .catch {
  text-align: center;
  font-size: 1.8rem;
  margin-bottom: 20px;
}
.appli-item-block .image {
  border: 1px solid #FFEBD9;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
.appli-item-block .image img {
  width: 100%;
}
.appli-item-block .message {
  margin-bottom: 20px;
  text-align: left;
}
.appli-item-block .note-list {
  text-align: left;
}
@media screen and (max-width:980px) {
  .appli-item-block {
    padding-top: 40px;
    padding-bottom: 30px;
  }
  .appli-item-block .label {
    position: relative;
    min-width: 177px;
    font-size: 1.4rem;
  }
  .appli-item-block .catch {
    text-align: center;
    font-size: 2.2rem;
    margin-bottom: 15px;
  }
  /*media 980*/
}
/*モスバーガー公式アプリ:他にもいろいろ！便利なサービス*/
.appli-icon-nav {
  display: flex;
}
.appli-icon-nav>li {
  position: relative;
  width: calc((100% - 96px) / 3);
  margin-right: 48px;
}
.appli-icon-nav>li:last-child {
  border-bottom: 0;
}
.appli-icon-nav>li>div,
.appli-icon-nav>li a {
  display: flex;
}
.appli-icon-nav>li .image {
  width: 80px;
  min-height: 74px;
  background-position: 0 center;
  background-repeat: no-repeat;
}
.appli-icon-nav>li .image.icon-menu {
  background-size: 56.32px;
  background-image: url(../../common/service/image/appli/icon-menu.png);
}
.appli-icon-nav>li .image.icon-store {
  background-position: 0 70%;
  background-image: url(../../common/service/image/appli/icon-store.png);
  background-size: 57.79px;
}
.appli-icon-nav>li .image.icon-contact {
  background-position: 0 70%;
  background-image: url(../../common/service/image/appli/icon-contact.png);
  background-size: 49.13px;
}
.appli-icon-nav>li .title {
  margin-bottom: 12px;
  font-weight: bold;
}
.appli-icon-nav>li .text {
  width: calc(100% - 80px);
}
.appli-icon-nav>li:last-child {
  margin-right: 0px;
}
.appli-icon-nav>li::after {
  content: "";
  position: absolute;
  display: block;
  width: 1px;
  height: 100%;
  top: 0;
  right: -24px;
  background: #DDDDDD;
}

@media screen and (max-width:980px) {
  .appli-icon-nav {
    display: block;
    margin: 0 auto;
  }
  .appli-icon-nav>li {
    position: relative;
    width: 100%;
    margin-right: 0;
    border-bottom: 1px dashed #DDDDDD;
  }
  .appli-icon-nav>li:last-child {
    margin-right: 0px;
  }
  .appli-icon-nav>li::after {
    display: none;
  }
  .appli-icon-nav>li:last-child::after {
    display: none;
  }
  .appli-icon-nav>li .image {
    width: 72px;
  }
  .appli-icon-nav>li .image.icon-contact {
    background-position: 3px 10px;
    background-image: url(../../common/service/image/appli/icon-contact.png);
  }
  .appli-icon-nav>li .image.icon-menu {
    background-position: 0px 10px;
    background-image: url(../../common/service/image/appli/icon-menu.png);
  }
  .appli-icon-nav>li .image.icon-store {
    background-position: 0px 10px;
    background-image: url(../../common/service/image/appli/icon-store.png);
    background-size: 57.79px;
  }
  .appli-icon-nav>li .title {
    margin-bottom: 12px;
    font-weight: bold;
  }
  .appli-icon-nav>li .text {
    width: calc(100% - 72px);
  }
  .appli-icon-nav>li>div,
  .appli-icon-nav>li a {
    padding: 15px 0 30px;
  }
  /*media 980*/
}
/*モスバーガー公式アプリ:モスバーガー公式アプリをダウンロード*/
.service-appli-other {
  margin-bottom: 60px;
  margin-bottom: 100px;
}
.service-appli-link {
  position: relative;
  padding-top: 60px;
}
.service-appli-link .head {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}
.service-appli-link .image {
  width: 57px;
}
.service-appli-link .text {
  width: calc(100% - 57px);
}
.service-appli-link .text .title {
  font-size: 2.4rem;
  margin-left: 25px;
  line-height: 1.54;
}
.service-appli-link .note-list {
  margin-top: 40px;
  margin-bottom: 20px;
}
@media screen and (max-width:980px) {
  .service-appli-other {
    margin-bottom: 30px;
    margin-bottom: 30px;
  }
  .service-appli-link {
    position: relative;
    padding-top: 40px;
  }
  .service-appli-link .head {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
  }
  .service-appli-link .text .title {
    font-size: 2.2rem;
    margin-left: 15px;
  }
  .service-appli-link .note-list {
    margin-top: 30px;
    margin-bottom: 0px;
  }
  /*media 980*/
}


/******************
 mpg:ポチッとギフト
******************/
/*mpg-block1*/
.mpg-block1 .row {
  padding: 30px 0;
  display: flex;
}
.mpg-block1 .row .image {
  width: 320px;
}
.mpg-block1 .row .text {
  width: calc(100% - 320px);
  padding-left: 40px;
}
.mpg-block1 .row .text .title {
  font-size: 1.6rem;
  margin-bottom: 22px;
  line-height: 1.375;
}
.mpg-block1 .row .text p {
  margin-bottom: 40px;
  line-height: 1.71;
}
.main .mpg-block1 .row .button-cvxl {
  margin: 0;
}
@media screen and (max-width:768px){
  .mpg-block1 .row {
    padding: 30px 0 50px;
    display: block;
  }
  .mpg-block1 .row .image {
    width:100%;
    margin-bottom: 25px;
    text-align: center;
  }
   .mpg-block1 .row .image img{
    width: 100%;
   }
  .mpg-block1 .row .text {
    width: 100%;
    padding-left: 0px;
  }
  .mpg-block1 .row .text .title {
    font-size: 1.6rem;
    margin-bottom: 22px;
    line-height: 1.375;
  }
  .mpg-block1 .row .text p {
    margin-bottom: 40px;
  }

  .mpg-block1 .row .cmn-button{
    margin: 0 auto;
  }
}
/*mpg-block2*/
.mpg-block2 .box1{
  position: relative;
  padding-top: 30px;
  border-top:1px solid #DDDDDD;
  border-bottom:1px solid #DDDDDD;
}
.mpg-block2 .box1::before{
  content:"";
  position: absolute;
  bottom:-19px;
  left: 50%;
  margin-left: -15px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 19px 15px 0 15px;
  border-color: #DDDDDD transparent transparent transparent;
}
.mpg-block2  .message1{
  text-align: center;
  margin-top: 43px;
}
.mpg-block2 .box1::after{
  content:"";
  position: absolute;
  width: 0;
  height: 0;
  left: 50%;
  bottom:-18px;
  margin-left: -15px;
  border-style: solid;
  border-width: 19px 15px 0 15px;
  border-color: #fff transparent transparent transparent;
}
.main .mpg-block2 .textList{
  display: flex;
  justify-content: space-between;
  margin-bottom: 22px;
}
.mpg-block2 .textList>li{
  font-size: 1.4rem;
  white-space: nowrap;
}
.mpg-block2 .textList>li:not(:last-child){
  margin-right: 15px;
}
@media screen and (max-width:1240px){
  .mpg-block2 .box1 {
    padding: 30px 30px 10px;
  }
  .main .mpg-block2 .textList {
    display: block;
  }
  .mpg-block2 .textList>li{
    white-space: normal;
  }
}
@media screen and (max-width:768px){
  .mpg-block2 .box1 {
    padding: 22px 0px 0px;
  }
  .main .mpg-block2 .textList {
    display: block;
  }
  .mpg-block2  .message1{
    text-align: center;
    margin-top: 38px;
  }
}

/**/
.mpg-step-list {
  display: flex;
  justify-content: space-between;
  padding: 0 58px;
  margin-bottom: 30px;
}
.mpg-step-list>li {
  position: relative;
  text-align: center;
  width: 22.4%;
}
.mpg-step-list>li .label {
  position: relative;
  display: block;
  width: 75px;
  margin: 0 auto 30px;
  z-index: 2;
}
.mpg-step-list>li .title {
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
  min-height: 51px;
}
.mpg-step-list>li .image {
  padding: 0px;
}
.mpg-step-list>li .image img{
  width: 100%;
}
.mpg-step-list>li::after {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 4px;
  top: 38px;
  left: 50%;
  background: #00A728;
}
.mpg-step-list>li:last-child::after {
  display: none;
}
.mpg-step-list>li .message{
  font-size: 1.4rem;
  margin-top: 15px;
  margin-bottom: 15px;
}

#mpg-section-step .button-area {
  padding: 50px 0;
}

.main .mpg-step-list .indentList{
  margin-bottom: 15px;
}

.main .mpg-step-list .linkList {
  margin-bottom: 0;
}

.main .mpg-step-list .indentList>li {
  font-size: 1.2rem;
  color: #888888;
  text-align: left;
}

.main .mpg-step-list .external a {
  text-align: left;
}

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

  /*step*/
  .mpg-step-list {
    display: block;
    margin-bottom: 30px;
  }
  .mpg-step-list>li {
    position: relative;
    width: 100%;
    text-align: left;
    padding-left: 75px;
  }
  .mpg-step-list>li::after {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    height: 100%;
    top: 30px;
    left: 28px;
    background: #00A728;
  }
  .mpg-step-list>li .label {
    position: absolute;
    width: 60px;
    left: 0;
    top: 0;
    margin: 0 auto 30px;
    z-index: 2;
  }
  .mpg-step-list>li .title {
    font-size: 1.6rem;
    font-weight: bold;
    text-align: left;
    margin-bottom: 0;
    padding: 18px 0;
  }
  .mpg-step-list>li .image {
    margin-bottom: 18px;
  }
  .mpg-step-list>li br {
    display: none;
  }
  .mpg-step-list .he-m {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
  }
  .mpg-step-list .he-m>em {
    font-size: 3.3rem;
  }
  .mpg-step-list {
    display: block;
    max-width: 375px;
    margin: 0 auto;
    padding: 0;
  }
  /*media 768*/
}

/*mpg-block4*/
.mpg-block4 .inner {
  background:#F5F5F5;
  padding: 55px 100px 20px;
}
.mpg-block4 .button-box {
  margin-bottom: 150px;
}
.mpg-block4 .dash-group1 {
border-top:1px dashed #DDDDDD;
border-bottom:1px dashed #DDDDDD;
padding: 35px 0 15px;
margin-bottom: 40px;
}
@media screen and (max-width:1000px) {
  .mpg-block4 {
    margin-top: 60px;
  }
  .mpg-block4 .inner {
    padding: 25px 20px 20px;
  }
}
@media screen and (max-width:768px){
  .mpg-block4 .dash-group1 {
    padding: 25px 0 10px;
    margin-bottom: 30px;
  }
  .mpg-block4 .button-box {
    margin-bottom: 100px;
  }
}


/******************
  モスのネット注文
******************/
/*テーブル*/
.module-table {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
}
.module-table th {
  font-weight: bold;
}
.module-table td em {
  font-size: 1.8rem;
}
.module-table td .percent {
  display: flex;
  align-items: center;
}
.module-table td .percent em {
  margin-bottom: 0;
  font-weight: bold;
}
.module-table th,
.module-table td {
  border: 1px solid #DDDDDD;
  text-align: left;
  padding: 13px 20px;
}
.module-table thead th {
  background: #F1E3D4;
  border-right: 1px solid #fff;
}
.module-table thead th:last-child {
  border-right: 1px solid #DDDDDD;
}
.module-table tbody th {
  background: #F5F5F5;
  font-weight: normal;
  border-right: 1px solid #fff;
  vertical-align: middle;
}
.module-table caption {
  margin-bottom: 10px;
}
.module-table th,
.module-table td {
  vertical-align: top;
}
.module-table>dl {
  margin-top: 0 !important;
  display: table-row;
}
.module-table>dl>dt,
.module-table>dl>dd {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: table-cell;
  padding: 15px 10px;
}
.module-table>dl>dt {
  width: 25%;
  background-color: #F1E3D4;
  font-weight: bold;
  border: 1px solid #DDDDDD;
  border-right: none;
  /*border-left: 1px solid #6a430a;*/
}
.module-table>dl>dd {
  width: 75%;
  border: 1px solid #DDDDDD;
  background-color: white;
  border-left: none;
}
.module-table>dl>dd>ul {
  margin-top: 10px !important;
}
.module-table .tr {
  display: table-row;
}
.module-table .tr .td {
  display: table-cell;
}
.module-table+p {
  margin-top: 20px;
}
.netorder .module-table {
  margin-bottom: 0;
}
@media screen and (max-width:768px) {
  .module-table {
    margin-top: 0;
    margin-bottom: 30px;
  }
  .module-table th,
  .module-table td {
    border: 1px solid #DDDDDD;
    text-align: left;
    padding: 12px 12px;
    font-size: 1.4rem;
  }
  .module-table td .percent {
    display: block;
    text-align: center;
  }
  .module-table td .percent em {
    margin-bottom: 0;
    display: block;
    font-size: 1.6rem;
  }
  /*media 768*/
}

/*モスのネット注文:トップセクション*/
.netorder-top {
  padding-bottom: 35px;
}
.netorder-top-block {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.netorder-top-button {
  width: 340px;
  margin-bottom: 30px;
}
.netorder-top-image {
  margin-bottom: 30px;
  margin-right: 40px;
}
@media screen and (max-width:768px) {
  .netorder-top {
    display: block;
    padding-bottom: 0;
    margin-bottom: 30px;
  }
  .netorder-top-block {
    display: block;
  }
  .netorder-top .paragraph.center {
    text-align: left;
  }
  .netorder-top-button {
    width: 100%;
  }
  .netorder-top-image {
    width: 100%;
    margin-bottom: 30px;
  }
  /*media 768*/
}
/*モスのネット注文:メインセクション*/
.netorder-main {
  padding: 60px 0;
}
.netorder-main .rudius-block {
  margin-bottom: 50px;
}
.netorder-main .rudius-box {
  width: 100%;
  border-radius: 10px;
  border: 1px solid #FFEBD9;
  background: #fff;
  overflow: hidden;
  margin: 0 0 20px 0;
  padding: 15px 30px 30px;
}

.netorder-main .rudius-box.flex {
  padding: 15px 30px 10px;
}

.netorder-main .rudius-box.flex > .button {
  margin-left: 60px;
}

.netorder-main .rudius-box .note-list {
  margin-top: 30px;
}
.netorder-main .button-area {
  text-align: center;
}
.netorder-main-head {
  display: flex;
  align-items: center;
}

.netorder-main-head .number {
  width: 45px;
  text-align: center;
  color: #00A728;
}

.netorder-main-head .number>span {
  display: block;
  font-weight: bold;
  text-align: center;
  line-height: 1em;
  margin-bottom: -14px;
}

.netorder-main-head .number>strong {
  display: block;
  font-weight: bold;
  text-align: center;
  line-height: 1em;
  font-size: 8rem;
  font-weight: bold;
}

.netorder-main-head .title {
  width: calc(100% - 45px);
  font-weight: bold;
  font-size: 2rem;
  padding-left: 20px;
}

.netorder-main-list {
  margin-bottom: 20px;
}

.netorder-main-list>li {
  border-bottom: 1px dashed #DDDDDD;
}

.netorder-main-list>li:last-child {
  border-bottom: 0;
}

.netorder-main .unit-block {
  display: flex;
  padding: 20px 0;
}

.netorder-main .unit-two-block {
  display: flex;
  justify-content: space-between;
  margin-bottom: 30px;
}

.netorder-main .unit-two-block.block-2{
  margin-bottom: 10px;
}

.netorder-main .unit-two-block .box img {
  width: 100%;
}

.netorder-main .unit-two-block>.box.img {
  width: 250px;
  margin-right: 20px;
}

.netorder-main .unit-two-block>.box.text {
  width: calc(100% - 270px);
}

.netorder-main .unit-two-block.block-2>.box {
  width: 48%;
}

.netorder-main .unit-block-image {
  width: 135px;
  min-height: 135px;
  border-radius: 5px;
  align-self: flex-start;
  border: 1px solid #dddddd;
  text-align: center;
  overflow: hidden;
}

.netorder-main .unit-block-image img {
  max-width: 127px;
}

.netorder-main .unit-block-text {
  width: calc(100% - 135px);
  align-items: flex-start;
  padding-left: 15px;
}

.netorder-main .unit-block-message {
  margin-bottom: 5px;
}

.netorder-main .unit-block-line {
  position: relative;
  display: inline-block;
  color: #000;
  padding: 0 3px;
}

.netorder-main .unit-block-line::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 2px;
  top: 50%;
  left: 0;
  margin-top: -1px;
  background: #E90000;
}

.netorder-main .unit-block-price {
  color: #00A728;
  font-weight: bold;
  font-size: 2rem;
  margin: 15px 0;
}

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

  .netorder-main {
    padding: 40px 0 50px;
  }

  .netorder-main-head .number {
    width: 36px;
  }

  .netorder-main-head .number>span {
    line-height: 1em;
    margin-bottom: -33px;
    font-size: 1.2rem;
  }

  .netorder-main-head .title {
    width: calc(100% - 36px);
    font-size: 1.6rem;
    margin-top: 8px;
    padding-left: 20px;
  }

  .netorder-main .rudius-box.flex > .button {
    margin-left: 0;
  }

  .netorder-main .unit-block-image {
    width: 100px;
    min-height: 100px;
  }

  .netorder-main .unit-block-image img {
    max-width: 100%;
    width: 100%;
  }

  .netorder-main .rudius-block {
    display: block;
    margin-bottom: 40px;
  }

  .netorder-main .rudius-box {
    width: 100%;
    border-radius: 10px;
    padding: 20px 20px 20px;
    margin-bottom: 20px;
  }

  .netorder-main-list {
    margin-bottom: 0;
  }

  .netorder-main .unit-block-price {
    color: #00A728;
    font-weight: bold;
    font-size: 2rem;
    margin: 5px 0 0 0;
  }
  .netorder-main .rudius-box.flex {
    display: block;
    padding: 15px 20px;
  }

  .netorder-main-head .number>strong img {
    width: 24px;
  }

  .netorder-main-head {
    margin-bottom: 20px;
  }

  .netorder-main .unit-two-block>.box.img {
    width: 40%;
    margin-right: 20px;
  }

  .netorder-main .unit-two-block>.box.text {
    width: calc(60% - 20px);
  }

  .netorder-main .unit-two-block.block-2 {
    display: block;
  }

  .netorder-main .unit-two-block.block-2>.box {
    width: 100%;
    margin-bottom: 20px;
  }

  /*media 768*/
}

@media screen and (max-width:425px) {
  .netorder-main .unit-two-block {
    display: block;
  }

  .netorder-main .unit-two-block>.box {
    width: 100%;
    margin-bottom: 15px;
  }
  
  .netorder-main .unit-two-block>.box.img {
    width: 100%;
    margin-right: 0;
  }

  .netorder-main .unit-two-block>.box.text {
    width: 100%;
  }

  /*media 425*/
}

/*モスのネット注文:ステップ*/
.netorder-section {
  padding: 60px 0 60px;
}

#netorder-section-step {
  border-top: 1px solid #dddddd;
}

.netorder-step-order {
  display: flex;
  justify-content: space-between;
  padding: 0 58px;
  margin-bottom: 30px;
}

.netorder-step-order>li {
  position: relative;
  text-align: center;
  width: 33.33%;
}

.netorder-step-order>li .label {
  position: relative;
  display: block;
  width: 75px;
  margin: 0 auto 30px;
  z-index: 2;
}

.netorder-step-order>li .title {
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
  min-height: 51px;
}

.netorder-step-order>li .image {
  padding: 0 10px;
}

.netorder-step-order>li::after {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 4px;
  top: 38px;
  left: 50%;
  background: #00A728;
}

.netorder-step-order>li:last-child::after {
  display: none;
}

.netorder-step-button {
  display: flex;
  justify-content: center;
}
#netorder-section-step .button-area {
  padding: 50px 0;
}

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

  /*step*/
  .netorder-step-order {
    display: block;
    margin-bottom: 30px;
  }

  .netorder-step-order>li {
    position: relative;
    width: 100%;
    text-align: left;
    padding-left: 75px;
  }

  .netorder-step-order>li::after {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    height: 100%;
    top: 30px;
    left: 28px;
    background: #00A728;
  }

  .netorder-step-order>li .label {
    position: absolute;
    width: 60px;
    left: 0;
    top: 0;
    margin: 0 auto 30px;
    z-index: 2;
  }

  .netorder-step-order>li .title {
    font-size: 1.6rem;
    font-weight: bold;
    text-align: left;
    margin-bottom: 0;
    padding: 18px 0;
  }

  .netorder-step-order>li .image {
    margin-bottom: 20px;
  }

  .netorder-step-order>li br {
    display: none;
  }

  .netorder-step .headline-m {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
  }

  .netorder-step {
    padding: 0;
  }

  .netorder-step .headline-m>em {
    font-size: 3.3rem;
  }

  .netorder-step-order {
    display: block;
    max-width: 375px;
    margin: 0 auto;
    padding: 0;
  }

  #netorder-section-step .button-area {
    padding: 20px 0 30px;
  }
  /*media 768*/

}

/*モスのネット注文:たとえば、こんな使い方*/
#netorder-section-howto {
  padding-bottom: 60px;
}

#netorder-section-howto .howto-movie-wrap {
  display: flex;
  justify-content: space-between;
}

#netorder-section-howto .howto-movie-group {
  width: 48.33%;
  border-radius: 10px;
}

#netorder-section-howto .howto-movie-block {
  position: relative;
  padding-top: 56.25%;
  margin-bottom: 50px;
}

#netorder-section-howto .howto-movie-block iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

#netorder-section-howto .check-list {
  margin-bottom: 60px;
}

#netorder-section-howto .check-list>li {
  position: relative;
  display: flex;
  padding-right: 0;
  margin-bottom: 20px;
  align-items: center;
  font-size: 1.6rem;
}

#netorder-section-howto .check-list>li {
  font-size: 1.4rem;
}

#netorder-section-howto .check-list>li i {
  content: "";
  position: relative;
  display: block;
  width: 30px;
  height: 30px;
  top: 0;
  left: 0;
  border-radius: 5px;
  border: 2px solid #DDDDDD;
  margin-right: 0;
}

#netorder-section-howto .check-list>li i::after {
  content: '';
  position: absolute;
  left: 13px;
  top: -3px;
  width: 8px;
  height: 18px;
  border-bottom: 4px solid #00A728;
  border-right: 4px solid #00A728;
  transform: rotate(45deg);
  z-index: 2;
}

#netorder-section-howto .check-list>li span {
  display: block;
  width: calc(100% - 30px);
  padding-left: 30px;
}

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

  .netorder-section {
    padding: 50px 0 20px;
  }


  #netorder-section-howto .check-list {
    margin-bottom: 35px;
  }


  #netorder-section-howto .check-list>li span {
    display: block;
    width: calc(100% - 30px);
    padding-left: 20px;
  }

  #netorder-section-howto {
    padding-bottom: 40px;
  }

  #netorder-section-howto .howto-movie-wrap {
    display: block;
  }

  #netorder-section-howto .howto-movie-group {
    width: 100%;
  }

  #netorder-section-howto .howto-movie-block {
    position: relative;
    padding-top: 56.25%;
    margin-bottom: 35px;
  }

  /*media 768*/
}

/*モスのネット注文:「お持ち帰り注文」と「お届け注文」*/
#netorder-section-option {
  border-top: 1px solid #dddddd;
  margin-bottom: 60px;
}

.netorder-option-block {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}

.netorder-option-block .netorder-takeout,
.netorder-option-block .netorder-delivery {
  position: relative;
  width: calc((100% - 80px) / 2);
}

.netorder-option-block .netorder-takeout::after {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  height: 100%;
  top: 0;
  right: -40px;
  border-right: 1px dashed #DDDDDD;
}

.netorder-option-block .box {
  display: flex;
  align-items: center;
  margin-bottom: 50px;
}

.netorder-option-block .image {
  width: 158px;
}

.netorder-option-block .text {
  width: calc(100% - 158px);
  padding-left: 20px;
  font-size: 1.6rem;
}

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

  #netorder-section-option {
    margin-bottom: 40px;
  }

  .netorder-option-block {
    display: block;
  }

  .netorder-option-block .netorder-takeout,
  .netorder-option-block .netorder-delivery {
    width: 100%;
  }
  .netorder-option-block .netorder-takeout {
    border-bottom: 1px dashed #ddd;
    padding-bottom: 40px;
    margin-bottom: 40px;
  }
  .netorder-option-block .box {
    margin-bottom: 40px;
  }

  .netorder-option-block .button-area {
    margin-bottom: 0px;
  }
  /*media 768*/
}
/*====================================
/* 15.その他画面（DFLで管理）
====================================*/


/*====================================
/* PowerCMS X ひな型テンプレート
====================================*/
/*共通画像*/
.main p img{
  height: auto !important;
}
/*共通マージン*/
/*#tinymce p,*/
.cmn-note,
.cmn-ul-list,
.cmn-ol-list,
.cmn-link,
.cmn-table-fix{
  margin-bottom: 30px;
}
.cmn-cols,
.cmn-table-fix,
.cmn-block,
.cmn-wide-image,
.cmn-flex,
.cmn-flex tbody,
.cmn-flex tr,
.cmn-flex td,
.cmn-flex-rvs,
.cmn-flex-rvs tbody,
.cmn-flex-rvs tr,
.cmn-flex-rvs td,
.cmn-float,
.cmn-float tbody,
.cmn-float tr,
.cmn-float td,
.cmn-float-rvs,
.cmn-float-rvs tbody,
.cmn-float-rvs tr,
.cmn-float-rvs td,
.cmn-flex-m,
.cmn-flex-m tbody,
.cmn-flex-m tr,
.cmn-flex-m td,
.cmn-flex-m-rvs,
.cmn-flex-m-rvs tbody,
.cmn-flex-m-rvs tr,
.cmn-flex-m-rvs td,
.cmn-figures  {
  display: block;
  margin-bottom: 50px;
}
.cmn-note a {
  text-decoration: underline;
}
.cmn-note a:hover {
  text-decoration: none;
}
@media screen and (max-width:768px){
  .cmn-cols,
  .cmn-table-fix,
  .cmn-block,
  .cmn-wide-image {
    margin-bottom: 25px;
  }
  .cmn-cols,
  .cmn-table-fix,
  .cmn-block,
  .cmn-wide-image,
  .cmn-flex,
  .cmn-flex-rvs,
  .cmn-float,
  .cmn-float-rvs,
  .cmn-flex-m,
  .cmn-flex-m-rvs {
    margin-bottom: 35px;
  }
} 

/*A見出し*/
.cmn-h2 {
  font-size: 3.2rem;
  margin-top: 90px;
  margin-bottom: 33px;
  font-weight: normal;
  text-align: center;
}

.cmn-h3 {
  text-align: left;
  font-size: 2.4rem;
  margin-bottom: 30px;
  font-weight: normal;
}
.cmn-h3 + p {
  margin-top: -10px;
}

.cmn-h4 {
  font-size: 1.8rem;
  margin-bottom: 25px;
}

.cmn-h5{
  font-size: 1.6rem;
  margin-bottom: 25px;
}

@media screen and (max-width:768px) {
  .cmn-h2  {
    font-size: 2.2rem;
    text-align: center;
    margin-top: 60px;
    margin-bottom: 30px;
    line-height: 1.625;
    font-weight: normal;
  }
  .cmn-h3 {
    text-align: left;
    font-size: 1.8rem;
    line-height: 1.66;
    margin-bottom: 25px;
    font-weight: normal;
  }
  .cmn-h4{
    font-size: 1.6rem;
    line-height: 1.66;
    margin-bottom: 15px;
  }
  .cmn-h5{
    font-size: 1.4rem;
    line-height: 1.66;
    margin-bottom: 25px;
  }

}

/*B：見出し＋段落*/
.cmn-boxes {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
/*
.cmn-boxes .cmn-box:only-child{
  width: 100%;
}
*/
.cmn-boxes>li {
  width: calc(50% - 30px);
}
/*
.cmn-boxes .cmn-h3,
.cmn-boxes .cmn-h4{
  margin-bottom: 20px;
}
*/
@media screen and (max-width:768px){
/*
  .cmn-boxes .cmn-h3,
  .cmn-boxes .cmn-h4,
  .cmn-boxes .cmn-h5{
    margin-bottom: 10px;
  }
*/
  .cmn-boxes>li {
    width: 100%;
    margin-bottom: 15px;
  }
  .cmn-boxes>li:last-child{
    margin-bottom: 0;
  }
}
/*C：段落*/
.cmn-ta-r {
  text-align: right;
}
.cmn-clr-r{
  color: #E90000;
}
.cmn-clr-g{
  color: #888888;
}

/*D：段落*/
.cmn-note-s>li {
  font-size: 1.2rem;
}
.cmn-note-s>li,
.cmn-note>li {
  position: relative;
  padding-left: 1em;
  line-height: 1.714;
  margin-bottom: 0.2em;
  text-indent: -1em;
}

/*E：リンク*/
.cmn-link {
  display: flex;
  flex-wrap: wrap;
}
.cmn-link>li {
  width: 100%;
  margin-bottom: 0.5em;
}
.cmn-link>li.anchor {
  width: auto;
}
.cmn-link.row>li {
  width: auto;
  margin-right: 24px;
}
.cmn-link a {
  position: relative;
  padding-left: 16px;
  padding-right: 2em;
  display: inline-block;
  line-height: 1.7;
}
.cmn-link a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.4em;
  border: 5px solid transparent;
  border-left: 7px solid #00a728;
}
.cmn-link a[target="_blank"]::after {
  content: "";
  margin-left: 9px;
  display: inline-block;
  width: 14px;
  height: 11px;
  background: url(../svg/target-blank_black.svg) no-repeat;
  background-size: 100%;
  -webkit-backface-visibility: hidden;
}
.cmn-link .pdf>a {
  position: relative;
}
.cmn-link .pdf>a::after {
  position: relative;
  content: '';
  right: 0;
  top: 3px;
  display: inline-block;
  width: 12px;
  height: 14px;
  margin-left: 8px;
  background: url(../svg/pdf.svg) no-repeat;
  background-position: 100% 50%;
  background-size: 100%;
}
.cmn-link .anchor>a {
  position: relative;
  padding-left: 16px;
  display: inline-block;
}
.cmn-link .anchor>a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  border: 5px solid transparent;
  border-top: 7px solid #00a728;
}
.cmn-link.col1>li {
  width: 100%;
   margin-bottom: 0.5em;
}
.cmn-link.col2>li {
  width: 50%;
   margin-bottom: 0.5em;
}
.cmn-link.col3>li {
  width: 33.33%;
   margin-bottom: 0.5em;
}
.cmn-link.col4>li {
  width: 25%;
   margin-bottom: 0.5em;
}
.cmn-link.inline>li{
  width: auto;
  padding-right: 60px;
}
@media screen and (max-width:768px) {
  .cmn-link {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  .cmn-link>li,
  .cmn-link.col1>li,
  .cmn-link.col2>li,
  .cmn-link.col3>li,
  .cmn-link.col4>li {
    width: 100%;
    margin-bottom: 15px;
  }
  .cmn-link.row>li {
    width: 100%;
    margin-right: 0;
  }
}
/*a リンク*/
a.cmn-alink {
  position: relative;
  padding-left: 16px;
  padding-right: 1em;
  display: inline-block;
  line-height: 1.7;
}
a.cmn-alink::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.4em;
  border: 5px solid transparent;
  border-left: 7px solid #00a728;
}
a[target="_blank"].cmn-alink::after {
  content: "";
  margin-left: 9px;
  display: inline-block;
  width: 14px;
  height: 11px;
  background: url(../svg/target-blank_black.svg) no-repeat;
  background-size: 100%;
  -webkit-backface-visibility: hidden;
}
a.cmn-alink.pdf::after {
  position: relative;
  content: '';
  right: 0;
  top: 3px;
  display: inline-block;
  width: 12px;
  height: 14px;
  margin-left: 8px;
  background: url(../svg/pdf.svg) no-repeat;
  background-position: 100% 50%;
  background-size: 100%;
}
a.cmn-alink.anchor::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  border: 5px solid transparent;
  border-top: 7px solid #00a728;
}

/*F：リスト*/
.cmn-ul-list li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 0.5em;
}
.cmn-ul-list li a {
  text-decoration: underline;
}
.cmn-ul-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  width: 8px;
  height: 8px;
  background: #00a728;
  border-radius: 50%;
}
.cmn-ol-list li {
  position: relative;
  counter-increment: number;
  padding-left: 22px;
   margin-bottom: 0.5em;
}
.cmn-ol-list li::before {
  content: counter(number)".";
  position: absolute;
  display: block;
  width: 1.5em;
  height: 1em;
  top: 0;
  left: 0;
  background: none;
  border-radius: 0;
  color: #00A728;
  font-weight: bold;
}

@media screen and (max-width:768px){
  .cmn-ul-list li::before {
    top: 8px;
  }
}

/* G 画像*/
.cmn-wide-image{
  display: block;
  position: relative;
  width: 100%;
  padding-top: calc(300px + 30px);
}
.cmn-wide-image .cmn-image{
  display: block;
  position: absolute;
  left:0;
  top:0;
  width: 100vw;
  height: 300px !important;
  top:0;
  left:calc( 50% - 50vw);
  object-fit: cover;
  overflow: hidden;
}
.cmn-wide-image .cmn-image img{
  width: 100%;
  object-fit: cover;
}
.cmn-image{
  display: block;
  text-align: center;
  margin-bottom: 25px;
}
.cmn-image img{
  height: 100% !important;
}

@media screen and (max-width:768px){
  .cmn-wide-image{
    position: relative;
    width: 100%;
    padding-top: calc(61.9vw + 15px);
  }
  .cmn-wide-image .cmn-image {
    left: 0;
    top: 0;
    width: 100vw;
    height: 0 !important;
    padding-top: 61.9vw;
    overflow: hidden;
    top:0;
    left: calc( 50% - 50vw );
  }
  .cmn-wide-image .cmn-image img{
    position: absolute;
    width: 100vw;
    height: 61.9vw !important;
    top:0;
    left:0;
  }
  .cmn-image{
    margin-bottom: 15px;
  }
}
.cmn-cols {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.cmn-cols .cmn-col {
  width: 47.5%;
  display: inline-block;
  max-width: 570px;
}
.cmn-cols .cmn-col:only-child{
  margin-left: auto;
  margin-right: auto;
}
.cmn-cols .cmn-image {
  display: block;
  text-align: center;
  margin: 0 auto 25px;
}

.cmn-cols .cmn-image img{
  height: auto !important;
}

@media screen and (max-width:768px) {
  .cmn-cols .cmn-col{
    margin-bottom: 20px;
  }
  .cmn-cols .cmn-col:only-child{
    width: 100%;
  }
  .cmn-cols .cmn-col:only-child img{
    max-width: 100%;
  }
}
.cmn-figures {
  display: flex;
  flex-wrap: wrap;
  margin-right:  auto;
  margin-left:  auto;
  justify-content: center;
}
.cmn-figures>.cmn-figure{
  width: 20.8%;
  margin-right: 5.6%;
}
.cmn-figures>.cmn-figure:nth-child(4n){
  width: 20.8%;
  margin-right: 0;
}
.cmn-figures>.cmn-figure:last-child {
  margin-right: 0;
}
.cmn-figures>.cmn-figure .image {
  margin-bottom: 25px;
}
/* .col4 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.col4>.col {
  margin-right: 5.5%;
  width: 20.8%;
}
.col4>.col:last-child {
  margin-right: 0;
}
.col4>.col .image {
  margin-bottom: 25px;
}
 */
@media screen and (max-width:768px) {
  .cmn-figures .cmn-image {
    width: 100%;
    margin: 0 auto 15px;
    max-width: none;
    text-align: center;
  }
  .cmn-figures>.cmn-figure,
  .cmn-figures>.cmn-figure:nth-child(4n) {
    width: 100%;
    margin-right: 0;
    text-align: center;
    margin-bottom: 20px;
  }
}

/*画像+テキスト*/
.cmn-flex,
.cmn-flex-rvs,
.cmn-float,
.cmn-float-rvs,
.cmn-flex-m,
.cmn-flex-m-rvs {
/*  margin-bottom: 45px;*/
  overflow: hidden;
}
.cmn-flex .cmn-image,
.cmn-float .cmn-image,
.cmn-flex-m .cmn-image{
  margin: 0 25px 25px 0;
  float: left;
}
.cmn-flex-rvs .cmn-image,
.cmn-flex-m-rvs .cmn-image ,
.cmn-float-rvs .cmn-image {
  float: right;
  margin: 0 0 25px 25px;
}
.cmn-flex .cmn-text,
.cmn-flex-rvs .cmn-text,
.cmn-flex-m .cmn-text,
.cmn-flex-m-rvs .cmn-text {
  overflow: hidden;
}
@media screen and (max-width:768px) {
  .cmn-flex,
  .cmn-flex-rvs {
    display: block;
  }
  .cmn-flex .cmn-image {
    margin-right: 0px;
    float: none;
    text-align: center;
    display: block;
  }
  .cmn-flex-rvs .cmn-image {
    margin-left: 0px;
    float: none;
    text-align: center;
  }
  .cmn-flex .cmn-text,
  .cmn-flex-rvs .cmn-text{
    overflow: hidden;
  }
  .cmn-flex-m .cmn-image {
    margin-right: 20px;
    text-align: center;
    max-width: 158px;
    width: 47.16%;
  }
  .cmn-flex-m-rvs .cmn-image {
    margin-left: 20px;
    margin-right: 0px;
    margin-bottom: 0;
    text-align: center;
    max-width: 158px;
    width: 47.16%;
  }
  .cmn-float .cmn-image {
    margin: 0 20px 0 0;
    max-width: 158px;
    width: 47.16%;
  }
  .cmn-float-rvs .cmn-image {
    margin: 0 0 0 20px;
    max-width: 158px;
    width: 47.16%;
  }
  .cmn-float .cmn-text,
  .cmn-float-rvs .cmn-text {
    overflow: visible;
  }
  .cmn-float-rvs .cmn-image {
    margin: 0 0 0 20px;
    max-width: 158px;
    width: 47.16%;
  }
}

/*緑フレーム*/
.cmn-bg-green {
  position: relative;
  background: #FFFBF0;
  padding: 37px 30px 15px;
}
@media screen and (max-width:768px) {
  .cmn-bg-green {
    position: relative;
    background: #FFFBF0;
    padding: 30px 20px 20px;
  }
}
.cmn-button-list{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.cmn-button-list>li{
  margin: 0 14px;
  margin-bottom: 30px;
}
.cmn-button{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 48px;
  line-height: 22px;
  height: auto;
  width: 340px;
  padding: 9.5px 45px;
  border-radius: 40px;
  text-align: center;
  font-size: 1.6rem;
  font-weight: bold;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition-duration: 0.5s;
  background: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border: 1px solid #00A728;
  text-decoration: none;
}
.cmn-button.green {
  background: #00A728;
  border: 1px solid #00A728;
  color: #fff;
}
.cmn-button.orange {
  background: #ff7e47;
  border: 1px solid #ff7e47;
  color: #fff;
}
.cmn-button.disabled {
  color: #ccc;
  border: 1px solid #ccc;
  background: #f5f5f5;
  cursor: auto;
}
.cmn-button[target="_blank"]::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 19px;
  height: 15px;
  background-size: 100%;
  background-repeat: no-repeat;
  transform: translateY(-50%);
  background-size: 14px auto;
  height: 12px;
}
.cmn-button[target="_blank"]::after {
  background-image: url(../svg/target-blank_green.svg);
}
.cmn-button.orange[target="_blank"]::after ,
.cmn-button.green[target="_blank"]::after {
  background-image: url(../svg/target-blank.svg);
}
.cmn-button:hover {
  opacity: 0.5;
}
.cmn-button.disabled:hover {
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .cmn-button{
    width: 340px;
    max-width: 100%;
    margin-bottom: 15px;
  }
  .cmn-button-list>li {
    margin: 0;
  }
  .cmn-button-list>li:last-child {
    margin-bottom: 0;
    margin-bottom: 0;
  }
}

/*横並びブロックリンク*/
.cmn-linkbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.cmn-linkbox li{
  width: calc(50% - 30px);
  margin-bottom: 30px;
}
.cmn-linkbox a {
  display: block;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.09);
  border-radius: 10px;
  padding: 25px;
  background: #fff;
  overflow: hidden;
}
.cmn-linkbox img{
  max-width: 142px;
  margin-bottom: 0;
  float:left;
  margin-right: 25px;
}
.cmn-linkbox .cmn-h4{
  display: inline-block;
  margin-bottom: 10px;
}
.cmn-linkbox br + p ,
.cmn-linkbox br + .cmn-h4 {
    display: block;
    margin-top: -1em;
}
.cmn-linkbox .cmn-message{
  display: block;
}
.cmn-linkbox .cmn-float,
.cmn-linkbox .cmn-float-rvs {
  margin-bottom: 0;
}
.cmn-linkbox .mediaBox p {
  margin-bottom: 0;
}
@media screen and (max-width: 768px) {
  .tableCols-wrap {
    margin-bottom: 37px;
  }
  .cmn-linkbox {
    display: block;
  }
  .cmn-linkbox li{
    width: 100%;
    margin: 0;
    margin-bottom: 20px;
  }
  .cmn-linkbox a {
    display: block;
    width: 100%;
    height: auto;
    padding: 20px;
    overflow: hidden;
  }
}
.clickableFrame p {
  margin-bottom: 0;
}
.clickableFrame .title {
  margin-bottom: 20px;
}
.cmn-menu-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  border-radius: 10px;
  padding: 0;
  margin-bottom: 20px;
}
.cmn-menu-list>li{
  position: relative;
  margin-bottom: 30px;
}
.cmn-menu-list>li,
.cmn-menu-list>li.cmn-menu-s{
  display: block;
  position: relative;
  max-width: 300px;
  min-height: 246px;
  margin-right: 2%;
  margin-bottom: 24px;
}
.cmn-menu-list a{
  position: relative;
  display: block;
  height: 100%;
  overflow: hidden;
  background: #fff;
  border-radius: 10px;
  padding-bottom: 5px;
  box-shadow: 0 0 10px rgba(0,0,0,0.09);
}
.cmn-menu-list>li{
  width: 23.5%
}
.cmn-menu-list>li.cmn-menu-s{
  width: 15%
}
.cmn-menu-list > div:nth-child(6n),
.cmn-menu-list > li:nth-child(6n){
  margin-right: 0;
}

.cmn-menu-list>div:last-child,
.cmn-menu-list>li:last-child {
  margin-right: 0;
}

.cmn-menu-list>li span,
.cmn-menu-list>li.cmn-menu-s span{
  display: block;
}
.cmn-menu-list .image {
  position: relative;
  padding: 27px;
  text-align: center;
  margin-bottom: 15px;
  border:1px solid #f5f5f5;
  overflow: hidden;
  border-radius: 10px;
}
.cmn-menu-list>li>p {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}
.cmn-menu-list a .image {
  border: none;
  border-radius: 0;
}
.cmn-menu-list a .image::after {
  content: '';
  left: 10px;
  bottom: 0;
  position: absolute;
  width: calc( 100% - 20px );
  height: 1px;
  background: #f5f5f5;
  border:none;
}
.cmn-menu-list img{
  height: auto;
}
.cmn-menu-list .name {
  margin-bottom: 0.5em;
  padding: 0 17px;
  font-weight: bold;
}
.cmn-menu-list .price {
  margin-bottom: 0.5em;
  padding: 0 17px;
}
.cmn-menu-list .icon {
  position: absolute;
  top: 0;
  left: 0;
  background: #00A728;
  font-size: 1.3rem;
  color: #fff;
  line-height: 28px;
  padding: 0 0.75em;
  margin-bottom: 0;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .cmn-menu-list {
    flex-wrap:wrap;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  .cmn-menu-list li{
    margin-bottom: 20px;
  }
  .cmn-menu-list li:nth-child(2n) {
    margin-right: 0;
  }
  .cmn-menu-list>li,
  .cmn-menu-list>li.cmn-menu-s {
      display: block;
      position: relative;
      max-width: none;
      min-height: 0;
      overflow: hidden;
      margin-right: 0;
  }
  .cmn-menu-list>li {
    width: 100%;
  }
  .cmn-menu-list>li.cmn-menu-s{
    width: 48%;
  }
}
.cmn-movie-wrap {
  display: block;
  max-width: 850px;
  margin: 0 auto 50px;
}
.cmn-movie-wrap .mce-object-iframe {
  position: relative;
  display: block;
  padding-top: 56.25%;
  margin-bottom: 15px;
  border:none !important;
}
.cmn-movie-wrap .mce-object-iframe iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left:0;
  top:0;
}
.cmn-movie-wrap li {
  position: relative;
  display: block;
  /*height: 478px;*/
  padding-top: 56.25%;
  margin-bottom: 15px;
  border:none !important;
}
.cmn-movie-wrap li iframe{
  position: absolute;
  width: 100%;
  height: calc(56.25vw - 30px);
  max-height: 478px;
  left:0;
  top:0;
}
.cmn-movie-wrap li>a,
.cmn-movie-wrap li>p{
  margin-top: 10px;
}
.cmn-movie-wrap .mce-object-iframe {
  position: relative;
  display: block;
  padding-top: 56.25%;
  margin-bottom: 15px;
  border:none !important;
}
.cmn-movie-wrap .mce-object-iframe iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left:0;
  top:0;
}
/*テーブル*/
.cmn-table-fix {
  display: table;
  table-layout: fixed;
  width: 100%;
  margin-top: 20px;
  border-collapse: collapse;
}
.cmn-table-fix th,
.cmn-table-fix td {
  border: 1px solid #DDDDDD;
  text-align: left;
  padding: 13px 20px;
}
.cmn-table-fix thead th {
  background: #F1E3D4;
  border-right: 1px solid #fff;
}
.cmn-table-fix thead th:last-child {
  border-right: 1px solid #DDDDDD;
}
.cmn-table-fix tbody th {
  background: #F5F5F5;
  font-weight: normal;
  border-right: 1px solid #fff;
  vertical-align: middle;
}
.cmn-table-fix caption {
  margin-bottom: 10px;
}
.cmn-table-fix th,
.cmn-table-fix td {
  vertical-align: top;
}

@media screen and (max-width:768px) {
  .cmn-table-fix {
    margin-top: 0;
    margin-bottom: 30px;
  }
  .cmn-table-fix th,
  .cmn-table-fix td {
    border: 1px solid #DDDDDD;
    text-align: left;
    padding: 12px 12px;
  }
}
/*■L-3 列見出し表（2列・1行）*/
.cmn-table {
  width: 100%;
}
.cmn-table td,
.cmn-table th {
  padding: 15px 20px;
}
.cmn-table th {
  width: 25%;
  background-color: #F1E3D4;
  font-weight: bold;
  border: 1px solid #DDDDDD;
  border-right: none;
}
.cmn-table td {
  width: 75%;
  border: 1px solid #DDDDDD;
  background-color: white;
  border-left: none;
}

/* QRコード */
.qrcode {
  max-width: 325px;
  position: relative;
  margin: 0 auto;
}
.qrcode img:last-child {
  position: absolute;
  right: 7px;
  top: 7px;
  width: auto;
  height: 80%;
}
@media screen and (max-width: 1000px) {
  .qrcode img:last-child {
    width: auto;
    height: 80%;
  }
}

/*印刷対応*/
/*@media print {
  #top-visual a {
    display: none;
  }
  #page-top .campaign-list .image {
    display: none;
  }
  #page-top .topics-slider-list li .image {
    display: none;
  }
  #page-service .service-top-list li .image {
    display: none;
  }
  #page-menu #menu-top-visual .swiper-wrapper .swiper-slide a {
    display: none;
  }
  #page-menu .menu-detail-campaign .menu-detail-banner a {
    display: none;
  }
  .shop-campaign-banner a {
    display: none;
  }
}*/
/*.shop-campaign-banner a img {
  pointer-events: none;
}*/

/*画像ドラック&ドロップ禁止*/
/*#page-top .campaign-list .image img,*/
/*#page-top .topics-slider-list li .image img,*/
/*#page-service .service-top-list li .image img,*/
/*#page-menu .menu-detail-campaign .menu-detail-banner a img {
  pointer-events: none;
}*/

/* Facebookシェアボタン */
.fb-share-container{
  display:flex;
  max-width:100px; 
  background:#1877f2; 
  width:90px; 
  height:20px; 
  margin-left:5px; 
  margin-right:5px; 
  border-radius:3px;
  color:#fff;
  vertical-align: middle;
  cursor: pointer;
}
.fb-share-image{
  vertical-align: middle;
  height: 20px;
  padding-bottom: 6px;
  margin-right: 10px;
  margin-left: 5px;
}
.fb-share-text{
  padding:2px;
  vertical-align: middle;
  width: 100%;
  -webkit-font-smoothing: antialiased;
  font-size:11px;
  font-weight: bold;
}

/* モスチキン（レシピ）フローティングバナー */
.chicken-recipe-noslink {
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 0 4px rgb(0 0 0 / 15%);
  margin: auto -20px;
  padding: 0 15px;
  background-color: #fff;
  position: fixed;
  bottom: 0;
  z-index: 3;
}
.chicken-recipe-noslink .noslink-txt-block {
  width: 55.8%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.chicken-recipe-noslink .noslink-txt-block img {
  width: 55px;
  padding-bottom: 5px;
}
.chicken-recipe-noslink .noslink-txt-block div {
  padding-left: 6px;
}
.chicken-recipe-noslink .noslink-txt-block div img {
  width: 132px;
}
.chicken-recipe-noslink .noslink-txt-block div p {
  font-weight: bold;
  color: #007749;
  line-height: 1.333;
  margin-bottom: 0;
}
.chicken-recipe-noslink .noslink-btn-block {
  text-align: right;
}
.chicken-recipe-noslink .button {
  font-size: 1rem !important;
  width: 130px !important;
  height: 48px !important;
  white-space: nowrap;
  text-align: left !important;
  padding-left: 19px !important;
  line-height: 1.7 !important;
}
.chicken-recipe-noslink .button[target="_blank"]::after {
  right: 15px;
}
.chicken-recipe-noslink .button-green {
  background: #007749!important;
  border: 1px solid #007749!important;
  color: #fff;
}
@media screen and (min-width:768px) {
  .chicken-recipe-noslink {
    width: 380px;
    right: 5vw;
    bottom: 3vw;
    box-shadow: 5px 5px 5px rgb(0 0 0 / 15%);
    border: 1px solid #f4f4f4;
    border-radius: 5px;
  }
  .chicken-recipe-noslink .button {
    width: 138px !important;
  }
}

/* モスチキン（キャンペーン）*/
.cp-chicken .icon-s {
  position: absolute;
  left: 10px;
  bottom: 7px;
  display: flex;
}
.cp-chicken .icon-s img {
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
@media screen and (max-width:767px) {
  .cp-chicken.cmn-menu-list a {
    border: 1px solid rgba(0,0,0,0.09);
    width: 98%;
    height: 98%;
    margin: auto;
  }
}

/*とびきりチーズ*/
.icon-tobikiri-menu {
  margin-right: 10px;
  margin-bottom: 13px;
}
.detail4-contents-block {
  position: relative;
  display: flex;
}
.detail4-contents-box1,
.detail4-contents-box2 {
  position: relative;
  width: 50%;
}
.detail4-contents-box1 {
  text-align: right;
}
.detail4-contents-box2 {
  text-align: left;
}
.detail4-contents-text {
  margin-top: 90px;
  max-width: 525px;
  display: inline-block;
  text-align: left;
  padding-left: 25px;
  padding-right: 25px;
}
.detail4-contents-image {
  position: relative;
  min-width: 500px;
  display: inline-block;
  text-align: center;
  margin-top: -40px;
}
.detail4-contents-image.abs {
  position: absolute;
  right: 30px;
  top: -20px;
  width: 100%;
  width: 702px;
  margin-top: 0;
}
.detail4-contents-block.reverse {
  flex-direction: row-reverse;
  margin-bottom: 30px;
}
.detail4-contents-block.reverse .detail2-contents-text {
  max-width: 550px;
  height: 360px;
  padding-left: 25px;
  padding-right: 25px;
}
.detail4-contents-block.reverse .detail2-contents-box1 {
  text-align: left;
}
.detail4-contents-block.reverse .detail2-contents-box2 {
  text-align: right;
}
.detail4-contents-box1 {
  text-align: right;
}
.detail4-contents-box2 {
  text-align: left;
}
.detail4-contents-block.reverse .detail2-contents-box2 {
  text-align: right;
  min-height: 227px;
}
.detail4-section-image {
  margin-bottom: 0px;
}
.detail4-contents-omoi-logo {
	position: relative;
	text-align: center;
  margin-top: 50px;
  margin-bottom: 20px;
}
.detail4-contents-message {
  font-size: 1.6rem;
  line-height: 2;
  margin-top: 120px;
}
.detail4-contents-image-snsarea{
  padding: 20px 80px;
  background :#F2F2ED
}
.detail4-contents-image-flex-4{
	display: flex;
	flex-wrap:wrap;
}
.detail4-contents-image-flex-4 li {
	width: calc(100%/4);
	box-sizing:border-box;
}
.detail4-contents-image-flex-4 li img {
	max-width:100%;
	height: auto;
}
.detail4-contents-gaburi {
  position: relative;
  padding: 60px 20px;
}
.detail4-contents-gaburi {
  display: block;
  width: 100%;
  background: #FAEBDC;
  margin-top: -60pt;
}
.detail4-contents-gaburi-block {
  position: relative;
  display: flex;
  margin-bottom: 20px;
  margin-top: -50pt;
}
.detail4-contents-gaburi-message {
  font: inherit;
    color: #00573d;
  font-family: "A1 Gothic B";
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 2;
}
.detail4-contents-gaburi-message-bold {
  font-size: 2.4rem;
  font-weight: 1000;
}
.detail4-contents-gaburi-image {
  position: relative;
  min-width: 500px;
  display: inline-block;
  text-align: center;
  margin-top: -40px;
}
.detail4-contents-gaburi-image.abs {
  position: absolute;
  right: 30px;
  top: -20px;
  width: 100%;
  width: 702px;
  margin-top: 0;
}
.detail4-contents-square {
  padding: 10% 10% 10% 10%;
  margin-top: 70px;
  margin-bottom: 30px;
  width: 750px;
  background: #FFFFFF;
}
.detail4-contents-square p {
  margin: 0; 
  padding: 0;
}
.detail4-contents-text-space{
  margin-top: 70px;
  margin-left: 50px;
}
.tobikiri-cheese-mb00-pc {margin-bottom: 0!important;
}
.tobikiri-cheese-mt10-pc {margin-top: 10px!important;
}
@media screen and (max-width:1366px) {
    .detail4-contents-block {
    overflow: hidden;
  }
  .detail4-contents-image.abs {
    position: absolute;
    right: 30px;
    top: 0;
    width: 103%;
  }
  .detail4-contents-gaburi-image.abs {
    position: absolute;
    right: 5px;
    top: 0;
    width: 10%;
  }
  .detail-contents-message {
    margin-bottom: 30px;
  }
}
@media screen and (max-width:1024px) {
  .detail4-contents-text-space{
    margin-top: 0px;
    margin-left: 0px;
  }
  .detail4-contents-square {
    padding: 5%;
    margin-top: 0px;
    width: 460px;
    background: #FFFFFF;
  }
  .detail4-contents-square p {
    margin: 0; 
    padding: 0;
  }
  .detail4-contents-block,
  .detail4-contents-block.reverse {
    display: block;
    max-width: 768px;
    margin: 0 auto;
  }
  .detail4-contents-box1,
  .detail4-contents-box2 {
    width: 100%;
    text-align: center;
  }
  .detail4-contents-text {
    max-width: 100%;
    display: block;
    text-align: left;
    padding-left: 0;
    padding: 0 20px;
  }
  .detail4-contents-message {
    font-size: 1.6rem;
    line-height: 2;
  }
  .detail4-contents-image {
    margin-bottom: 50px;
    min-width: 0;
  }
  .detail4-contents-image img {
    max-width: 100%;
  }
  .detail4-contents-block.reverse .detail2-contents-box2 {
    position: relative;
    padding-top: inherit;
    padding-top: 179px;
  }
  .detail4-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-gaburi-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-image.abs img {
    /*width: 149.6%;*/
    width: 100%;
    max-width: none;
  }
   .detail4-contents-gaburi-image.abs img {
    /*width: 149.6%;*/
    width: 100%;
    max-width: none;
  }
  .detail4-contents-block.reverse .detail2-contents-text {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
  .detail4-contents-block.reverse .detail2-contents-box2 {
    min-height: 267px;
  }
}
/*とびきりチーズ汎用スタイル*/
@media screen and (max-width: 768px){
  .tobikiri-cheese-mt00 {padding-top: 0!important;
 }
 .tobikiri-cheese-mb00 {margin-bottom: 0!important;
 }
 .tobikiri-cheese-text_l {text-align: left!important;
 }
 .tobikiri-cheese-mt10 {margin-top: 10px!important;
 }
 .tobikiri-cheese-mt25 {margin-top: 25px!important;
 }
 .tobikiri-cheese-mt30 {margin-top: 30px!important;
 }
 .tobikiri-cheese-mb20 {margin-bottom: 20px!important;
 }
 .tobikiri-cheese-mb30 {margin-bottom: 30px!important;
 }
}
@media screen and (max-width:768px) {
  .tobikiri-cheese-fontsize{
    font-size: 2.1rem;
  }
  .tobikiri-image-left {
    position: relative; left:-20px;
  }
  .tobikiri-image-right {
    position: relative; left:20px;
    margin-top: -130px;
  }

  .detail4-contents-gaburi-button {
    text-align: center;
    padding: 0px;
  }
  .detail4-contents-omoi-logo img{
    width: 120px;
    margin-bottom: 20px;
  }
  br.nobr {
    display:contents;
  }
  .detail4-contents-square {
    padding: 30px 20px 130px 20px;
    margin-bottom: 30px;
    margin-right: 40px;
    width: 380px;
    background: #FFFFFF;
  }
  .detail4-contents-square p {
    margin: 0; 
    padding: 0;
  }
  .detail4-contents-gaburi {
    padding: 50px 0px;
    margin-top: 10px;
  }
  .detail4-contents-image {
    margin-bottom: 20px;
    min-width: 0;
    text-align: center;
    display: block;
  }
  .detail4-contents-image-sp2 {
    position: relative;
  }
  .detail4-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-gaburi-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-block.reverse .detail-contents-message {
    text-align: left;
  }
  .detail4-contents-message {
    font-size: 1.4rem;
    line-height: 2;
    margin-top: -10px;
    margin-bottom: 5px;
    text-align: center;
  }
  .detail4-contents-image-snsarea{
    overflow: hidden;
    text-align: center;
    padding: 1px 0;
  }
  .detail4-contents-image-flex-4{
    margin: 25px;
    display: flex;
    flex-wrap:wrap;
  }
  .detail4-contents-image-flex-4 ul {
    list-style: none;
    margin: 0;
    display: flex;
  }
  .detail4-contents-image-flex-4 li {
    margin: 0 0 10px;
    width: calc(200%/4);
	  padding:10px 15px;
    font-size: 14px;
   }
  .detail4-contents-image-flex-4 li img {
    max-width:100%;
    height: auto;
  }
}
/*とびきりチーズ ボトム要素*/
.detail4-section {
  text-align: left;
  max-width: 1050px;
  margin: 150px auto 74px;
  padding: 0 25px;
}
.detail4-section-block {
  background: #F8EEE2;
  text-align: center;
  padding: 75px 20px 15px;
  border-radius: 10px;
}
.detail4-section-label {
  position: relative;
}
.detail4-section-label>span {
  position: absolute;
  display: block;
  top: -130px;
  left: 0;
  width: 100%;
  text-align: center;
}
.detail4-section-title {
  position: relative;
  font-size: 2.6rem;
  color: #6A430A;
  padding-bottom: 20px;
  margin-bottom: 30px;
}
.detail4-section-title::after {
  content: "";
  position: absolute;
  display: block;
  width: 36px;
  height: 3px;
  bottom: 0;
  left: 50%;
  margin-left: -18px;
  background: #fff;
}
.detail4-section-message1 {
  font-size: 1.6rem;
  margin-bottom: 30px;
  line-height: 2;
}
.detail4-section-message2 {
  font-size: 1.6rem;
  margin-bottom: 30px;
  line-height: 2;
}
.detail4-contents-button {
  text-align: center;
  padding: 0 20px;
}
@media screen and (max-width:1024px) {
  .detail4-section {
    margin: 70px auto 74px;
    padding: 0 20px;
  }
  .detail4-contents-button {
    width: 100%;
}
}
@media screen and (max-width:768px) {
  .detail4-section-title {
    position: relative;
    font-size: 2rem;
  }
  .unique .menu-detail-inner .button-box .button {
    margin: 0 auto 20px;
  }
  .detail4-section {
    margin: 24px auto 40px;
    padding: 0 20px;
  }
  .detail4-section-message1,
  .detail4-section-message2 {
    font-size: 1.4rem;
    margin-bottom: 15px;
    line-height: 2;
    text-align: left;
  }
  .detail4-section-block {
    padding: 50px 0 15px;
  }
  .detail4-section-block .inner {
    padding: 0 5%;
  }
  .detail4-section-image {
    padding: 0 1.5% 0 5%;
  }
  .detail4-section-image img {
    width: 100%;
  }
  .detail4-section-label>span {
    position: absolute;
    display: block;
    top: -89px;
    left: 50%;
    text-align: center;
    width: 76px;
    margin-left: -38px;
  }
}
/*とびきりチーズ*/
.sns-contents {
  padding-top: 50px;
  flex-direction: row;
	justify-content: center;
	margin-left: -10px;
}

.detail4-contents-block {
  position: relative;
  display: flex;
}
.detail4-contents-box1,
.detail4-contents-box2 {
  position: relative;
  width: 50%;
}
.detail4-contents-box1 {
  text-align: right;
}
.detail4-contents-box2 {
  text-align: left;
}
.detail4-contents-text {
  margin-top: 90px;
  max-width: 525px;
  display: inline-block;
  text-align: left;
  padding-left: 25px;
  padding-right: 25px;
}
.detail4-contents-image {
  position: relative;
  min-width: 500px;
  display: inline-block;
  text-align: center;
  margin-top: -40px;
}
.detail4-contents-image.abs {
  position: absolute;
  right: 30px;
  top: -20px;
  width: 100%;
  width: 702px;
  margin-top: 0;
}
.detail4-contents-block.reverse {
  flex-direction: row-reverse;
  margin-bottom: 30px;
}
.detail4-contents-block.reverse .detail2-contents-text {
  max-width: 550px;
  height: 360px;
  padding-left: 25px;
  padding-right: 25px;
}
.detail4-contents-block.reverse .detail2-contents-box1 {
  text-align: left;
}
.detail4-contents-block.reverse .detail2-contents-box2 {
  text-align: right;
}
.detail4-contents-box1 {
  text-align: right;
}
.detail4-contents-box2 {
  text-align: left;
}
.detail4-contents-block.reverse .detail2-contents-box2 {
  text-align: right;
  min-height: 227px;
}
.detail4-section-image {
  margin-bottom: 0px;
}
.detail4-contents-omoi-logo {
  position: relative;
  text-align: center;
  margin-top: 50px;
  margin-bottom: 20px;
}
.detail4-contents-omoi-logo img{
  width: 144px;
}
.detail4-contents-message {
  font-size: 1.6rem;
  line-height: 2;
  margin-top: 120px;
}
.detail4-contents-image-snsarea{
  padding: 20px 0px;
  background :#F2F2ED
}
.detail4-contents-image-flex-4{
  display: flex;
  flex-wrap:wrap;
}
.detail4-contents-image-flex-4 li {
  width: calc(100%/4);
  box-sizing:border-box;
  padding: 20px;
}
.detail4-contents-image-flex-4 li img {
  max-width:100%;
  height: auto;
}
.snsarea-padding {
  padding: 20px 100px 20px 50px;
}
.detail4-contents-gaburi {
  display: block;
  width: 100%;
  background: #FAEBDC;
  margin-top: -60pt;
}
.detail4-contents-gaburi-block {
  position: relative;
  display: flex;
  margin-bottom: 20px;
  margin-top: -50pt;
}
.detail4-contents-gaburi-message {
  font: inherit;
    color: #00573d;
  font-family: "A1 Gothic B"!important;
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 2.1;
  margin-top: 2px;
}
.detail4-contents-gaburi-message-bold {
  font-size: 2.4rem;
  font-weight: 1000;
}
.detail4-contents-gaburi-image {
  position: relative;
  min-width: 500px;
  display: inline-block;
  text-align: center;
  margin-top: -40px;
}
.detail4-contents-gaburi-image.abs {
  position: absolute;
  right: 30px;
  top: -20px;
  width: 100%;
  width: 702px;
  margin-top: 0;
}
.detail4-contents-gaburi-button {
  text-align: center;
  padding: 0 20px;
}
.gaburi-text-arae {
  margin-left: -150px;
  max-width: 600px;
}
.detail4-contents-gaburi-mb {
  margin-bottom: 40px!important;
}
.detail4-contents-gaburi-text {
  margin: 10px 20px 20px -130px;
  max-width: 105%;
}
.detail4-contents-gaburi-ml {
  margin-left: -200px;
}
 
@media screen and (max-width:1366px) {
  .detail4-contents-block {
    overflow: hidden;
  }
  .detail4-contents-image.abs {
    position: absolute;
    right: 30px;
    top: 0;
    width: 103%;
  }
  .detail4-contents-gaburi-image.abs {
    position: absolute;
    right: 5px;
    top: 0;
    width: 10%;
  }
  .detail-contents-message {
    margin-bottom: 30px;
  }
}
@media screen and (max-width:1024px) {
  .detail4-contents-gaburi-text {
    margin-left: 0px;
    max-width: 200%;
  }
  .detail4-contents-gaburi-ml {
    margin-left: 0px;
  }
  .gaburi-text-arae {
    margin-left: -5px;
    max-width: 600px;
  }
  .detail4-contents-block,
  .detail4-contents-block.reverse {
    display: block;
    max-width: 768px;
    margin: 0 auto;
  }
  .detail4-contents-box1,
  .detail4-contents-box2 {
    width: 100%;
    text-align: center;
  }
  .detail4-contents-text {
    max-width: 100%;
    display: block;
    text-align: left;
    padding-left: 0;
    padding: 0 20px;
  }
  .detail4-contents-message {
    font-size: 1.6rem;
    line-height: 2;
  }
  .detail4-contents-image {
    margin-bottom: 50px;
    min-width: 0;
  }
  .detail4-contents-image img {
    max-width: 100%;
  }
  .detail4-contents-block.reverse .detail2-contents-box2 {
    position: relative;
    padding-top: inherit;
    padding-top: 179px;
  }
  .detail4-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-gaburi-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-image.abs img {
    /*width: 149.6%;*/
    width: 100%;
    max-width: none;
  }
   .detail4-contents-gaburi-image.abs img {
    /*width: 149.6%;*/
    width: 100%;
    max-width: none;
  }
  .detail4-contents-block.reverse .detail2-contents-text {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
  .detail4-contents-block.reverse .detail2-contents-box2 {
    min-height: 267px;
  }
}
@media screen and (max-width:768px) {
  .detail4-contents-gaburi-text {
    text-align: center;
    margin: 30px 0px 0px 0px;
  }
  .sns-contents {
    padding: 30px 0 50px 0;
  }
  .gaburi-text-arae {
    margin-left: 0px;
    max-width: 0px;
  }
  .detail4-contents-gaburi-mb {
    margin-bottom: 0px!important;
  }
  .detail4-contents-gaburi {
    padding: 38px 0px 50px 0px;
    margin-top: 10px;
  }
  .detail4-contents-image {
    margin-bottom: 20px;
    min-width: 0;
    text-align: center;
    display: block;
  }
  .detail4-contents-image-sp2 {
    position: relative;
    padding-left: 20px;
  }
  .detail4-contents-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-gaburi-image.abs {
    position: absolute;
    left: 50%;
    right: auto;
    top: 0;
    width: 561px;
    height: 100%;
    text-align: center;
    transform: translate(-50%, 0);
  }
  .detail4-contents-block.reverse .detail-contents-message {
    text-align: left;
  }
  .detail4-contents-message {
    font-size: 1.4rem;
    line-height: 2;
    margin-top: -10px;
    margin-bottom: 5px;
    text-align: center;
  }
  .detail4-contents-image-snsarea{
    overflow: hidden;
    text-align: center;
    padding: 1px 0;
  }
  .detail4-contents-image-flex-4{
    margin: 30px 0;
    display: flex;
    flex-wrap:wrap;
  }
  .detail4-contents-image-flex-4 ul {
    list-style: none;
    margin: 0;
    display: flex;
  }
  .detail4-contents-image-flex-4 li {
    margin: 0 0 10px;
    width: calc(200%/4);
    padding:10px 15px;
    font-size: 14px;
   }
  .detail4-contents-image-flex-4 li img {
    max-width:100%;
    height: auto;
  }
  .snsarea-padding {
    padding: 8px 5px;
  }
}
/*とびきりチーズ ボトム要素*/
.detail4-section {
  text-align: left;
  max-width: 1050px;
  margin: 150px auto 74px;
  padding: 0 25px;
}
.detail4-section-block {
  background: #F8EEE2;
  text-align: center;
  padding: 75px 20px 15px;
  border-radius: 10px;
}
.detail4-section-label {
  position: relative;
}
.detail4-section-label>span {
  position: absolute;
  display: block;
  top: -130px;
  left: 0;
  width: 100%;
  text-align: center;
}
.detail4-section-title {
  position: relative;
  font-size: 2.6rem;
  color: #6A430A;
  padding-bottom: 20px;
  margin-bottom: 30px;
}
.detail4-section-title::after {
  content: "";
  position: absolute;
  display: block;
  width: 36px;
  height: 3px;
  bottom: 0;
  left: 50%;
  margin-left: -18px;
  background: #fff;
}
.detail4-section-message1 {
  font-size: 1.6rem;
  margin-bottom: 30px;
  line-height: 2;
}
.detail4-section-message2 {
  font-size: 1.6rem;
  margin-bottom: 30px;
  line-height: 2;
}
.detail4-contents-button {
  text-align: center;
  padding: 0 20px;
}
@media screen and (max-width:1024px) {
  .detail4-section {
    margin: 70px auto 74px;
    padding: 0 20px;
  }
  .detail4-contents-button {
    width: 100%;
}
}
@media screen and (max-width:768px) {
  .detail4-section-title {
    position: relative;
    font-size: 2rem;
  }
  .unique .menu-detail-inner .button-box .button {
    margin: 0 auto 20px;
  }
  .detail4-section {
    margin: 24px auto 40px;
    padding: 0 20px;
  }
  .detail4-section-message1,
  .detail4-section-message2 {
    font-size: 1.4rem;
    margin-bottom: 15px;
    line-height: 2;
    text-align: left;
  }
  .detail4-section-block {
    padding: 50px 0 15px;
  }
}
/*ホットドッグ*/
.detail5-contents-block1 {
  padding-top: 138px;
}
.detail5-contents-image {
  width: 521px;
}
.detail5-contents-block1 .detail5-contents-image {
  margin: 35px 20px 20px -25px;
  padding-left: 25px;
}
.detail5-contents-block2 .detail5-contents-box2pc {
  margin-left: auto;
  position: relative;
  z-index: 1;
}
.detail5-contents-block2 .detail5-contents-image {
  margin: 35px -20px 20px 0;
  padding-left: 25px;
}
.detail5-contents-block2 .detail5-contents-box1 {
  text-align: left;
}
.detail5-contents-block2 .detail5-contents-square {
  background: #fff;
  margin: 171px 0 0 -296px;
  min-height: 292px;
  padding: 10% 10% 10% 345px;
  width: 817px;
}
@media screen and (min-width: 1025px) {
  .detail5-contents-block1 .detail5-contents-text {
    padding-right: 89px;
  }
  .detail5-contents-block {
    align-items: center;
  }
}
@media screen and (max-width: 1024px) and (min-width:769px) {
  .detail5-contents-block2 .detail5-contents-square {
    margin-top: 70px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width:768px) {
  .detail5-contents-image {
    width: auto;
  }
  .detail5-contents-block1 {
    padding-top: 29.6px;
  }
  .detail5-contents-block1 .detail5-contents-image {
    margin: 10px -20px 0 0;
    padding-left: 0;
  }
  .detail5-contents-block2 .detail5-contents-square {
    margin: 8px 0 0 0;
    min-height: 0;
    padding: 30px 20px 148px 20px;
    width: auto;
  }
  .detail5-contents-block2 .detail5-contents-image {
    margin: -75px 0 0 -20px;
    padding-left: 0;
  }
}
/*ライスバーガー*/
.detail6-contents-image {
  width: 496px;
}
@media screen and (min-width: 1025px) {
  .detail6-contents-text .detail-contents-caption {
    font-size: 2.5rem;
  }
  .detail6-contents-block3 .detail6-contents-square {
    margin-top: 153px;
  }
}
@media screen and (max-width:768px) {
  .detail6-contents-image {
    width: auto;
  }
  .detail6-contents-block2 .detail6-contents-image {
    right: -20px;
  }
  .detail6-contents-block3 .detail6-contents-square {
    padding-bottom: 30px;
  }
}

/*モス野菜バーガー*/
.detail7-contents-block1 {
  padding-top: 138px;
}
.detail7-contents-image {
  width: 521px;
}
.detail7-contents-block1 .detail7-contents-image {
  margin: 10px 20px 20px -26px;
  padding-left: 25px;
}
.detail7-contents-block2 .detail7-contents-box2pc {
  margin-left: auto;
  position: relative;
  z-index: 1;
}
.detail7-contents-block2 .detail7-contents-image {
  margin: 35px 14px 20px 0;
}
.detail7-contents-block2 .detail7-contents-box1 {
  text-align: left;
}
.detail7-contents-block2 .detail7-contents-square {
  background: #fff;
  margin: 85px 0 0 -320px;
  min-height: 292px;
  padding: 10% 10% 10% 345px;
  width: 817px;
}
.detail7-contents-gaburi-button {
  margin-top: 71px;
  padding: 0 20px;
  text-align: center;
}
.detail7-contents-gaburi-text-sub {
  margin: 0 auto 41px;
  max-width: 425px;
}
@media screen and (min-width: 1025px) {
  .detail7-contents-block1 .detail7-contents-text {
    padding-right: 89px;
  }
  .detail7-contents-block {
    align-items: center;
  }
}
@media screen and (max-width: 1024px) and (min-width:769px) {
  .detail7-contents-block2 .detail7-contents-square {
    margin-top: 70px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width:768px) {
  .detail7-contents-image {
    width: auto;
  }
  .detail7-contents-block1 {
    padding-top: 29.6px;
  }
  .detail7-contents-block1 .detail7-contents-image {
    margin: 10px -20px 0 0;
    padding-left: 0;
  }
  .detail7-contents-block2 .detail7-contents-square {
    margin: 30px 0 0 0;
    min-height: 0;
    padding: 30px 20px 98px 20px;
    width: auto;
  }
  .detail7-contents-block2 .detail7-contents-image {
    margin: -75px 0 0 -20px;
    padding-left: 0;
  }
  .detail7-contents-gaburi-button {
    margin-top: 40px;
  }
  .detail7-contents-gaburi-text-sub {
    margin: 0 auto 26px;
    max-width: 100%;
  }
}
  /*ロースカツバーガー*/
.detail8-contents-block1 {
  padding-top: 138px;
}
.detail8-contents-image {
  width: 521px;
}
.detail8-contents-block1 .detail8-contents-image {
  margin: 10px 20px 20px -26px;
  padding-left: 25px;
}
.detail8-contents-block2 .detail8-contents-box2pc {
  margin-left: auto;
  position: relative;
  z-index: 1;
}
.detail8-contents-block2 .detail8-contents-image {
  margin: 35px 14px 20px 0;
}
.detail8-contents-block2 .detail8-contents-box1 {
  text-align: left;
}
.detail8-contents-block2 .detail8-contents-square {
  margin: 0 0 0 -320px;
  min-height: 292px;
  padding: 10% 10% 10% 345px;
  width: 817px;
}
.detail8-contents-gaburi-button {
  margin-top: 71px;
  padding: 0 20px;
  text-align: center;
}
.detail8-contents-gaburi-text-sub {
  margin: 0 auto 25px;
  max-width: 425px;
}
@media screen and (min-width: 1025px) {
  .detail8-contents-block1 .detail8-contents-text {
    padding-right: 89px;
  }
  .detail8-contents-block {
    align-items: center;
  }
}
@media screen and (max-width: 1024px) and (min-width:769px) {
  .detail8-contents-block2 .detail8-contents-square {
    margin-top: 70px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width:768px) {
  .detail8-contents-image {
    width: auto;
  }
  .detail8-contents-block1 {
    padding-top: 29.6px;
  }
  .detail8-contents-block1 .detail8-contents-image {
    margin: 10px -20px 0 0;
    padding-left: 0;
  }
  .detail8-contents-block2 .detail8-contents-square {
    margin: 30px 0 0 0;
    min-height: 0;
    padding: 30px 20px 98px 20px;
    width: auto;
  }
  .detail8-contents-block2 .detail8-contents-image {
    margin: -75px 0 0 -20px;
    padding-left: 0;
  }
  .detail8-contents-gaburi-button {
    margin-top: 40px;
  }
  .detail8-contents-gaburi-text-sub {
    margin: 0 auto 26px;
    max-width: 100%;
  }
}
/*テリヤキチキンバーガー*/
.detail9-contents-block1 {
  padding-top: 138px;
}
.detail9-contents-image {
  width: 521px;
}
.detail9-contents-block1 .detail9-contents-image {
  margin: 10px 20px 20px -26px;
  padding-left: 25px;
}
.detail9-contents-block2 .detail9-contents-box2pc {
  margin-left: auto;
  position: relative;
  z-index: 1;
}
.detail9-contents-block2 .detail9-contents-image {
  margin: 35px 14px 20px 0;
}
.detail9-contents-block2 .detail9-contents-box1 {
  text-align: left;
}
.detail9-contents-block2 .detail9-contents-square {
  margin: 0 0 0 -320px;
  min-height: 292px;
  padding: 10% 10% 10% 345px;
  width: 817px;
}
.detail9-contents-gaburi-button {
  margin-top: 71px;
  padding: 0 20px;
  text-align: center;
}
.detail9-contents-gaburi-text-sub {
  margin: 0 auto 25px;
  max-width: 425px;
}
@media screen and (min-width: 1025px) {
  .detail9-contents-block1 .detail9-contents-text {
    padding-right: 89px;
  }
  .detail9-contents-block {
    align-items: center;
  }
}
@media screen and (max-width: 1024px) and (min-width:769px) {
  .detail9-contents-block2 .detail9-contents-square {
    margin-top: 70px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width:768px) {
  .detail9-contents-image {
    width: auto;
  }
  .detail9-contents-block1 {
    padding-top: 29.6px;
  }
  .detail9-contents-block1 .detail9-contents-image {
    margin: 10px -20px 0 0;
    padding-left: 0;
  }
  .detail9-contents-block2 .detail9-contents-square {
    margin: 30px 0 0 0;
    min-height: 0;
    padding: 30px 20px 98px 20px;
    width: auto;
  }
  .detail9-contents-block2 .detail9-contents-image {
    margin: -75px 0 0 -20px;
    padding-left: 0;
  }
  .detail9-contents-gaburi-button {
    margin-top: 40px;
  }
  .detail9-contents-gaburi-text-sub {
    margin: 0 auto 26px;
    max-width: 100%;
  }
}
  /*昼割セット番号*/
  .heijituwari_number{
    display: inline-block;
    padding: 0 9px;
    margin: 0 5px;
    color: #ffff;
    border: none;
    border-radius: 5px;
    background: #e60004;
  }