@charset "UTF-8";
/* ------------------------
  reset
------------------------ */
html,
body {
  height: 100%;
}

*,
*::after,
*::before {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
  font-size: inherit;
  line-height: inherit;
}

pre,
textarea {
  overflow: auto;
}

template {
  display: none;
}

details,
main,
summary {
  display: block;
}

input[type=number] {
  width: auto;
}

input[type=search] {
  -webkit-appearance: textfield;
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

progress {
  display: inline-block;
}

small {
  font-size: 75%;
}

sub,
sup {
  position: relative;
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

textarea {
  resize: vertical;
}

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

audio:not([controls]) {
  display: none;
}

img {
  border: 0;
  max-width: 100%;
  height: auto;
}

button,
input,
select,
textarea {
  min-height: 1.5em;
  color: inherit;
  font-family: inherit;
  font-weight: inherit;
  font-style: inherit;
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

input {
  line-height: normal;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
  border-style: none;
  cursor: pointer;
  background-color: transparent;

  -webkit-appearance: button;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}

code,
kbd,
pre,
samp {
  font-family: monospace;
}

ol,
ul {
  list-style: none;
}

select {
     -moz-appearance: none;
  -webkit-appearance: none;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
}

fieldset {
  border: 0;
}

/* ------------------------
  Base Settings
------------------------ */
html {
  font-size: 62.5%;
}

body {
  opacity: 0;
  word-wrap: break-word;
  color: #000;
  font-family: "Noto Sans JP", "Noto Sans CJK JP", sans-serif;
  line-height: 1.6;

  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
          text-size-adjust: 100%;
}
body.is-active {
  opacity: 1;
  transition: opacity 0.1s;
}

main {
  overflow: hidden;
}
main img {
  width: 100%;
  height: auto;
}

sup {
  font-size: 55.5556%;
}

a {
  text-decoration: none;
  color: #000;
}
a:visited {
  color: #000;
}
a:hover {
  text-decoration: none;
  color: #000;
}
a:active {
  text-decoration: none;
  color: #000;
}
a[href^="tel:"]:hover {
  color: #000;
}
@media (min-width: 768px) {
  a[href^="tel:"] {
    cursor: text;
    text-decoration: none;
  }
}

img {
  max-width: 100%;
}

/* ------------------------
  Components
------------------------ */
.hoge {
  width: 100%;
  background: turquoise;
}
.hoge::after {
  content: "：SM";
}
@media (min-width: 768px) {
  .hoge {
    background: violet;
  }
  .hoge::after {
    content: "：MD";
  }
}
@media (min-width: 1236px) {
  .hoge {
    background: wheat;
  }
  .hoge::after {
    content: "：LG";
  }
}

/* 小コメント ------- */
.hoge_small {
  width: 100%;
}

/* ------------------------
  Print Styles
------------------------ */
@media print {
  *,
  *::before,
  *::after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}
/* Magnific Popup CSS */
.mfp-bg {
  overflow: hidden;
  opacity: 0.9;
  position: fixed;
  z-index: 1042;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
}
.is-special .mfp-bg,
.is-adventurer .mfp-bg {
  background-color: #2c210e;
}
@media (max-width: 767.98px) {
  .is-special .mfp-bg,
  .is-adventurer .mfp-bg {
    opacity: 0.8;
  }
}
@media (min-width: 768px) {
  .mfp-bg {
    min-width: 1000px;
  }
  .is-special .mfp-bg,
  .is-adventurer .mfp-bg {
    opacity: 0.5;
  }
}

.mfp-wrap {
  position: fixed;
  z-index: 1043;
  top: 0;
  left: 0;
  outline: none !important;
  width: 100%;
  height: 100%;

  -webkit-backface-visibility: hidden;
}
.mfp-wrap::-webkit-scrollbar {
  width: 5px;
}
.mfp-wrap::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: #646464;
}
.mfp-wrap::-webkit-scrollbar-track {
  background-color: #323232;
}

.mfp-container {
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
}
.mfp-container::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

#bangaihen .mfp-container {
  padding-top: 0;
}

.mfp-align-top .mfp-container::before {
  display: none;
}

.mfp-content {
  display: inline-block;
  position: relative;
  z-index: 1045;
  margin: 0 auto;
  text-align: left;
  vertical-align: middle;
}
@media (max-width: 767.98px) {
  .mfp-content {
    max-width: vw(614, 750);
  }
  .is-adventurer .mfp-content {
    padding-top: 58.6666666667vw;
    padding-bottom: 26.6666666667vw;
    max-width: 160vw;
  }
  .is-special .mfp-content {
    padding-top: 58.6666666667vw;
    padding-bottom: 26.6666666667vw;
    max-width: 177.0666666667vw;
  }
}
@media (min-width: 768px) {
  .mfp-content {
    max-width: vw(1320, 1920);
  }
  .is-special .mfp-content,
  .is-adventurer .mfp-content {
    max-width: clamp(84.5rem, 110.03237vw, 136rem);
  }
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}

.mfp-ajax-cur {
  cursor: progress;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor:         zoom-out;
}

.mfp-zoom {
  cursor: pointer;
  cursor:         zoom-in;
}

.mfp-auto-cursor .mfp-content {
  cursor: auto;
}

.mfp-loading.mfp-figure {
  display: none;
}

.mfp-hide {
  display: none !important;
}

.mfp-preloader {
  position: absolute;
  z-index: 1044;
  top: 50%;
  right: 8px;
  left: 8px;
  margin-top: -0.8em;
  width: auto;
  text-align: center;
  color: #ccc;
}
.mfp-preloader a {
  color: #ccc;
}
.mfp-preloader a:hover {
  color: #fff;
}

.mfp-s-ready .mfp-preloader {
  display: none;
}

.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-close,
button.mfp-arrow {
  display: block;
  overflow: visible;
  z-index: 1046;
  padding: 0;
  border: 0;
  outline: none;
  cursor: pointer;
  background: transparent;
  box-shadow: none;

  -webkit-appearance: none;
  touch-action: manipulation;
}
button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

button.mfp-close {
  opacity: 0.65;
  opacity: 1;
  position: absolute;
  top: 0;
  right: 0;
  background-size: contain;
}
button.mfp-close:hover,
button.mfp-close:focus {
  opacity: 1;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  white-space: nowrap;
  color: #ccc;
  font-size: 12px;
  line-height: 18px;
}

.mfp-arrow {
  top: 50%;
  background-size: contain !important;
}
@media (max-width: 767.98px) {
  .mfp-arrow {
    position: fixed;
    margin-top: -9.3333333333vw;
    width: 10.1333333333vw;
    height: 18.6666666667vw;
  }
}
@media (min-width: 768px) {
  .mfp-arrow {
    position: absolute;
    margin-top: clamp(-3.5rem, -2.83171vw, -2.2rem);
    width: clamp(2.3rem, 3.07444vw, 3.8rem);
    height: clamp(4.3rem, 5.66344vw, 7rem);
  }
}

.mfp-arrow-left {
  transform: scaleX(-1);
}
@media (max-width: 767.98px) {
  .mfp-arrow-left {
    left: 4.5333333333vw;
  }
}
@media (min-width: 768px) {
  .mfp-arrow-left {
    left: clamp(12.5rem, 16.34305vw, 20.2rem);
  }
}

@media (max-width: 767.98px) {
  .mfp-arrow-right {
    right: 4.5333333333vw;
  }
}
@media (min-width: 768px) {
  .mfp-arrow-right {
    right: clamp(12.5rem, 16.34305vw, 20.2rem);
  }
}

.mfp-iframe-holder {
  padding-top: 0px;
  padding-bottom: 0px;
}
.mfp-iframe-holder .mfp-content {
  width: 100%;
  line-height: 0;
}
.mfp-iframe-scaler {
  padding-top: 56.25%;
  width: 100%;
  height: 0;
}
.mfp-iframe-scaler iframe {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}

.resident-iframe {
  position: relative;
  padding-bottom: 56.25%;
  width: 100%;
  height: 0;
}
.resident-iframe iframe {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
}

/* Main image in popup */
img.mfp-img {
  display: block;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 40px 0 40px;
  width: auto;
  max-width: 100%;
  height: auto;
  line-height: 0;
}

/* The shadow behind the image */
.mfp-figure {
  line-height: 0;
}
.mfp-figure::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: 40px;
  right: 0;
  bottom: 40px;
  left: 0;
  width: auto;
  height: auto;
  background: #444;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
.mfp-figure small {
  display: block;
  color: #bdbdbd;
  font-size: 12px;
  line-height: 14px;
}
.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: -36px;
  width: 100%;
  cursor: auto;
}

.mfp-title {
  padding-right: 36px;
  text-align: left;
  word-wrap: break-word;
  color: #f3f3f3;
  line-height: 18px;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

@media screen and (max-width: 768px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
   * Remove all paddings around the image on small screen
   */
  .mfp-img-mobile .mfp-image-holder {
    padding-right: 0;
    padding-left: 0;
  }
  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }
  .mfp-img-mobile .mfp-figure::after {
    top: 0;
    bottom: 0;
  }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }
  .mfp-img-mobile .mfp-bottom-bar {
    box-sizing: border-box;
    position: fixed;
    top: auto;
    bottom: 0;
    margin: 0;
    padding: 3px 5px;
    background: rgba(0, 0, 0, 0.6);
  }
  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }
  .mfp-img-mobile .mfp-counter {
    top: 3px;
    right: 5px;
  }
  .mfp-img-mobile .mfp-close {
    position: fixed;
    top: 0;
    right: 0;
    padding: 0;
    width: 35px;
    height: 35px;
    background: rgba(0, 0, 0, 0.6);
    text-align: center;
    line-height: 35px;
  }
}
@media all and (max-width: 768px) {
  .mfp-container {
    padding-right: 0px;
    padding-left: 0px;
  }
}
.mfp-fade {
  /* overlay at start */
  /* content at start */
}
.mfp-fade.mfp-bg {
  opacity: 0;
  transition: all 0.25s ease-out;
  /* overlay animate in */
  /* overlay animate out */
}
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.9;
}
@media (max-width: 767.98px) {
  .is-special .mfp-fade.mfp-bg.mfp-ready,
  .is-adventurer .mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.8;
  }
}
@media (min-width: 768px) {
  .is-special .mfp-fade.mfp-bg.mfp-ready,
  .is-adventurer .mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.5;
  }
}
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}
.mfp-fade.mfp-wrap {
  /* content animate it */
  /* content animate out */
}
.mfp-fade.mfp-wrap .mfp-container {
  opacity: 0;
  transition: all 0.25s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-container {
  opacity: 1;
}
.mfp-fade.mfp-wrap.mfp-removing .mfp-container {
  opacity: 0;
}

/* --------------------------------
  共通
-------------------------------- */
@-webkit-keyframes arrow {
  0% {
    opacity: 1;
    transform: translateX(0) rotate(-45deg);
  }
  49% {
    opacity: 0;
    transform: translateX(10px) rotate(-45deg);
  }
  51% {
    opacity: 0;
    transform: translateX(-10px) rotate(-45deg);
  }
  100% {
    opacity: 1;
    transform: translateX(0) rotate(-45deg);
  }
}
@keyframes arrow {
  0% {
    opacity: 1;
    transform: translateX(0) rotate(-45deg);
  }
  49% {
    opacity: 0;
    transform: translateX(10px) rotate(-45deg);
  }
  51% {
    opacity: 0;
    transform: translateX(-10px) rotate(-45deg);
  }
  100% {
    opacity: 1;
    transform: translateX(0) rotate(-45deg);
  }
}
@-webkit-keyframes arrow2 {
  0% {
    opacity: 1;
    transform: translateY(0) rotate(-135deg);
  }
  49% {
    opacity: 0;
    transform: translateY(-10px) rotate(-135deg);
  }
  51% {
    opacity: 0;
    transform: translateY(10px) rotate(-135deg);
  }
  100% {
    opacity: 1;
    transform: translateY(0) rotate(-135deg);
  }
}
@keyframes arrow2 {
  0% {
    opacity: 1;
    transform: translateY(0) rotate(-135deg);
  }
  49% {
    opacity: 0;
    transform: translateY(-10px) rotate(-135deg);
  }
  51% {
    opacity: 0;
    transform: translateY(10px) rotate(-135deg);
  }
  100% {
    opacity: 1;
    transform: translateY(0) rotate(-135deg);
  }
}
@-webkit-keyframes arrowBottom {
  0% {
    opacity: 1;
    transform: translateY(0) rotate(45deg);
  }
  49% {
    opacity: 0;
    transform: translateY(10px) rotate(45deg);
  }
  51% {
    opacity: 0;
    transform: translateY(-10px) rotate(45deg);
  }
  100% {
    opacity: 1;
    transform: translateY(0) rotate(45deg);
  }
}
@keyframes arrowBottom {
  0% {
    opacity: 1;
    transform: translateY(0) rotate(45deg);
  }
  49% {
    opacity: 0;
    transform: translateY(10px) rotate(45deg);
  }
  51% {
    opacity: 0;
    transform: translateY(-10px) rotate(45deg);
  }
  100% {
    opacity: 1;
    transform: translateY(0) rotate(45deg);
  }
}
.mfp-bg {
  opacity: 1;
  background-color: #333c;
}

.mfp-container {
  padding: 3.3333333333vw;
}
@media (min-width: 768px) {
  .mfp-container {
    padding: clamp(3.9rem, 5.178vw, 6.4rem) clamp(3.1rem, 4.04531vw, 5rem);
  }
}

@media (min-width: 768px) {
  .mfp-content {
    width: clamp(49.7rem, 64.72492vw, 80rem) !important;
  }
}

.mfp-close-button {
  width: 13.3333333333vw;
  transform: translateY(-100%);

  aspect-ratio: 1/1;
}
@media (min-width: 768px) {
  .mfp-close-button {
    top: clamp(-1.3rem, -1.05177vw, -0.9rem);
    right: clamp(-0.6rem, -0.48543vw, -0.4rem);
    width: clamp(3.1rem, 4.04531vw, 5rem);
  }
}
.mfp-close-button::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 13.3333333333vw;
  height: 0.5333333333vw;
  transform: rotate(45deg);
  background-color: #fff;
}
@media (min-width: 768px) {
  .mfp-close-button::before {
    width: clamp(3.1rem, 4.04531vw, 5rem);
    height: 2px;
  }
}
.mfp-close-button::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 13.3333333333vw;
  height: 0.5333333333vw;
  transform: rotate(-45deg);
  background-color: #fff;
}
@media (min-width: 768px) {
  .mfp-close-button::after {
    width: clamp(3.1rem, 4.04531vw, 5rem);
    height: 2px;
  }
}

.caloriemateforstudent_section {
  padding-top: 21.3333333333vw;
  padding-bottom: 16vw;
}
@media (min-width: 768px) {
  .caloriemateforstudent_section {
    padding-top: clamp(9rem, 11.7314vw, 14.5rem);
    padding-bottom: clamp(7.6rem, 9.95146vw, 12.3rem);
  }
}

.caloriemateforstudent_inner {
  padding: 0 4vw;
}
@media (min-width: 768px) {
  .caloriemateforstudent_inner {
    margin-right: auto;
    margin-left: auto;
    padding: 0 clamp(2.4rem, 3.23625vw, 4rem);
    max-width: 1320px;
  }
}

.caloriemateforstudent_title {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  margin: auto;
  text-align: center;
  font-family: Montserrat, sans-serif !important;
  font-size: 8.8vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .caloriemateforstudent_title {
    font-size: clamp(3.7rem, 4.85437vw, 6rem);
  }
}
.caloriemateforstudent_title .caloriemateforstudent_title_circle {
  position: relative;
  width: 0.5em;
  height: 1em;
}
.caloriemateforstudent_title .caloriemateforstudent_title_circle::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  width: 1.6vw;
  height: 1.6vw;
  transform: translate(-50%, -50%);
  background-color: #000;
}
@media (min-width: 768px) {
  .caloriemateforstudent_title .caloriemateforstudent_title_circle::before {
    width: clamp(0.8rem, 1.13269vw, 1.4rem);
    height: clamp(0.8rem, 1.13269vw, 1.4rem);
  }
}
@media (min-width: 768px) {
  .caloriemateforstudent_title.-product {
    font-size: clamp(4.3rem, 5.66344vw, 7rem);
  }
}
.caloriemateforstudent_title.-product .caloriemateforstudent_title_label {
  width: 52.2666666667vw;
  background-image: url(/cmt/caloriemateforstudent/assets/images/title_grid-background_03_sm.png);
}
@media (min-width: 768px) {
  .caloriemateforstudent_title.-product .caloriemateforstudent_title_label {
    width: clamp(27.9rem, 36.40777vw, 45rem);
    background-image: url(/cmt/caloriemateforstudent/assets/images/title_grid-background_03_lg.png);
  }
}
@media (min-width: 768px) {
  .caloriemateforstudent_title.-study-partners {
    font-size: clamp(3.7rem, 4.85437vw, 6rem);
  }
}
.caloriemateforstudent_title.-study-partners .caloriemateforstudent_title_label {
  width: 83.4666666667vw;
  background-image: url(/cmt/caloriemateforstudent/assets/images/title_grid-background_04_sm.png);
}
@media (min-width: 768px) {
  .caloriemateforstudent_title.-study-partners .caloriemateforstudent_title_label {
    width: clamp(36.6rem, 47.73463vw, 59rem);
    background-image: url(/cmt/caloriemateforstudent/assets/images/title_grid-background_04_lg.png);
  }
}

.caloriemateforstudent_title_label {
  display: block;
  position: absolute;
  z-index: -1;
  width: 70.6666666667vw;
  height: 8.5333333333vw;
  background-image: url(/cmt/caloriemateforstudent/assets/images/title_grid-background_02_sm.png);
  background-repeat: no-repeat;
  background-size: contain;

  inset: auto 4.2666666667vw 0 0;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .caloriemateforstudent_title_label {
    right: clamp(1.3rem, 1.69903vw, 2.1rem);
    width: clamp(32.9rem, 42.88026vw, 53rem);
    height: clamp(3.9rem, 5.09709vw, 6.3rem);
    background-image: url(/cmt/caloriemateforstudent/assets/images/title_grid-background_02_lg.png);
  }
}

.caloriemateforstudent_thumb {
  display: block;
  overflow: hidden;
  position: relative;
}
.caloriemateforstudent_thumb.-color02::before {
  background-image: url(/cmt/caloriemateforstudent/assets/images/movies_play_02.png);
}
.caloriemateforstudent_thumb::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 10.1333333333vw;
  background-image: url(/cmt/caloriemateforstudent/assets/images/movies_play.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;

  aspect-ratio: 1/1;
}
@media (min-width: 768px) {
  .caloriemateforstudent_thumb::before {
    width: clamp(4.6rem, 6.06797vw, 7.5rem);
    transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
}
.caloriemateforstudent_thumb::after {
  content: "";
  opacity: 0;
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: opacity 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  background-color: rgba(0, 0, 0, 0.2);
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .caloriemateforstudent_thumb:hover::before {
    transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.9);
  }
  .caloriemateforstudent_thumb:hover::after {
    opacity: 1;
    transition: opacity 0.45s cubic-bezier(0.39, 0.575, 0.565, 1);
  }
  .caloriemateforstudent_thumb:hover img {
    transition: transform 0.45s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(1.1);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .caloriemateforstudent_thumb:hover::before {
    transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.9);
  }
  .caloriemateforstudent_thumb:hover::after {
    opacity: 1;
    transition: opacity 0.45s cubic-bezier(0.39, 0.575, 0.565, 1);
  }
  .caloriemateforstudent_thumb:hover img {
    transition: transform 0.45s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(1.1);
  }
}
.caloriemateforstudent_thumb img {
  transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1);

  aspect-ratio: 801/450.56;
}

.caloriemateforstudent_link {
  display: block;
  position: relative;
  letter-spacing: 0.08em;
  font-size: 4vw;
  line-height: 1.3333333333;
}
@media (min-width: 768px) {
  .caloriemateforstudent_link {
    font-size: clamp(1.1rem, 1.45632vw, 1.8rem);
    line-height: 1.7777777778;
  }
}
@media (hover: hover) and (pointer: fine) {
  .caloriemateforstudent_link:hover:not(.is-active):not([aria-selected=true]) .introduction_partner_link_image::after,
  .caloriemateforstudent_link:hover:not(.is-active):not([aria-selected=true]) .caloriemateforstudent_link_wrap::after {
    -webkit-animation: arrow 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
            animation: arrow 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }
  .caloriemateforstudent_link:hover[aria-selected=true] .introduction_partner_link_image::after,
  .caloriemateforstudent_link:hover[aria-selected=true] .caloriemateforstudent_link_wrap::after,
  .caloriemateforstudent_link:hover.is-active .introduction_partner_link_image::after,
  .caloriemateforstudent_link:hover.is-active .caloriemateforstudent_link_wrap::after {
    -webkit-animation: arrow2 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
            animation: arrow2 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }
  .caloriemateforstudent_link:hover .introduction_partner_link_image,
  .caloriemateforstudent_link:hover .caloriemateforstudent_link_wrap {
    transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.99);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .caloriemateforstudent_link:hover:not(.is-active):not([aria-selected=true]) .introduction_partner_link_image::after,
  .caloriemateforstudent_link:hover:not(.is-active):not([aria-selected=true]) .caloriemateforstudent_link_wrap::after {
    -webkit-animation: arrow 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
            animation: arrow 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }
  .caloriemateforstudent_link:hover[aria-selected=true] .introduction_partner_link_image::after,
  .caloriemateforstudent_link:hover[aria-selected=true] .caloriemateforstudent_link_wrap::after,
  .caloriemateforstudent_link:hover.is-active .introduction_partner_link_image::after,
  .caloriemateforstudent_link:hover.is-active .caloriemateforstudent_link_wrap::after {
    -webkit-animation: arrow2 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
            animation: arrow2 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }
  .caloriemateforstudent_link:hover .introduction_partner_link_image,
  .caloriemateforstudent_link:hover .caloriemateforstudent_link_wrap {
    transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.99);
  }
}
.caloriemateforstudent_link[aria-selected=true] .caloriemateforstudent_link_wrap::after,
.caloriemateforstudent_link.is-active .caloriemateforstudent_link_wrap::after {
  margin-top: 1.6vw;
  transform: rotate(-135deg);
}
@media (min-width: 768px) {
  .caloriemateforstudent_link[aria-selected=true] .caloriemateforstudent_link_wrap::after,
  .caloriemateforstudent_link.is-active .caloriemateforstudent_link_wrap::after {
    margin-top: clamp(0.3rem, 0.48544vw, 0.6rem);
  }
}

.caloriemateforstudent_link_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  padding: 1.0666666667vw 2.6666666667vw 1.6vw 2.6666666667vw;
  border-radius: 0.8vw;
  width: 100%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 11.2vw;
  background-color: #000;
  letter-spacing: 0;
  color: #fff;
  font-weight: bold;

  gap: 0.8vw;
}
@media (min-width: 768px) {
  .caloriemateforstudent_link_wrap {
    padding: 0 clamp(1.5rem, 2.02266vw, 2.5rem) clamp(0.1rem, 0.24272vw, 0.3rem);
    border-radius: 6px;
    min-height: clamp(3.7rem, 4.85437vw, 6rem);
    transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);

    gap: clamp(0.3rem, 0.40454vw, 0.5rem);
    will-change: transform;
  }
}
.caloriemateforstudent_link_wrap::after {
  content: "";
  margin-bottom: -0.2666666667vw;
  margin-left: 1.3333333333vw;
  border-right: 1px solid #fbc114;
  border-bottom: 1px solid #fbc114;
  width: 2.1333333333vw;
  transition: transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1), margin 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: rotate(-45deg);
  transform-origin: center;

  aspect-ratio: 1/1;
}
@media (min-width: 768px) {
  .caloriemateforstudent_link_wrap::after {
    margin-bottom: clamp(-0.2rem, -0.16181vw, -0.2rem);
    margin-left: clamp(0.3rem, 0.40454vw, 0.5rem);
    border-width: 2px;
    border-right: 2px solid #fbc114;
    border-bottom: 2px solid #fbc114;
    width: clamp(0.6rem, 0.88997vw, 1.1rem);
  }
}

/* --------------------------------
  header
-------------------------------- */
.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  left: 0;
  padding: 0 4.2666666667vw;
  width: 100%;
  height: 11.2vw;
}
@media (min-width: 768px) {
  .header {
    padding: 0 clamp(2.7rem, 3.55988vw, 4.4rem) 0 clamp(1.9rem, 2.589vw, 3.2rem);
    height: clamp(5.4rem, 7.03884vw, 8.7rem);
  }
}

.header_top a {
  display: block;
  width: 18.6666666667vw;
}
@media (min-width: 768px) {
  .header_top a {
    width: clamp(8.8rem, 11.56958vw, 14.3rem);
  }
}

.header_sns {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.header_sns li:not(:first-of-type) {
  margin-left: 4.2666666667vw;
}
@media (min-width: 768px) {
  .header_sns li:not(:first-of-type) {
    margin-left: clamp(0.9rem, 1.2945vw, 1.6rem);
  }
}
.header_sns li a {
  display: block;
}
.header_sns li a.twitter {
  width: 5.6vw;
}
@media (min-width: 768px) {
  .header_sns li a.twitter {
    width: clamp(1.3rem, 1.77994vw, 2.2rem);
  }
}
.header_sns li a.facebook {
  width: 6.9333333333vw;
}
@media (min-width: 768px) {
  .header_sns li a.facebook {
    width: clamp(1.8rem, 2.34628vw, 2.9rem);
  }
}

/* --------------------------------
  kv
-------------------------------- */
.kv {
  position: relative;
  background-color: #fff7c2;
}
.kv .kv_inner {
  position: relative;
  padding-top: 38.6666666667vw;
  padding-bottom: 5.3333333333vw;
}
@media (min-width: 768px) {
  .kv .kv_inner {
    padding-top: clamp(13.6rem, 17.79936vw, 22rem);
    padding-bottom: clamp(14.9rem, 19.41748vw, 24rem);
  }
}
.kv .kv_content {
  display: grid;
  position: relative;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .kv .kv_content {
    left: clamp(0.6rem, 0.80907vw, 1rem);
    max-width: clamp(57.1rem, 74.43366vw, 92rem);

    grid-template-columns: clamp(32rem, 41.66667vw, 51.5rem) 1fr;
    gap: 0 clamp(3.7rem, 4.85437vw, 6rem);
  }
}
@media (max-width: 767.98px) {
  .kv .kv_title {
    margin: 0 auto;
    max-width: 78.6666666667vw;
  }
}
.kv .kv_text {
  margin-top: 12vw;
  text-align: center;
  letter-spacing: 0.04em;
  font-size: 3.7333333333vw;
  font-weight: bold;
  line-height: 2;
}
@media (min-width: 768px) {
  .kv .kv_text {
    margin-top: clamp(0.6rem, 0.80907vw, 1rem);
    text-align: left;
    font-size: clamp(1.1rem, 1.45632vw, 1.8rem);
    line-height: 2;
  }
}
.kv .kv_icons {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
}
@media (min-width: 768px) {
  .kv .kv_icons {
    margin: auto;
    max-width: clamp(76.7rem, 100vw, 123.6rem);
  }
}
.kv .kv_icon {
  position: absolute;
}
@media (min-width: 768px) {
  .kv .kv_icon {
    right: 0;
    left: 0;
    margin: auto;
  }
}
.kv .kv_icon:nth-of-type(1) {
  top: -20vw;
  left: 26.1333333333vw;
  width: 29.3333333333vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(1) {
    top: clamp(-22rem, -17.79935vw, -13.7rem);
    left: clamp(-60.2rem, -48.7055vw, -37.5rem);
    width: clamp(16.9rem, 22.00648vw, 27.2rem);
  }
}
.kv .kv_icon:nth-of-type(2) {
  top: 12.2666666667vw;
  left: 70.9333333333vw;
  width: 27.2vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(2) {
    top: clamp(1.7rem, 2.26538vw, 2.8rem);
    left: clamp(56.5rem, 73.6246vw, 91rem);
    width: clamp(15.7rem, 20.46926vw, 25.3rem);
  }
}
.kv .kv_icon:nth-of-type(3) {
  top: 10.6666666667vw;
  left: -3.7333333333vw;
  width: 21.3333333333vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(3) {
    top: clamp(7.5rem, 9.87056vw, 12.2rem);
    left: clamp(-121.7rem, -98.46278vw, -75.7rem);
    width: clamp(12.2rem, 15.93852vw, 19.7rem);
  }
}
.kv .kv_icon:nth-of-type(4) {
  top: 113.3333333333vw;
  left: 3.2vw;
  width: 9.6vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(4) {
    top: clamp(32.3rem, 42.0712vw, 52rem);
    left: clamp(2.9rem, 3.80259vw, 4.7rem);
    width: clamp(5.6rem, 7.36246vw, 9.1rem);
  }
}
.kv .kv_icon:nth-of-type(5) {
  top: 84vw;
  left: -14.6666666667vw;
  width: 34.4vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(5) {
    top: clamp(28rem, 36.56958vw, 45.2rem);
    left: clamp(-134.5rem, -108.81877vw, -83.6rem);
    width: clamp(19.9rem, 25.97088vw, 32.1rem);
  }
}
.kv .kv_icon:nth-of-type(6) {
  top: 109.3333333333vw;
  left: 88vw;
  width: 10.6666666667vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(6) {
    top: clamp(34.7rem, 45.30745vw, 56rem);
    left: clamp(44.6rem, 58.09062vw, 71.8rem);
    width: clamp(7.5rem, 9.78965vw, 12.1rem);
  }
}
.kv .kv_icon:nth-of-type(7) {
  top: 83.7333333333vw;
  left: 76.8vw;
  width: 21.8666666667vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(7) {
    top: clamp(19.8rem, 25.80907vw, 31.9rem);
    left: clamp(69.2rem, 90.12945vw, 111.4rem);
    width: clamp(12.6rem, 16.42395vw, 20.3rem);
  }
}
.kv .kv_icon:nth-of-type(8) {
  top: auto;
  bottom: -10.6666666667vw;
  left: 77.3333333333vw;
  width: 21.3333333333vw;
}
@media (min-width: 768px) {
  .kv .kv_icon:nth-of-type(8) {
    bottom: clamp(-6rem, -4.85436vw, -3.8rem);
    left: clamp(72rem, 93.85114vw, 116rem);
    width: clamp(11.4rem, 14.96764vw, 18.5rem);
  }
}

/* --------------------------------
  anchors
-------------------------------- */
.anchors {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  position: relative;
  z-index: 3;
  bottom: -6.6666666667vw;
  padding: 0 8vw;

  gap: 1.3333333333vw;
}
@media (min-width: 768px) {
  .anchors {
    flex-wrap: nowrap;
    position: absolute;
    right: 0;
    bottom: clamp(-5rem, -4.0453vw, -3.2rem);
    left: 0;
    margin: auto;
    padding: 0 clamp(1.2rem, 1.61813vw, 2rem);
    max-width: 1180px;

    gap: clamp(1.1rem, 1.45632vw, 1.8rem);
  }
}
.anchors .anchors_item {
  width: calc((100% - 1.3333333333vw) / 2 - 1px);
  height: 12.32vw;
}
@media (min-width: 768px) {
  .anchors .anchors_item {
    width: clamp(17.7rem, 23.13916vw, 28.6rem);
    height: clamp(5.7rem, 7.44337vw, 9.2rem);
  }
}
.anchors .anchors_link {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding-bottom: 0.8vw;
  border-radius: 0.8vw;
  height: 100%;
  background-color: #000;
  color: #fff;
  font-size: 3.4666666667vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .anchors .anchors_link {
    padding-bottom: clamp(1.2rem, 1.61813vw, 2rem);
    border-radius: 6px;
    transition: transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    font-size: clamp(1.6rem, 2.10356vw, 2.6rem);
  }
  .anchors .anchors_link.anchors_link--small {
    font-size: clamp(1.4rem, 1.94175vw, 2.4rem);
  }
}
@media (hover: hover) and (pointer: fine) {
  .anchors .anchors_link:hover {
    transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.97);
  }
  .anchors .anchors_link:hover::after {
    -webkit-animation: arrowBottom 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
            animation: arrowBottom 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .anchors .anchors_link:hover {
    transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.97);
  }
  .anchors .anchors_link:hover::after {
    -webkit-animation: arrowBottom 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
            animation: arrowBottom 0.3s 1 cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }
}
.anchors .anchors_link::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: -5.3333333333vw;
  left: 0;
  margin: auto;
  border-right: 1px solid #fbc114;
  border-bottom: 1px solid #fbc114;
  width: 2.1333333333vw;
  transform: rotate(45deg);

  aspect-ratio: 1/1;
}
@media (min-width: 768px) {
  .anchors .anchors_link::after {
    bottom: clamp(-2.8rem, -2.26537vw, -1.8rem);
    border-right: 2px solid #fbc114;
    border-bottom: 2px solid #fbc114;
    width: clamp(0.7rem, 0.97088vw, 1.2rem);
  }
}
.anchors .anchors_line {
  width: calc((100% - 1.3333333333vw) / 2 - 1px);
  height: 11.52vw;
}
@media (min-width: 768px) {
  .anchors .anchors_line {
    display: none;
  }
}

/* --------------------------------
  movies
-------------------------------- */
.movies {
  padding-bottom: 22.9333333333vw;
  background-color: #fff085;
}
@media (min-width: 768px) {
  .movies {
    padding-bottom: clamp(6.9rem, 9.06149vw, 11.2rem);
  }
}
.movies .movie_inner {
  position: relative;
  margin-top: 10.6666666667vw;
}
@media (max-width: 767.98px) {
  .movies .movie_inner {
    padding-inline: 7.2vw;
  }
}
@media (min-width: 768px) {
  .movies .movie_inner {
    margin: clamp(2.2rem, 2.91263vw, 3.6rem) auto 0;
    max-width: clamp(70.8rem, 92.23301vw, 114rem);
  }
}
.movies .movie_content {
  display: grid;
  position: relative;
}
@media (min-width: 768px) {
  .movies .movie_content {
    background-repeat: no-repeat;
    background-size: contain;

    grid-template-rows: auto auto auto auto;
    grid-template-columns: 1fr 1fr;
    padding-inline: clamp(1.3rem, 1.69903vw, 2.1rem) clamp(1.5rem, 2.02266vw, 2.5rem);
  }
}
.movies .movie_tabs {
  display: grid;
  position: relative;
  width: 100%;

  grid-area: 1/1/2/3;
  grid-template-columns: 1fr 1fr;
  gap: 1.3333333333vw;
  padding-inline: 0.8vw;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .movies .movie_tabs {
    right: clamp(-1.6rem, -1.29449vw, -1rem);
    max-width: clamp(52rem, 67.79936vw, 83.8rem);

    gap: clamp(0.8rem, 1.05178vw, 1.3rem);
  }
}
.movies .movie_tab {
  border-radius: 1.0666666667vw 1.0666666667vw 0 0;
  height: 12.5333333333vw;
  font-size: 2.6666666667vw;
  font-weight: bold;

  grid-column: span 1;
}
@media (min-width: 768px) {
  .movies .movie_tab {
    border-radius: clamp(0.3rem, 0.40454vw, 0.5rem) clamp(0.3rem, 0.40454vw, 0.5rem) 0 0;
    height: clamp(4rem, 5.2589vw, 6.5rem);
    transition: scale 0.1s cubic-bezier(0.39, 0.575, 0.565, 1), color 0.2s cubic-bezier(0.39, 0.575, 0.565, 1), background-color 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);
    transform-origin: bottom;
    font-size: clamp(1.2rem, 1.61813vw, 2rem);

    will-change: scale;
  }
}
.movies .movie_tab[aria-selected=true] {
  background-color: #fff;
  pointer-events: none;
  color: #000;
}
.movies .movie_tab[aria-selected=false] {
  background-color: #000;
  color: #fff;
}
@media (hover: hover) and (pointer: fine) {
  .movies .movie_tab:hover {
    transition: scale 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);

    scale: 1.02;
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .movies .movie_tab:hover {
    transition: scale 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);

    scale: 1.02;
  }
}
.movies .movie_tab .new {
  color: #d83260;
  font-size: 3.4666666667vw;
}
@media (min-width: 768px) {
  .movies .movie_tab .new {
    font-size: clamp(1.6rem, 2.10356vw, 2.6rem);
  }
}
.movies .movie_pages {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
  padding: 9.6vw 6.6666666667vw 14.9333333333vw 11.2vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;

  grid-area: 2/1/5/3;
  gap: 7.4666666667vw;
}
@media (min-width: 768px) {
  .movies .movie_pages {
    display: grid;
    padding: clamp(3.9rem, 5.178vw, 6.4rem) clamp(5.2rem, 6.79612vw, 8.4rem) clamp(4.1rem, 5.42072vw, 6.7rem) clamp(7.3rem, 9.54693vw, 11.8rem);
    border-radius: clamp(0.4rem, 0.64725vw, 0.8rem);

    grid-template-rows: subgrid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(0.8rem, 1.05178vw, 1.3rem) clamp(1.9rem, 2.589vw, 3.2rem);
  }
}
.movies .movie_pages[aria-hidden=true],
.movies .movie_pages[aria-hidden=true] * {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.movies .movie_pages[aria-hidden=false] {
  visibility: visible;
  opacity: 1;
}
.movies .movie_pages::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 3;
  width: 8.5333333333vw;
  transform: translateX(-3.7333333333vw);
  background-image: url(/cmt/caloriemateforstudent/assets/images/movie_rings.png);
  background-repeat: repeat-y;
  background-size: contain;

  inset: 3.4666666667vw auto 3.4666666667vw 0;
  margin-block: auto;
}
@media (min-width: 768px) {
  .movies .movie_pages::before {
    top: clamp(2.1rem, 2.83172vw, 3.5rem);
    width: clamp(4.1rem, 5.33981vw, 6.6rem);
    height: clamp(28.5rem, 37.13593vw, 45.9rem);
    transform: translateX(clamp(-2.9rem, -2.34627vw, -1.9rem));
  }
}
.movies .movie_pages::after {
  content: "";
  position: absolute;
  z-index: -2;
  border-radius: 1.0666666667vw;
  transform: translate(clamp(0.5rem, 0.72816vw, 0.9rem), clamp(0.4rem, 0.56635vw, 0.7rem));
  background-color: #fcd038;

  inset: 0;
}
@media (min-width: 768px) {
  .movies .movie_pages::after {
    border-radius: clamp(0.4rem, 0.64725vw, 0.8rem);
  }
}
.movies .movie_pages_background {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 1.0666666667vw;
  background-color: #fff;
  background-image: url(/cmt/caloriemateforstudent/assets/images/movie_background_sm.png?update=250604);
  background-repeat: no-repeat;
  background-position: 70.9% 2.9333333333vw;
  background-size: 78.1333333333vw;

  inset: 0;
}
@media (min-width: 768px) {
  .movies .movie_pages_background {
    border-radius: clamp(0.4rem, 0.64725vw, 0.8rem);
    background-image: url(/cmt/caloriemateforstudent/assets/images/movie_background_lg.png);
    background-position: 62% 40%;
    background-size: clamp(57.9rem, 75.40454vw, 93.2rem) clamp(26rem, 33.98059vw, 42rem);
  }
}
.movies .movie_item {
  display: grid;
  width: 100%;

  margin-inline: auto;
}
@media (max-width: 767.98px) {
  .movies .movie_item {
    gap: 3.2vw;
  }
}
@media (min-width: 768px) {
  .movies .movie_item {
    max-width: clamp(37.2rem, 48.54369vw, 60rem);

    grid-template-rows: subgrid;
    grid-row: span 3;
  }
}
@media (min-width: 768px) {
  .movies .movie_item:first-of-type:last-of-type {
    grid-template-rows: auto auto 1fr;
    grid-column: span 2;
    gap: clamp(0.8rem, 1.05178vw, 1.3rem);
  }
}
.movies .movie_title {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 3.7333333333vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .movies .movie_title {
    font-size: clamp(1.4rem, 1.94175vw, 2.4rem);

    grid-row: 1/2;
  }
}
.movies .movie_image {
  display: grid;
  position: relative;
  margin-top: 1.8666666667vw;
}
@media (min-width: 768px) {
  .movies .movie_image {
    margin-top: 0;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;

    grid-row: 2/3;
  }
}
.movies .movie_image [aria-hidden=true] {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.39, 0.575, 0.565, 1), visibility 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
  pointer-events: none;
}
.movies .movie_image [aria-hidden=false] {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.3s cubic-bezier(0.39, 0.575, 0.565, 1), visibility 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
  pointer-events: auto;
}
.movies .movie_image a {
  display: block;
  position: relative;

  grid-area: 1/1;
}
.movies .movie_buttons {
  display: grid;
  align-items: flex-start;
  justify-content: center;

  grid-template-columns: 1fr 1fr;
  gap: 1.8666666667vw;
  padding-inline: 1.3333333333vw;
}
@media (min-width: 768px) {
  .movies .movie_buttons {
    margin-top: clamp(0.3rem, 0.48544vw, 0.6rem);

    gap: clamp(0.8rem, 1.05178vw, 1.3rem);
    padding-inline: clamp(0.4rem, 0.56635vw, 0.7rem);
  }
}
.movies .movie_buttons.-grid {
  grid-template-columns: 1fr 1fr;
}
.movies .movie_buttons.-grid > *:nth-child(1) {
  grid-column: span 2;
}
.movies .movie_buttons.-grid > *:nth-child(2) {
  grid-column: span 1;
}
.movies .movie_buttons.-grid > *:nth-child(3) {
  grid-column: span 1;
}
.movies .movie_item_button {
  width: 100%;
  font-size: 2.9333333333vw;
}
@media (min-width: 768px) {
  .movies .movie_item_button {
    font-size: clamp(1.1rem, 1.45632vw, 1.8rem);

    margin-inline: auto;
  }
}
.movies .movie_item_button[aria-selected=true] {
  pointer-events: none;
}
.movies .movie_item_button .caloriemateforstudent_link_wrap {
  min-height: 8vw;
}
@media (min-width: 768px) {
  .movies .movie_item_button .caloriemateforstudent_link_wrap {
    min-height: clamp(2.7rem, 3.64078vw, 4.5rem);
  }
}
.movies .movies_icons {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.movies .movies_icons .movies_icon {
  position: absolute;
}
.movies .movies_icons .movies_icon:nth-child(1) {
  top: -40vw;
  left: 1.3333333333vw;
  width: 13.3333333333vw;
}
@media (min-width: 768px) {
  .movies .movies_icons .movies_icon:nth-child(1) {
    top: clamp(-25rem, -20.22653vw, -15.6rem);
    left: clamp(-3rem, -2.42718vw, -1.9rem);
    width: clamp(4.9rem, 6.4725vw, 8rem);
  }
}
.movies .movies_icons .movies_icon:nth-child(2) {
  top: -2.6666666667vw;
  left: 8vw;
  width: 21.3333333333vw;
}
@media (min-width: 768px) {
  .movies .movies_icons .movies_icon:nth-child(2) {
    top: clamp(-13rem, -10.51779vw, -8.1rem);
    left: clamp(1.8rem, 2.42719vw, 3rem);
    width: clamp(14.4rem, 18.77023vw, 23.2rem);
  }
}
.movies .movies_icons .movies_icon:nth-child(3) {
  top: -34.6666666667vw;
  right: -6.6666666667vw;
  width: 21.3333333333vw;
}
@media (min-width: 768px) {
  .movies .movies_icons .movies_icon:nth-child(3) {
    top: initial;
    right: clamp(-18rem, -14.5631vw, -11.2rem);
    bottom: clamp(21.7rem, 28.31716vw, 35rem);
    left: auto;
    width: clamp(12.4rem, 16.18123vw, 20rem);
  }
}

/* --------------------------------
  product
-------------------------------- */
.product {
  overflow: hidden;
  padding-top: 16vw;
  padding-bottom: 24vw;
  background-color: #fbc114;
}
@media (min-width: 768px) {
  .product {
    padding-top: clamp(6.4rem, 8.41424vw, 10.4rem);
    padding-bottom: clamp(6.8rem, 8.89968vw, 11rem);
  }
}

.product_lead {
  margin-top: 5.3333333333vw;
  text-align: center;
  letter-spacing: 0;
  font-size: 6.9333333333vw;
  font-weight: bold;
  line-height: 1.4716981132;
}
@media (min-width: 768px) {
  .product_lead {
    margin-top: clamp(0.5rem, 0.72816vw, 0.9rem);
    font-size: clamp(3.1rem, 4.04531vw, 5rem);
    line-height: 1.48;
  }
}

.product_text {
  margin-top: 5.3333333333vw;
  text-align: center;
  font-size: 3.4666666667vw;
  font-weight: bold;
  line-height: 2.0384615385;
}
@media (min-width: 768px) {
  .product_text {
    margin-top: clamp(1.2rem, 1.61813vw, 2rem);
    font-size: clamp(0.9rem, 1.2945vw, 1.6rem);
    line-height: 2;
  }
}

.product_contents {
  position: relative;
  margin-top: 7.2vw;
  padding: 2.6666666667vw 7.2vw 10.6666666667vw;
  border-radius: 2.6666666667vw 2.6666666667vw 0 0;
  background: #fff7c2;
}
@media (min-width: 768px) {
  .product_contents {
    margin-top: clamp(3.1rem, 4.04531vw, 5rem);
    padding: clamp(4.3rem, 5.66344vw, 7rem) clamp(4.3rem, 5.66344vw, 7rem) clamp(6.2rem, 8.09062vw, 10rem);
    border-radius: 20px 20px 0 0;
  }
}

.product_contents_icon {
  position: absolute;
  top: 8.8vw;
  width: 21.0666666667vw;
}
@media (min-width: 768px) {
  .product_contents_icon {
    top: clamp(-5rem, -4.0453vw, -3.2rem);
    right: clamp(-96rem, -77.6699vw, -59.7rem);
    left: 0;
    margin: auto;
    width: 12vw;
    max-width: clamp(10.6rem, 13.91586vw, 17.2rem);
  }
}
@media (max-width: 1235.98px) {
  .product_contents_icon {
    right: clamp(-94.4rem, -76.3754vw, -58.7rem);
  }
}
@media (max-width: 767.98px) {
  .product_contents_icon {
    right: -3.2vw;
  }
}

.product_contents_icon02 {
  position: absolute;
  top: -6.6666666667vw;
  left: 2.6666666667vw;
  width: 14.6666666667vw;
}
@media (min-width: 768px) {
  .product_contents_icon02 {
    top: clamp(-16.3rem, -13.1877vw, -10.2rem);
    right: 0;
    left: clamp(-101rem, -81.71521vw, -62.8rem);
    margin: auto;
    width: clamp(7.5rem, 9.78965vw, 12.1rem);
  }
}

.product_contents_icon03 {
  position: absolute;
  top: -100.8vw;
  right: -26.6666666667vw;
  width: 40vw;
  transform: rotate(194deg);
}
@media (min-width: 768px) {
  .product_contents_icon03 {
    top: clamp(-48.1rem, -38.91585vw, -29.9rem);
    right: 0;
    left: clamp(61.9rem, 80.66344vw, 99.7rem);
    margin: auto;
    width: clamp(17.3rem, 22.65373vw, 28rem);
    transform: rotate(196deg);
  }
}

.product_contents_title_sub {
  display: block;
  letter-spacing: 0.04em;
  font-size: 4.2666666667vw;
  line-height: 1.5625;
}
@media (min-width: 768px) {
  .product_contents_title_sub {
    font-size: clamp(1.7rem, 2.26538vw, 2.8rem);
    line-height: 1.5;
  }
}

.product_contents_title_main {
  display: block;
  margin-top: -3.7333333333vw;
  white-space: nowrap;
  font-size: 6.6666666667vw;
  line-height: 1.5;
}
@media (min-width: 768px) {
  .product_contents_title_main {
    margin-top: clamp(0.9rem, 1.2136vw, 1.5rem);
    font-size: clamp(2.7rem, 3.55988vw, 4.4rem);
    line-height: 1.3;
  }
}
.product_contents_title_main .product_text_large {
  position: relative;
  top: 0.8vw;
  letter-spacing: 0.06em;
  color: #d83260;
  font-size: 7.2vw;
}
@media (min-width: 768px) {
  .product_contents_title_main .product_text_large {
    top: 0;
    font-size: clamp(2.9rem, 3.8835vw, 4.8rem);
  }
}
.product_contents_title_main .product_text_large span {
  position: relative;
  top: 0.8vw;
  font-size: 11.7333333333vw;
}
@media (min-width: 768px) {
  .product_contents_title_main .product_text_large span {
    position: static;
    font-size: clamp(4.7rem, 6.14887vw, 7.6rem);
    line-height: 0;
  }
}
.product_contents_title_main small {
  letter-spacing: 0.06em;
  font-size: 5.3333333333vw;
}
@media (min-width: 768px) {
  .product_contents_title_main small {
    font-size: clamp(2.2rem, 2.91263vw, 3.6rem);
  }
}

.product_contents_main {
  display: flex;
  flex-flow: column;
  margin: 4.2666666667vw auto 0;
  width: 100%;
  text-align: center;
}
@media (min-width: 768px) {
  .product_contents_main {
    flex-flow: row;
    position: relative;
    z-index: 1;
    margin-top: 0;
    padding-right: clamp(2.4rem, 3.23625vw, 4rem);
    max-width: 1000px;

    gap: clamp(2.9rem, 3.8835vw, 4.8rem);
  }
}

.product_contents_image {
  order: 1;
  position: relative;
  z-index: 1;
  margin: 5.3333333333vw auto 0;
  width: 74.6666666667vw;
}
@media (min-width: 768px) {
  .product_contents_image {
    order: 0;
    margin: clamp(-10rem, -8.09061vw, -6.3rem) 0 0 clamp(-2rem, -1.61812vw, -1.3rem);
    min-width: clamp(31.6rem, 41.26214vw, 51rem);
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
}

.product_contents_main_textarea {
  text-align: center;
}
@media (min-width: 768px) {
  .product_contents_main_textarea {
    text-align: left;
  }
}

.product_contents_main_text {
  margin-top: 4.8vw;
  text-align: center;
  font-size: 3.4666666667vw;
  font-weight: bold;
  line-height: 1.6923076923;
}
@media (min-width: 768px) {
  .product_contents_main_text {
    margin-top: 0;
    text-align: left;
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
  }
}

.product_contents_main_lead {
  margin-top: 2.1333333333vw;
  text-align: center;
  font-size: 3.4666666667vw;
  font-weight: bold;
  line-height: 1.5;
}
@media (min-width: 768px) {
  .product_contents_main_lead {
    margin-top: clamp(1.5rem, 2.02266vw, 2.5rem);
    text-align: left;
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
  }
}

.product_boxs {
  margin: -6.6666666667vw auto 0;
}
@media (min-width: 768px) {
  .product_boxs {
    display: flex;
    flex-wrap: wrap;
    margin-top: clamp(-4rem, -3.23624vw, -2.5rem);
    max-width: 1000px;

    gap: clamp(1.8rem, 2.42719vw, 3rem) clamp(2.1rem, 2.75081vw, 3.4rem);
  }
}

.product_box {
  position: relative;
  margin-top: 5.3333333333vw;
  border-radius: 2.1333333333vw;
  background-color: #fff;
}
@media (min-width: 768px) {
  .product_box {
    margin-top: 0;
    border-radius: 8px;
  }
}
@media (min-width: 768px) {
  .product_box.-box01 {
    width: 100%;
  }
}
@media (min-width: 768px) {
  .product_box.-box02 {
    width: calc((100% - clamp(2.1rem, 2.7589vw, 3.41rem)) / 2);
  }
}
@media (min-width: 768px) {
  .product_box.-box03 {
    width: calc((100% - clamp(2.1rem, 2.7589vw, 3.41rem)) / 2);
  }
}

.product_box_heading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.6666666667vw;
  border-radius: 2.1333333333vw 2.1333333333vw 0 0;
  min-height: 12vw;
  background-color: #fbc114;
  text-align: center;
  letter-spacing: 0.04em;
  color: #000;
  font-size: 4vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .product_box_heading {
    padding: clamp(0.3rem, 0.40454vw, 0.5rem);
    border-radius: 8px 8px 0 0;
    min-height: clamp(4.4rem, 5.74434vw, 7.1rem);
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
    line-height: 1.3;
  }
}
.product_box_heading small {
  font-size: 2.9333333333vw;
}
@media (min-width: 768px) {
  .product_box_heading small {
    font-size: clamp(0.8rem, 1.13269vw, 1.4rem);
  }
}
@media (max-width: 767.98px) {
  .product_box_heading .wrap {
    line-height: 1.4;
  }
}

.product_box_body {
  padding: 8vw 5.3333333333vw 6.1333333333vw;
}
@media (min-width: 768px) {
  .product_box_body {
    padding: clamp(3.1rem, 4.04531vw, 5rem) clamp(9.2rem, 12.05502vw, 14.9rem) clamp(2.4rem, 3.23625vw, 4rem);
  }
}
@media (min-width: 768px) {
  .product_box.-box02 .product_box_body {
    padding: clamp(2.7rem, 3.55988vw, 4.4rem) clamp(3.7rem, 4.93528vw, 6.1rem) clamp(1.2rem, 1.61813vw, 2rem) clamp(4rem, 5.2589vw, 6.5rem);
  }
}
.product_box.-box03 .product_box_body {
  padding: 5.3333333333vw 5.3333333333vw 8vw;
}
@media (min-width: 768px) {
  .product_box.-box03 .product_box_body {
    padding: clamp(1.8rem, 2.42719vw, 3rem) clamp(4.3rem, 5.66344vw, 7rem) clamp(1.8rem, 2.42719vw, 3rem) clamp(4.9rem, 6.4725vw, 8rem);
  }
}

@media (max-width: 767.98px) {
  .product_box.-box03 .product_box_image {
    padding: 0 2.6666666667vw;
  }
}

.product_box_features {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;

  gap: 8vw 2.6666666667vw;
}
@media (min-width: 768px) {
  .product_box_features {
    gap: clamp(2.4rem, 3.23625vw, 4rem) clamp(1.2rem, 1.61813vw, 2rem);
  }
}
.product_box.-box02 .product_box_features {
  gap: 8vw 2.6666666667vw;
}
@media (min-width: 768px) {
  .product_box.-box02 .product_box_features {
    gap: clamp(1.9rem, 2.589vw, 3.2rem) clamp(0.6rem, 0.88997vw, 1.1rem);
  }
}

.product_box_feature {
  position: relative;
  border-radius: 0.8vw;
  width: calc((100% - 2.6666666667vw) / 2);
  background-color: #fff7c2;
  text-align: center;
}
@media (min-width: 768px) {
  .product_box_feature {
    border-radius: 6px;
  }
}
@media (min-width: 768px) {
  .product_box.-box01 .product_box_feature {
    width: calc((100% - clamp(1.2rem, 1.61813vw, 2rem) * 2) / 3);
  }
}
@media (min-width: 768px) {
  .product_box.-box02 .product_box_feature {
    width: calc((100% - clamp(0.6rem, 0.88997vw, 1.1rem)) / 2);
  }
}

.product_box_feature_title {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
  padding: 0.5333333333vw 2.9333333333vw;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  transform: translateY(-50%);
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_roop.png);
  background-repeat: repeat-x;
  background-position: center;
  background-size: cover;
  text-align: center;
  letter-spacing: 0.04em;
  letter-spacing: 0.06em;
  color: #fff;
  font-size: 3.4666666667vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .product_box_feature_title {
    padding: clamp(0.1rem, 0.16182vw, 0.2rem) clamp(0.9rem, 1.2945vw, 1.6rem);
    font-size: clamp(0.9rem, 1.2945vw, 1.6rem);
  }
}
.product_box_feature_title::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1px;
  transform: translateX(-100%);
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_left.png);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: cover;

  aspect-ratio: 6/49;
}
.product_box_feature_title::after {
  content: "";
  position: absolute;
  top: 0;
  right: 1px;
  bottom: 0;
  transform: translateX(100%);
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_right.png);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: cover;

  aspect-ratio: 6/49;
}

.product_box_feature_text {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.1333333333vw 1.3333333333vw 0;
  min-height: 22.9333333333vw;
  white-space: nowrap;
  font-weight: bold;
  line-height: 1.4285714286;
}
@media (min-width: 768px) {
  .product_box_feature_text {
    padding: 0;
    line-height: 1.6;
  }
}
.product_box.-box01 .product_box_feature_text {
  padding: 2.1333333333vw 1.3333333333vw 0;
  font-size: 3.7333333333vw;
}
@media (min-width: 768px) {
  .product_box.-box01 .product_box_feature_text {
    padding: 0;
    min-height: clamp(7.1rem, 9.30421vw, 11.5rem);
    font-size: clamp(1.1rem, 1.45632vw, 1.8rem);
  }
}
.product_box.-box02 .product_box_feature_text {
  padding: 0 1.3333333333vw 1.0666666667vw;
  font-size: 4.8vw;
}
@media (min-width: 768px) {
  .product_box.-box02 .product_box_feature_text {
    padding: 0;
    min-height: clamp(6.5rem, 8.49515vw, 10.5rem);
    font-size: clamp(1.3rem, 1.77994vw, 2.2rem);
  }
}
.product_box_feature_text .quantity {
  display: flex;
  justify-content: center;
}
.product_box_feature_text .quantity img {
  position: relative;
  top: 2.9333333333vw;
  margin-left: 0.5333333333vw;
  width: auto;
  height: 3.7866666667vw;
}
@media (min-width: 768px) {
  .product_box_feature_text .quantity img {
    top: clamp(0.9rem, 1.2136vw, 1.5rem);
    margin-left: 0.1em;
    height: clamp(1.1rem, 1.45632vw, 1.8rem);
  }
}
.product_box_feature_text .caption {
  display: block;
  margin-top: 1.8666666667vw;
  font-size: 2.4vw;
  line-height: 0.8888888889;
}
@media (min-width: 768px) {
  .product_box_feature_text .caption {
    margin-top: clamp(0.3rem, 0.48544vw, 0.6rem);
    font-size: clamp(0.7rem, 0.97088vw, 1.2rem);
  }
}

.product_box_caption {
  margin-top: 2.6666666667vw;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  letter-spacing: 0.04em;
  font-size: 2.6666666667vw;
  line-height: 1.6;
}
@media (min-width: 768px) {
  .product_box_caption {
    margin: clamp(1.3rem, 1.77994vw, 2.2rem) auto 0;
    max-width: 616px;
    text-align: center;
    font-size: clamp(0.6rem, 0.80907vw, 1rem);
  }
}
@media (max-width: 767.98px) {
  .product_box.-box02 .product_box_caption {
    margin-top: 5.3333333333vw;
  }
}
.product_box.-box03 .product_box_caption {
  margin-top: 4vw;
}
@media (min-width: 768px) {
  .product_box.-box03 .product_box_caption {
    margin-top: clamp(0.6rem, 0.80907vw, 1rem);
  }
}
.product_box_caption span {
  display: block;
  padding-left: 1.9em;
  text-align: left;
  text-indent: -1.9em;
}
.product_box_caption span.-small {
  padding-left: 1em;
  text-align: left;
  text-indent: -1em;
}

.product_box_icons img {
  position: absolute;
}
.product_box.-box01 .product_box_icons img:nth-of-type(1) {
  top: 73.3333333333vw;
  right: -4.2666666667vw;
  width: 13.3333333333vw;
}
@media (min-width: 768px) {
  .product_box.-box01 .product_box_icons img:nth-of-type(1) {
    top: clamp(8rem, 10.5178vw, 13rem);
    right: clamp(-5.7rem, -4.61165vw, -3.6rem);
    width: clamp(6.8rem, 8.89968vw, 11rem);
  }
}
.product_box.-box01 .product_box_icons img:nth-of-type(2) {
  top: 92.8vw;
  left: -3.7333333333vw;
  width: 17.3333333333vw;
}
@media (min-width: 768px) {
  .product_box.-box01 .product_box_icons img:nth-of-type(2) {
    top: clamp(18.6rem, 24.27185vw, 30rem);
    left: clamp(-3rem, -2.42718vw, -1.9rem);
    width: clamp(9.1rem, 11.89321vw, 14.7rem);
  }
}
.product_box.-box02 .product_box_icons img:nth-of-type(1) {
  top: 39.2vw;
  left: 1.3333333333vw;
  width: 13.3333333333vw;
}
@media (min-width: 768px) {
  .product_box.-box02 .product_box_icons img:nth-of-type(1) {
    top: clamp(11.4rem, 14.96764vw, 18.5rem);
    left: clamp(1.2rem, 1.61813vw, 2rem);
    width: clamp(4.7rem, 6.14887vw, 7.6rem);
  }
}
.product_box.-box02 .product_box_icons img:nth-of-type(2) {
  top: 36.5333333333vw;
  right: 1.6vw;
  width: 9.8666666667vw;
}
@media (min-width: 768px) {
  .product_box.-box02 .product_box_icons img:nth-of-type(2) {
    top: clamp(9.6rem, 12.62136vw, 15.6rem);
    right: clamp(1.2rem, 1.61813vw, 2rem);
    width: clamp(3.7rem, 4.85437vw, 6rem);
  }
}
.product_box.-box02 .product_box_icons img:nth-of-type(3) {
  top: 69.3333333333vw;
  right: 19.4666666667vw;
  width: 11.2vw;
}
@media (min-width: 768px) {
  .product_box.-box02 .product_box_icons img:nth-of-type(3) {
    top: clamp(20rem, 26.05178vw, 32.2rem);
    right: clamp(7.7rem, 10.03237vw, 12.4rem);
    width: clamp(3.7rem, 4.85437vw, 6rem);
  }
}

.product_pictures {
  position: relative;
  padding: 8.2666666667vw 0 6.6666666667vw;
  border-radius: 0 0 4.2666666667vw 4.2666666667vw;
  background-color: #fff;
}
@media (min-width: 768px) {
  .product_pictures {
    padding-top: clamp(3.6rem, 4.77347vw, 5.9rem);
    border-radius: 0 0 20px 20px;
  }
}

.product_pictures_title {
  text-align: center;
}
.product_pictures_title .sub {
  display: block;
  letter-spacing: 0.04em;
  font-size: 3.4666666667vw;
  line-height: 1.7692307692;
}
@media (min-width: 768px) {
  .product_pictures_title .sub {
    font-size: clamp(1.6rem, 2.10356vw, 2.6rem);
  }
}
.product_pictures_title .main {
  display: block;
  margin-top: 2.1333333333vw;
  letter-spacing: 0.04em;
  font-size: 6.6666666667vw;
  line-height: 1.4;
}
@media (min-width: 768px) {
  .product_pictures_title .main {
    margin-top: 0;
    font-size: clamp(2.7rem, 3.55988vw, 4.4rem);
  }
}

.product_pictures_images {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 3.2vw auto 0;
  padding: 0 4.8vw 0 6.4vw;

  gap: 3.2vw 0;
}
@media (min-width: 768px) {
  .product_pictures_images {
    align-items: flex-start;
    flex-wrap: nowrap;
    margin-top: clamp(1.1rem, 1.53722vw, 1.9rem);
    padding: 0 clamp(2.4rem, 3.23625vw, 4rem);
    max-width: 1094px;

    gap: clamp(0.7rem, 0.97088vw, 1.2rem);
  }
}

.product_picture {
  flex-shrink: 0;
  width: 38.1333333333vw;
}
@media (min-width: 768px) {
  .product_picture {
    flex-shrink: 1;
    width: 100%;
  }
}
.product_picture:nth-of-type(1) {
  width: 39.2vw;
}
@media (min-width: 768px) {
  .product_picture:nth-of-type(1) {
    width: 100%;
    max-width: 247px;
  }
}
.product_picture:nth-of-type(2) {
  position: relative;
  top: 1.6vw;
}
@media (min-width: 768px) {
  .product_picture:nth-of-type(2) {
    top: clamp(0.3rem, 0.40454vw, 0.5rem);
    left: clamp(-0.5rem, -0.40453vw, -0.4rem);
    max-width: 241px;
  }
}
@media (min-width: 768px) {
  .product_picture:nth-of-type(3) {
    position: relative;
    top: clamp(1rem, 1.37541vw, 1.7rem);
    left: clamp(-0.3rem, -0.24271vw, -0.2rem);
    max-width: 239px;
  }
}
@media (min-width: 768px) {
  .product_picture:nth-of-type(4) {
    max-width: 237px;
  }
}

.product_pictures_icon {
  position: absolute;
  top: -16vw;
  right: -1.3333333333vw;
  width: 18.4vw;
  transform: rotate(10deg);
}
@media (min-width: 768px) {
  .product_pictures_icon {
    top: clamp(-12rem, -9.70873vw, -7.5rem);
    right: clamp(-24rem, -19.41747vw, -15rem);
    left: clamp(60.2rem, 78.47897vw, 97rem);
    margin: auto;
    width: clamp(9.6rem, 12.54046vw, 15.5rem);
    transform: rotate(12deg);
  }
}

.product_pictures_icon02 {
  position: absolute;
  top: -4.8vw;
  left: 1.3333333333vw;
  width: 14.6666666667vw;
}
@media (min-width: 768px) {
  .product_pictures_icon02 {
    top: clamp(-7rem, -5.66343vw, -4.4rem);
    right: 0;
    left: clamp(-75rem, -60.67961vw, -46.7rem);
    margin: auto;
    width: clamp(9rem, 11.7314vw, 14.5rem);
  }
}

.product_list {
  display: flex;
  flex-direction: column;
  position: relative;
  margin-top: 26.6666666667vw;
  padding: 0 11.2vw;

  gap: 2.6666666667vw;
}
@media (min-width: 768px) {
  .product_list {
    flex-direction: row;
    margin: clamp(7.5rem, 9.87056vw, 12.2rem) auto 0;
    padding: 0 clamp(2.4rem, 3.23625vw, 4rem);
    max-width: 1080px;

    gap: clamp(1.3rem, 1.77994vw, 2.2rem);
  }
}

.product_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  padding: 9.6vw 8vw 8.5333333333vw;
  border-radius: 2.1333333333vw;
  width: 100%;
  background-color: #fff7c2;
}
@media (min-width: 768px) {
  .product_card {
    padding: clamp(2.6rem, 3.39806vw, 4.2rem) clamp(1.1rem, 1.45632vw, 1.8rem) clamp(2.2rem, 2.91263vw, 3.6rem);
    border-radius: 20px;
    width: calc((100% - clamp(1.3rem, 1.77994vw, 2.2rem) * 2) / 3);
  }
}
.product_card + .product_card {
  margin-top: 14.1333333333vw;
}
@media (min-width: 768px) {
  .product_card + .product_card {
    margin-top: 0;
  }
}

.product_title {
  position: absolute;
  top: 4vw;
  right: 0;
  left: 0;
  margin: auto;
  transform: translateY(-100%);
  text-align: center;
}
@media (min-width: 768px) {
  .product_title {
    top: clamp(1.5rem, 2.02266vw, 2.5rem);
  }
}
.product_title .sub {
  color: #dc2902;
  font-size: 4vw;
}
@media (min-width: 768px) {
  .product_title .sub {
    font-size: clamp(1.1rem, 1.45632vw, 1.8rem);
  }
}
.product_title .main {
  display: block;
  position: relative;
  margin: auto;
  margin-top: 0.8vw;
  padding: 0.5333333333vw 2.9333333333vw;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  min-width: 45.8666666667vw;
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_roop.png);
  background-repeat: repeat-x;
  background-position: center;
  background-size: cover;
  text-align: center;
  letter-spacing: 0.04em;
  letter-spacing: 0.06em;
  color: #fff;
  font-size: 4.2666666667vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .product_title .main {
    margin-top: clamp(0.4rem, 0.56635vw, 0.7rem);
    padding: 0;
    width: clamp(13.2rem, 17.23301vw, 21.3rem);
    min-width: auto;
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
    line-height: 2;
  }
}
.product_title .main::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1px;
  transform: translateX(-100%);
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_left.png);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: cover;

  aspect-ratio: 6/49;
}
.product_title .main::after {
  content: "";
  position: absolute;
  top: 0;
  right: 1px;
  bottom: 0;
  transform: translateX(100%);
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_right.png);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: cover;

  aspect-ratio: 6/49;
}

.product_image {
  text-align: center;
}
@media (min-width: 768px) {
  .product_image {
    min-height: clamp(14.9rem, 19.41748vw, 24rem);
  }
}
.product_image img[src*=block] {
  width: 34.6666666667vw;
}
@media (min-width: 768px) {
  .product_image img[src*=block] {
    margin-top: clamp(2.9rem, 3.80259vw, 4.7rem);
    width: clamp(11.6rem, 15.12945vw, 18.7rem);
  }
}
.product_image img[src*=jelly] {
  width: 24.5333333333vw;
}
@media (min-width: 768px) {
  .product_image img[src*=jelly] {
    width: clamp(8.2rem, 10.76052vw, 13.3rem);
  }
}
.product_image img[src*=liquid] {
  width: 17.3333333333vw;
}
@media (min-width: 768px) {
  .product_image img[src*=liquid] {
    margin-top: clamp(1.9rem, 2.5081vw, 3.1rem);
    width: clamp(5.5rem, 7.28156vw, 9rem);
  }
}

.product_card_text {
  margin-top: 2.9333333333vw;
  text-align: center;
  white-space: nowrap;
  letter-spacing: 0.025em;
  font-size: 3.4666666667vw;
  font-weight: bold;
  line-height: 2.0384615385;
}
@media (min-width: 768px) {
  .product_card_text {
    margin-top: 0;
    font-size: clamp(0.9rem, 1.2945vw, 1.6rem);
    line-height: 1.8;
  }
}

.product_card_link {
  margin-top: 4.8vw;

  aspect-ratio: 275/50;
}
@media (min-width: 768px) {
  .product_card_link {
    margin-top: clamp(1.5rem, 2.02266vw, 2.5rem);

    aspect-ratio: 275/60;
  }
}
.product_card_link + .product_card_link {
  margin-top: 4vw;
}
@media (min-width: 768px) {
  .product_card_link + .product_card_link {
    margin-top: clamp(1.2rem, 1.61813vw, 2rem);
  }
}

@media (min-width: 768px) {
  .product_bottom {
    display: flex;
    flex-flow: column;
    justify-content: flex-end;
    height: 100%;
  }
}

.product_card_icons {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.product_card_icons img {
  position: absolute;
}
.product_card_icons img:nth-of-type(1) {
  top: -36.8vw;
  left: -19.2vw;
  width: 37.3333333333vw;
}
@media (min-width: 768px) {
  .product_card_icons img:nth-of-type(1) {
    top: clamp(-8.7rem, -7.03883vw, -5.5rem);
    left: clamp(-38.5rem, -31.14886vw, -24rem);
    width: clamp(20.8rem, 27.18447vw, 33.6rem);
  }
}
.product_card_icons img:nth-of-type(2) {
  right: 8.5333333333vw;
  bottom: -21.8666666667vw;
  width: 24vw;
}
@media (min-width: 768px) {
  .product_card_icons img:nth-of-type(2) {
    top: clamp(18.6rem, 24.27185vw, 30rem);
    right: clamp(-23.8rem, -19.25566vw, -14.8rem);
    bottom: initial;
    width: clamp(12.4rem, 16.18123vw, 20rem);
  }
}

/* --------------------------------
  campaigns
-------------------------------- */
.campaigns {
  padding: 14.6666666667vw 0 18.1333333333vw;
  background-color: #fff085;
}
@media (min-width: 768px) {
  .campaigns {
    padding: clamp(7.1rem, 9.30421vw, 11.5rem) 0;
  }
}
.campaigns .campaigns_title {
  margin-left: 4.5333333333vw;
  font-size: 8.8vw;
}
@media (min-width: 768px) {
  .campaigns .campaigns_title {
    margin-left: 0;
    font-size: clamp(4.3rem, 5.66344vw, 7rem);
  }
}
.campaigns .campaigns_label {
  left: 5.3333333333vw;
  width: 61.3333333333vw;
}
@media (min-width: 768px) {
  .campaigns .campaigns_label {
    bottom: clamp(0.6rem, 0.80907vw, 1rem);
    left: clamp(1.2rem, 1.61813vw, 2rem);
    width: clamp(31.6rem, 41.26214vw, 51rem);
  }
}
.campaigns .campaign_obj_01 {
  position: absolute;
  top: -9.6vw;
  left: 0;
  width: 25.3333333333vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_obj_01 {
    top: clamp(-8.4rem, -6.79611vw, -5.3rem);
    left: clamp(3.7rem, 4.85437vw, 6rem);
    width: clamp(10.2rem, 13.34952vw, 16.5rem);
    height: clamp(10.2rem, 13.34952vw, 16.5rem);
  }
}
.campaigns .campaign_obj_02 {
  position: absolute;
  top: -6.9333333333vw;
  right: -1.8666666667vw;
  width: 26.6666666667vw;

  rotate: 7deg;
}
@media (min-width: 768px) {
  .campaigns .campaign_obj_02 {
    top: clamp(-12rem, -9.70873vw, -7.5rem);
    right: clamp(-0.7rem, -0.56634vw, -0.5rem);
    width: clamp(15.7rem, 20.55017vw, 25.4rem);

    rotate: 0deg;
  }
}
.campaigns .campaign_head {
  display: flex;
  align-items: center;
  flex-flow: column;
}
.campaigns .campaign_logo {
  margin: 6.9333333333vw auto 0;
  width: 69.3333333333vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_logo {
    margin: clamp(2.8rem, 3.72169vw, 4.6rem) auto 0;
    width: clamp(30.7rem, 40.04855vw, 49.5rem);
  }
}
.campaigns .campaign_lead {
  margin-top: 3.2vw;
  text-align: center;
  font-size: 3.7333333333vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .campaigns .campaign_lead {
    margin-top: clamp(0.7rem, 0.97088vw, 1.2rem);
    font-size: clamp(1.6rem, 2.10356vw, 2.6rem);
  }
}
.campaigns .campaign_copy {
  margin-top: 3.4666666667vw;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  letter-spacing: 0.5333333333vw;
  font-size: 8.8vw;
  font-weight: bold;
  line-height: 1.1818181818;

  font-feature-settings: "palt";
}
@media (min-width: 768px) {
  .campaigns .campaign_copy {
    margin-top: clamp(2.2rem, 2.91263vw, 3.6rem);
    padding-bottom: clamp(0.4rem, 0.64725vw, 0.8rem);
    padding-left: clamp(0.4rem, 0.64725vw, 0.8rem);
    letter-spacing: clamp(0.3rem, 0.40454vw, 0.5rem);
    font-size: clamp(3.7rem, 4.85437vw, 6rem);
    line-height: 1.3;
  }
}
@media (max-width: 767.98px) {
  .campaigns .campaign_copy i {
    height: 0.2em;
  }
}
.campaigns .campaign_inner {
  position: relative;
  margin-top: 9.3333333333vw;
  width: 92vw;

  margin-inline: auto;
}
@media (min-width: 768px) {
  .campaigns .campaign_inner {
    margin-top: clamp(3.7rem, 4.85437vw, 6rem);
    padding: 0 clamp(1.2rem, 1.61813vw, 2rem);
    width: auto;
    max-width: 1280px;
  }
}
.campaigns .campaign_content {
  padding: 4vw 6.6666666667vw 10.6666666667vw;
  border-radius: 5.3333333333vw;
  background-color: #fff;
}
@media (min-width: 768px) {
  .campaigns .campaign_content {
    padding: clamp(1.5rem, 2.02266vw, 2.5rem) clamp(7.4rem, 9.70874vw, 12rem) clamp(5.5rem, 7.28156vw, 9rem);
    border-radius: clamp(1.2rem, 1.61813vw, 2rem);
  }
}
.campaigns .campaign_content_text {
  margin-top: 5.3333333333vw;
  text-align: center;
  font-size: 3.4666666667vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_text {
    margin-top: clamp(2.6rem, 3.39806vw, 4.2rem);
    font-size: clamp(1.6rem, 2.10356vw, 2.6rem);
  }
}
.campaigns .campaign_content_text .campaign_content_text_large {
  display: inline-block;
  margin-top: 1.6vw;
  letter-spacing: 0.5333333333vw;
  font-size: 5.8666666667vw;
  line-height: 1.3636363636;

  font-feature-settings: "palt";
}
@media (min-width: 768px) {
  .campaigns .campaign_content_text .campaign_content_text_large {
    margin-top: clamp(0.4rem, 0.64725vw, 0.8rem);
    letter-spacing: clamp(0.2rem, 0.32363vw, 0.4rem);
    font-size: clamp(2.7rem, 3.55988vw, 4.4rem);
    line-height: 1.2045454545;
  }
}
.campaigns .campaign_content_text .campaign_content_text_large i {
  height: 0.3em;
}
.campaigns .campaign_content_subject {
  display: flex;
  flex-flow: column;
  margin-top: 6.6666666667vw;

  gap: 8vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject {
    flex-flow: wrap;
    margin-top: clamp(2.4rem, 3.23625vw, 4rem);

    gap: clamp(2.4rem, 3.23625vw, 4rem) clamp(1.2rem, 1.61813vw, 2rem);
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item {
  position: relative;
  padding: 8vw 5.3333333333vw 5.3333333333vw;
  border-radius: 5.3333333333vw;
  width: 100%;
  background-color: #fff7c2;
  font-size: 3.4666666667vw;
  font-weight: bold;
  line-height: 2;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item {
    border-radius: clamp(1.2rem, 1.61813vw, 2rem);
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
    line-height: 2.2;
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item:first-child {
  width: 100%;
  text-align: center;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item:first-child {
    padding: clamp(2.1rem, 2.83172vw, 3.5rem) clamp(1.2rem, 1.61813vw, 2rem) clamp(1.2rem, 1.61813vw, 2rem);
    border-radius: 0;
  }
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item:nth-of-type(2) {
    padding: clamp(3.1rem, 4.04531vw, 5rem) clamp(4.3rem, 5.66344vw, 7rem);
    width: calc(60% - clamp(0.6rem, 0.80907vw, 1rem));
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item:last-child {
  text-align: center;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item:last-child {
    padding: clamp(4.3rem, 5.66344vw, 7rem) clamp(0.6rem, 0.80907vw, 1rem);
    width: calc(40% - clamp(0.6rem, 0.80907vw, 1rem));
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item_title {
  position: absolute;
  top: -3.2vw;
  left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item_title {
    top: clamp(-1.5rem, -1.21359vw, -1rem);
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item_title .main {
  display: block;
  position: relative;
  margin: auto;
  padding: 0 2.9333333333vw 0.5333333333vw;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  min-width: 46.4vw;
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_roop.png);
  background-repeat: repeat-x;
  background-position: center;
  background-size: cover;
  text-align: center;
  letter-spacing: 0.04em;
  letter-spacing: 0.06em;
  color: #fff;
  font-size: 4.2666666667vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item_title .main {
    padding: 0 clamp(1.5rem, 2.02266vw, 2.5rem) clamp(0.1rem, 0.16182vw, 0.2rem);
    min-width: auto;
    white-space: nowrap;
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
    line-height: 1.6;
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item_title .main::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1px;
  transform: translateX(-100%);
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_left.png);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: cover;

  aspect-ratio: 6/49;
}
.campaigns .campaign_content_subject .campaign_content_subject_item_title .main::after {
  content: "";
  position: absolute;
  top: 0;
  right: 1px;
  bottom: 0;
  transform: translateX(100%);
  background-image: url(/cmt/caloriemateforstudent/assets/images/masking_right.png);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: cover;

  aspect-ratio: 6/49;
}
.campaigns .campaign_content_subject .campaign_content_subject_item_list {
  display: flex;
  flex-flow: column;

  gap: 2.9333333333vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item_list {
    gap: clamp(0.9rem, 1.2136vw, 1.5rem);
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item_list li {
  display: flex;
  align-items: center;
  position: relative;
  padding-left: 1.5em;
  white-space: nowrap;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item_list li {
    padding-left: 1.5em;
    line-height: 1.6;
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item_list li::before {
  content: "1";
  position: absolute;
  top: 0.5333333333vw;
  left: 0;
  color: #d83260;
  font-size: 5.3333333333vw;
  font-weight: 900;
  line-height: 1;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item_list li::before {
    top: clamp(0.1rem, 0.16182vw, 0.2rem);
    font-size: clamp(1.8rem, 2.42719vw, 3rem);
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item_list li:nth-of-type(2)::before {
  content: "2";
}
.campaigns .campaign_content_subject .campaign_content_subject_item_date {
  margin-top: 1.3333333333vw;
  letter-spacing: 0.2666666667vw;
  font-size: 3.7333333333vw;
  line-height: 1.3;

  font-feature-settings: "palt";
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item_date {
    margin-top: 0;
    letter-spacing: clamp(0rem, 0.08091vw, 0.1rem);
    font-size: clamp(1.1rem, 1.45632vw, 1.8rem);
  }
}
.campaigns .campaign_content_subject .campaign_content_subject_item_date strong {
  font-size: 5.3333333333vw;
  font-weight: 900;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_subject .campaign_content_subject_item_date strong {
    font-size: clamp(1.7rem, 2.26538vw, 2.8rem);
  }
}
.campaigns .campaign_content_specialbox {
  position: relative;
  margin-top: 10.6666666667vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox {
    margin-top: clamp(2.4rem, 3.23625vw, 4rem);
  }
}
.campaigns .campaign_content_specialbox .campaign_content_specialbox_title {
  text-align: center;
  font-size: 5.8666666667vw;
  font-weight: bold;
  line-height: 1.3636363636;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox .campaign_content_specialbox_title {
    font-size: clamp(2.2rem, 2.99353vw, 3.7rem);
    line-height: initial;
  }
}
.campaigns .campaign_content_specialbox_obj_01 {
  position: absolute;
  top: -6.4vw;
  left: -10.1333333333vw;
  width: 18.6666666667vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox_obj_01 {
    top: clamp(-6.7rem, -5.42071vw, -4.2rem);
    left: clamp(-17.6rem, -14.23948vw, -11rem);
    width: clamp(10.5rem, 13.75405vw, 17rem);
  }
}
.campaigns .campaign_content_specialbox_obj_02 {
  position: absolute;
  right: -10.6666666667vw;
  bottom: 13.3333333333vw;
  width: 16vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox_obj_02 {
    right: clamp(-14rem, -11.32686vw, -8.7rem);
    bottom: clamp(-15rem, -12.13592vw, -9.4rem);
    width: clamp(8.9rem, 11.65049vw, 14.4rem);
  }
}
.campaigns .campaign_content_specialbox_inner {
  display: flex;
  flex-flow: column;
  margin-top: 2.6666666667vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox_inner {
    flex-flow: row;
    margin-top: clamp(1.2rem, 1.61813vw, 2rem);
    margin-left: clamp(2.1rem, 2.83172vw, 3.5rem);

    gap: clamp(1.9rem, 2.589vw, 3.2rem);
  }
}
.campaigns .campaign_content_package {
  width: 100%;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_package {
    margin-top: clamp(1.2rem, 1.61813vw, 2rem);
    width: clamp(33.4rem, 43.52751vw, 53.8rem);
  }
}
.campaigns .campaign_content_specialbox_list {
  display: flex;
  align-items: center;
  flex-flow: column;
  margin-top: 5.3333333333vw;
  text-align: center;

  gap: 4.5333333333vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox_list {
    align-items: baseline;
    margin-top: 0;
    text-align: left;

    gap: clamp(0.6rem, 0.80907vw, 1rem);
  }
}
.campaigns .campaign_content_specialbox_list li {
  position: relative;
  padding-left: 0.5em;
  letter-spacing: 0.2666666667vw;
  font-size: 3.4666666667vw;
  font-weight: bold;

  font-feature-settings: "palt";
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox_list li {
    padding-left: 0.5em;
    letter-spacing: clamp(0rem, 0.08091vw, 0.1rem);
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
  }
}
.campaigns .campaign_content_specialbox_list li::before {
  content: "・";
  display: inline-block;
  font-size: inherit;
}
@media (min-width: 768px) {
  .campaigns .campaign_content_specialbox_list li::before {
    position: absolute;
    top: 0;
    left: 0;
  }
}
.campaigns .campaign_special {
  display: flex;
  align-items: center;
  flex-flow: column;
  position: relative;
  margin-top: 13.3333333333vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_special {
    margin: 0 auto;
    margin-top: clamp(6.4rem, 8.41424vw, 10.4rem);
    max-width: clamp(77rem, 100.32363vw, 124rem);
  }
}
.campaigns .campaign_special .campaign_content_special_obj_01 {
  position: absolute;
  top: -8vw;
  left: -2.6666666667vw;
  width: 13.3333333333vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_special .campaign_content_special_obj_01 {
    top: clamp(0.4rem, 0.56635vw, 0.7rem);
    left: clamp(5.3rem, 6.95793vw, 8.6rem);
    width: clamp(7.5rem, 9.87056vw, 12.2rem);
  }
}
.campaigns .campaign_special .campaign_content_special_obj_02 {
  position: absolute;
  right: 2.6666666667vw;
  bottom: -24.8vw;
  width: 26.6666666667vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_special .campaign_content_special_obj_02 {
    right: clamp(1.6rem, 2.18447vw, 2.7rem);
    bottom: clamp(-15rem, -12.13592vw, -9.4rem);
    width: clamp(15.4rem, 20.14564vw, 24.9rem);
  }
}
.campaigns .campaign_special .campaign_special_logo {
  width: 74.6666666667vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_special .campaign_special_logo {
    margin-left: clamp(1.1rem, 1.45632vw, 1.8rem);
    width: clamp(32rem, 41.66667vw, 51.5rem);
  }
}
.campaigns .campaign_special .campaign_special_text {
  margin-top: 3.2vw;
  text-align: center;
  font-size: 6.6666666667vw;
  line-height: 1.24;
}
@media (min-width: 768px) {
  .campaigns .campaign_special .campaign_special_text {
    margin-top: clamp(1.5rem, 2.02266vw, 2.5rem);
    font-size: clamp(2.2rem, 2.91263vw, 3.6rem);
    line-height: 1.2777777778;
  }
}
.campaigns .campaign_special .campaign_special_banner {
  display: inline-block;
  margin-top: 6.4vw;
  width: 79.4666666667vw;
}
@media (min-width: 768px) {
  .campaigns .campaign_special .campaign_special_banner {
    margin-top: clamp(2.4rem, 3.23625vw, 4rem);
    width: clamp(36.6rem, 47.73463vw, 59rem);
    transition: opacity 0.15s cubic-bezier(0.39, 0.575, 0.565, 1), transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
}
@media (hover: hover) and (pointer: fine) {
  .campaigns .campaign_special .campaign_special_banner:hover {
    opacity: 0.8;
    transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1), transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.99);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .campaigns .campaign_special .campaign_special_banner:hover {
    opacity: 0.8;
    transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1), transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.99);
  }
}

/* --------------------------------
  anchors
-------------------------------- */
.school-of-lock {
  padding: 12.2666666667vw 6.6666666667vw 17.3333333333vw;
  background-color: #fff7c2;
}
@media (min-width: 768px) {
  .school-of-lock {
    padding: clamp(4.4rem, 5.82525vw, 7.2rem) clamp(5.5rem, 7.28156vw, 9rem);
  }
}
.school-of-lock .school-of-lock_contents {
  display: grid;
  justify-content: center;

  grid-template-rows: 48.2666666667vw auto auto auto;
  gap: 1.0666666667vw;
}
@media (min-width: 768px) {
  .school-of-lock .school-of-lock_contents {
    grid-template-rows: clamp(20.5rem, 26.69903vw, 33rem) auto auto auto;
    gap: clamp(0.5rem, 0.72816vw, 0.9rem);
  }
}
.school-of-lock .school-of-lock_image {
  display: flex;
  justify-content: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;

  margin-inline: auto;
}
.school-of-lock .school-of-lock_image img {
  width: auto;
  height: 100%;
}
.school-of-lock .school-of-lock_lead {
  margin-top: 1.3333333333vw;
  text-align: center;
  font-size: 6.6666666667vw;
  font-weight: bold;
}
@media (min-width: 768px) {
  .school-of-lock .school-of-lock_lead {
    margin-top: clamp(0.9rem, 1.2136vw, 1.5rem);
    font-size: clamp(2.2rem, 2.91263vw, 3.6rem);
  }
}
.school-of-lock .school-of-lock_lead .accent {
  color: #d83260;
}
.school-of-lock .school-of-lock_text {
  text-align: center;
  font-size: 3.4666666667vw;
  font-weight: bold;
  line-height: 2.1;
}
@media (min-width: 768px) {
  .school-of-lock .school-of-lock_text {
    font-size: clamp(1.2rem, 1.61813vw, 2rem);
  }
}
.school-of-lock .school-of-lock_banners {
  margin-top: 3.4666666667vw;

  margin-inline: auto;
}
@media (min-width: 768px) {
  .school-of-lock .school-of-lock_banners {
    margin-top: clamp(1.5rem, 2.02266vw, 2.5rem);
    width: clamp(29.5rem, 38.51133vw, 47.6rem);
  }
}
.school-of-lock .school-of-lock_banner {
  display: block;
}
@media (min-width: 768px) {
  .school-of-lock .school-of-lock_banner {
    transition: opacity 0.15s cubic-bezier(0.39, 0.575, 0.565, 1), transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
}
@media (hover: hover) and (pointer: fine) {
  .school-of-lock .school-of-lock_banner:hover {
    opacity: 0.8;
    transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1), transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.99);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .school-of-lock .school-of-lock_banner:hover {
    opacity: 0.8;
    transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1), transform 0.25s cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scale(0.99);
  }
}

/* --------------------------------
  introduction
-------------------------------- */
.page-top {
  display: flex;
  justify-content: flex-end;
  position: sticky;
  z-index: 1;
  right: 0;
  bottom: 3.2vw;
  margin: -8.1333333333vw auto 0;
  padding-right: 3.2vw;
  max-width: 1440px;
}
@media (min-width: 768px) {
  .page-top {
    bottom: clamp(1.9rem, 2.5081vw, 3.1rem);
    margin-top: clamp(-5.1rem, -4.12621vw, -3.2rem);
    padding-right: clamp(1.9rem, 2.5081vw, 3.1rem);
  }
}
.page-top a {
  display: block;
  width: 8.1333333333vw;
  transition: opacity 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);
}
@media (min-width: 768px) {
  .page-top a {
    width: clamp(3.1rem, 4.12622vw, 5.1rem);
  }
}
@media (hover: hover) and (pointer: fine) {
  .page-top a:hover {
    opacity: 0.8;
    transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1);
  }
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .page-top a:hover {
    opacity: 0.8;
    transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1);
  }
}

/* --------------------------------
  footer
-------------------------------- */
.footer {
  background-color: #fff;
}

.footer_inner {
  position: relative;
  padding: 16.2666666667vw 0 9.6vw;
}
@media (min-width: 768px) {
  .footer_inner {
    padding: clamp(4.9rem, 6.4725vw, 8rem) clamp(3.1rem, 4.04531vw, 5rem);
  }
}

.footer_body {
  display: flex;
  align-items: center;
  flex-direction: column;

  gap: 10.1333333333vw;
}
@media (min-width: 768px) {
  .footer_body {
    align-items: flex-start;
    flex-direction: row;
    justify-content: center;
    margin: 0 auto;
    max-width: 1236px;

    gap: clamp(3.7rem, 4.85437vw, 6rem);
  }
}

.footer_item {
  width: 62.1333333333vw;
}
@media (min-width: 768px) {
  .footer_item {
    width: clamp(19.6rem, 25.56635vw, 31.6rem);
  }
}

.footer_bnr {
  display: block;
}

.footer_desc {
  margin-top: 2.6666666667vw;
  text-align: center;
  font-size: 3.2vw;
  line-height: 1.6666666667;
}
@media (min-width: 768px) {
  .footer_desc {
    margin-top: clamp(0.9rem, 1.2945vw, 1.6rem);
    font-size: clamp(0.7rem, 0.97088vw, 1.2rem);
    line-height: 1.8333333333;
  }
}

.footer_bottom {
  padding: 2.1333333333vw 2.6666666667vw 2.9333333333vw;
  border-top: 1px solid #cfcfcf;
}
@media (min-width: 768px) {
  .footer_bottom {
    padding: clamp(0.6rem, 0.80907vw, 1rem) clamp(6.2rem, 8.09062vw, 10rem);
  }
}
.footer_bottom a {
  display: block;
  margin-right: auto;
  width: clamp(8.6rem, 11.24596vw, 13.9rem);
}
@media (min-width: 768px) {
  .footer_bottom a {
    margin: 0 0 0 auto;
    width: clamp(9.5rem, 12.37865vw, 15.3rem);
  }
}

/* ------------------------
  utilities Classes
------------------------ */
.u-f-braces {
  margin-left: -0.4em;
}

.u-underline-01 {
  display: inline-block;
  position: relative;
  z-index: 1;
}
.u-underline-01 > i {
  position: absolute;
  z-index: -1;
  right: -1px;
  bottom: 2px;
  left: -3px;
  height: 0.4em;
  background-color: #fbc114;
}

.u-underline-02 {
  display: inline-block;
  position: relative;
  z-index: 1;
}
.u-underline-02 > i {
  position: absolute;
  z-index: -1;
  right: -1px;
  bottom: 2px;
  left: -3px;
  height: 0.4em;
  background-color: #fff085;
}
@media (min-width: 768px) {
  .product_contents_title_main .u-underline-02 i {
    bottom: clamp(-0.7rem, -0.56634vw, -0.5rem);
  }
}

.u-color-red {
  color: #dc2902;
}

.u-color-pink {
  color: #d83260;
}

.u-lineheight {
  display: block;
  padding-top: 1.1em;
}

.u-gothic {
  font-family: source-han-sans-japanese, sans-serif !important;
}

.u-montserrat {
  font-family: "Montserrat", sans-serif !important;
}

.u-shadow {
  box-shadow: 2.5px 1.5px 0 #000;
}
@media (min-width: 768px) {
  .u-shadow {
    box-shadow: clamp(0.3rem, 0.48544vw, 0.6rem) clamp(0.1rem, 0.16182vw, 0.2rem) 0 #000;
  }
}

.u-hidden {
  display: none !important;
  visibility: hidden;
}

@media (max-width: 767.98px) {
  .u-hidden-sm {
    display: none !important;
    visibility: hidden;
  }
}

.u-hidden-up-sm {
  display: none !important;
  visibility: hidden;
}

@media (max-width: 767.98px) {
  .u-hidden-down-sm {
    display: none !important;
    visibility: hidden;
  }
}

@media (min-width: 768px) and (max-width: 1235.98px) {
  .u-hidden-md {
    display: none !important;
    visibility: hidden;
  }
}

@media (min-width: 768px) {
  .u-hidden-up-md {
    display: none !important;
    visibility: hidden;
  }
}

@media (max-width: 1235.98px) {
  .u-hidden-down-md {
    display: none !important;
    visibility: hidden;
  }
}

@media (min-width: 1236px) {
  .u-hidden-lg {
    display: none !important;
    visibility: hidden;
  }
}

@media (min-width: 1236px) {
  .u-hidden-up-lg {
    display: none !important;
    visibility: hidden;
  }
}

.u-hidden-down-lg {
  display: none !important;
  visibility: hidden;
}

.u-visuallyhidden {
  overflow: hidden;
  clip: rect(0 0 0 0);
  position: absolute;
  margin: -1px;
  padding: 0;
  border: 0;
  width: 1px;
  height: 1px;
}

.u-visuallyhidden.focusable:active,
.u-visuallyhidden.focusable:focus {
  overflow: visible;
  clip: auto;
  position: static;
  margin: 0;
  width: auto;
  height: auto;
}

.u-invisible {
  visibility: hidden;
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/*
* top.css
*
*/