@charset 'utf-8';

/* ----------------------------------------------------------------
    Clearfix
----------------------------------------------------------------- */
.b-list-line::before, .b-list-line::after {
  display: table;
  content: '';
}
.b-list-line::after {
  clear: both;
}

/* ----------------------------------------------------------------
    Pseudo element (Block)
----------------------------------------------------------------- */
.b-panel-benefit > .panel-hdg::before, .b-panel-benefit > .panel-hdg span::before, .b-panel-benefit > .panel-hdg span::after {
  display: block;
  content: '';
}

/* ----------------------------------------------------------------
    Pseudo element (Inline Block)
----------------------------------------------------------------- */
.b-icon-label-02._card::before, .b-icon-label-02._phone::before, .b-icon-label-02._email::before, .b-icon-label-02._sconto::before {
  display: inline-block;
  content: '';
}

/* ----------------------------------------------------------------
    Loading Spritesheet
----------------------------------------------------------------- */
.b-icon-label-02._card::before, .b-icon-label-02._phone::before, .b-icon-label-02._email::before, .b-panel-benefit > .panel-hdg::before {
  background-image: url(/ist_tokuten/images/sprite.png);
}

/* ----------------------------------------------------------------
    Headings
----------------------------------------------------------------- */
/* .b-hdg-l1
----------------------------------------------- */
.b-hdg-l1 {
  margin: 0 0 45px;
}
.b-hdg-l1 .hdg-item {
  margin: 0 0 5px;
  color: #032545;
  font-weight: normal;
}
.b-hdg-l1 .hdg-item-main {
  display: inline-block;
  margin: 0 4px 0 0;
  font-size: 4.5rem;
  line-height: 1.2;
}
.b-hdg-l1 .hdg-item-sub {
  display: inline-block;
  font-size: 2.4rem;
}
.b-hdg-l1 > :last-child {
  margin-bottom: 0;
}
@media only screen and (max-width: 640px) {
  .b-hdg-l1 {
    margin: 0 0 12px;
  }
  .b-hdg-l1 .hdg-item-main {
    font-size: 2.4rem;
  }
  .b-hdg-l1 .hdg-item-sub {
    font-size: 1.8rem;
  }
}

/* ----------------------------------------------------------------
    Texts
----------------------------------------------------------------- */
/* .b-txt-catch
----------------------------------------------- */
.b-txt-catch {
  margin: 0 0 6px;
  font-size: 2.2rem;
  line-height: 1.18182;
}
@media only screen and (max-width: 640px) {
  .b-txt-catch {
    font-size: 1.4rem;
    line-height: 1.28571;
  }
}

/* .b-txt-lead
----------------------------------------------- */
.b-txt-lead {
  font-size: 1.8rem;
  line-height: 1.66667;
}
@media only screen and (max-width: 640px) {
  .b-txt-lead {
    font-size: 1.3rem;
    line-height: 1.38462;
  }
}

/* ----------------------------------------------------------------
    Lists
----------------------------------------------------------------- */
/* .b-list-line
----------------------------------------------- */
.b-list-line {
  margin: -5px 0 25px -5px;
}
.b-list-line > li {
  float: left;
  margin: 5px 0 0 5px;
}
.b-panel-note .b-list-line {
  margin-left: -15px;
}
.b-panel-note .b-list-line > li {
  margin-left: 15px;
}

/* ----------------------------------------------------------------
    Icons
----------------------------------------------------------------- */
/* .b-icon-label (common)
----------------------------------------------- */
.b-icon-label, .b-icon-label-02, .b-icon-label-03, .b-icon-label-04 {
  display: inline-block;
  padding: 3px 12px 2px;
  font-size: 1.2rem;
}
.panel-hdg .b-icon-label, .panel-hdg .b-icon-label-02, .panel-hdg .b-icon-label-03, .panel-hdg .b-icon-label-04 {
  font-weight: normal;
  font-size: 1.4rem;
}
.b-hdg-l1 .b-icon-label, .b-hdg-l1 .b-icon-label-02, .b-hdg-l1 .b-icon-label-03, .b-hdg-l1 .b-icon-label-04 {
  font-size: 1.4rem;
}

/* .b-icon-label
----------------------------------------------- */
.b-icon-label {
  background: #e7e7e7;
}

/* .b-icon-label-02
----------------------------------------------- */
.b-icon-label-02 {
  background: #032545;
  color: #fff;
}
.b-icon-label-02._card {
  position: relative;
  padding-left: 44px;
}
.b-icon-label-02._card::before {
  position: absolute;
  top: 50%;
  left: 12px;
  margin: -8.5px 0 0;
  width: 25px;
  height: 16px;
  background-position: -29px 0;
  background-size: 54px auto;
}

/*240314ここから*/
.b-icon-label-02._sconto {
  position: relative;
  padding-left: 44px;
}
.b-icon-label-02._sconto::before {
  position: absolute;
  top: 50%;
  left: 12px;
  margin: -8px 0 0;
  width: 25px;
  height: 16px;
  background-position: -29px 0;
  background-size: 54px auto;
}
/*240314ここまで*/

.b-icon-label-02._phone {
  position: relative;
  padding-left: 44px;
}
.b-icon-label-02._phone::before {
  position: absolute;
  top: 50%;
  left: 12px;
  margin: -7px 0 0;
  width: 19px;
  height: 14px;
  background-position: 0 -23px;
  background-size: 54px auto;
}
.b-icon-label-02._email {
  position: relative;
  padding-left: 39px;
}
.b-icon-label-02._email::before {
  position: absolute;
  top: 50%;
  left: 12px;
  margin: -6px 0 0;
  width: 20px;
  height: 12px;
  background-position: -21px -23px;
  background-size: 54px auto;
}

/* .b-icon-label-03
----------------------------------------------- */
.b-icon-label-03 {
  background: #995e24;
  color: #fff;
}

/* .b-icon-label-04
----------------------------------------------- */
.b-icon-label-04 {
  background: #1c5b6b;
  color: #fff;
}

/* ----------------------------------------------------------------
    Panels
----------------------------------------------------------------- */
/* .b-panel
----------------------------------------------- */
.b-panel {
  margin: 0 0 25px;
  padding: 20px;
  background: #f5f5f5;
}
.b-panel > :last-child {
  margin-bottom: 0;
}
.b-panel > .panel-hdg {
  margin: 0 0 15px;
  padding: 3px 0 4px 12px;
  border-left: 3px solid #995e24;
  color: #333;
  font-size: 2.4rem;
}
@media only screen and (max-width: 640px) {
  .b-panel {
    padding: 18px;
  }
  .b-panel > .panel-hdg {
    margin: 0 0 15px;
    padding: 3px 0 4px 12px;
    border-left: 3px solid #995e24;
    color: #333;
    font-size: 1.6rem;
  }
}

/* .b-panel-note
----------------------------------------------- */
.b-panel-note {
  display: table;
  box-sizing: border-box;
  margin: 0 0 25px;
  width: 100%;
  table-layout: fixed;
}
.b-panel-note .panel-inner {
  display: table-cell;
  box-sizing: border-box;
  background: #f1f1f1;
  vertical-align: middle;
}
.b-panel-note .panel-inner + .panel-inner {
  border-left: 1px solid #fff;
}
.b-panel-note dl {
  display: table;
  box-sizing: border-box;
  margin: 0;
  padding: 17px;
}
.b-panel-note dl dt, .b-panel-note dl dd {
  display: table-cell;
  box-sizing: border-box;
  vertical-align: middle;
}
.b-panel-note dl dt > :last-child, .b-panel-note dl dd > :last-child {
  margin-bottom: 0;
}
.b-panel-note dl dt {
  padding: 0 44px 0 20px;
  white-space: nowrap;
  font-weight: bold;
}
.b-panel-note dl dd > :last-child {
  margin-bottom: 0;
}
.b-panel-note dl dd strong {
  color: #8f2b22;
  font-size: 2rem;
}
.b-panel-benefit > .b-panel-note .panel-inner {
  background: #f1eee7;
}
.b-panel-benefit > .b-panel-note .panel-inner + .panel-inner {
  border-left-color: #f9f8f6;
}
.b-panel-benefit > .b-panel-note dl dt, .b-panel-benefit > .b-panel-note dl dd {
  color: #8b6537;
}
.b-panel > .b-panel-note .panel-inner {
  border: 1px solid #d8cfba;
  background: transparent;
}
.b-panel > .b-panel-note .panel-inner + .panel-inner {
  border-left: 0;
}
.b-panel > .b-panel-note dl dt, .b-panel > .b-panel-note dl dd {
  color: #8b6537;
}
@media only screen and (max-width: 640px) {
  .b-panel-note {
    display: block;
    margin: 0 0 25px;
  }
  .b-panel-note .panel-inner {
    display: block;
  }
  .b-panel-note .panel-inner + .panel-inner {
    border-top: 1px solid #fff;
    border-left: 0;
  }
  .b-panel-note dl {
    display: block;
    padding: 17px;
  }
  .b-panel-note dl dt, .b-panel-note dl dd {
    display: block;
  }
  .b-panel-note dl dt {
    margin: 0 0 6px;
    padding: 0;
    text-align: center;
    white-space: normal;
    font-size: 1.4rem;
  }
  .b-panel-note dl dd > :last-child {
    margin-bottom: 0;
  }
  .b-panel-note dl dd strong {
    font-size: 2rem;
  }
  .b-panel-benefit > .b-panel-note .panel-inner + .panel-inner {
    border-left: 0;
  }
  .b-panel > .b-panel-note .panel-inner + .panel-inner {
    border-top: 0;
    border-left: 1px solid #d8cfba;
  }
}

/* .b-panel-benefit
----------------------------------------------- */
.b-panel-benefit {
  margin: 40px 0;
  padding: 22px 35px 40px;
  border: 8px solid #f7f7f5;
  border-radius: 8px;
  background: url(/ist_tokuten/images/bg-panel-benefit.png) repeat #fffefc;
  box-shadow: inset 0 0 0 1px #ddd3c7;
}
.b-panel-benefit > :last-child {
  margin-bottom: 0;
}
.b-panel-benefit > .panel-hdg {
  position: relative;
  overflow: hidden;
  margin: 0 0 14px;
  padding: 21px 0 0;
  color: #995e24;
  text-align: center;
  font-weight: normal;
  font-size: 3.6rem;
}
.b-panel-benefit > .panel-hdg::before {
  position: absolute;
  top: 0;
  left: 50%;
  margin: 0 0 0 -13.5px;
  width: 27px;
  height: 21px;
  background-position: 0 0;
  background-size: 54px auto;
}
.b-panel-benefit > .panel-hdg span {
  position: relative;
  display: inline-block;
  padding: 0 35px;
}
.b-panel-benefit > .panel-hdg span::before, .b-panel-benefit > .panel-hdg span::after {
  position: absolute;
  top: 50%;
  margin: -6px 0 0;
  width: 332px;
  height: 12px;
  background-color: transparent;
  background-image: linear-gradient(to top,transparent 0%, transparent 60%, #995e24 61%, #995e24 100%);
  background-size: auto 5px;
}
.b-panel-benefit > .panel-hdg span::before {
  left: 0;
  transform: rotate(180deg);
  transform-origin: left center;
}
.b-panel-benefit > .panel-hdg span::after {
  right: 0;
  transform: rotate(180deg);
  transform-origin: right center;
}
@media only screen and (max-width: 640px) {
  .b-panel-benefit {
    margin: 0 0 25px;
    padding: 12px 15px 21px;
    box-shadow: inset 0 0 0 4px #f7f7f5, inset 0 0 0 5px #ddd3c7;
  }
  .b-panel-benefit > .panel-hdg {
    margin: 0 0 6px;
    padding: 10.5px 0 0;
    font-size: 2rem;
  }
  .b-panel-benefit > .panel-hdg::before {
    margin: 0 0 0 -6.75px;
    width: 13.5px;
    height: 10.5px;
    background-position: 0 0;
    background-size: 27px auto;
  }
  .b-panel-benefit > .panel-hdg span {
    padding: 0 15px;
  }
  .b-panel-benefit > .panel-hdg span::before, .b-panel-benefit > .panel-hdg span::after {
    width: 91px;
    height: 9px;
    background-size: auto 3px;
  }
}

/* .b-panel-benefit-02
----------------------------------------------- */
.b-panel-benefit-02 {
  margin: 0 0 25px;
  padding: 20px;
  border: 1px solid rgba(184, 184, 184, .5);
  background: #fff;
}
.b-panel-benefit-02 > :last-child, .b-panel-benefit-02 > .panel-inner:last-child {
  margin-bottom: 0;
}
.b-panel-benefit-02 > .panel-inner {
  display: table;
  margin: 0 0 25px;
  width: 100%;
}
.b-panel-benefit-02 > .panel-inner > .panel-icon {
  /*display: table-cell;*/
  /*padding: 0 50px 0 20px;*/
  width: 47px;
  vertical-align: middle;
  margin: 0 20px 0 20px;
  display: block;
}
.b-panel-benefit-02 > .panel-inner > .panel-col {
  display: table-cell;
  margin: 0 0 25px;
  vertical-align: middle;
}
.b-panel-benefit-02 > .panel-inner > .panel-col > :last-child {
  margin-bottom: 0;
}
.b-panel-benefit-02 > .panel-inner > .panel-col > .panel-hdg {
  margin: 0 0 21px;
  padding: 7px 16px 5px;
  background: #032545;
  color: #fff;
  font-size: 1.6rem;
}
.b-panel-benefit-02 > .panel-inner > .panel-col .panel-txt {
  /* テキストが他の要素に含まれる可能性があるのでセレクタを直接の子要素にしない */
  color: #032545;
  font-weight: bold;
  font-size: 2rem;
}
.b-panel-benefit-02 > .panel-inner > .panel-col .panel-txt strong {
  color: #032545;
  font-size: 2.8rem;
  line-height: 1.1;
}
@media only screen and (max-width: 640px) {
  .b-panel-benefit-02 {
    margin: 0 0 16px;
    padding: 12px;
  }
  .b-panel-benefit-02 > .panel-inner {
    margin: 0 0 20px;
  }
  .b-panel-benefit-02 > .panel-inner > .panel-icon {
    /*padding: 0 15px 0 0;*/
    width: 30px;
    margin: 30px 10px 0 0px;
  }
  .b-panel-benefit-02 > .panel-inner > .panel-col {
    margin: 0 0 15px;
  }
  .b-panel-benefit-02 > .panel-inner > .panel-col .panel-txt {
    font-weight: normal;
    font-size: 1.4rem;
  }
  .b-panel-benefit-02 > .panel-inner > .panel-col .panel-txt strong {
    font-size: 1.8rem;
  }
}

/* .b-panel-usage
----------------------------------------------- */
.b-panel-usage {
  margin: 0 0 25px;
  padding: 16px 20px 20px;
  border: 5px solid #eff1f3;
  background: #eff1f3;
  box-shadow: inset 0 0 0 1px #fff;
}
.b-panel-usage > :last-child {
  margin-bottom: 0;
}
.b-panel-usage > .panel-hdg {
  margin: 0 0 25px;
  color: #032545;
  /* p 要素として使うケースがあるため太字にする */
  text-align: center;
  font-weight: bold;
  font-size: 2.2rem;
}
.b-panel-usage > .panel-hdg:last-child {
  margin-bottom: 0;
}
@media only screen and (max-width: 640px) {
  .b-panel-usage {
    margin: 0 0 10px;
    padding: 13px 15px 15px;
    border-width: 3px;
  }
  .b-panel-usage > .panel-hdg {
    margin: 0 0 9px;
    font-size: 1.6rem;
  }
}
