@charset "SHIFT-JIS";

@import url("https://yakult-t.jp/css/style.css");

* {
  box-sizing: border-box;
}

html {
  text-size-adjust: 100%;
  overflow-y: scroll;
  font-size: 62.5%;
  height: 100%;
}

body {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO", "verdana", sans-serif;
  width: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  color: rgba(0, 0, 0, 1);
  margin: 0;
  position: relative;
}

/*
100	Thin
300	Light
400	Regular
500	Medium
700	Bold
900	Black */

a {
  text-decoration: none;
  transition: all .2s ease-out;
  text-decoration: none;
}

a:hover {
  transition: all .2s ease-out;
  cursor: pointer;
  opacity: 0.7;
}

ol,
ul,
li {
  list-style: none;
  padding: 0;
}

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

.l ._pc {
  display: block;
}

._pc {
  display: none;
}

.l ._sp {
  display: none;
}

._sp {
  display: block;
}



/* ヘッダー ----------------------------------*/
/* .wrapper div.header {
  margin: 0 auto;
  background-color: rgba(255, 255, 255, 1);
} */

#header {
  background: transparent;
  overflow-x: hidden;
  padding: 10px 0;
  position: relative;
}

.inner {
  position: static;
  margin: 0 auto;
  max-width: 1000px;
  padding: 0;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 30px;
}

.header_logo {
  width: 114px;
  display: inline-block;
}

/* フッター ------------------------------------*/

#footer {
  position: relative;
  background-color: rgba(255, 255, 255, 1)af2;
  padding: 10px 0;
  z-index: 2;
  border-top: rgba(201, 12, 26, 1) solid 2px;
}

@media screen and (min-width: 767px) {
  .footer {
    margin: 0;
    background: rgba(251, 246, 236, 1);
  }
}

@media screen and (max-width: 767px) {
  .footer {
    margin: 0;
  }
}

#footer .logo,
#footer #copyright {
  text-align: center;
  margin: 8px auto;
}

#footer a {
  display: block;
  width: 114px;
  margin: 0 auto;
}

/* ================================
        Layout
================================ */
.Center {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;

  max-width: 744px;
  position: relative;
}

.s .Center {
  padding-left: 4.2666vw;
  padding-right: 4.2666vw;
}

.CommonNote {
  font-size: 1.2rem;
}

.s .CommonNote {
  font-size: 3.2vw;
}

.CommonNote>p {
  padding-bottom: 8px;
  padding-left: 1em;
  text-indent: -1em;
}

.s .CommonNote>p {
  padding-bottom: 2.1333vw;
}

.s .CommonNote>p:last-child {
  padding-bottom: 0;
}


.CommonList li {
  text-indent: -1em;
  padding-left: 1em;
  text-align: left;
}

.CommonBox {
  padding: 47px 26px 40px 26px;
  border-radius: 24px;
}

.s .CommonBox {
  padding: 10.933vw 4.266vw 8.533vw 4.266vw;
}

.CommonBox._red {
  background: rgba(230, 0, 57, 1);
}

.CommonBox._white {
  background: rgba(255, 255, 255, 1);
}

.s .TextIndetSp {
  text-indent: -1em;
  padding-left: 1em;
}

/* letter-spacing */
.ls0,
.l .l-ls0,
.m .m-ls0,
.s .s-ls0 {
  letter-spacing: 0
}

.ls8,
.l .l-ls8,
.m .m-ls8,
.s .s-ls8 {
  letter-spacing: -0.8px
}

.ls9,
.l .l-ls9,
.m .m-ls9,
.s .s-ls9 {
  letter-spacing: -0.9px
}

.ls10,
.l .l-ls10,
.m .m-ls10,
.s .s-ls10 {
  letter-spacing: -1.0px
}

.ls11,
.l .l-ls11,
.m .m-ls11,
.s .s-ls11 {
  letter-spacing: -1.1px
}

.ls12,
.l .l-ls12,
.m .m-ls12,
.s .s-ls12 {
  letter-spacing: -1.2px
}

.ls13,
.l .l-ls13,
.m .m-ls13,
.s .s-ls13 {
  letter-spacing: -1.3px
}

.ls14,
.l .l-ls14,
.m .m-ls14,
.s .s-ls14 {
  letter-spacing: -1.4px
}

.ls15,
.l .l-ls15,
.m .m-ls15,
.s .s-ls15 {
  letter-spacing: -1.5px
}

.ls16,
.l .l-ls16,
.m .m-ls16,
.s .s-ls16 {
  letter-spacing: -1.6px
}

.ls18,
.l .l-ls18,
.m .m-ls18,
.s .s-ls18 {
  letter-spacing: -1.8px
}

.ls20,
.l .l-ls20,
.m .m-ls20,
.s .s-ls20 {
  letter-spacing: -2px
}

.ls30,
.l .l-ls30,
.m .m-ls30,
.s .s-ls30 {
  letter-spacing: -3px
}

.SrOnly {
  border: 0 !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
  width: 1px !important;
}

/* ================================
        Title
================================ */
h2 {
  font-size: 3.6rem;
  font-weight: 700;
  text-align: center;
}

.s h2 {
  font-size: 6.4vw;
}

h2 span {
  position: relative;
}

h2._art span::before {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -70px;
  margin: auto;
  width: 54px;
  height: 54px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-paints.png);
  background-size: 54px 54px;
  background-repeat: no-repeat;
}

.s h2._art span::before {
  left: -18.666vw;
  width: 14.399vw;
  height: 14.399vw;
}

h2._art span::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -70px;
  margin: auto;
  width: 54px;
  height: 54px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-brush.png);
  background-size: 54px 44px;
  background-repeat: no-repeat;
}

.s h2._art span::after {
  right: -18.666vw;
  width: 14.399vw;
  height: 14.399vw;
}

h2._art._white span::before {
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-paints-white.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

h2._art._white span::after {
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-brush-white.png);
  background-size: 100%;
  background-repeat: no-repeat;
}


h2._barber span::before {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -70px;
  margin: auto;
  width: 54px;
  height: 52px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-scissors.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s h2._barber span::before {
  left: -18.133vw;
  width: 14.399vw;
  height: 13.866vw;
}

h2._barber span::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -70px;
  margin: auto;
  width: 54px;
  height: 54px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-ruler.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s h2._barber span::after {
  right: -18.133vw;
  width: 14.399vw;
  height: 14.399vw;
}


h2._barber._white span::before {
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-scissors-white.png);
  background-size: 100%;
  background-repeat: no-repeat;
}


h2._barber._white span::after {
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-ruler-white.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

h4 {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
}

.s h4 {
  font-size: 4.2666vw;
}

/* ================================
        Slider
================================ */
.JsSlider {
  max-width: 564px;
  margin: 0 auto;
  text-align: center;
}

.JsSlider .slick-prev,
.JsSlider .slick-next {
  position: absolute;
  top: 0;
  bottom: 0;
  top: calc(50% + 36px);
  transform: translateY(-50%);
  z-index: 2;
  background: none;
  border: none;
  padding: 0;
}

.s .JsSlider .slick-prev,
.s .JsSlider .slick-next {
  top: calc(50% + 6.4vw);
}

.JsSlider._others .slick-prev,
.JsSlider._others .slick-next {
  top: calc(50%);
}

.s .JsSlider._others .slick-prev,
.s .JsSlider._others .slick-next {
  top: calc(50% - 2.666vw);
}

.JsSlider .slick-prev {
  left: -44px;
}

.s .JsSlider .slick-prev {
  left: 3.784vw;
}

.JsSlider .slick-next {
  right: -44px;
}

.s .JsSlider .slick-next {
  right: 3.784vw;
}


.JsSlider .slick-prev img,
.JsSlider .slick-next img {
  width: 14px;
  height: 24px;
}

.s .JsSlider .slick-prev img,
.s .JsSlider .slick-next img {
  width: 3.6319vw;
  height: 6.274vw;
}

.JsSliderProduct {
  margin: 0 auto;
  text-align: center;
  position: relative;
}

.JsSliderProduct li {
  padding: 0 3px;
}


.JsSliderProduct li div:nth-of-type(2) {
  font-size: 1.2rem;
  font-weight: 500;
  padding-top: 8px;
}

.s .JsSliderProduct li div:nth-of-type(2) {
  font-size: 3.2vw;
  padding-top: 2.133vw;
}

.JsSliderProduct .slick-prev,
.JsSliderProduct .slick-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  background: none;
  border: none;
  padding: 0;
}

.s .JsSliderProduct .slick-prev,
.s .JsSliderProduct .slick-next {
  transform: translateY(-100%);
}

.JsSliderProduct .slick-prev {
  left: -24px;
}

.s .JsSliderProduct .slick-prev {
  left: -11.416vw;
}

.JsSliderProduct .slick-next {
  right: -24px;
}

.s .JsSliderProduct .slick-next {
  right: -11.416vw;
}

.JsSliderProduct .slick-prev img,
.JsSliderProduct .slick-next img {
  width: 14px;
  height: 24px;
}

.s .JsSliderProduct .slick-prev img,
.s .JsSliderProduct .slick-next img {
  width: 3.6319vw;
  height: 6.274vw;
}

.dots-wrap {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding-top: 20px;
}

.s .dots-wrap {
  padding-top: 2.666vw;
}



.JsSliderProduct._shop .dots-wrap {
  text-align: left;
  display: block;
}

.JsSliderProduct._shop .dots-wrap>* {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}



.dots-wrap li {
  width: 2.666vw;
  height: 2.666vw;
  margin: 0 1.066vw 1.066vw 1.066vw;
  background: rgba(59, 60, 60, 0.2);
  border-radius: 50%;
  cursor: pointer;
}

.dots-wrap li:hover,
.dots-wrap li.slick-active {
  background: rgba(59, 60, 60, 0.6);
}

.dots-wrap li button {
  display: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  padding: 0;
  border: none;
  background-color: transparent;
}

/* ================================
        Mv
================================ */
.Mv {
  background: rgba(72, 162, 196, 1);
  padding: 0 20px;
}

.s .Mv {
  background: rgba(72, 162, 196, 1);
  padding: 0;
}

.Mv h1 {
  max-width: 640px;
  margin: 0 auto;
  padding: 10px 0;
}

.s .Mv h1 {
  max-width: 100%;
  padding: 1.8666vw 0;
}

/* ================================
        Lead
================================ */
.LeadTermArea {
  background: rgba(230, 0, 57, 1);
  padding: 10px 0;
}

.s .LeadTermArea {
  line-height: 1.1;
  padding: 2.666vw 0;
}

.LeadTerm {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 362px;
  margin: 0 auto;
  position: relative;
}

.s .LeadTerm {
  max-width: 60.533vw;
}

.LeadTerm::after {
  content: "";
  display: inline;
  position: absolute;
  bottom: 0;
  right: -88px;
  width: 69px;
  height: 131px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-yakult-lead.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .LeadTerm::after {
  right: -14.666vw;
  width: 11.557vw;
  height: 21.973vw;
}

.LeadTermSub {
  max-width: 97px;
  position: absolute;
  left: -107px;
}

.s .LeadTermSub {
  max-width: 16.266vw;
  left: -17.866vw;
}

.LeadArea {
  background: rgba(223, 240, 243, 1);
  padding: 64px 0 40px;
}

.s .LeadArea {
  padding: 9.066vw 0 6.4vw;
}

.LeadArea h2 {
  padding-bottom: 24px;
  color: rgba(59, 60, 60, 1);
}

.s .LeadArea h2 {
  padding-bottom: 6.4vw;
}


.LeadArea h3 {
  font-size: 2.7rem;
  font-weight: bold;
  padding-bottom: 22px;
}

.s .LeadArea h3 {
  font-size: 7.199vw;
  padding-bottom: 5.7333vw;
}

.LeadArea h3 span {
  position: relative;
}

.LeadArea h3 span::before {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -48px;
  margin: auto;
  width: 26px;
  height: 51px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-yakult.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .LeadArea h3 span::before {
  left: -12.8vw;
  width: 6.9333vw;
  height: 13.6vw;
}

.LeadArea h3 span::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -48px;
  margin: auto;
  width: 26px;
  height: 51px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-yakult.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .LeadArea h3 span::after {
  right: -12.8vw;
  width: 6.9333vw;
  height: 13.6vw;
}

.LeadArea .CommonBox {
  padding: 27px 26px;
  margin-bottom: 40px;
}

.s .LeadArea .CommonBox {
  padding: 6.4vw 4.266vw;
  margin-bottom: 10.666vw;
}

/* 作品紹介 */
.LeadWorks {
  padding-bottom: 40px;
}

.s .LeadWorks {
  padding-bottom: 0;
}


.LeadWorks .CommonBox._arrow {
  position: relative;
}

.s .LeadWorks .CommonBox._arrow {
  margin-bottom: 8.333vw;
}

.s .LeadWorks .CommonBox:not(._arrow) {
  margin-bottom: 13.066vw;
}

.LeadWorks .CommonBox._arrow::before {
  content: "";
  position: absolute;
  top: -24px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 24px solid rgba(255, 255, 255, 1);
}

.s .LeadWorks .CommonBox._arrow::before {
  top: -6.4vw;
  border-left: 3.2vw solid transparent;
  border-right: 3.2vw solid transparent;
  border-bottom: 6.4vw solid rgba(255, 255, 255, 1);
}




.LeadWorksItem {
  margin: 0 auto;
  max-width: 704px;
  padding-bottom: 27px;
}

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

.LeadWorksName {
  display: inline-block;
  font-size: 2.4rem;
  font-weight: bold;
  position: relative;
  margin-bottom: 27px;
}

.s .LeadWorksName {
  font-size: 4.2666vw;
  margin-bottom: 4.8vw;
}

.LeadWorksName span {
  font-size: 1.6rem;
}

.s .LeadWorksName span {
  font-size: 3.2vw;
}

.LeadWorksName::before {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -65.5px;
  margin: auto;
  width: 50px;
  height: 50px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-works1.png);
  background-size: 100%;
  background-repeat: no-repeat;
  border-radius: 50vw;
}

.s .LeadWorksName::before {
  left: -15.04vw;
  width: 10.879vw;
  height: 10.879vw;
}

.LeadWorksText {
  font-size: 1.8rem;
}

.s .LeadWorksText {
  font-size: 4.266vw;
}

.LeadWorksName::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -54px;
  margin: auto;
  width: 29px;
  height: 29px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-x.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .LeadWorksName::after {
  right: -14.5vw;
  margin: auto;
  width: 7.677vw;
  height: 7.677vw;
}

.LeadCourseArea {
  text-align: center;
}

.LeadCourseText {
  font-size: 1.8rem;
  margin-bottom: 20px;
  font-weight: 500;
  position: relative;
  display: inline-block;
}

.s .LeadCourseText {
  font-size: 4.266vw;
  margin-bottom: 5.333vw;
}

.LeadCourseText::before {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -30px;
  margin: auto;
  width: 22px;
  height: 42px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-line-left.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .LeadCourseText::before {
  top: auto;
  left: -12vw;
  width: 5.333vw;
  height: 10.666vw;
}

.LeadCourseText::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -30px;
  margin: auto;
  width: 22px;
  height: 42px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-line-right.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .LeadCourseText::after {
  top: auto;
  right: -12vw;
  width: 5.333vw;
  height: 10.666vw;
}

.LeadCourseText span {
  color: rgba(230, 0, 57, 1);
  font-weight: 700;
}

.LeadCourseBtn a {
  display: block;
  max-width: 388px;
  margin: 0 auto;
}

.s .LeadCourseBtn a {
  max-width: 82.933vw;
}

/* キャンペーン概要 */
.LeadCampaign {
  color: rgba(255, 255, 255, 1);
  text-align: center;
}

.LeadCampaign h4 {
  font-size: 3.4rem;
  font-weight: bold;
  padding-bottom: 16px;
  line-height: 1.4;
}

.s .LeadCampaign h4 {
  font-size: 6.4vw;
  padding-bottom: 2.1333vw;
  margin: 0 -3.2vw;
}

.LeadCampaign h4 ._white {
  font-size: 4.4rem;
  background: rgba(255, 255, 255, 1);
  color: rgba(230, 0, 57, 1);
  padding: 6px 12px;
  line-height: 1;
  display: inline-block;
  margin-right: 8px;
}

.s .LeadCampaign h4 ._white {
  font-size: 8vw;
  padding: 1.6vw 0.4vw;
}

.LeadCampaign h4 ._leftindent {
  transform: translateX(-1vw);
  display: inline-block;
}

.s .LeadCampaign h4 ._leftindent {
  transform: translateX(-2vw);
}


.LeadCampaignText {
  font-size: 2.4rem;
  padding-bottom: 27px;
}

.s .LeadCampaignText {
  font-size: 4.8vw;
  padding-bottom: 5.066vw;
  letter-spacing: -0.8px;
}

.LeadCampaignText ._wave {
  font-weight: bold;
  position: relative;
  display: inline-block;
  padding-bottom: 6px;
}

.s .LeadCampaignText ._wave {
  padding-bottom: 1.0666vw;
}

.LeadCampaignText ._wave::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4.5px;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-wave.png);
  background-repeat: repeat-x;
  background-size: auto 100%;
}

.s .LeadCampaignText ._wave::after {
  height: 1.2vw;
}

.LeadBox {
  background: rgba(255, 255, 255, 1);
  color: rgba(0, 0, 0, 1);
  border-radius: 12px;
  padding: 24px 38px;
  text-align: center;
  font-size: 1.6rem;
}

.s .LeadBox {
  padding: 4vw;
  font-size: 4vw;
}

.s .LeadBox .CommonNote {
  padding-bottom: 5.333vw;
  margin-left: -3.2vw;
}



.LeadCampaignList li {
  display: flex;
  align-items: flex-start;
  text-align: left;
  padding-bottom: 8px;
  line-height: 1.6;
}

.LeadCampaignList li div:nth-of-type(1) {
  font-weight: bold;
}

.s .LeadCampaignList li div:nth-of-type(1) {
  width: 21.333vw;
}


.LeadCampaign h5 {
  text-align: center;
  background: rgba(20, 130, 98, 1);
  border-radius: 4px;
  color: rgba(255, 255, 255, 1);
  padding: 4px;
  font-weight: 700;
  margin-top: 8px;
  margin-bottom: 16px;
}

.s .LeadCampaign h5 {
  padding: 1.066vw;
  margin-top: 0;
  margin-bottom: 4.2666vw;
}

.LeadProduct {
  color: rgba(255, 255, 255, 1);
  text-align: center;
}

.s .LeadBox .CommonList li {
  margin: 0 -1vw;
}



/* 対象商品 */
.LeadProductInner {
  text-align: center;
}

.LeadProduct h4 {
  font-size: 2rem;
  font-weight: 400;
  padding-bottom: 16px;
}

.s .LeadProduct h4 {
  font-size: 4.8vw;
  padding-bottom: 4.2666vw;
}

.LeadProduct h5 {
  color: rgba(60, 128, 100, 1);
}

.LeadAccordion {
  padding: 0;
  margin-bottom: 24px;
  font-size: 1.6rem;
  font-weight: bold;
  color: rgba(20, 130, 98, 1);
  border: 2px solid rgba(60, 128, 100, 1);
  border-radius: 35px;
  text-align: center;
}

.s .LeadAccordion {
  padding: 0;
  margin-bottom: 6.4vw;
  font-size: 4.2666vw;
  border-radius: 20px;
}

.Lead .LeadAccordion:last-child {
  margin-bottom: 0;
}

.LeadAccordionHeader {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
}

.LeadAccordionHeader {
  cursor: pointer;
  position: relative;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 15px 50px;
}

.s .LeadAccordionHeader {
  font-size: 4.2666vw;
  padding: 4vw 0;
}

/* .LeadAccordionHeader::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 49px;
  margin: auto;
  width: 20px;
  height: 20px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-leadtoggle-plus.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .LeadAccordionHeader::after {
  right: 6.4vw;
  width: 5.333vw;
  height: 5.333vw;
}

.LeadAccordionHeader.open::after {
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-leadtoggle-minus.png);
}

.LeadAccordionHeader.open::before {
  transform: rotate(180deg);
} */

.LeadAccordionContent {
  color: rgba(59, 60, 60, 1);
  font-weight: 500;
  line-height: 1.4;
  width: 100%;
}

/* .LeadAccordionHeader.open+.LeadAccordionContent {
  max-height: 1000px;
  opacity: 1;
} */

.LeadAccordionInner {
  padding: 9px 20px 24px 20px;
}

.s .LeadAccordionInner {
  padding: 2.4vw 4.266vw 6.4vw 4.266vw;
}

.LeadAccordionList {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.LeadAccordionList li {
  max-width: 171px;
}

.s .LeadAccordionList li {
  max-width: 28.666vw;
}

.s .LeadAccordionList {
  justify-content: space-between;
}

.LeadAccordionList li:nth-child(-n + 3) {
  padding-bottom: 16px;
}

.s .LeadAccordionList li:nth-child(-n + 3) {
  padding-bottom: 0;
}

.LeadAccordionList li div:nth-of-type(2) {
  font-size: 1.2rem;
  font-weight: 500;
  padding-top: 8px;
  letter-spacing: 0.4px;
}

.s .LeadAccordionList li div:nth-of-type(2) {
  font-size: 3.2vw;
  padding-top: 2.133vw;
  margin: 0 -1vw;
  letter-spacing: 0;
}

.LeadProductText {
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
}

.s .LeadProductText {
  font-size: 4.266vw;
}

.LeadProductText span {
  color: rgba(230, 0, 57, 1);
  font-weight: 700;
}


.LeadProductBtn a {
  display: block;
  max-width: 388px;
  margin: 0 auto;
  padding: 28px 0;
}

.s .LeadProductBtn a {
  max-width: 65.86vw;
  padding: 7.466vw 0;
}

/* ================================
        Intro
================================ */
.Intro {
  background: rgba(72, 162, 196, 1);
  padding: 80px 0;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.s .Intro {
  padding: 19.466vw 0 17.066vw;
}

.Intro:before {
  content: "";
  position: absolute;
  top: 71px;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  aspect-ratio: 2780 / 3978;
  background-image:
    url(/img/usr/free_page/yakult-sugoumacp/intro-bg-plant.png),
    url(/img/usr/free_page/yakult-sugoumacp/intro-bg-plant.png);
  background-size: auto 50%, auto 50%;
  background-repeat: no-repeat, no-repeat;
  background-position: top center, bottom center;
  pointer-events: none;
}

.Intro:after {
  content: "";
  position: absolute;
  top: 425px;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  aspect-ratio: 3406 / 4168;
  background-image:
    url(/img/usr/free_page/yakult-sugoumacp/intro-bg-cloud.png),
    url(/img/usr/free_page/yakult-sugoumacp/intro-bg-cloud.png);
  background-size: auto 50%, auto 50%;
  background-repeat: no-repeat, no-repeat;
  background-position: top center, bottom -120px center;
  pointer-events: none;
}

.Intro h2 {
  color: rgba(255, 255, 255, 1);
  padding-bottom: 24px;
}

.s .Intro h2 {
  padding-bottom: 8.799vw;
}

.Intro h2 span {
  color: rgba(255, 255, 255, 1);
  position: relative;
}

.IntroCourse {
  padding-bottom: 72px;
}

.s .IntroCourse {
  padding-bottom: 11.2vw;
}



.IntroCourse .CommonBox {
  padding: 8px;
  position: relative;
  margin-bottom: 48px;
}

.s .IntroCourse .CommonBox {
  padding: 2.133vw;
  margin-bottom: 8.533vw;
}

.IntroCourse .CommonBox._item1,
.IntroCourse .CommonBox._item2 {
  margin-bottom: 0;
}

.IntroCourse>div:nth-last-of-type(2).CommonBox {
  margin-bottom: 0;
}

.IntroCourseArea {
  margin-bottom: 48px;
}

.s .IntroCourseArea {
  margin-bottom: 8.533vw;
}


/* コース紹介 */
.IntroCourseNumber {
  max-width: 114px;
  position: absolute;
  top: -18px;
  left: -18px;
  z-index: 2;
}

.s .IntroCourseNumber {
  max-width: 21.784vw;
  top: -4.8vw;
  left: -3.1013vw;
}

.IntroCourse h3 {
  font-size: 3.6rem;
  font-weight: 700;
  position: relative;
  text-align: center;
  color: rgba(255, 255, 255, 1);
  background: rgba(198, 179, 123, 1);
  border-radius: 12px 12px 0 0;
  padding: 8px 0;
}

.s .IntroCourse h3 {
  font-size: 6.4vw;
  padding: 2.1333vw 0;
}

.s .IntroCourse ._item1 h3 span {
  transform: translateX(4vw);
  display: block;
}

.IntroCourse h4 {
  font-size: 2.7rem;
  font-weight: 700;
  text-align: center;
  color: rgba(255, 255, 255, 1);
  margin-bottom: 25px;
  position: relative;
}

.IntroCourse ._item4 h4 {
  letter-spacing: 1px;
}


.s .IntroCourse h4 {
  font-size: 4.8vw;
  letter-spacing: -0.3px;
  margin-bottom: 2.1333vw;
  line-height: 1.6;
  transform: translateX(-6vw);
}

.s .IntroCourse ._item4 h4 {
  transform: translateX(0);
}


.IntroCourse h4::after {
  content: "";
  display: inline;
  position: absolute;
  top: 5px;
  right: 5px;
  width: 26px;
  height: 51px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-yakult.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .IntroCourse h4::after {
  top: 5vw;
  right: -5vw;
  width: 6.9333vw;
  height: 13.57vw;
}

.s .IntroCourse ._item4 h4::after {
  right: 1vw;
}

.IntroCourse h4 ._number {
  font-size: 4.5rem;
}

.s .IntroCourse h4 ._number {
  font-size: 8vw;
}

.IntroCourse h4 ._wave {
  position: relative;
  display: inline-block;
  padding-bottom: 8px;
}

.s .IntroCourse h4 ._wave {
  padding-bottom: 0;
}

.IntroCourse h4 ._wave::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4.5px;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-wave.png);
  background-repeat: repeat-x;
  background-size: auto 100%;
}

.s .IntroCourse h4 ._wave::after {
  height: 1.2vw;
}

.s .IntroCourse h4 ._spsmall {
  font-size: 5.866vw;
}

.s .IntroCourse h4 ._leftindent {
  transform: translateX(-2vw);
  display: inline-block;
}

.IntroCourseInner {
  border: 2px solid rgba(198, 179, 123, 1);
  border-radius: 0 0 16px 16px;
  padding: 16px;
}

.s .IntroCourseInner {
  padding: 2.1333vw;
}

.IntroCourseBox {
  background: rgba(255, 255, 255, 1);
  border-radius: 12px;
  padding: 24px 33px 31px 33px;
}

.s .IntroCourseBox {
  padding: 4.2666vw 4.1333vw;
}

.IntroCourseBox p {
  margin: 0 auto;
}

.IntroCourseImg1 {
  max-width: 400px;
}

.IntroCourseImg2 {
  max-width: 310px;
}

.IntroCourseImg3 {
  max-width: 260px;
}

.IntroCourseImg4 {
  max-width: 200px;
}


.IntroCourseCreditArea {
  display: flex;
  justify-content: center;
}

.IntroCourseCredit {
  text-align: center;
  font-size: 1.2rem;
  padding-top: 10px;
}

.s .IntroCourseCredit {
  font-size: 3.2vw;
  padding-top: 2.666vw;
  padding-top: 0;
}

.IntroCourseCredit._white {
  text-align: left;
  color: rgba(255, 255, 255, 1);
  padding-top: 16px;
}

.s .IntroCourseCredit._white {
  padding-top: 4.266vw;
}

.s .IntroCourseCredit._white li {
  text-align: left;
  padding-left: 1em;
  text-indent: -1em;
}

.s .IntroCourseCredit._white li:nth-of-type(2) {
  padding-top: 2.133vw;
}


.IntroCourseBoxTitle {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  font-size: 3rem;
}

.s .IntroCourseBoxTitle {
  flex-direction: column;
  gap: 3.2vw;
  font-size: 8vw;
}

.IntroCourse .CommonBox._item1 .IntroCourseBoxTitle,
.IntroCourse .CommonBox._item2 .IntroCourseBoxTitle {
  padding-bottom: 20px;
}

.IntroCourse .CommonBox._item1 .IntroCourseBoxTitle,
.IntroCourse .CommonBox._item2 .IntroCourseBoxTitle {
  padding-bottom: 4.27vw;
}


.IntroCourseBoxNumber {
  width: 154px;
  border: 1px solid rgba(230, 0, 57, 1);
  border-radius: 50px;
  text-align: center;
  font-size: 2rem;
  color: rgba(230, 0, 57, 1);
  font-weight: bold;
  transform: translateY(10px);
}

.s .IntroCourseBoxNumber {
  width: 34.666vw;
  font-size: 4.266vw;
  transform: translateY(0);
  order: 2;
}

.IntroCourseBoxNumber span {
  font-size: 3.4rem;
}

.s .IntroCourseBoxNumber span {
  font-size: 5.333vw;
}

.IntroCourseChance {
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.2;
  padding-top: 10px;
  text-align: center;
}

.s .IntroCourseChance {
  font-size: 6.933vw;
  padding-top: 1.333vw;
  order: 1;
  letter-spacing: -0.6px;
}

.IntroCourse ._item2 .IntroCourseChance {
  letter-spacing: -4px;
}

.s .IntroCourse ._item2 .IntroCourseChance {
  letter-spacing: 0;
}


.IntroCourseChance ._smallblack {
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1.4;
}

.s .IntroCourseChance ._smallblack {
  font-size: 5.333vw;
}

.IntroCourseChance ._smallred {
  font-size: 3.6rem;
  color: rgba(230, 0, 57, 1);
  background: linear-gradient(transparent 60%, rgba(252, 220, 183, 1) 50%);
}

.s .IntroCourseChance ._smallred {
  font-size: 6.9333vw;
  letter-spacing: -2px;
  line-height: 1.5;
}

.IntroCourseChance ._largered {
  font-size: 4.6rem;
  color: rgba(230, 0, 57, 1);
  background: linear-gradient(transparent 60%, rgba(252, 220, 183, 1) 50%);
}

.s .IntroCourseChance ._largered {
  font-size: 9.066vw;
}

.IntroCourseText {
  font-size: 1.6rem;
  font-weight: 500;
  padding-top: 18px;
}

.s .IntroCourseText {
  font-size: 4.266vw;
  padding-top: 3.2vw;
}

.IntroCourseText span {
  font-size: 1.2rem;
}

.s .IntroCourseText span {
  font-size: 3.2vw;
}

.IntroBtnArea {
  display: flex;
  flex-direction: column;
}

.IntroBtn {
  order: 1;
}

.s .IntroBtn {
  order: 2;
}

.IntroBtn a {
  display: block;
  max-width: 388px;
  margin: 0 auto;
  padding: 20px 0;
}

.s .IntroBtn a {
  max-width: 76vw;
  padding: 0;
}

.IntroBtnArea .CommonList {
  order: 2;
}

.s .IntroBtnArea .CommonList {
  order: 1;
  padding-bottom: 3.2vw;
}

.s .IntroBtnArea .CommonList li:nth-of-type(2) {
  padding-top: 2.1333vw;
}


/* 応募方法 */

.IntroApply .CommonBox {
  margin-bottom: 64px;
}

.s .IntroApply .CommonBox {
  margin-bottom: 13.066vw;
}

.IntroApply .CommonBox:nth-of-type(2) {
  margin-bottom: 0;
}


.IntroApplyList li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 30px;
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 2px solid rgba(219, 147, 36, 1);
}

.s .IntroApplyList li {
  flex-direction: column;
  align-items: center;
  gap: 6.666vw;
  padding-bottom: 8.365vw;
  margin-bottom: 10.205vw;
}

.IntroApplyList li:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.IntroApplyList li::after {
  content: "";
  display: inline;
  position: absolute;
  bottom: -16.65px;
  right: 0;
  left: 0;
  margin: auto;
  width: 33px;
  height: 33px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-flow-arrow.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .IntroApplyList li::after {
  bottom: -4.39995vw;
  width: 8.7999vw;
  height: 8.7999vw;
}

.IntroApplyList li:last-child:after {
  display: none;
}

.InfoApplyText {
  font-size: 1.6rem;
  font-weight: 700;
  padding-bottom: 16px;
}

.s .InfoApplyText {
  font-size: 4.266vw;
  padding-bottom: 4.266vw;
}

.IntroApplyList li:nth-of-type(1) .InfoApplyText {
  padding-bottom: 0;
  letter-spacing: 0.5px;
}

.s .IntroApplyList li:nth-of-type(1) .InfoApplyText {
  padding-bottom: 0;
  letter-spacing: 0;
}

.InfoApplyText span {
  font-size: 1.8rem;
  line-height: 1;
  font-weight: 700;
  color: rgba(255, 255, 255, 1);
  background: rgba(219, 147, 36, 1);
  padding: 6px 16px;
  border-radius: 4px;
  margin-bottom: 8px;
  display: inline-block;
}

.s .InfoApplyText span {
  font-size: 4.8vw;
  padding: 1.6vw 4.266vw;
  margin-bottom: 2.1333vw;
}

.IntroApplyListImg {
  flex: 0 0 122px;
}

.s .IntroApplyListImg {
  flex: unset;
}

.IntroApplyList li:nth-of-type(1) .IntroApplyListImg span {
  display: block;
  max-width: 117px;
  margin: 0 auto;
  transform: translateY(0px);
}

.s .IntroApplyList li:nth-of-type(1) .IntroApplyListImg span {
  max-width: 31.2vw;
}

.IntroApplyList li:nth-of-type(2) .IntroApplyListImg span {
  display: block;
  max-width: 106px;
  margin: 0 auto;
  transform: translateY(6px);
}

.s .IntroApplyList li:nth-of-type(2) .IntroApplyListImg span {
  max-width: 28.26vw;
  transform: translateY(0);
}

.IntroApplyList li:nth-of-type(3) .IntroApplyListImg span {
  display: block;
  max-width: 87px;
  margin: 0 auto;
  transform: translateY(30px);
}

.s .IntroApplyList li:nth-of-type(3) .IntroApplyListImg span {
  max-width: 23.2vw;
  transform: translateY(0);
}


.InfoApplyBtnLead {
  font-size: 1.6rem;
  font-weight: 700;
  text-align: center;
  padding-bottom: 16px;
}

.s .InfoApplyBtnLead {
  font-size: 4.2666vw;
  padding-bottom: 3.2vw;
}


.InfoApplyBtn a,
.InfoApplyBtn span {
  display: block;
  max-width: 386px;
  margin: 0 auto;
}

.s .InfoApplyBtn a,
.s .InfoApplyBtn span {
  max-width: 82.93vw;
}

.InfoApplyBtnText {
  font-size: 1.2rem;
  text-align: center;
  padding-top: 20px;
}

.s .InfoApplyBtnText {
  font-size: 3.2vw;
  text-align: center;
  padding-top: 4.266vw;
}

/* ================================
        Terms
================================ */
.Terms {
  background: rgba(223, 240, 243, 1);
  padding: 80px 0;
}

.s .Terms {
  background: rgba(223, 240, 243, 1);
  padding: 17.066vw 0;
}

.TermsFaq {
  padding-bottom: 64px;
}

.s .TermsFaq {
  padding-bottom: 10.666vw;
}

.TermsFaq h2 {
  padding-bottom: 24px;
}

.s .TermsFaq h2 {
  padding-bottom: 3.2vw;
}

.TermsFaq h3 {
  text-align: center;
  font-size: 2.4rem;
  font-weight: 700;
  padding-top: 20px;
  padding-bottom: 30px;
}

.s .TermsFaq h3 {
  font-size: 5.3333vw;
  padding-top: 4.266vw;
  padding-bottom: 5.3333vw;
}


.TermsAccordion {
  padding: 0;
  margin-bottom: 24px;
  font-size: 1.6rem;
}

.s .TermsAccordion {
  margin-bottom: 6.4vw;
  font-size: 4.2666vw;
}

.Terms .TermsAccordion:last-child {
  margin-bottom: 0;
}

.TermsAccordionHeader {
  display: flex;
  align-items: flex-start;
  width: 100%;
}

.TermsAccordionHeader {
  cursor: pointer;
  color: rgba(255, 255, 255, 1);
  position: relative;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 15px 50px;
  border-radius: 35px;
  background-color: rgba(230, 0, 57, 1);
}

.s .TermsAccordionHeader {
  font-size: 4.2666vw;
  padding: 4vw 13.333vw 4vw 6.4vw;
  border-radius: 24px;
}

.TermsAccordionHeader.open {
  border-radius: 35px 35px 0 0;
}

.s .TermsAccordionHeader.open {
  border-radius: 24px 24px 0 0;
}

.TermsAccordionHeader span:nth-of-type(2) {
  padding-left: 10px;
}

.s .TermsAccordionHeader span:nth-of-type(2) {
  padding-left: 2.133vw;
  padding-right: 3.2vw;
}

.TermsAccordionHeader::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 49px;
  margin: auto;
  width: 20px;
  height: 20px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-toggle-plus.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .TermsAccordionHeader::after {
  right: 6.4vw;
  width: 5.333vw;
  height: 5.333vw;
}

.TermsAccordionHeader.open::after {
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-toggle-minus.png);
}

.TermsAccordionHeader.open::before {
  transform: rotate(180deg);
}

.TermsAccordionContent {
  color: rgba(59, 60, 60, 1);
  font-weight: 500;
  background-color: rgba(255, 255, 255, 1);
  padding: 16px 24px;
  border-radius: 0 0 35px 35px;
  line-height: 1.4;
  display: none;
  width: 100%;
}

.s .TermsAccordionContent {
  padding: 4.2666vw 6.4vw;
  border-radius: 0 0 24px 24px;
}

.TermsAccordionContentArea {
  display: flex;
  align-items: flex-start;
  width: 100%;
}

.TermsAccordionContentArea div:nth-of-type(1) {
  line-height: 1.6;
}


.TermsAccordionContentArea div:nth-of-type(2) {
  padding-left: 10px;
  line-height: 1.6;
}

.s .TermsAccordionContentArea div:nth-of-type(2) {
  padding-left: 2.133vw;
}

.TermsAccordionContentArea div ._info {
  padding-bottom: 10px;
}

.s .TermsAccordionContentArea div ._info {
  padding-bottom: 2.666vw;
}

.TermsAccordionContentArea div .CommonList {
  font-size: 1.2rem;
}

.s .TermsAccordionContentArea div .CommonList {
  font-size: 3.2vw;
}


.TermsRule h2 {
  padding-bottom: 24px;
}

.s .TermsRule h2 {
  padding-bottom: 6.4vw;
}

.TermsRule .CommonBox {
  margin-bottom: 64px;
}


.TermsRuleArea .CommonBox {
  padding: 33px 26px 0 24px
}

.s .TermsRuleArea .CommonBox {
  padding: 4vw 6.4vw 0 6.4vw;
}

.TermsRuleArea h3 {
  font-size: 1.6rem;
  font-weight: bold;
  padding-bottom: 15px;
  line-height: 1;
  text-align: center;
}

.s .TermsRuleArea h3 {
  font-size: 4.2666vw;
  padding-bottom: 4vw;
}

.TermsRuleBox {
  position: relative;
  font-size: 1.2rem;
}

.s .TermsRuleBox {
  font-size: 3.2vw;
}

.TermsRuleText {
  height: 180px;
  padding-right: 16px;
}

.s .TermsRuleText {
  height: 48vw;
  padding-right: 4.2666vw;
}


.TermsRuleText div {
  padding-bottom: 24px;
}

.s .TermsRuleText div {
  padding-bottom: 6.4vw;
}



.ScrollBar {
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.ScrollBar::-webkit-scrollbar {
  display: none;
}

.CustomScrollbarTrack {
  position: absolute;
  top: 0;
  height: 90%;
  right: 0;
  width: 6px;
  border-radius: 50vw;
  z-index: 5;
}

.s .CustomScrollbarTrack {
  height: 92%;
  right: 0;
  width: 5px;
}

.CustomScrollbarThumb {
  width: 100%;
  background: rgba(204, 204, 204, 1);
  border-radius: 50vw;
  position: absolute;
  top: 0;
}

.TermsContact .CommonBox {
  padding: 33px 40px 40px 40px;
  margin-bottom: 0;
}

.s .TermsContact .CommonBox {
  padding: 4.2666vw 6.4vw;
}

.TermsContact h3 {
  font-size: 2rem;
  font-weight: 700;
  border-bottom: 2px solid rgba(59, 60, 60, 1);
  padding-bottom: 20px;
  margin-bottom: 20px;
  line-height: 1;
}

.s .TermsContact h3 {
  font-size: 4.8vw;
  padding-bottom: 4.2666vw;
  margin-bottom: 6.4vw;
}

.TermsContactList {
  font-size: 2rem;
  padding: 16px 0;
}

.s .TermsContactList {
  font-size: 4.8vw;
  padding: 4.2666vw 0;
}

.TermsContactList li span {
  position: relative;
  padding-left: 30px;
  line-height: 1;
}

.s .TermsContactList li span {
  padding-left: 8vw;
}

.TermsContactList li:nth-of-type(1) span::before {
  content: "";
  position: absolute;
  top: 2px;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-phone.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .TermsContactList li:nth-of-type(1) span::before {
  top: 0.533vw;
  width: 6.4vw;
  height: 6.4vw;
}

.TermsContactList li:nth-of-type(2) span::before {
  content: "";
  position: absolute;
  top: 2px;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  display: block;
  background-image: url(/img/usr/free_page/yakult-sugoumacp/icon-mail.png);
  background-size: 100%;
  background-repeat: no-repeat;
}

.s .TermsContactList li:nth-of-type(2) span::before {
  top: 0.533vw;
  width: 6.4vw;
  height: 6.4vw;
}

.TermsContactOpen {
  font-size: 1.4rem;
  padding-bottom: 16px;
  line-height: 1.8;
}

.s .TermsContactOpen {
  font-size: 3.733vw;
  padding-bottom: 3.733vw;
}

.TermsContactOpen li {
  display: flex;
  align-items: flex-start;
}

/* ================================
        Sticky Banner
================================ */
.StickyLink {
  position: fixed;
  bottom: 30px;
  right: 0;
  max-width: 138px;
  z-index: 9999;
}

.s .StickyLink {
  bottom: 4.2666vw;
  right: 0;
  max-width: 36.8vw;
}