@charset "UTF-8";
/* SpCommonReset
**************************** */
/* h1 and h2 */
#main h1 img,#main div[id^="h2_0"] img{
zoom:1;
display:block;
max-width:750px;
width:100%;
height:auto;
margin:auto;
}
h2 {
padding: 0;
background-color: transparent;
}
.results.goodsList.data-matrix {
margin-top: 1em;
}
.pcOnly{
display: none;
}
.pc-content {
display: none;
}
#h2_001{
margin-top: 12%;
margin-bottom: 6%;
}
.block-separat{
display: none;
}
/* wrap */
.osechiWrap {
max-width:750px;
width:100%;
margin:0 auto;
-webkit-text-size-adjust:100%;
background: #ffffff;
margin-bottom: calc(40 / 750 * 100%);
}
.osechiWrap img {
vertical-align: top;
width: 100%;
height: auto;
zoom: 1 !important;
}
/* .osechiWrap h2 {
margin-top: 12%;
margin-bottom: 6%;
} */

/* reservationPeriodBlock */
.reservationPeriodBlock{
padding: calc(30 / 750 * 100%);
background: url(/contents/0018/img/event/osechi/osechi_sp_bg_001_260728.png) no-repeat;
}
.reservationPeriodBlock .reservationPeriodBtn{
width: calc(500 / 750 * 100%);
margin: calc(30 / 750 * 100%) auto 0;
}
/* osechiItemBlock */
.osechiItemBlock{
padding: calc(20 / 750 * 100%) calc(30 / 750 * 100%) calc(60 / 750 * 100%);
background: url(/contents/0018/img/event/osechi/osechi_sp_bg_002_260728.jpg) no-repeat;
}
.osechiItemBlock .osechiItemInner{
margin-top: calc(20 / 750 * 100%);
background: #fff;
font-size: 14px;
}
.osechiItemBlock .osechiItemInner .col2{
display: flex;
flex-direction: column-reverse;
}
.osechiItemBlock .osechiItemInner .col2 .osechiTxt{
padding: calc(30 / 750 * 100%);
}
.osechiItemBlock .osechiItemInner .col2 .osechiNote{
padding: calc(30 / 750 * 100%);
}
.osechiItemBlock .osechiItemInner .col2 .osechiTitle{
font-size: 18px;
}
.osechiItemBlock .osechiItemInner .col2 .osechiTitle span{
font-size: 14px;
}
.osechiItemBlock .osechiItemInner .col2 .price{
margin: 10px 0;
font-size: 20px;
line-height: 1;
color: #000;
}
.osechiItemBlock .osechiItemInner .col2 .price img{
width: calc(147 / 690 * 100%);
}
.osechiItemBlock .osechiItemInner .col2.item4{
flex-direction: column;
}
.osechiItemBlock .osechiItemInner .col2.item2{
flex-direction: column;
}
.osechiItemBlock .osechiItemInner .purchaseBonus{
padding: calc(30 / 750 * 100%);
}
.osechiItemBlock .osechiItemInner .osechiNote{
padding: calc(30 / 750 * 100%);
}
.osechiItemBlock .osechiItemInner .noteTxt{
padding: 0 calc(30 / 750 * 100%) calc(60 / 750 * 100%);
}
/* campaignBlock */
.campaignBlock{
padding-bottom: calc(30 / 750 * 100%);
background: url(/contents/0018/img/event/osechi/osechi_sp_bg_003_260728.png) no-repeat;
}
.campaignBlock h2{
padding: calc(60 / 750 * 100%) calc(30 / 750 * 100%) 0;
}
.campaignBlock .doubleMiles{
padding: calc(40 / 750 * 100%) calc(30 / 750 * 100%) 0;
}
.campaignBlock .selectTtl{
width: calc(450 / 750 * 100%);
margin: auto;
}
.campaignBlock .choosebonus .chopsticks{
margin: calc(40 / 750 * 100%) calc(30 / 750 * 100%);
padding-bottom: calc(34 / 750 * 100%);
background: url(/contents/0018/img/event/osechi/osechi_sp_bg_005_260728.png) no-repeat;
background-size: contain;
}
.campaignBlock .choosebonus .chopsticks .chopsticksTtl{
padding: calc(30 / 750 * 100%) calc(20 / 750 * 100%);
}
.campaignBlock .choosebonus .chopsticks .chopsticksPeriod{
padding: 0 calc(60 / 750 * 100%);
}
.campaignBlock .choosebonus .chopsticks .chopsticksTxt{
padding: calc(35 / 750 * 100%);
}
.campaignBlock .choosebonus .chopsticks .chopsticksBtn{
margin: calc(40 / 750 * 100%) auto;
width: calc(620 / 750 * 100%);
}
.campaignBlock .choosebonus .coupon{
margin: calc(40 / 750 * 100%) calc(30 / 750 * 100%) 0;
padding: calc(30 / 750 * 100%) calc(40 / 750 * 100%) calc(40 / 750 * 100%);
background: url(/contents/0018/img/event/osechi/osechi_sp_bg_006_260728.png) no-repeat;
background-size: contain;
}
.campaignBlock .choosebonus .coupon .couponOff{
margin: calc(20 / 750 * 100%) 0;
}
.campaignBlock .choosebonus .coupon .couponPeriod{
margin-top: calc(40 / 750 * 100%);
}
.campaignBlock .choosebonus .coupon .couponNote{
margin-top: calc(40 / 750 * 100%);
}
.campaignBlock .choosebonus .coupon .couponBtn button{
border: none;
background-color: initial;
position: relative;
}
.campaignBlock .choosebonus .coupon .couponBtn button p{
position: absolute;
top: 8px;
right: 25%;
color: #fff;
}
.campaignBlock .campaignNote{
padding: 0 calc(60 / 750 * 100%) calc(80 / 750 * 100%);
}
/* navBlockA01 */
.navBlockA01{
margin: calc(20 / 750 * 100%) 0;
}
.navBlockA01 ul{
display: flex;
}
/* OriginalosechiCpn */
.OriginalosechiCpn{
padding: calc(40 / 750 * 100%);
background: #fff;
}
.OriginalosechiCpn .couponBtn {
margin-top: calc(20 / 750 * 100%);
}
/* Originalosechi */
.Originalosechi{
background: url(/contents/0018/img/event/osechi/osechi_sp_bg_004_260728.jpg) no-repeat;
}
/* osechiKnowledge */
/* =========================================================
   おせちの美味しい豆知識エリア (SP用レイアウト)
   ========================================================= */

.osechiKnowledge {
    background: #ececec;
    padding: calc(40 / 750 * 100%) 0 calc(60 / 750 * 100%);
}

/* 各見出しの調整 */
.osechiKnowledge h3 {
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin-top: calc(50 / 750 * 100%);
    margin-bottom: calc(30 / 750 * 100%);
    line-height: 1.4;
}

.osechiKnowledge .origin {
    width: calc(690 / 750 * 100%);
    margin: 0 auto;
    background-color: #ffffff;
}

/* 画像の下のテキストエリア */
.osechiKnowledge .knowledgeTxt {
    padding: calc(30 / 750 * 100%);
}
.osechiKnowledge .knowledgeTxt p {
    font-size: 13px;
    line-height: 1.6;
}

.osechiKnowledge .container {
    width: calc(690 / 750 * 100%);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
}

.osechiKnowledge .card {
    width: calc(335 / 690 * 100%);
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    box-shadow: none;
}

.osechiKnowledge .card-image-container {
    width: 100%;
    padding: 0;
    background-color: transparent;
    display: block;
}
.osechiKnowledge .card-image-container picture {
    display: block;
}
.osechiKnowledge .card-image-container img {
    width: 100%;
    height: auto;
    max-height: none;
    display: block;
    object-fit: cover;
}

.osechiKnowledge .card-content {
    width: 100%;
    box-sizing: border-box;
    padding: calc(25 / 750 * 100%) calc(20 / 750 * 100%);
}

.osechiKnowledge .card-title {
    font-size: 14px;
    font-weight: bold;
    color: #333;
    margin-bottom: calc(10 / 750 * 100%);
}

.osechiKnowledge .card-description {
    font-size: 12px;
    color: #333;
    line-height: 1.5;
}

.osechiKnowledge .source {
    width: calc(690 / 750 * 100%);
    margin: calc(30 / 750 * 100%) auto 0;
    font-size: 11px;
    color: #666;
    line-height: 1.4;
    word-break: break-all;
}

.recommendationTtl{
margin-top: calc(60 / 750 * 100%);
}

/* bannerList */
.col2-286_286 .bannerList {
  --gap: 20px;
  gap: var(--gap);
}

.col3-286_286 .bannerList {
  --gap: 10px;
  gap: var(--gap);
}
.bannerItem:first-child{
width: 100%;
}
.bannerItem{
width: 49%;
}
.bannerWrap {
  margin: calc(50 / 750 * 100%) auto;
}
.titleBlock-h2 {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}
.bannerList {
  margin-top: calc(20 / 750 * 100%);
  margin-inline: auto;
  width:calc(690 / 750 * 100%);
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
}
.justify-content-center .bannerList {
  justify-content: center !important;
}
.noteBox.gray {
  margin-top:  calc(30 / 750 * 100%);
  margin-inline: auto;
  padding: 0.5em 1em;
  width: calc(690 / 750 * 100%);
  background-color: #e3e5ed;
}
.noteBox.gray .noteText {
  padding-left: 1em;
  text-indent: -1em;
  font-size: 14px;
  line-height: 1.3;
  letter-spacing: 0.3px;
}
.noteBox {
  margin-top:  calc(30 / 750 * 100%);
  margin-inline: auto;
  width: calc(690 / 750 * 100%);
}
.noteBox .noteText {
  /* padding-left: 1em;
  text-indent: -1em; */
  font-size: 14px;
  line-height: 1.3;
  letter-spacing: 0.3px;
}

/* couponBlock */
.couponBlock {
  padding: calc(30 / 750 * 100%) calc(45 / 750 * 100%) calc(60 / 750 * 100%);
  margin: calc(30 / 750 * 100%) calc(30 / 750 * 100%) calc(40 / 750 * 100%);
  background: url(/contents/0018/img/event/osechi/osechi_sp_bg_007_260728.png) no-repeat;
  background-size: 100% 100%;
}
.couponBlock .couponL p{
/* width: calc(600 / 750 * 100%); */
margin: auto;
}
.couponBlock .couponL .couponbtn{
width: calc(550 / 690 * 100%);
margin: calc(20 / 750 * 100%) auto 0;
}
.couponBlock .couponR p{
margin-top: calc(40 / 750 * 100%);
}