@charset "euc-jp";
/* CSS Document */
* {
  box-sizing: border-box
}
body {
  font-family: "Noto Serif JP", "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  text-size-adjust: none;
  -webkit-text-size-adjust: 100%;
}
span.megane {
  font-family: "Noto Serif JP", "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
li {
  list-style: none;
}
/* =============================================
                    PC
============================================= */
@media screen and (min-width: 769px) {
  .spOnly {
    display: none !important;
  }
  a:hover {
    cursor: pointer;
  }
  a:hover img {
    opacity: 0.7;
    transition: all 1s;
  }
}
.lp-headwrap {
  position: relative;
  margin: 0 auto 0;
  position: relative;
  max-width: 640px;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.lp-headwrap h1, .lp-headwrap p {
  margin: 20px 15px;
}
.lp-headwrap h1 {}
.lp-headwrap h1 img {
  width: 110px;
}
.lp-headwrap p {
  margin-right: 15px;
  text-align: right;
}
.lp-headwrap p img {
  width: 110px;
}
.tsubukore-wrapper {
  width: 640px;
  margin: 0 auto;
}
@media screen and (min-width: 768px) and (max-width: 950px) {
  html{
    font-size: 5.875px;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  html{
    font-size: calc(10 * 100vw/1200);
  }
}
@media screen and (max-width: 768px) {
  html{
    font-size: inherit;
  }

  .tsubukore-wrapper {
    width: 100%;
    margin: 0 auto;
  }

  .lpFooter_inquiry_note{
    font-size: 18px;
  }

  .lpFooter_nav_link{
    font-size: 14px;
  }

  .comparison td{
    font-size: 1.2rem;
  }
}
.tsubukore-wrapper a {
  text-decoration: none;
}
.tsubukore-wrapper a:hover {
  opacity: 0.7;
  transition: all 0.5s;
}
.main {
  text-align: center;
}
.tsubukore-wrapper img {
  width: 100%;
  height: auto;
}
.tsubukore-wrapper .sup {
  font-size: 70%;
  vertical-align: top;
  position: relative;
  top: -0.3em;
}
.mv {
  padding: 0 0 6%;
  background: url("../images/fv_bg.png") no-repeat;
  background-size: cover;
}
.mv .lead {}
.mv .title {
  width: 88.1%;
  margin: 6% auto 0;
}
.mv .copy {
  width: 86.1%;
  margin: 67% auto 8%;
}
/*CONCEPT*/
.concept {
  padding: 28% 0 0;
  background: url("../images/concept_top.png") no-repeat;
  background-size: contain;
}
.concept .inner {
background: url("../images/concept_bottom.png") no-repeat 0 100%;
  background-size: contain;
}
.concept h3 {
  width: 40.9%;
  margin: 0 auto 12%;
}
.concept .lead {
  width: 61.8%;
  margin: 0 auto;
}
.concept p {
  font-size: 22px;
  margin: 10% 0 0;
  text-align: center;
  line-height: 195.4%;
  color: #603b01;
  font-weight: bold;
}
.concept p.note {
  width: 90.6%;
  margin: 8% auto 0;
  padding: 5% 0 28%;
  font-size: 18px;
  line-height: 166%;
  text-align: center;
  border-top: 1px solid #603b01;
  color: #603b01;
  font-weight: normal;
}
/*SET*/
.set {
  padding: 10% 0 5%;
  background: #faf7eb;
}
.set h3 {
  width: 40.9%;
  margin: 0 auto;
}
.set .lead {
  width: 87.5%;
  margin: 10% auto 6%;
}
.set .pkg {
  width: 89%;
  margin: 0 auto 8%;
}
/*DAILY*/
.daily {
  padding: 12% 0 0;
}
.daily h3 {
  width: 72.8%;
  margin: 0 auto 5%;
}
.daily .pict {
  width: 90.6%;
  margin: 0 auto;
}
.daily .arrow {
  width: 2.2%;
  height: auto;
  margin: 5% auto;
  border-top: 30px solid #603b01;
  border-right: 20px solid transparent;
  border-left: 20px solid transparent;
}
/*ENJOY*/
.enjoy {
  padding: 10% 0 8%;
  background: url("../images/enjoy_bg.png") no-repeat;
  background-size: cover;
}
.enjoy h3 {
  width: 82.9%;
  margin: 0 auto;
}
.enjoy ul {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.enjoy ul li {
  width: 50%;
  margin: 8% 0 0;
}
/*DETAIL*/
.detail {
  padding: 12% 0 12%;
  background: #fef7eb;
}
.detail h3 {
  width: 40.9%;
  margin: 0 auto;
}
.detail .lead {
  width: 77.2%;
  margin: 8% auto 5%;
}
.detail .pict {
  width: 87.5%;
  margin: 0 auto;
}
.detail .text {
  width: 87.5%;
  margin: 4% auto 0;
}
/*EASY*/
.easy {
  padding: 12% 0 0;
  background: #f6faeb;
}
.easy h3 {
  width: 75.3%;
  margin: 0 auto 5%;
}
.easy .pict {
  width: 87.5%;
  margin: 0 auto;
}
.easy .text {
  width: 87.5%;
  margin: 4% auto 0;
}
.easy p.note {
  width: 87.5%;
  margin: 4% auto 4%;
  font-size: 18px;
  text-align: left;
  line-height: 166%;
  color: #603b01;
}
/*COMPARISON*/
.comparison {
  padding: 12% 0 0;
}
.comparison p.orange{
  color: #f5ac3c;
  font-weight: bold;
}
.comparison p.green{
  color: #a9cd36;
  font-weight: bold;
}
.comparison h3 {
  width: 34.7%;
  margin: 0 auto;
}
.comparison table {
  width: 90.6%;
  margin: 0 auto;
  font-family: "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "MS PGothic", sans-serif;
  font-size: 20px;
  line-height: 145%;
}
.comparison tr {
  border-top: 1px solid #c9caca;
}
.comparison tr:first-child {
  border: none;
}
.comparison tr:last-child {
  border-bottom: 1px solid #c9caca;
}
.comparison td {
  width: 45%;
  padding: 0.5em 1em;
  vertical-align: top;
}
.comparison td:first-child {
  width: 10%;
  background: #f7f7f8;
  white-space: nowrap;
  text-align: center;
}
.comparison tr:first-child td {
  background: none;
  vertical-align: bottom;
  text-align: center;
}
.comparison p.note {
  width: 90.6%;
  margin: 3% auto 4%;
  padding: 0 0 3%;
  font-size: 18px;
  text-align: left;
  line-height: 166%;
  border-bottom: 1px solid #c9caca;
  font-family: "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "MS PGothic", sans-serif;
}
/*INFORMATION*/
.information {
  width: 90.6%;
  margin: 0 auto;
  font-size: 22px;
  line-height: 150%;
}
.information .orange {
  color: #f5ac3c;
}
.information .green {
  color: #a9cd36;
}
.information ul {
  margin: 0 0 5%;
  padding: 0;
}
.information li {}

/* CARTIN */
.cartin {
  width: 90.6%;
  margin: 0 auto;
}
.cartin .border {
  background: rgb(193, 148, 51);
  background: linear-gradient(90deg, rgba(193, 148, 51, 1) 0%, rgba(244, 226, 167, 1) 11%, rgba(193, 148, 51, 1) 23%, rgba(234, 211, 146, 1) 35%, rgba(193, 148, 51, 1) 48%, rgba(204, 163, 62, 1) 60%, rgba(193, 148, 51, 1) 73%, rgba(244, 226, 169, 1) 84%, rgba(193, 148, 51, 1) 96%);
  padding: 3px;
  box-sizing: border-box;
}
.cartin .inner {
  padding: 0;
  /* background: url("../images/cartin_frame.png") no-repeat #ffffff; */
  /* background-size: cover; */
  background: #ffffff;
}
.cartin .title_offer{
  /* margin: 0 0 5%; */
}

.cartin .title {
  /* margin: 0 0 5%; */
  padding: 5% 5% 0;
}

.cartin .price {
  width: 98%;
  margin: 0 0 0 auto;
  padding: 5% 5% 0;
}
.cartin .btn {
  width: 70.4%;
  margin: 4% auto;
  padding: 0 5%;
}
.cartin ul.col {
  display: flex;
  justify-content: center;
}
.cartin li:first-child {
  width: 50%;
  padding: 0 1.1% 0 0;
}
.cartin li:last-child {
  width: 50%;
  padding: 0 0 0 1.1%;
}
.cartin .set-content {
  margin: 4.5% auto 0%;
  padding: 0 5% 5%;
}
.cartin p.note {
  margin: 4% 0 0;
  font-size: 18px;
  text-align: left;
  line-height: 166%;
  color: #603b01;
}
.summer{
  width: 100%;
  padding: 5% 6.2% 7.5%;
  background: url("../images/summer_bg.png") no-repeat;
  background-size: cover;

}
.summer-1{
  width: 88.5%;
}
.summer-2{
  margin: 16.3% 0 0;
  width: 100;
}
.summer-3{
  margin: 22% 0 0;
  width: 100%;
}
/* =============================================
                    ACCORDION
============================================= */
.accordion {
  /* margin: 5% auto 0; */
  padding: 0 0 5%;
}
.accordion.orange {
  background: #fef7eb;
}
.accordion.green {
  background: #f6faeb;
}
.toggle {
  display: none;
  position: relative
}
.Label {
  width: 87.5%;
  margin: 0% auto 0;
  padding: 0 0 0 14%;
  height: 90px;
  display: flex;
  color: #fff;
  align-items: center;
  
  cursor: pointer;
}
.accordion h3 {
  font-weight: 500;
  margin: 0;
  font-size: min(3.4vw, 20px);
}
.ac-01 h3::before {
  background: url("../images/acd_icon_1.png") no-repeat;
}
.ac-02 h3::before {
  background: url("../images/acd_icon_2.png") no-repeat;
}
.ac-03 h3::before {
  background: url("../images/acd_icon_3.png") no-repeat;
}
.ac-04 h3::before {
  background: url("../images/acd_icon_4.png") no-repeat;
}
.ac-05 h3::before {
  background: url("../images/acd_icon_5.png") no-repeat;
}
.ac-06 h3::before {
  background: url("../images/acd_icon_6.png") no-repeat;
}
.ac-07 h3::before {
  background: url("../images/acd_icon_7.png") no-repeat;
}
.ac-08 h3::before {
  background: url("../images/acd_icon_8.png") no-repeat;
}
.accordion h3::before {
  content: "";
  background-size: contain;
  width: 65px;
  height: 65px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 2%;
  margin: auto;
}
.ac-orange {
  background: #f5ac3c;
}
.ac-green {
  background: #a9cd36;
}
.Label::before {
  content: "";
  background: url("../images/icon_plus.png") no-repeat;
  background-size: contain;
  width: 65px;
  height: 65px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2%;
  margin: auto;
}
.Label, .content {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0);
  transition: all 0.3s;
}
.accordion .content .pict {
  margin: 5.4% auto 7%;
  text-align: center;
}
.accordion .content .pict img {
  width: 89.2%;
  margin: 0 auto;
}
.accordion .content h4 {
  width: 89.2%;
  margin: 0 auto 3%;
  font-size: 23px;
  line-height: 43px;
  font-weight: normal;
}
.accordion .content p {
  width: 89.2%;
  margin: 0 auto;
  font-size: 18px;
  line-height: 36px;
  font-weight: normal;
}
.accordion .content {
  width: 87.5%;
  height: 0;
  margin: 0 auto 2.5%;
  overflow: hidden;
  /* background: #ffffff; */
  color: #603b01;
}
.accordion.orange .content {
  background: #fef7eb;
}
.accordion.green .content {
  background: #f6faeb;
}
.accordion .content.ac-orange {
  border: 1px solid #f5ac3c;
}
.accordion .content.ac-green {
  border: 1px solid #a9cd36;
}
.accordion p.note {
  margin: 5% auto 0;
  font-size: 16px;
  line-height: 168.7%;
  color: #603b01;
}
.toggle:checked + .Label + .content {
  height: auto;
  transition: all .3s;
  padding: 0 0 5%;
}
.toggle:checked + .Label + .content.ac-orange {
  padding: 0 0 7%;
}
.toggle:checked + .Label::before {
  content: "";
  background: url("../images/icon_minus.png") no-repeat;
  background-size: contain;
  width: 65px;
  height: 65px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2%;
  margin: auto;
}
