/*hover一括ーーーーーーーーーーーーーーーーーーーーーーーーー*/
.top-view-L a img,.top-news .news-list .news-link a,.top-news .news-archive,.top-gift a,.top-banner-area a,.top-mMart-area a{
-webkit-transition: .3s ease-in-out;
   transition: .3s ease-in-out;
   cursor: pointer;
}
.top-view-L a img:hover,.top-gift a:hover,.top-banner-area a:hover,.top-mMart-area a:hover{
  opacity: 0.6;
}
.top-news .news-list .news-link a:hover,.top-news .news-archive:hover{
  opacity: 0.5;
}

#toppage{
  background: url(../../images/top/top-foot_bg.png)no-repeat;
  background-position: bottom left;
  overflow: hidden;
}
@media screen and (max-width: 896px) {
  #toppage{
    width: 100vw;
    overflow-x: hidden;
    background: url(../../images/top/top-foot_bg.png)no-repeat;
    background-position: bottom left;
    background-size: 442px 273px;
  }
}
/*2分割エリアーーーーーーーーーーーーーーーーーーーーーーーーー*/
.top-view{
  width: 100vw;
  overflow-x: hidden;
  position: relative;
}
.top-view .top-view-L{
  width:calc(5% + 495px);
  margin-left: 5%;
  padding-right: 20px;
}
.top-view-L-inner{
  width:495px;
  height: auto;
  margin-right: 0;
}
.top-view-L-logo{
  text-align: center;
  margin-left: 30px;
}
.top-view-L-logo p{
  font-size: 1.85rem;
  margin-top: 50px;
  margin-bottom: 20px;
}
.top-view-L-logo h2 img{
  width:240px;
  height: 60px;
}
.top-view .top-view-R{
  min-width:calc(100vw - 5% + 495px);
  height: auto;
  background: url(../../images/top/top-view-R_bg.jpg)no-repeat;
  background-position: left;
}
.top-view-R .top-view-catch {
  -ms-writing-mode: tb-rl;
   writing-mode: vertical-rl;
   line-height: 6.2rem;
   color:#fff;
   font-size: 4.8rem;
   background:url(../../images/top/top-view-catch_bg.png)no-repeat rgba(0,0,0,0.7);
   background-size: 151px 697px;
   background-position: bottom center;
   padding: 100px 25px 70px 25px;
   position: absolute;
   right:100px;
   z-index: 20;
   top:0;
   font-weight: bold;
}
.top-floor-link {
  margin-top: 40px;
  background: url(../../images/top/top-floor-bg.png)no-repeat;
  background-position: -20px 50%;
  position: relative;
  height: 414px;
  width: 100%;
  margin-bottom: 20px;
}
.top-floor-link ul{
  width:200px;
  padding-bottom: 55px;
  /*福袋バナー設置時padding-bottom: 5px;*/
  padding-top: 0;
  position: absolute;
  right: 0;
  top:0;
}
.top-floor-link ul li.top-floor-link-comingSoon:hover a{
  opacity: 0.1;
}
.top-floor-link ul li.top-floor-link-comingSoon .comingSoon{
  opacity: 0;
  height: 0;
  line-height: 0;
}
.top-floor-link ul li.top-floor-link-comingSoon:hover .comingSoon{
  opacity: 1;
  font-size: 1.4rem;
  height: 2.8rem;
  line-height: 2.8rem;
  margin-top: -50px;
  text-align: center;
}
.top-floor-link ul li{
  text-align: right;
}
.top-floor-link ul li span:first-child{
  color:#6f1414;
  opacity: 0.3;
  font-size:1.8rem;
  position: inherit;
  z-index: 1;
}
.top-floor-link ul li span:nth-child(2){
  color:#6f1414;
  font-size:6.0rem;
}
.top-floor-link ul li span:nth-child(3){
  color:#6f1414;
  font-size:4.8rem;
}
.top-floor-link ul li a{
  background:#6f1414;
  display: block;
  color:#fff;
  font-size: 2.0rem;
  width:200px;
  text-align: center;
  margin-top: -9px;
  padding: 10px 0;
  position: inherit;
  z-index: 2;
  -webkit-transition: .3s ease-in-out;
     transition: .3s ease-in-out
}
.top-floor-link ul li a:hover{
  opacity: 0.6;
}
.top-floor-link ul li:nth-child(2) a{
  font-size: 3.6rem;
  letter-spacing: 1.2rem;
}
.top-floor-link ul li a span.small{
  color:#fff;
  font-size: 1.6rem;
  opacity: 1;
}
.top-floor-link ul li a span.english{
  font-size: 1.0rem;
  opacity: 0.8;
  letter-spacing: 0;
  color:#fff;
  margin-top: 5px;
  display: block;
}
.top-floor-link-delica-campaign{
  width:200px;
  height:40px;
  display:block;
  background:#333;
  margin-top:5px;
  position:absolute;
  right:0;
  bottom:30px;
}
.top-floor-link-delica-campaign a{
  display:block;
}
.top-floor-link-delica-campaign a img{
  width:100%;
  height:auto;
}
.counter-area p{
  font-size:2.4rem;
  background:#fff;
  padding: 10px 25px;
}
.counter-area p date{
  font-size:4.5rem;
  color:#fff;
  background:#b19d4e;
  padding: 2px;
  display: inline-block;
  text-align: center;
}
.counter-area p span{
  font-size:3.6rem;
}
.top-view-L-banner{
  text-align: center;
  width:100%;
}
.top-view-L-banner a img{
  margin-bottom: 20px;
}
@media screen and (max-width: 1050px) {
  .top-view .top-view-L{
    width:450px;
    margin-left: -30px;
    margin-top: -140px;
    padding-right: 20px;
    height: 1050px
  }
  .top-view-L-inner{
    -webkit-transform: scale(0.75);
      transform: scale(0.75);
  }
  .top-view .top-view-R{
    min-width:calc(100vw - 0 + 450px);
    height: 1050px;
    background: url(../../images/top/top-view-R_bg.jpg)no-repeat;
    background-position: left;
    background-size: 100%;
  }
  .top-view-R .top-view-catch {
    -ms-writing-mode: tb-rl;
     writing-mode: vertical-rl;
     line-height: 4rem;
     color:#fff;
     font-size: 3rem;
     background:url(../../images/top/top-view-catch_bg.png)no-repeat rgba(0,0,0,0.7);
     background-size: 110px 500px;
     background-position: bottom center;
     padding: 100px 15px 70px 15px;
     position: absolute;
     right:50px;
     z-index: 20;
     top:0;
     font-weight: bold;
  }
}
@media screen and (max-width: 896px) {
  .top-view .top-view-L{
    width:100%;
    margin: 0;
    padding:0 20px;
    box-sizing: border-box;
    height: auto;
  }
  .top-view-L-inner{
    -webkit-transform: scale(1);
      transform: scale(1);
    width:100%;
    height: auto;
    margin: 0;
  }
  .top-view-L .top-floor-link-SP ul{
    margin: 15px 0;
  }
  .top-floor-link-SP ul li.top-floor-link-comingSoon{
    position: relative;
  }
  .top-floor-link-SP ul li.top-floor-link-comingSoon:hover a img{
    opacity: 0.1;
  }
  .top-floor-link-SP ul li.top-floor-link-comingSoon .comingSoon{
    opacity: 0;
    height: 0;
    line-height: 0;
    position: absolute;
    top:40%;
    left:0;
    right: 0;
    margin: auto;
  }
  .top-floor-link-SP ul li.top-floor-link-comingSoon:hover .comingSoon{
    opacity: 1;
    font-size: 1.6rem;
    line-height: 2.8rem;
    text-align: center;
  }
  .top-view-L img{
    width:100%;
    height: auto;
    margin: 35px auto 15px auto;
  }
  .top-view-L .top-floor-link-SP a img{
    width:100%;
    height: auto;
    margin: 12px auto;
  }
  .top-view-L-banner a img{
  margin-bottom: 0px;
  }
  .counter-area p{
    font-size:1.8rem;
    padding: 10px;
    margin-top: 10px;
  }
  .counter-area p date{
    font-size:2.9rem;
    width:4rem;
  }
  .counter-area p span{
    font-size:2.2rem;
  }
  .top-view .top-view-R{
    width:100vw;
    height: 70vw;
    background: url(../../images/top/top-view-R_bg_SP.jpg)no-repeat;
    background-position: -40% 40%;
    background-size:80%;
  }
  .top-view-R .top-view-catch {
     line-height: 3.5rem;
     height:auto;
     font-size: 2.4rem;
     background:url(../../images/top/top-view-catch_bg.png)no-repeat rgba(0,0,0,0.7);
     background-size: 45px 300px;
     background-position:center 5px;
     padding: 40px 10px 40px 10px;
     box-sizing: border-box;
     right:30px;
     top:0;
  }
}
@media screen and (max-width: 480px) {
  .top-view .top-view-R{
    background: url(../../images/top/top-view-R_bg_SP.jpg)no-repeat;
    background-position: -20% 40%;
    background-size:60%;
  }
  .top-view-R .top-view-catch {
     line-height: 2.5rem;
     height: 70vw;
     font-size: 1.8rem;
     background:url(../../images/top/top-view-catch_bg.png)no-repeat rgba(0,0,0,0.7);
     background-size: 45px 253px;
     background-position:center 5px;
     padding: 20px 10px 10px 10px;
     box-sizing: border-box;
     right:20px;
     top:0;
  }
}
@media screen and (max-width: 340px) {
  .top-view-R .top-view-catch {
    font-size: 1.6rem;
    padding: 10px;
  }
}
/*お知らせーーーーーーーーーーーーーーーーーーーーーーーーー*/
.top-news{
  width:100%;
  background:#fff;
  box-sizing: border-box;
  padding: 30px;
  position: relative;
  margin-bottom: 100px;
}
.top-news h2{
  width:25%;
  border-right: 1px #000 solid;
  text-align: center;
  background: url(../../images/top/top-news_bg.png)no-repeat;
  background-position: center;
  background-size:15vw;
  font-size: 2.6rem;
  box-sizing:border-box;
  position: relative;
}
.top-news h2 span{
  position: absolute;
  right: 25%;
  margin: auto;
  top:5vw;
}
.top-news .news-list-area{
  width:75%;
}
.top-news .tag-wrap {
  display: flex;
  margin-bottom: 10px;
}
.top-news .tag-wrap .tag {
  font-size: 1.4rem;
  border: 1px solid #6f1414;
  padding: 2px;
  display: inline-flex;
  color: #6f1414;
  margin-left: 6px;
}
.top-news .news-list{
  line-height: 2.4rem;
  font-size: 1.6rem;
  padding-left: 35px;
  padding-top: 25px;
  padding-bottom: 10px;
}
.top-news .news-list .news-link{
  padding-bottom: 3rem;
}

.top-news .news-list .news-link a:link,
.top-news .news-list .news-link a:visited,
.top-news .news-list .news-link a:active{
  color:#000;
  text-decoration: underline;
  cursor: pointer;
}
.top-news .news-archive{
  display: block;
  font-size:1.6rem;
  width: 176px;
  border:1px solid #000;
  text-align: center;
  color: #000;
  padding: 4px;
  position: absolute;
  right: 50px;
  top:25rem;
}
.top-news .news-list .news-link data{
  width: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 1050px) {
  .top-news h2 span{
    position: absolute;
    right: 0;
    left: 0;
    top:7vw;
  }
}
@media screen and (max-width: 896px) {
  .top-news .news-list-area{
    width: 100%;
  }
  .top-news{
    margin-top: 50px;
    padding: 30px 20px 100px 20px;
  }
  .top-news h2{
    width:100%;
    height:7rem;
    border-right: none;
    text-align: center;
    background: url(../../images/top/top-news_bg.png)no-repeat;
    background-position: center;
    background-size:121px 53px;
    font-size: 2.6rem;
    padding-top: 20px;
  }
  .top-news h2 span{
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    top:0;
    bottom:0;
  }
  .top-news .news-list{
    line-height: 2.4rem;
    font-size: 1.2rem;
    padding-left: 0;
  }
  .top-news .news-list-area{
    height: auto;
  }
  .top-news .news-list .news-link{
    display: block;
  }
  .top-news .news-list .news-link data{
  display: block;
}
  .top-news .news-archive{
    display: block;
    font-size:1.6rem;
    width: 176px;
    border:1px solid #000;
    text-align: center;
    color: #000;
    padding: 4px;
    position:inherit;
    float: right;
  }
  .top-news .tag-wrap .tag {
    font-size: 10px;
  }
  .top-news .news-list .news-link data{
    width: 60px;
  }

}
/*フローチャートーーーーーーーーーーーーーーーーーーーーーーーーー*/
.top-flowChart{
  background:#6f1414;
  height: auto;
  padding: 20px 0;
  text-align: center;
  position: relative;
  display: block;
  margin-bottom: 60px;
}
.top-flowChart h2{
  margin:auto;
  position: absolute;
  top:-50px;
  left: 0;
  right: 0;
}
.top-flowChar p{
  margin: 0 auto;
  display: block;
}
.top-flowChar p img{
  max-width: 1005px;
  display: block;
}
@media screen and (max-width: 1050px) {
  .top-flowChart{
    padding: 20px;
    box-sizing: border-box;
  }
  .top-flowChart p img{
    width: 100%;
  }
}
@media screen and (max-width: 530px) {
  .top-flowChart h2{
    top:-40px;
  }
  .top-flowChart h2 img{
    width:80%;
  }
}
/*バナー・SNSエリアーーーーーーーーーーーーーーーーーーーーーーーーー*/
.top-gift{
  text-align: center;
  margin-top: 25px;
  margin-bottom: 70px;
}
.top-banner-area{
  width:750px;
  margin: 0 auto;
}
.line-banner-area{
  margin-bottom:50px;
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}
.line-banner-area div{
  width:calc(100% / 3 - 10px);
}
.line-banner-area div a{
  display: block;
}
.line-banner-area div a,.line-banner-area div a img{
  width:100%;
}
.top-banner-area a img{
  margin-bottom: 15px;
}
.top-facebook-area .fb-page{
  width:360px;
  height: 500px;
  display: block;
}
.top-mMart-area{
  text-align: center;
  margin-top: 105px;
  margin-bottom: 60px;
}
@media screen and (max-width: 1050px) {
  .top-gift a img{
    max-width: 100%;
  }
}
@media screen and (max-width: 896px) {
  .top-gift{
    margin-top: 60px;
    margin-bottom: 45px;
    padding: 0 20px;
    box-sizing: border-box;
  }
  .top-gift img{
    width:100%;
    margin: 0 auto;
  }
  .top-banner-area{
    width:100%;
    padding: 0 20px;
    box-sizing: border-box;
  }

  .top-banner-area a img{
    width:100%;
  }
  .line-banner-area{
    width:98%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:40px;
  }
  .line-banner-area div {
    width:calc(98% / 2 - 10px);
    margin-left: 5px;
    margin-right: 5px;
  }
  .line-banner-area a{
    width: 100%;
    display: block;
  }
  .line-banner-area a img{
    width: 100%;
  }
    .top-banner-2area {
      display: flex;
      justify-content: space-between;
    }
    .top-banner-2area a{
      width:calc(50% - 10px);
    }
    .top-banner-2area a img{
      width:100%;
    }
    .top-facebook-area .fb-page{
      width:100%;
      height: 500px;
      display: block;
      box-sizing: border-box;
      margin-top: 30px;
    }
    .top-facebook-area .fb-page iframe{
      width:100vw;
      height: 500px;
      display: block;
    }
    .top-mMart-area{
      text-align: center;
      margin-top: 60px;
      margin-bottom: 60px;
    }
    .top-mMart-area a{
      margin: 0 auto;
    }
    .top-mMart-area a img{
      width:234px;
      height: 60px;
    }
}
/*キャンペーンエリアーーーーーーーーーーーーーーーーーーーーーーーーー*/
.top-campaign-area {
  margin: 30px auto;
}
.top-campaign-area .img-block {
  margin: 0 auto;
  max-width: 1042px;
}
.top-campaign-area .img-block img {
  width: 100%;
}