@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600&display=swap');

.mincho {
  font-family: 'Noto Serif JP', serif;
  font-feature-settings: normal !important;
  letter-spacing: 0;
}

.fw-500 {
  font-weight: 500;
}

h2.h1 {
  font-size: 2.318em;
  line-height: 1.25;
  margin: 0 0 0.5em;
}

small, .small {
  font-size: .682em;
}

.ttlBox {
  margin-bottom: 1.5em;
}
.ttlBox span {
  display: block;
}

.img_ttl {
  margin: .4em 0 .5em;
}

.block-container-section {
    padding: 0!important;
}

#magazine {
  font-feature-settings: "palt";
  color: #222;
}


.inBlock_S {
  max-width: 32.681818em;
}
@media (max-width: 960px){
  .sp-full {
    width: auto;
    max-width: inherit;
    margin-right: -5.5vw !important;
    margin-left: -5.5vw !important;
    border-radius: 0 !important;
  }
}
@media (max-width: 768px){
  .sp-full {
    width: 100vw;
  }
}
@media (max-width: 768px){
  .sp-px-0 {
    max-width: 100%;
    padding-right: 0;
    padding-left: 0;
  }
}

.mb {
  margin-bottom: 1.5em;
}

.copy {
  letter-spacing: .08em;
}


.bg-blue {
  background: #D7E6FF;
  padding: 1.25em;
}
.bg-yellow {
  background: #FAF5DC;
  padding: 1.25em;
}
.bg-beige {
  background: #F5DCC8;
  padding: 1.25em;
}
.bg-grad {
  background: #DCF0FF;
  background: linear-gradient(180deg, #FFF 0%, #DCF0FF 50%, #ECE7FD 100%);
  padding: 1.25em;
}

.bg-white {
  background: #FFF;
  padding: 1.25em;
}

[class^="bg-"] .bg-white {
  padding: 1em;
}


.txt-gold {
  color: #CCAC73;
}
.txt-blue {
  color: #0087CA;
}
.txt-orive {
  color: #AA952F;
}


.bg-grad > div >  * {
  margin-bottom: 1.25rem;
}
.bg-grad span {
  position: relative;
}
.bg-grad span sup {
  position: absolute;
  right: 0;
  font-size: .4em;
}

/* --------------------
   Header
-------------------- */
.articleHeader {
    margin-bottom: 0;
}
/* --------------------
   .limited
-------------------- */
.limited {
  overflow: hidden;
}

/* --------------------
   .arrow
-------------------- */
.arrow {
  width: .5em;
  margin: 1em auto;
}
.arrow svg {
  vertical-align: bottom;
}

/* --------------------
   .toc
-------------------- */
.toc {
  display: flex;
  padding: 0 2%;
}
.toc li {
  flex-basis: 100%;
  padding: 2em 1% 0;
}
.toc li a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: rgb(245,221,172);
  background: linear-gradient(180deg, rgba(245,221,172,1) 40%, rgba(206,181,133,1) 100%);
  padding: 1.5em 0 1.25em;
  line-height: 1.25;
  position: relative;
}
.toc li a > * {
  display: block;
}
.toc li a > .img_ttl {
  width: 37.5%;
  position: absolute;
  bottom: 87.5%;
}
.toc li a > em {
  font-size: .864em;
}
.toc li a > span {
  font-size: 1.455em;
}
.toc li a > .toc_img {
  width: 47.5%;
  margin: .25em auto;
}
.toc li a i {
  width: 1.25em;
  height: 1em;
  background: url(../img/toc_arrow.png) no-repeat center center / contain;
  position: absolute;
  bottom: .5em;
}

/* --------------------
   cont-intro
-------------------- */
.cont-header {
  padding: 3em 0 0;
  background: #DCF0FF;
  background: linear-gradient(180deg, #FFF 0%, #DCF0FF 100%);
}
.cont-intro {
  background: #DCF0FF;
  background: linear-gradient(180deg, #FFF 0%, #ECE7FD 50%, #F0F5FF 100%);
  text-align: center;
  overflow: hidden;
}
.cont-header + .cont-intro {
  background: #DCF0FF;
  background: linear-gradient(180deg, #DCF0FF 0%, #ECE7FD 50%, #FFF 100%);
  text-align: center;
}
.cont-intro .cont-num {
  width: 4.25em;
  margin: 0 auto;
  padding: 3em 0 .5em;
}
.cont-intro .ttl {
  line-height: 1.25;
}
.cont-intro .ttl em {
  display: block;
  font-style: normal;
}
.cont-intro .ttl span {
  display: block;
}
.cont-intro .label {
  padding: 0 1.25em;
}
.cont-intro .label span {
  display: block;
  font-size: 1.5em;
  background: #FFF;
}

/* --------------------
   .ing-list
-------------------- */
.ing-list {
  display: flex;
  flex-wrap: wrap;
}
.ing-list li {
  flex: 0 0 50%;
  padding: .5em .5em 0;
  text-align: center;
  font-size: .955em;
  line-height: 1.25;
  position: relative;
}
.ing-list li:nth-child(n + 3) {
  margin-top: 1em;
}
.ing-list li img {
  margin-top: .5em;
}

@media (max-width: 769px) {
  .ing-list li {
    font-size: .875em;
  }
}

/* --------------------
   #cont4
-------------------- */
#cont4 .underline {
  display: block;
}
#cont4 .underline span {
  display: inline-block;
  margin: 0;
  border-bottom: 1.5px solid currentColor;
}

/* --------------------
   .recommend
-------------------- */
.recommend {
  padding: 1em 0;
}
.recommend-cont {
  display: flex;
  justify-content: center;
}
.recommend-cont ul {
  margin: 0;
}
.recommend-cont li {
  margin-top: .5em;
  padding: .125em 0 0 1.25em;
  position: relative;
  background: url(../img/check.png) no-repeat left .1em / .8em;
}

/* --------------------
   #voice
-------------------- */
#voice .ttl {
  margin: .25em 0 1.5em;
}
#voice .ttl .huge {
  font-size: 3em;
  line-height: 1.25;
  margin: 0 -.35em;
}
#voice dl {
  margin-bottom: 0;
  letter-spacing: 0;
}
#voice dl dt {
  font-weight: 600;
  padding: 0 0 .5em;
  margin-bottom: .75em;
  border-bottom: 1px solid currentColor;
  position: relative;
}
#voice dl dt img {
  display: block;
  width: 3em;
  position: absolute;
  right: 0;
  bottom: .5em;
}
#voice dl dt:not(:first-of-type) img {
  width: 2.5em;
}
#voice dl dd {
  font-size: .818em;
  margin-bottom: 2em;
}
#voice dl dd:last-child {
  margin-bottom: 0;
}



/* --------------------
   #bnr
-------------------- */
.bnr2 {
  background: #C7C1C1;
  padding: 2em 1.25em 1.5em;
  margin-top: 6.5em;
  position: relative;
}
.bnr2 .img_ttl {
  max-width: 108%;
  position: absolute;
  top: -5em;
  right: -4%;
  left: -4%;
}
.bnr2 .btnBox .cartBtn {
  width: 100%;
  background: rgba(207,0,100,1);
  background: linear-gradient(90deg, rgba(207,0,100,1) 0%, rgba(227,100,147,1) 50%, rgba(207,0,100,1) 100%);
}

/* --------------------
   #float-bnr
-------------------- */
#float-bnr {
  position: fixed;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 99990;
  padding: 0 83px 0 185px;
}
#float-bnr a {
  display: block;
  box-shadow: 0 7.5px 3.75px rgba(0,0,0,0.5);
}
@media(max-width: 768px){
  #float-bnr {
    padding: 0 3%;
  }

  #footer_pagetop {
    bottom: 20vw !important;
  }
}





/* --------------------
   .buyBox
-------------------- */
.buyBox {
  overflow: hidden;
}
.buyBox .imgBox_S {
  display: block;
  width: 47.5%;
  margin: 1em 6% -12.5% auto;
}
.buyBox .txtBox {
  padding: 0 1.25em;
}
.buyBox .txtBox small {
  margin-bottom: 2em;
}
.buyBox .txtBox .ttl {
  font-weight: 500;
}
.btnBox {
  text-align: center;
}
.btnBox .cartBtn {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.75em;
  font-weight: 500;
  line-height: 1;
  width: 11em;
  max-width: 100%;
  padding: .45em 0 .6em 0;
  margin: 0 auto;
  border-radius: 0;
  text-align: center;
  vertical-align: middle;
  position: relative;
  z-index: 1;
  cursor: pointer;
  transition: .2s;

  color: #FFF;
  background: rgb(140,110,50);
  background: linear-gradient(90deg, rgba(140,110,50,1) 0%, rgba(180,154,110,1) 50%, rgba(140,110,50,1) 100%);
  border-width: 6px;
  border-style: solid;
  border-color: rgba(255,255,255,.2) rgba(0,0,0,.2) rgba(0,0,0,.3) rgba(255,255,255,.3);
}
.btnBox .cartBtn:hover {
  transform: translateY(-2px);
}

.cartBtn i.cart {
  display: block;
  width: 1em;
  height: 1em;
  margin-left: .25em;
  background: url(../img/cart.png) no-repeat center center / contain;
}

