/* ==========================================================================
Typograpgy
========================================================================== */
@media only screen and (min-width: 768px) and (max-width: 1600px) {
	html {
		font-size: calc(10 * (100vw / 1600)) !important;
	}
}
@media (max-width: 767px) {
	.lp * {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
}
  html {
    font-size: 62.5%;
  }

  :where(.valentine) img,
  :where(.valentine) video,
  :where(.valentine) svg {
    width: 100%;
    height: auto;
  }

  body {
    background-color: var(--top-bg-color);
  }

  .valentine .sp_only {
    display: block;
  }

  .valentine .pc_only {
    display: none;
  }

  .valentine {
    font-family: var(--font-common);
    font-weight: normal;
    font-feature-settings: "palt";
    color: #555555;
    font-weight: 400;
    background-color: var(--top-bg-color);
  }

  @media screen and (max-width:767px) {
    .valentine .item_img a:hover {
      opacity: 1!important;
    }
  }

/************** js **************/
  /* fade */
  .fade {
    transition-property: opacity, transform;
    transition-duration: 1.5s;
    opacity: 0;
    transform: translateY(1.5rem);
  }

  .fade.onView {
    opacity: 1;
    transform: translateY(0);
  }

  /* border */
  @keyframes border_anime {
    0%{
      width: 0%;
    }
    100%{
      width: 100%;
    }
  }

  .sec_ttl_border {
    position: relative;
  }

  .sec_ttl_border.border_bottom {
    position: relative;
  }

  .sec_ttl_border.border_bottom::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    border-bottom: solid 1px #555555;
    animation: border_anime 1.8s ease forwards;
    animation-delay: 0.5s;
  }

/************** common **************/
  .lp {
    padding-bottom: 0;
  }

  /*** sec ***/
  .valentine .sec {
    width: calc(660* (100vw /750));
  }

  /*** flex_box ***/
  .valentine .flex_box {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  /*** sec_text ***/
  .valentine .sec_text {
    font-size: calc(24* (100vw /750));
    letter-spacing: 0.07em;
    line-height: 2;
    font-weight: 400;
    text-align: justify;
  }

  .valentine .sec_text_ttl {
    margin: calc(60* (100vw /750)) 0 calc(45* (100vw /750));
    font-size: calc(32* (100vw /750));
    letter-spacing: 0.075em;
    line-height: 2.25;
    font-weight: 400;
    text-align: center;
    font-feature-settings: normal;
  }

  /*** h3 ***/
  .valentine h3 {
    letter-spacing: 0.1em;
    font-weight: 400;
  }

  .valentine .tax_ttl {
    margin-bottom: calc(38* (100vw /750));
    font-size: calc(32* (100vw /750));
    text-align: center;
  }

  .valentine .function_ttl {
    margin-bottom: calc(36* (100vw /750));
    font-size: calc(32* (100vw /750));
    text-align: center;
  }

  .valentine .sec_ttl {
    margin-bottom: calc(40* (100vw /750));
    font-size: calc(32* (100vw /750));
    font-family: var(--font-common);
    font-weight: 400;
    font-style: normal;
  }

  .valentine .sec_ttl span {
    font-size: calc(36* (100vw /750));
  }

  .valentine .sec_ttl_border {
    margin-bottom: calc(60* (100vw /750));
    padding-bottom: calc(26* (100vw /750));
  }

  .sec_tax {
    margin: calc(46* (100vw /750)) auto calc(35* (100vw /750));
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: calc(17* (100vw /750)) 0;
  }

  .sec_tax li {
    font-family: var(--font-ja);
  }

  .sec_tax li:nth-of-type(1)  {
    width: max-content;
    font-size: calc(30* (100vw /750));
    letter-spacing: 0.1em;
    line-height: 1.866;
    text-align: center;
  }

  .sec_tax li:nth-of-type(2)  {
    width: max-content;
    font-size: calc(26* (100vw /750));
    letter-spacing: 0.085em;
  }


/************** mv **************/
  .valentine .mv {
    margin: 0 auto calc(120* (100vw /750));
  }

  .valentine .mv_img {
    margin-bottom: calc(80* (100vw /750));
    width: 100%;
  }

  .valentine .mv h2 {
    margin: 0 auto calc(28* (100vw /750));
    text-align: center;
    font-weight: 400;
  }

  .valentine .mv h2 p:first-child {
    margin-bottom: calc(23* (100vw /750));
    font-size: calc(30* (100vw /750));
    letter-spacing: 0.16em;
  }

  .valentine .mv h2 p:last-child {
    font-size: calc(40* (100vw /750));
    letter-spacing: 0.13em;
    line-height: 2;
  }

  .valentine .mv_text {
    font-size: calc(24* (100vw /750));
    letter-spacing: 0.1em;
    line-height: 2;
    text-align: center;
  }

/************** sec01 **************/
  .valentine .sec01 {
    margin: 0 auto calc(120* (100vw /750));
  }
  
/************** sec02 **************/
  .valentine .sec02 {
    margin: 0 auto calc(120* (100vw /750));
  }

  .valentine .sec02 .sec_text {
    letter-spacing: 0.06em;
  }

/************** sec03 **************/
  .valentine .sec03 {
    margin: 0 auto calc(120* (100vw /750));
  }

  .valentine .sec03 .sec_text {
    letter-spacing: 0.06em;
  }


/************** sec04 **************/
  .valentine .sec04 {
    margin: 0 auto calc(125* (100vw /750));
  }

/************** all_item **************/
  .valentine .all_item {
    margin: 0 auto calc(120* (100vw /750));
    width: calc(540* (100vw /750));
  }

/* ===============================================### 
PC用デザイン
###=============================================== */
@media screen and (min-width:768px) {
  .valentine .sp_only {
    display: none;
  }

  .valentine .pc_only {
    display: block;
  }

  .valentine .flex_box{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row;
  }

/************** common **************/
  .lp {
    padding-bottom: 0;
  }

  /*** sec ***/
  .valentine .sec {
    width: 66rem;
  }
  
  /*** flex_box ***/
  .valentine .flex_box_pc {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 5rem 0;
  }

  /*** sec_text ***/
  .valentine .sec_text {
    font-size: 1.4rem;
    letter-spacing: 0.06em;
    line-height: 2;
    font-weight: 400;
    text-align: justify;
  }

  .valentine .sec_text_ttl {
    margin: 0 0 2.3rem;
    font-size: 1.8rem;
    letter-spacing: 0.05em;
    line-height: 2.44;
  }

  /*** h3 ***/
  .valentine .tax_ttl {
    margin-bottom: 2rem;
    font-size: 1.8rem;
    text-align: center;
  }

  .valentine .function_ttl {
    margin-bottom: 1.2rem;
    font-size: 1.8rem;
    text-align: center;
  }

  .valentine .sec_ttl {
    margin-bottom: 4.0rem;
    font-size: 2rem;
    letter-spacing: 0.11em;
  }

  .valentine .sec_ttl span {
    font-size: 2.3rem;
  }

  .valentine .sec_ttl_border {
    margin-bottom: 4.5rem;
    padding-bottom: 1.1rem;
  }

  .sec_tax {
    margin: 3.8rem auto 2.4rem;
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 1.7rem 0;
  }

  .sec_tax li {
    font-family: var(--font-ja);
  }

  .sec_tax li:nth-of-type(1)  {
    width: max-content;
    font-size: 1.8rem;
    letter-spacing: 0.1em;
    line-height: 1;
    text-align: center;
  }

  .sec_tax li:nth-of-type(2)  {
    width: max-content;
    font-size: 1.6rem;
    letter-spacing: 0.085em;
  }

  .item_img {
    margin: 0 auto;
    width: 36rem;
  }

/************** mv **************/
  .valentine .mv {
    margin: 0 auto 9.1rem;
    width: 90rem;
  }

  .valentine .mv_img {
    margin-bottom: 8rem;
    width: 100%;
  }

  .valentine .mv h2 {
    margin: 0 auto 2.5rem;
  }

  .valentine .mv h2 p:first-child {
    margin-bottom: 1.2rem;
    font-size: 1.8rem;
    letter-spacing: 0.16em;
  }

  .valentine .mv h2 p:last-child {
    font-size: 2.3rem;
    letter-spacing: 0.15em;
  }

  .valentine .mv_text {
    font-size: 1.4rem;
    letter-spacing: 0.075em;
    line-height: 2;
    text-align: center;
  }


/************** sec01 **************/
  .valentine .sec01 {
    margin: 0 auto 11rem;
  }

  .img04 {
    width: 32rem;
  }

/************** sec02 **************/
  .valentine .sec02 {
    margin: 0 auto 11rem;
  }

  .valentine .sec02 .sec_text {
    letter-spacing: 0.04em;
  }

/************** sec03 **************/
  .valentine .sec03 {
    margin: 0 auto 11rem;
  }

  .valentine .sec03 .sec_text {
    letter-spacing: 0.06em;
  }


/************** sec04 **************/
  .valentine .sec04 {
    margin: 0 auto 11rem;
  }

  
/************** all_item **************/
  .valentine .all_item {
    margin: 0 auto 12.0rem;
    width: 44.0rem;
  }

  .valentine .package_list {
    margin-top: 5.1rem;
    display: flex;
    width: 68rem;
    justify-content: space-between;
  }
  .package_list_item {
    width: 20rem;
  }

}



/*
//////////////////////////////////////////////////////////////////////////////////////////////
                                                                                パッケージ
//////////////////////////////////////////////////////////////////////////////////////////////
*/
.valentine .sec-package {
  margin: 0 auto 11.2rem;
}
.valentine .package_img-main {
  width: 50rem;
  margin-inline: auto;
}
.valentine .package_ttl-sub {
  margin-top: 3.6rem;
  font-size: 1.5rem;
  line-height: 1.5;
  letter-spacing: 0.125em;
  text-align: center;
}
.valentine .package_ttl-main {
  margin-top: .8rem;
  border-bottom: 0;
  letter-spacing: 0.1em;
  font-size: 2rem;
  line-height: 1.6;
  text-align: center;
}
.valentine .package_txt {
  margin-top: 1.3rem;
  font-size: 1.2rem;
  line-height: 2.3333333333;
  letter-spacing: 0.05em;
  text-align: center;
  display: block;
}
.valentine .package_list {
  margin-top: 5.1rem;
}
.valentine .package_list_item_ttl {
  margin-top: 2.8rem;
  font-size: 1.6rem;
  line-height: 1.75;
  letter-spacing: 0.1em;
  text-align: center;
}
.valentine .package_list_item_lead {
  margin-top: 0.4rem;
}
.valentine .package_list_item:nth-child(2) .package_list_item_lead {
  letter-spacing: 0.04em;
}
.valentine .common_lead {
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) and (max-width: 1400px) {}
@media screen and (max-width: 767px) {
  .valentine .common_lead {
    font-size: calc(24*100vw/750);
    letter-spacing: 0.075em;
  }
  .valentine .sec-package {
    margin: 0 auto calc(-90*100vw/750);
  }
  .valentine .package_img-main {
    width: calc(660*100vw/750);
  }
  .valentine .package_ttl-sub {
    margin-top: calc(48*100vw/750);
    font-size: calc(26*100vw/750);
    line-height: 2.0769230769;
    font-weight: 400;
  }
  .valentine .package_ttl-main {
    margin-top: calc(4*100vw/750);
    font-size: calc(34*100vw/750);
    line-height: 1.58;
    letter-spacing: 0.1em;
  }
  .valentine .package_txt {
    margin-top: calc(21*100vw/750);
    font-size: calc(18*100vw/750);
    line-height: 1.5555555556;
  }
  .valentine .package_list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: calc(75*100vw/750);
    gap: calc(66*100vw/750) calc(30*100vw/750);
  }
  .valentine .package_list_item {
    width: calc(315*100vw/750);
  }
  .valentine .package_list_item:nth-child(3) {
    width: calc(660*100vw/750);
  }
  .valentine .package_list_item:nth-child(3) > div {
    width: calc(315*100vw/750);
    margin-inline: auto;
  }
  .valentine .package_list_item_ttl {
    margin-top: calc(42*100vw/750);
    font-size: calc(30*100vw/750);
    line-height: 2;
    font-weight: 400;
  }
  .valentine .package_list_item_lead {
    margin-top: calc(10*100vw/750);
    text-align: center;
    white-space: nowrap;
  }
  .valentine .package_list_item:nth-child(2) .package_list_item_lead {
    letter-spacing: 0.075em;
  }
  .valentine .package_list_item:nth-child(3) .package_list_item_lead {
    letter-spacing: 0.04em;
  }
}