.p-frontLayout{
  position:relative;
  display:grid;
  grid-template-columns:280px 1fr;
  gap:10px;
  padding:10px;
}

.p-frontSidebar{
  position:sticky;
  top:90px;
  padding-left:10px;
}

.l-container--front{
  max-width:1200px;
  margin:0 auto !important;

}


.p-campaignFloat{

  display:none;

  position:fixed;

  left:calc(50% + 620px);
  bottom:30px;

  width:clamp(220px, 14vw, 300px);

  z-index:100;

  background:#fff;

  border-radius:12px;

  overflow:hidden;

  box-shadow:
    0 4px 20px rgba(0,0,0,.08);

  opacity:0;
  visibility:hidden;

  transform:translateY(80px);

  transition:
    opacity .3s,
    transform .3s,
    visibility .3s;

}

@media (min-width:1600px){

  .p-campaignFloat{
    display:block;
  }

}

.p-campaignFloat.is-show{

  opacity:1;
  visibility:visible;

  transform:translateY(0);

}

.p-campaignFloat:hover{

  transform:translateY(-6px);

}

.p-campaignFloat__line{

  padding:16px;

  border-top:1px solid #eee;

  text-align:center;

}

.p-campaignFloat__lineTitle{

  margin-bottom:8px;

  font-size:16px;
  font-weight:700;

}

.p-campaignFloat__lineText{

  margin-bottom:12px;

  font-size:13px;
  color:#666;

}

.p-campaignFloat__qr{

  width:140px;

  display:block;

  margin:0 auto 12px;

}

.p-campaignFloat__lineBtn{

  display:block;

  padding:12px;

  background:#06c755;

  color:#fff;

  border-radius:6px;

  font-weight:700;

  text-decoration:none;

}

.p-campaignFloat__body .p-searchArea{
  display:block;
  padding:5px;
  width:100%;
}

/* 検索ボックス */

.p-campaignFloat__body .p-searchBox{

  position:relative;

}

.p-campaignFloat__body .p-searchBox__input{

  width:100%;

  height:48px;

  padding:0 50px 0 16px;

  border:2px solid #4caf50;

  border-radius:999px;

  font-size:14px;

  background:#fff;

}

.p-campaignFloat__body .p-searchBox__input:focus{

  outline:none;

  border-color:#2e7d32;

  box-shadow:
    0 0 0 4px rgba(76,175,80,.15);

}

.p-campaignFloat__body .p-searchBox::after{

  content:'🔍';

  position:absolute;

  right:16px;
  top:50%;

  transform:translateY(-50%);

  font-size:18px;

  pointer-events:none;

}

.p-campaignFloat__searchLead{

  margin-bottom:5px;

  font-size:13px;

  font-weight:700;

  color:#333;

}

.p-campaignFloat__searchLead{

  display:flex;

  align-items:center;

  justify-content:center;

  gap:8px;

  margin:5px 0 2px;

  font-size:12px;

  font-weight:700;

  color:#4caf50;

  letter-spacing:.08em;

  text-transform:uppercase;

}

.p-campaignFloat__head{

  padding:14px 16px;

  background:#4caf50;

  color:#fff;

  font-size:15px;

  font-weight:700;

  letter-spacing:.05em;

  text-align:center;

}

/* front-contents */

.p-frontContent{
  min-width:0;
}


.p-sideMenu{
  background:#fff;
  overflow:hidden;
  box-shadow:
    0 4px 20px rgba(0,0,0,0.06);
}

.p-sideMenu__head{
  padding:18px 20px;

  font-size:18px;
  font-weight:700;

  color:#fff;
  background:#66bb6a;
}

.p-sideMenu__body{
  padding:10px 0;
}

.p-sideMenu__item{
  display:flex;
  align-items:center;

  min-height:56px;

  padding:0 20px;

  border-bottom:
    1px solid #eee;

  font-size:14px;
  font-weight:500;

  transition:.2s;
}

.p-sideMenu__item:last-child{
  border-bottom:none;
}

.p-sideMenu__item:hover{
  background:#f5f5f5;
  padding-left:26px;
}

.p-popular .p-card{
  max-width:320px;
  margin:0 auto;
}

.p-sideMenu__item::before{
  content:'';

  display:block;

  width:20px;
  height:20px;

  margin-right:10px;

  background-position:center;
  background-repeat:no-repeat;
  background-size:contain;

  flex-shrink:0;
}

.p-sideMenu__item--ranking::before{
  background-image:url('../img/icon/icon-ranking.png');
}

.p-sideMenu__item--campaign::before{
  background-image:url('../img/icon/icon-campaign.png');
}

.p-sideMenu__item--maker::before{
  background-image:url('../img/icon/icon-maker.png');
}

.p-sideMenu__item--price::before{
  background-image:url('../img/icon/icon-price.png');
}

.p-sideMenu__item--material::before{
  background-image:url('../img/icon/icon-material.png');
}

.p-sideMenu__item--accessories::before{
  background-image:url('../img/icon/icon-accessories.png');
}

.p-sideMenu__item--feature::before{
  background-image:url('../img/icon/icon-feature.png');
}

.p-sideMenu__item--works::before{
  background-image:url('../img/icon/icon-works.png');
}

.p-sideMenu__item--voice::before{
  background-image:url('../img/icon/icon-voice.png');
}

.p-sideMenu__item--column::before{
  background-image:url('../img/icon/icon-column.png');
}

.p-sideMenu__item--area::before{
  background-image:url('../img/icon/icon-area.png');
}

.p-sideMenu__item--warranty::before{
  background-image:url('../img/icon/icon-warranty.png');
}

.p-sideMenu__item--search::before{
  background-image:url('../img/icon/icon-search.png');
}

.p-sideMenu__item--check::before{
  background-image:url('../img/icon/icon-check.png');
}

.p-sideMenu__item--payment::before{
  background-image:url('../img/icon/icon-payment.png');
}