@charset "utf-8";

/* top css */
li {
  list-style-type: none;
}
.clear {
  clear: both;
}
.top__main_pc section {
  text-align: center;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}
section {
  text-align: center;
}
h1.top-title {
  text-align: center;
  font-size: 30px;
  margin: 0 0 40px 0;
}

.block-layout--left {
  text-align: left;
  margin: 0 auto;
}

.top__regularbox-area {
  background-color: #f9f4e6;
  padding: 20px 20px 0 20px;
  text-align: center;
  font-size: 16px;
}
.top__regularbox-area.client {
  padding: 20px 20px 0 20px;
}
.top__wrapper {
  background-color: #ffffff;
  padding: 0 0 0 0;
  margin: 0 auto;
  max-width: 960px;
}
/* 定期エリア部分 */
.state_box * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.state_box {
  padding: 20px 0;
}
.state_detail {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 620px;
  margin: 10px auto 0 auto;
}
.state_detail .state-msg {
  text-align: left;
}
.state_detail img {
  width: 100px;
  height: auto;
  margin: 0 10px 0 0;
}
.state-msg a:before {
  content: "";
  background: url("/assets/img/recommend-arrow-right-on.png") no-repeat center;
  background-size: 20px 20px;
  padding: 0 10px;
  margin: 0 5px 0 0;
}
.state-msg .state-time {
  color: #ce2308;
  margin: 5px 0 0 25px;
}
.top__content-notine {
  padding: 0 0 30px 0;
}
.top__regularbox-notreturnarea {
  padding: 0 0 0 0;
}
.top__regularbox-returnarea p {
  margin: 20px 0 0 0;
}
.top__regularbox-returnarea {
  padding: 20px 0;
  background-color: #e0e0e0;
}
.top__pc_nav {
  padding: 20px 0;
  font-size: 0;
}
.top__pc_nav a {
  margin: 0 0 0 20px;
}
.top__pc_nav a:first-of-type {
  margin: 0 0 0 0;
}
.top__nativebanner-wrap {
  padding: 20px 20px 0 20px;
  margin: 0 auto;
  max-width: 960px;
  /*text-align: center;*/
}
.carousel-buy {
  max-width: 680px;
  width: 100%;
  margin: 0 auto 80px;
}
.top__thisrecommend-list li {
  margin: 0 0 0 25px;
}
.top__thisrecommend-list li:first-child {
  margin: 0;
}
.top__thisrecommend-list a img {
  width: 120px;
}
.top__thisrecommend-itemmiddle {
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  max-width: 555px;
  width: 100%;
}
.top__thisrecommend-itemmiddle li {
  margin: 0 0 20px 0;
}
.top__thisrecommend-itemmiddle li:nth-child(odd) {
  margin: 0 25px 20px 0;
}

.top__thisrecommend-list {
  margin: 0 0 20px 0;
  padding: 0;
  display: flex;
  justify-content: center;
}
.top__thisrecommend-itemmiddleunit a img {
  width: 264px;
}
.top__other-bnr {
  background-color: #075131;
  margin: 0;
  padding: 0;
  text-align: center;
}
.top__other-list {
  display: inline-block;
  margin: 0 0 0 23px;
  padding: 15px 0 20px 0;
}
.top__other-list.second {
  margin: 0 0 0 60px;
}
.top__other-list p {
  color: #fff;
}
.top__other-list img {
  width: 160px;
}
.top__other-notice {
  padding: 60px 20px;
  background-color: #e0e0e0;
}
body#top .top__other-service,
body#top .top__infomation {
  padding: 0;
}
.top__service-listarea {
  background-color: #fff;
  padding: 40px 0 30px 0;
  margin: 20px auto 60px auto;
  overflow: hidden;
  max-width: 960px;
  width: 100%;
}
.top__service-list {
  display: inline-block;
}
.top__service-list.second {
  margin: 0 0 0 80px;
}
.top__service-info {
  float: left;
  text-align: left;
  margin: 0 0 0 20px;
}
.top__service-img {
  width: 185px;
  float: left;
}
section.top__infomation table {
  text-align: left;
  width: auto;
  margin: 0 50px;
}
.top__infomation-link {
  text-align: right;
  width: auto;
  margin: 20px 50px 0 0;
}
.top__contents-ttl {
  font-size: 30px;
}
body#top .news-info {
  padding: 40px 0;
  margin: 20px auto 0 auto;
  background-color: #fff;
  max-width: 960px;
  width: 100%;
}
body.page-top .top-contents {
  padding: 20px 33px 0 33px;
  background-color: #F5F0EC;
  max-width: 100vw;
  text-align: center;
  margin: 0;
}
body.page-top #applpo {
  width: 100%;
  max-width: 960px;
  margin: 0 auto 0 auto !important;
}
body#top .top-item-group {
  max-width: 100vw;
  margin: 0 auto !important;
  padding: 0;
  display: flex;
  justify-content: center;
  background: #f9f4e6;
  text-align: center;
}
body.page-top #content {
  padding: 123px 0 0;
}
body.page-top .top__otherarea {
  margin: 0 0 -5px 0;
}
body.page-top .top-item-group .item-unit.span-2 {
  max-width: 480px;
}
body.page-top .top__newcustomer-wrap {
  padding: 20px 10px 0 10px;
}
.benefits {
  padding: 30px 0 0 0;
  background: #e0e0e0;
}
.benefits p {
  line-height: 1em;
  font-size: 35px;
  margin: 0 0 20px 0;
}
.benefits__img {
  display: flex;
  padding: 0 0 40px 0;
  justify-content: center;
}
.benefits__img .img_box:first-child {
  margin: 0 20px 0 0;
}
.img_box p {
  font-size: 20px;
  margin: 0;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  text-align: center;
}
.benefits__img .img_box {
  position: relative;
}
.use_point p:first-child,
.free_postage p:first-child {
  top: 105px;
}
.use_point p:nth-child(2),
.free_postage p:nth-child(2) {
  top: 135px;
}
.info_banner {
  display: inline-block;
  padding: 0 0 20px 0;
  max-width: 620px;
  margin: 0 auto;
}

/* 商品カテゴリ一覧ボタン */
.top__categorybtn {
  text-align: center;
  padding: 40px 0;
  clear: both;
}

/* 売り場下バナーエリア（こちらもおすすめ） */
.top__bnr_uriba-bottom {
  padding-bottom: 60px;
}
.top__bnr_uriba-bottom .top-title {
  margin-bottom: 10px;
}
.top__bnr_uriba-bottom-list {
  margin: 0 0 20px 0;
  padding: 0;
  display: flex;
  justify-content: center;
}
.top__bnr_uriba-bottom-list li {
  margin: 0 0 0 25px;
}
.top__bnr_uriba-bottom-list li:first-child {
  margin: 0;
}
.top__bnr_uriba-bottom-list a img {
  width: 120px;
}
.top__bnr_uriba-bottom-itemmiddle {
  width: 100%;
  max-width: 555px;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0 auto;
}
.top__bnr_uriba-bottom-itemmiddle li {
  margin: 0 0 20px 0;
}
.top__bnr_uriba-bottom-itemmiddle li:nth-child(odd) {
  margin: 0 25px 20px 0;
}
.top__bnr_uriba-bottom-itemmiddleunit a img {
  width: 264px;
}

/* 読み物下バナーエリア */
.top__bnr_yomimono-bottom {
  padding-bottom: 40px;
}
.top__bnr_yomimono-bottom-list {
  margin: 0 0 20px 0;
  padding: 0;
  display: flex;
  justify-content: center;
}
.top__bnr_yomimono-bottom-list li {
  margin: 0 0 0 25px;
}
.top__bnr_yomimono-bottom-list li:first-child {
  margin: 0;
}
.top__bnr_yomimono-bottom-list a img {
  width: 120px;
}
.top__bnr_yomimono-bottom-itemmiddle {
  width: 100%;
  max-width: 555px;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0 auto;
}
.top__bnr_yomimono-bottom-itemmiddle li {
  margin: 0 0 20px 0;
}
.top__bnr_yomimono-bottom-itemmiddle li:nth-child(odd) {
  margin: 0 25px 20px 0;
}
.top__bnr_yomimono-bottom-itemmiddleunit a img {
  width: 264px;
}
.top__bnr_yomimono-bottom-itemmiddle li.itemlarge {
  margin: 0;
}
.top__bnr_yomimono-bottom-itemmiddle li.itemlarge img {
  width: 100%;
}

/* お知らせ・大地を守る会のサービス */
.top__other-notice {
  background-color: #e0e0e0;
  padding: 10px 20px;
}
body#top .top__infomation,
body#top .top__other-service {
  padding: 0;
  margin-top: 40px;
}

/* お知らせ */
section.top__infomation table {
  text-align: left;
  width: auto;
  margin: 0 50px;
}
.top__infomation-listarea {
  width: 100%;
  max-width: 960px;
  background-color: #fff;
  padding: 40px 0;
  margin: 20px auto 0 auto;
}
.top__infomation-link {
  width: auto;
  text-align: right;
  margin: 20px 50px 0 0;
}

/* 大地を守る会のサービス */
.top__other-service-listarea {
  background-color: #fff;
  padding: 40px 0 30px 0;
  margin: 20px auto 60px auto;
  overflow: hidden;
  max-width: 960px;
  width: 100%;
}
.top__other-service-list {
  display: inline-block;
}
.top__other-service-list.second {
  margin: 0 0 0 80px;
}
.top__other-service-info {
  float: left;
  text-align: left;
  margin: 0 0 0 20px;
}
.top__other-service-img {
  width: 185px;
  float: left;
}

/* タブレット対応 */
@media screen and (min-width: 768px) and (max-width: 1000px) {
  .top__service-list {
    display: block;
    overflow: hidden;
    width: 60%;
    margin: 0 auto;
  }
  .top__service-list.second {
    margin: 30px auto 0;
  }
  body.page-top .top-contents {
    padding: 0 20px;
  }
}