html{
font-family: 'Zen Old Mincho', serif;
font-size: calc(10/375*100vw);
color: #1C1C1C;
}
@media screen and (min-width: 769px) {
html{
font-size: calc(10 /1920*100vw); }
}
.body {
margin: 0;
}
.mv{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_fv_sp.jpg);
aspect-ratio: 375/1243;
width: 100%;
position: relative;
}
@media screen and (min-width: 769px) {
.mv {
background-image: url(../images/bg_fv_pc.jpg);
aspect-ratio: 1920 / 1945;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
position: relative;
}
}
.mv__text--container{
text-align: center;
padding-top: 62.0rem;
position: relative;
}
.mv__maintext--img{
position: absolute;
left: 1%;
top: 61rem;
width: 98%;
display: block;
text-align: center;
}
.mv_maintext{
font-family: 'Zen Old Mincho', serif;
font-size: 3.0rem;
font-weight: 600;
}
.mv_maintext--small{
font-size: 2.0rem;
font-weight: 600;
}
@media screen and (min-width: 769px) {
.mv__text--container{
text-align: center;
padding-top: 53%;
position: relative;
}
.mv__maintext--img{
position: absolute;
left: 30%;
top: 99rem;
width: 40%;
display: block;
text-align: center;
}
.mv_maintext{
font-size: 5.0rem;
}
.mv_maintext--small{
font-size: 3.6rem;
}
}
.cta--container{
position: relative;
align-items: center;
top:3%;
}
.cta_maintext1{
position: absolute;
font-family: 'Zen Old Mincho', serif ;
line-height: 0.2;
text-align: center;
top: 3rem;
left: 13%;
width: 75%;
font-size: 2.8rem;
font-weight: 600;
}
.cta_maintext1--red{
color:#FF7A73 ;
}
.cta_maintext1--small{
font-size: 2.2rem;
font-weight: 600;
}
.cta_maintext2{
position: absolute;
font-family: 'Zen Old Mincho', serif ;
line-height: 2.7;
text-align: center;
top: 3rem;
left: 13%;
width: 75%;
font-size: 2.8rem;
font-weight: 600;}
.cta_maintext2--small{
font-size: 2.2rem;
font-weight: 600;
}
@media screen and (min-width: 769px) {
.cta_maintext--unit{
position: relative;
display: flex;
align-items: flex-end;
top:5rem;
}
.cta_maintext1{
position: absolute;
top: 0rem;
font-size: 5.0rem;
left: 1%;
}
.cta_maintext1--small{
font-size: 3.6rem;
}
.cta_maintext2 {
position: absolute;
top: 0rem;
left: 23.5%;
font-size: 5.0rem;
transform: translateY(-6.2rem);
}
.cta_maintext2--small{
font-size: 3.6rem;
}}
.cta__product--img{
position: absolute;
left: 2.5%;
width: 48%;
top: 14.0rem;
}
.cta_productname{
position: absolute;
left: 46%;
top: 17rem;
font-family: 'Zen Old Mincho', serif ;
font-size: 2.8rem;
font-weight: 600;
}
.cta__fv--img{
position: absolute;
left: 25.0%;
width: 70%;
top: 12.0rem;
}
@media screen and (min-width: 769px) {
.cta__product--img{
position: absolute;
left: 22%;
width: 18%;
top: 18.0rem;
}
.cta_productname{
position: absolute;
left: 53%;
top: 20rem;
font-family: 'Zen Old Mincho', serif ;
font-size: 5.6rem;
font-weight: 600;
z-index: 0;
}
.cta_productname::after{
content: "";
position: absolute;
left: 1%;
bottom: 0.2em; /* テキストの下から少し上に上げると自然 */
width: 100%;
height: 0.5em; /* マーカーの太さ */
background-color:rgba(252, 243, 150, 0.6); /* マーカーの色 */
z-index: -1;
}
.cta__fv--img{
position: absolute;
left: 32.0%;
width: 30%;
top: 13rem;
}
}
.cta_text1{
position: absolute;
left: 45%;
top: 21rem;
width: 8.5rem;
height: 2.8rem;
border:0.1rem solid #FF7A73;
border-radius: 30px;
background-color: transparent;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.6rem;
color: #FF7A73;
}
.cta_text2_sp{
position: absolute;
left: 70%;
top: 21rem;
width: 8.5rem;
height: 2.8rem;
border: 0.1rem solid #FF7A73;
border-radius: 30px;
background-color: transparent;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.6rem;
color: #FF7A73;
}
.cta_text2_pc{
display: none;
}
@media screen and (min-width: 769px) {
.cta_text1{
display: none;
}
.cta_text2_sp{
display: none;
}
.cta_text2_pc{
position: absolute;
left: 70%;
top: 40.5rem;
border: 0.1rem solid #FF7A73;
padding-top: 0.2em;
padding-right: 0.1em;
padding-bottom: 0.3em ;
padding-left: 0.3em;
display: inline-block;
border-radius: 4px;
background-color: transparent;
font-size: 4rem;
letter-spacing: 0.2em;
color: #FF7A73;
font-weight: 600;
line-height: 1.2em;
text-align: center;
}}
.cta__discount_sp{
position: absolute;
left: 49%;
top: 24.5rem;
width: 15.4rem;
height: 8.4rem;
border-radius: 50%;
background-color: #FF7A73;
justify-content: center;
align-items: center;
display: flex;
font-size: 5.6rem;
color: white;
font-family: "Times New Roman", Times, serif;
font-weight: bold;
font-style: italic;
}
.cta__discount_sp::after{
content: "";
position: absolute;
bottom: 1.5rem;
left: -2rem;
transform: translateY(-110%);
transform: rotate(-290deg);
border-width: 2.2rem 2.2rem 2rem 4.5rem;
border-style: solid;
border-color: transparent #ff7a73 transparent transparent;
}
.cta__discount--small{
font-size: 2.0rem;
font-weight: bold;
display: flex;
}
.cta__discount--smallitalic{
font-size: 2.0rem;
font-weight: bold;
font-style: italic;
display: flex;
}
.cta__discount::after{
content: "";
position: absolute;
bottom: -1.2rem; /* 下方向に配置 */
left: 3rem; /* 横位置 */
border: 1rem solid transparent; /* 透明の三角を作る */
border-top-color:#FF7A73; /* 上側の三角だけ色をつける */
transform: rotate(23deg);
}
.cta__discount_pc{
display: none;}
.cta--container {
position: relative;
height: 400px;
}
@media screen and (min-width: 769px) {
.cta__discount_sp{
display: none;
}
.cta__discount-top {
position: absolute;
top: -5rem;
left: 52%;
transform: translateX(-50%);
color: #FF7A73;
font-size: 3.1rem;
font-family: "Zen Maru Gothic" ;
font-weight: bold;
text-align: center;
width:120% ;
font-style: normal;
}
.cta__discount_pc {
position: absolute;
top: 44rem;
left: 45%;
transform: translate(-50%, -50%);
width: 20.1rem;
height: 20.1rem;
border-radius: 50%;
background-color: #FF7A73;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-family: "Times New Roman", Times, serif;
font-size: 11.6rem;
font-weight: bold;
font-style: italic;
color: white;
z-index: 10;
}
.cta__discount_pc p {
margin: 0; /* ← これ大事！ */
line-height: 1; /* 行間を詰める */
text-align: center;
}
.cta__discount_pc span {
font-size: 3.6rem;
}
.cta__circle--sub{
font-size: 4.0rem;
}
}
.cta__price--small{
position: absolute;
top: 34.5rem;
left:8%;
display: flex;
font-size: 1.4rem;
font-family: 'Zen Old Mincho', serif ;
}
.cta__price{
position: absolute;
top: 36rem;
left:8%;
display: flex;
font-size: 2.8rem;
font-family: "Times New Roman", Times, serif;
}
.cta__price::after{
content: "";
position: absolute;
left: 1%;
top: 85%;
width: 7.2rem;
height: 0.1rem;
background: #FF7A73;
transform: rotate(-20deg);
transform-origin: left center;
}
.cta__price--small2{
font-size: 1.0rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
}
.cta__price--small3{
font-size: 1.3rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
line-height: 1.1;
}
@media screen and (min-width: 769px) {
.cta__price--small{
position: absolute;
top: 32rem;
left:52%;
display: column;
font-size: 3.8rem;
font-family: 'Zen Old Mincho', serif ;
}
.cta__price{
position: absolute;
top: 29.8rem;
left: 61%;
font-size: 6.8rem;
font-family: "Times New Roman", Times, serif;
}
.cta__price::after{
content: "";
position: absolute;
left: -95%;
top: 85%;
width: 38rem;
height: 0.2rem;
background: #FF7A73;
transform: rotate(-8deg);
transform-origin: left center;
}
.cta__price--small2{
font-size: 2.0rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
transform: translateY(0.8rem);
}
.cta__price--small3{
font-size: 3.0rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
transform: translateY(0.8rem);
line-height: 1.2;
}}
.cta__arrow {
width: 7.3rem;
height: 4.0rem;
background-color:#FF7A73;
clip-path: polygon(0% 0%, 70% 0%, 100% 100%, 0% 100%);
position: absolute;
top: 35rem;
left: 33%;
padding-left: 3%;
padding-right: 1%;
align-items: center;
display: flex;
font-size: 1.6rem;
font-family:"Zen Maru Gothic";
color: #ffff;
line-height: 1.0;
}
@media screen and (min-width: 769px) {
.cta__arrow{
visibility: hidden;
}
}
.cta__discountprice{
position: absolute;
top: 32.5rem;
left: 55%;
display: flex;
font-size: 7.2rem;
font-family: "Times New Roman", Times, serif;
color: #FF7A73;
}
.cta__discountprice--small1{
font-size: 1.2rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
color: #1C1C1C;
line-height: 4.3;
}
.cta__discountprice--small2{
font-size: 2.8rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
line-height: 0.01;
}
@media screen and (min-width: 769px) {
.cta__discountprice{
position: absolute;
top: 35rem;
left: 51.5%;
display: flex;
font-size: 18.0rem;
font-family: "Times New Roman", Times, serif;
color: #FF7A73;
}
.cta__discountprice--small1{
font-size: 2.0rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
color: #1C1C1C;
line-height: 4.5;
transform: translateY(4.2rem);
}
.cta__discountprice--small2{
font-size: 5.6rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
line-height: 0.01;
transform: translateY(4.2rem);
}}
.cta__button--img{
position: absolute;
width: 96%;
left: 2.5%;
top: 40.5rem;
}
@media screen and (min-width: 769px) {
.cta__button--img{
position: absolute;
justify-content:center ;
align-items: center;
width: 55%;
left: 22.5%;
top: 57.0rem;}}
.cta__bg--img{
left: 0.2%;
width: 98%;
display: block;
margin-top: 0%;
margin-left: 1%;
margin-right: 1%;
}
@media screen and (min-width: 769px) {
.cta__bg--img{
left: 23%;
width: 60%;
display: block;
margin-top: 0%;
margin-left: 20%;
margin-right: 20%;
}}
.worries{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_worries_sp.png);
aspect-ratio: 375/531;
}
@media screen and (min-width: 769px) {
.worries{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_worries_pc.png);
aspect-ratio: 1920/638;
}}
.worries__text--container{
padding-top: 5.0rem;
position: relative;
text-align: center;
}
.worries__subtext{
font-family: 'Zen Old Mincho', serif ;
font-size: 1.6rem;
font-weight: normal;
position: absolute;
left: 10%;
transform: rotate(-8deg);
}
.worries__subtext::before{
content: "";
position: absolute;
left: -25%;
top: 1%;
width: 3.8rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(58deg);
transform-origin: left center;
}
.worries__subtext::after{
content: "";
position: absolute;
left: 105%;
top: 130%;
width: 3.8rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(-65deg);
transform-origin: left center;
}
.worries__maintext{
font-family: 'Zen Old Mincho', serif ;
font-size:1.8rem ;
font-weight: normal;
position: absolute;
text-align: center;
left: 7%;
margin-top: 4rem;
}
.worries__line{
position: absolute;
width: 55%;
top: 9rem;
left: 38%;
}
.worries__woman--img{
position: absolute;
top:35.5rem;
left: 22%;
width: 52%;
}
@media screen and (min-width: 769px) {
.worries__text--container{
padding-top: 9.0rem;
position: relative;
text-align: center;
}
.worries__subtext{
font-family: 'Zen Old Mincho', serif ;
font-size: 2.8rem;
font-weight: normal;
position: absolute;
left: 28%;
transform: rotate(-8deg);
}
.worries__subtext::before{
content: "";
position: absolute;
left: -25%;
top: 5%;
width: 4.3rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(58deg);
transform-origin: left center;
}
.worries__subtext::after{
content: "";
position: absolute;
left: 108%;
top: 100%;
width: 4.3rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(-65deg);
transform-origin: left center;
}
.worries__maintext{
font-family: 'Zen Old Mincho', serif ;
font-size:4.0rem ;
font-weight: normal;
position: absolute;
text-align: center;
left: 31%;
margin-top: 4rem;}
.worries__line{
position: absolute;
width: 24%;
top: 150%;
left: 44%;
}
.worries__woman--img{
position: absolute;
top:19rem;
left: 41%;
width: 18%;
}
}
.worries__list{
list-style: none;
padding-left: 0;
margin: 0;
}
.worries__illust--container1{
position: relative;
}
.worries__fukidashi1--img{
position: absolute;
left: 3%;
top: 5.5rem;
width: 53%;
display: block;
}
.worries__fukidashi1{
position: absolute;
top: 12rem;
left: 28%;
transform: translate(-50%,-50%);
font-family: "Zen Maru Gothic";
font-size: 1.4rem;
text-align: center;
}
.worries__illust--container2{
position: relative;
}
.worries__fukidashi2--img{
position: absolute;
left: 40%;
top: 10rem;
width: 58%;
display: block;
}
.worries__fukidashi2{
position: absolute;
top: 17rem;
left: 76%;
transform: translate(-60%,-60%);
width: 50%;
font-family: "Zen Maru Gothic";
font-size: 1.4rem;
text-align: center;
}
.worries__illust--container3{
position: relative;
}
.worries__fukidashi3--img{
position: absolute;
left: 1%;
top: 17.0rem;
width: 59%;
display: block;
}
.worries__fukidashi3{
position: absolute;
top: 24.5rem;
left: 36%;
transform: translate(-60%,-60%);
width: 50%;
font-family: "Zen Maru Gothic";
font-size: 1.4rem;
text-align: center;
}
.worries__illust--container4{
position: relative;
}
.worries__fukidashi4--img{
position: absolute;
left: 51%;
top: 22.0rem;
width: 45%;
display: block;
}
.worries__fukidashi4{
position: absolute;
top: 27.5rem;
left: 79%;
transform: translate(-60%,-60%);
width: 50%;
font-family: "Zen Maru Gothic";
font-size: 1.4rem;
text-align: center;
}
@media screen and (min-width: 769px) {
.worries__list{
list-style: none;
padding-left: 0;
margin: 0;
}
.worries__illust--container1{
position: relative;
}
.worries__fukidashi1--img{
position: absolute;
left: 32%;
top: 10rem;
width: 15%;
display: block;
}
.worries__fukidashi1{
position: absolute;
top: 19rem;
left: 39%;
transform: translate(-50%,-50%);
font-family: "Zen Maru Gothic";
font-size: 1.8rem;
text-align: center;
}
.worries__illust--container2{
position: relative;
}
.worries__fukidashi2--img{
position: absolute;
left: 58%;
top: 24rem;
width: 17%;
display: block;
}
.worries__fukidashi2{
position: absolute;
top: 35rem;
left: 70%;
transform: translate(-60%,-60%);
width: 30%;
font-family: "Zen Maru Gothic";
font-size: 1.8rem;
text-align: center;
}
.worries__illust--container3{
position: relative;
}
.worries__fukidashi3--img{
position: absolute;
left: 24%;
top: 24.0rem;
width: 17%;
display: block;
}
.worries__fukidashi3{
position: absolute;
top: 35.5rem;
left: 36%;
transform: translate(-60%,-60%);
width: 30%;
font-family: "Zen Maru Gothic";
font-size: 1.8rem;
text-align: center;
}
.worries__illust--container4{
position: relative;
}
.worries__fukidashi4--img{
position: absolute;
left: 56.5%;
top: 11rem;
width: 13%;
display: block;
}
.worries__fukidashi4{
position: absolute;
top: 19rem;
left: 65%;
transform: translate(-60%,-60%);
width: 20%;
font-family: "Zen Maru Gothic";
font-size: 1.8rem;
text-align: center;
}}
.workout{
position: relative;
width: 100%;
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 375/388;
overflow: hidden;
}
@media screen and (min-width: 769px) {
.workout{
position: relative;
width: 100%;
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 1920/632;
overflow: hidden;
}}
.workout__text--container{
padding-top: 3.5rem;
position: relative;
text-align: center;
}
.workout__text{
font-family:'Zen Old Mincho', serif ;
font-size: 1.8rem ;
font-weight: 600;
position: absolute;
text-align: center;
left: 0%;
margin-top: 1.0rem;
width: 100%;
z-index: 2;
}
.workout__text--large{
font-size: 2.4rem ;
color: #FF7A73;
font-weight: 600;
}
.workout__fukidashi--img{
position: absolute;
width: 95%;
left: 2.5%;
text-align: center;
z-index: 1;
top:3rem;
}
.workout__woman--img{
display: block;
width: 100%;
height: auto;
margin-top: 7rem;
position: relative;
}
@media screen and (min-width: 769px) {
.workout__fukidashi--img{
display: none;
}
.workout__woman--img{
display: block;
width: 100%;
height: auto;
margin-top: -4rem;
position: relative;
}
.workout__text--container{
padding-top: 5.2rem;
position: relative;
display: flex;
}
.workout__text{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem ;
font-weight: 600;
position: absolute;
text-align: center;
left: 0%;
margin-top: 5.5rem;
width: 100%;
}
.workout__text br {
display: none;
}
.workout__text--large{
font-size: 4.8rem ;
color: #FF7A73;
font-weight: 600;
}
}
.secret{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_secret_sp.jpg);
aspect-ratio: 375/1722;
}
@media screen and (min-width: 769px) {
.secret{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_secret_pc.jpg);
aspect-ratio: 1920/1630;
}
}
.secret__text--container{
padding-top: 4rem;
position: relative;
text-align: center;
margin-bottom: 9.6rem;
}
.secret__subtext{
font-family:'Zen Old Mincho', serif ;
font-size: 2.4rem;
font-weight: normal;
position: absolute;
left: 28%;
}
.secret__subtext--small{
font-size: 1.8rem;
}
.secret__maintext{
font-family:'Zen Old Mincho', serif ;
font-size: 2.8rem;
color: #64C4D0;
font-weight: 600;
position: absolute;
text-align: center;
left: 30%;
line-height: 3.8;
display: inline-block;
padding:0 1.0rem;
}
.secret__maintext--small{
font-size: 2.2rem;
}
.secret__maintext::before{
content: "";
position: absolute;
width: 3.0rem;
height: 0.2rem;
left: -15%;
background-color:#64C4D0;
transform: rotate(58deg);
top: 50%;
}
.secret__maintext::after{
content: "";
position: absolute;
width: 2.5rem;
height: 0.2rem;
left: -15%;
background-color:#64C4D0;
transform: rotate(51deg);
top: 55%;
}
.secret__maintext span::before,
.secret__maintext span::after{
content: "";
position: absolute;
width: 3.0rem;
height: 0.2rem;
right: -15%;
background-color:#64C4D0;
top: 50%;
}
.secret__maintext span::before{
top: 50%;
width: 3.0rem;
transform: rotate(-58deg);
}
.secret__maintext span::after{
top: 55%;
width: 2.5rem;
transform: rotate(-51deg);
}
@media screen and (min-width: 769px) {
.secret__text--container{
padding-top: 9rem;
position: relative;
text-align: center;
margin-bottom: 12.6rem;
}
.secret__subtext{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
font-weight: normal;
position: absolute;
left: 50%; /* 画面の50%位置に */
transform: translateX(-50%);
}
.secret__subtext--small{
font-size: 3.2rem;
}
.secret__maintext{
font-family:'Zen Old Mincho', serif ;
font-size: 4.8rem;
color: #64C4D0;
font-weight: 600;
position: absolute;
text-align: center;
left: 50%;
transform: translateX(-50%);
line-height: 3.8;
display: inline-block;
padding-right: 1.0rem;
padding-left: 1rem;
}
.secret__maintext--small{
font-size: 4.0rem;
}
.secret__maintext::before{
content: "";
position: absolute;
width: 5.0rem;
height: 0.2rem;
left: -15%;
background-color:#64C4D0;
transform: rotate(58deg);
top: 50%;
}
.secret__maintext::after{
content: "";
position: absolute;
width: 4rem;
height: 0.2rem;
left: -15%;
background-color:#64C4D0;
transform: rotate(51deg);
top: 55%;
}
.secret__maintext span::before,
.secret__maintext span::after{
content: "";
position: absolute;
width: 3.0rem;
height: 0.2rem;
right: -15%;
background-color:#64C4D0;
top: 50%;
}
.secret__maintext span::before{
top: 50%;
width: 5.0rem;
transform: rotate(-58deg);
}
.secret__maintext span::after{
top: 55%;
width: 4rem;
transform: rotate(-51deg);
}}
.secret__list{
list-style: none;
padding: 1.6rem 1.6rem;
margin: 0;
top: 40%;
display: flex;
flex-direction: column;
align-items: center;
gap: 1.0rem;
}
.secret__item{
background-color: #ffff;
border-radius: 1.5rem;
padding: 0.5rem 2.0rem ;
margin-bottom: 1.5rem;
box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.1);
}
.secret__item--container1{
position: relative;
}
.secret__number1-img{
position:absolute;
left: -0.5rem;
top: 2.4rem;
width: 50% ;
z-index: 1;
}
.secret__number1{
position: absolute;
font-size: 5.0rem;
color: #ffffff;
top: 4rem;
left: 3rem;
z-index: 2;
}
.secret__english1--img{
position: absolute;
width: 20%;
left:9.5rem ;
top: 4rem;
}
.secret__title1{
padding-top: 16.0rem;
padding-bottom: 1rem;
font-family: "Kiwi Maru";
font-size: 1.8rem;
text-align: right;
}
.secret__title1--large{
font-size: 2.4rem;
color: #64C4D0;
}
.secret__item1--img{
width: 100%;
}
.secret__text1{
font-family: "Zen Maru Gothic";
font-size: 1.4rem;
line-height: 1.6;
padding-top: 0.5rem;
padding-bottom: 2rem;
}
.secret__item--container2{
position: relative;
}
.secret__number2-img{
position:absolute;
left: -1.0rem;
top: 2.4rem;
width: 50% ;
z-index: 1;
}
.secret__number2{
position: absolute;
font-size: 5.0rem;
color: #ffffff;
top: 4rem;
left: 7.5rem;
z-index: 2;
}
.secret__english2--img{
position: absolute;
width: 20%;
left:-1rem ;
top: 2rem;
}
.secret__title2{
padding-top: 16.0rem;
padding-bottom: 1rem;
font-family: "Kiwi Maru";
font-size: 1.8rem;
text-align: right;
}
.secret__title2--large{
font-size: 2.4rem;
color: #64C4D0;
}
.secret__item2--img{
width: 100%;
}
.secret__text2{
font-family: "Zen Maru Gothic";
font-size: 1.4rem;
line-height: 1.6;
padding-top: 0.5rem;
padding-bottom: 2rem;
}
.secret__item--container3{
position: relative;
}
.secret__number3-img{
position:absolute;
left: -0.5rem;
top: 2.4rem;
width: 50% ;
z-index: 1;
}
.secret__number3{
position: absolute;
font-size: 5.0rem;
color: #ffffff;
top: 5rem;
left: 3rem;
z-index: 2;
}
.secret__english3--img{
position: absolute;
width: 20%;
left:10rem ;
top: 5rem;
}
.secret__title3{
padding-top: 16.0rem;
padding-bottom: 1rem;
font-family: "Kiwi Maru";
font-size: 1.8rem;
text-align: right;
}
.secret__title3--large{
font-size: 2.4rem;
color: #64C4D0;
}
.secret__item3--img{
width: 100%;
}
.secret__text3{
font-family: "Zen Maru Gothic";
font-size: 1.4rem;
line-height: 1.6;
padding-top: 0.5rem;
padding-bottom: 2rem;
}
@media screen and (min-width: 769px) {
.secret__list{
list-style: none;
padding: 1.6rem 1.6rem;
margin: 0;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.3rem;
}
.secret__item{
background-color: #ffff;
border-radius: 1.5rem;
margin: 5rem 40rem;
padding: 0rem 5.7rem ;
margin-bottom: 1.5rem;
box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.1);
}
.secret__item--container1{
position: relative;
}
.secret__number1-img{
position:absolute;
left: -0.5rem;
top: 2rem;
width: 35% ;
z-index: 1;
}
.secret__number1{
display: none;
}
.secret__english1--img{
display: none;
}
.secret__title1{
padding-top: 8.0rem;
font-family: "Kiwi Maru";
font-size: 2.8rem;
text-align: right;
}
.secret__title1--large{
font-size: 3.6rem;
color: #64C4D0;
}
.secret__text--unit1{
display: flex;
width: 100%;
max-width: 1100px;
margin: 0 auto;
padding: 4rem 0rem;
gap: 3rem;
align-items: flex-start;
flex-direction: row-reverse;
}
.secret__item1--img,
.secret__text1{
flex: 0 0 50%;
box-sizing: border-box;}
.secret__item1--img img{
width: 100%;
max-width: 500px;
height: auto;
display: block;
}
.secret__text1{
font-family: "Zen Maru Gothic";
font-size: 1.8rem;
line-height: 1.6;
padding-top: 0;}
.secret__item--container2{
position: relative;
}
.secret__number2-img{
position:absolute;
left: -0.5rem;
top: 2.4rem;
width: 24% ;
z-index: 1;
}
.secret__number2{
display: none;
}
.secret__english2--img{
display: none;
}
.secret__title2{
padding-top: 8.0rem;
font-family: "Kiwi Maru";
font-size: 2.8rem;
text-align: right;
}
.secret__title2--large{
font-size: 3.6rem;
color: #64C4D0;
}
.secret__text--unit2{
display: flex;
width: 100%;
gap: 3rem;
max-width: 1100px;
margin: 0 auto;
padding: 4rem 0rem;
align-items: flex-start;
flex-direction: row-reverse;
}
.secret__item2--img,
.secret__text2 {
flex: 0 0 50%;
box-sizing: border-box;
}
.secret__text2{
font-size: 1.8rem;
line-height: 1.6;
padding-top: 0;
}
.secret__item2--img img{
width: 100%;
max-width: 500px;
height: auto;
display: block;
}
.secret__item--container3{
position: relative;
}
.secret__number3-img{
position:absolute;
left: -0.5rem;
top: 2.4rem;
width: 30% ;
z-index: 1;
}
.secret__number3{
display: none;
}
.secret__english3--img{
display: none;
}
.secret__title3{
padding-top: 8.0rem;
font-family: 3Kiwi Maru;
font-size: 2.8rem;
text-align: right;
}
.secret__title3--large{
font-size: 3.6rem;
color: #64C4D0;
}
.secret__text--unit3{
display: flex;
width: 100%;
max-width: 1100px;
margin: 0 auto;
padding: 4.0rem 0rem ;
gap: 3.0rem;
flex-direction: row-reverse;
align-items: flex-start;
}
.secret__item3--img,
.secret__text3{
flex: 0 0 50%;
box-sizing: border-box;
}
.secret__item3--img img{
width: 100%;
max-width: 500px;
height: auto;
display: block;
}
.secret__text3{
font-family: "Zen Maru Gothic";
font-size: 1.8rem;
line-height: 1.6;
padding-top: 0;
}
}
.success{
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 375/323;
}
@media screen and (min-width: 769px) {
.success{
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 1920/600;
}
}
.success__text--container{
padding-top: 3.0rem;
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.success__arrow--img{
position: absolute;
width: 70%;
top: -1.0rem;
}
.success__bg--img{
width: 100%;
top: 6.0rem;
}
.success__subtext--img{
position: absolute;
top: 8rem;
left: 43%;
width: 28%;
}
.success__maintext1{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem ;
color: #FF7A73;
text-shadow: 0.1rem 0.1rem 0.2rem rgb(255, 255, 255);
font-weight: 600;
line-height: 1.3;
position: absolute;
text-align: center;
left: 40%;
margin-top: 12.0rem;
width: 60%;
}
.success__maintext2{
font-family:'Zen Old Mincho', serif ;
font-size: 2.0rem ;
font-weight: 400;
position: absolute;
text-align: center;
left: 50%;
margin-top: 20.0rem;
width: 50%;
}
@media screen and (min-width: 769px) {
.success__text--container{
padding-top: 3.0rem;
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.success__arrow--img{
position: absolute;
width: 25%;
top: 2.0rem;
}
.success__bg--img{
position: absolute;
width: 70%;
top:10rem;
left: 15%;
align-content: center;
}
.success__subtext--img{
position: absolute;
top: 22rem;
left: 46%;
width: 8%;
}
.success__maintext1{
font-family:'Zen Old Mincho', serif ;
font-size: 4.8rem ;
color: #FF7A73;
text-shadow: 0.1rem 0.1rem 0.2rem rgb(255, 255, 255);
font-weight: 600;
position: absolute;
text-align: center;
left: 24%;
margin-top: 27.0rem;
width: 70%;
}
.success__maintext2{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem ;
font-weight: 400;
position: absolute;
text-align: center;
left: 40%;
margin-top: 40.0rem;
width: 50%;
}}
.graph{
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 375/780;
padding-bottom: 4rem;
}
@media screen and (min-width: 769px) {
.graph{
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 1920/740;
padding-bottom: 4rem;
}}
.gragh__text--container{
padding-top: 3.4rem;
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.graph__fukidashi--img{
width: 93vw;
}
.graph__subtitle{
position: absolute;
text-align: center;
line-height: 2.0rem;
top:5rem;
background-color: rgba(252, 243, 150, 0.6);
border-radius: 1.5rem;
padding: 0.5rem 2.0rem ;
font-family:'Zen Old Mincho', serif ;
font-size: 2.0rem ;
font-weight: 400;
}
.graph__maintitle{
position: absolute;
text-align: center;
line-height: 9.5rem;
top:5.5rem;
font-family:'Zen Old Mincho', serif ;
font-size: 2.8rem ;
font-weight: 400;
}
.graph__maintitle--small{
font-size: 2.2rem ;
font-weight: 400;
}
.graph__linewave--img{
position: absolute;
width: 60vw;
left: 10%;
top: 12rem;
}
@media screen and (min-width: 769px) {
.gragh__text--container{
padding-top: 10.4rem;
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.graph__fukidashi--img{
position: absolute;
left: 30%;
width: 40%;
}
.graph__subtitle{
position: absolute;
text-align: center;
line-height:0.5;
top:13rem;
background-color: rgba(252, 243, 150, 0.6);
border-radius: 3.5rem;
padding: 1.2rem 2.0rem ;
font-family:'Zen Old Mincho', serif ;
font-size: 3.2rem ;
font-weight: 400;
}
.graph__maintitle{
position: absolute;
text-align: center;
line-height: 2.5;
top:15rem;
font-family:'Zen Old Mincho', serif ;
font-size: 4.8rem ;
font-weight: 500;
}
.graph__maintitle--small{
font-size: 4.0rem ;
font-weight: 500;
}
.graph__linewave--img{
position: absolute;
width: 22%;
left: 35%;
top: 24rem;
}}
.graph__graph1--container{
padding-top: 2rem;
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.graph__graph1--img{
position: absolute;
width: 70%;
}
.graph1__text{
position: absolute;
text-align: center;
padding-top: 6.0rem;
font-family: "Zen Maru Gothic";
font-size: 2.0rem;
color: #33AFE0;
font-weight: 600;
}
.graph1__percent{
position: absolute;
text-align: center;
padding-top: 12.0rem;
font-family:"Times New Roman", Times, serif;
color: #33AFE0;
font-size: 8.4rem;
font-style: italic;
}
.graph1__percent--small{
font-size: 3.2rem;
}
.graph__woman--img{
padding-top: 20rem;
display: block;
margin-left: 0;
margin-right: auto;
width: 30%;
}
.graph__graph2--img{
position: absolute;
padding-top: 33.0rem;
width: 70%;
}
.graph2__text{
position: absolute;
text-align: center;
padding-top: 39.0rem;
font-family: "Zen Maru Gothic";
font-size: 2.0rem;
color: #FF7A73;
font-weight: 600;
}
.graph2__percent{
position: absolute;
text-align: center;
padding-top: 45.0rem;
font-family:"Times New Roman", Times, serif;
color: #FF7A73;
font-size: 8.4rem;
font-style: italic;
}
.graph2__percent--small{
font-size: 3.2rem;
}
@media screen and (min-width: 769px) {
.graph__graph1--container{
padding-top: 11rem;
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.graph__graph1--img{
position: absolute;
width: 20%;
padding-top: 10rem;
left: 22%;
}
.graph1__text{
position: absolute;
padding-top: 19rem;
left: 25%;
font-family: "Zen Maru Gothic";
font-size: 3.0rem;
color: #33AFE0;
}
.graph1__percent{
position: absolute;
padding-top:28.0rem;
left: 28%;
font-family:"Times New Roman", Times, serif;
color: #33AFE0;
font-size: 12rem;
font-style: italic;
}
.graph1__percent--small{
font-size: 4rem;
}
.graph__woman--img{
position: absolute;
padding-top: 15rem;
left: 45%;
width: 10%;
}
.graph__graph2--img{
position: absolute;
padding-top: 33.0rem;
width: 20%;
padding-top: 10rem;
left: 58%;
}
.graph2__text{
position: absolute;
padding-top: 19.0rem;
left:61% ;
font-family: "Zen Maru Gothic";
font-size: 3.0rem;
color: #FF7A73;
}
.graph2__percent{
position: absolute;
text-align: center;
padding-top: 28.0rem;
left: 64%;
font-family:"Times New Roman", Times, serif;
color: #FF7A73;
font-size: 12rem;
font-style: italic;
}
.graph2__percent--small{
font-size: 4rem;
}}
.ranking{
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 375/464;
}
@media screen and (min-width: 769px) {
.ranking{
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 1920/752;
}}
.ranking__arrow--container{
text-align: center;
display: flex;
justify-content: center;
}
.ranking__arrow--line{
position: relative;
width: 27.7rem;
height: 10rem;
}
.ranking__arrow--line::before,
.ranking__arrow--line::after{
content: "";
position: absolute;
width: 16rem;
height:0.1rem ;
background-color: #1C1C1C;
top: 30%;
}
.ranking__arrow--line::before{
left: 0;
transform: rotate(30deg);
transform-origin: left center;
}
.ranking__arrow--line::after{
right: 0;
transform: rotate(-30deg);
transform-origin: right center;
}
.ranking__arrow--text{
position: absolute;
padding-top: 8%;
font-size: 2.2rem;
}
@media screen and (min-width: 769px) {
.ranking__arrow--container{
text-align: center;
display: flex;
justify-content: center;
}
.ranking__arrow--line{
position: relative;
width: 48.3rem;
height: 14.7rem;
}
.ranking__arrow--line::before,
.ranking__arrow--line::after{
content: "";
position: absolute;
width: 28rem;
height:0.1rem ;
background-color: #1C1C1C;
top: 10%;
}
.ranking__arrow--line::before{
left: 0;
transform: rotate(30deg);
transform-origin: left center;
}
.ranking__arrow--line::after{
right: 0;
transform: rotate(-30deg);
transform-origin: right center;
}
.ranking__arrow--text{
position: absolute;
padding-top: 1%;
font-size: 3rem;
}}
.ranking__number--container{
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.ranking__bg--img{
position: absolute;
width: 100%;
padding-top: 10%;
left: 0;
}
.ranking__ribbon--img{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 98%;
}
.ranking__ribbon--text{
position: absolute;
top: 3.5rem;
padding-left: 0;
width: 90vw;
height: auto;
text-align: center;
font-family: "Zen Maru Gothic";
color:#ffffff;
letter-spacing:0.1rem;
}
.ranking__numbertext--container{
text-align: center;
justify-content: center;
}
.ranking__numbertext1{
font-family: "Hina Mincho" ;
font-size: 2.2rem;
position: absolute;
top: 11rem;
margin-left: 15%;
transform: rotate(-10deg);
}
.ranking__numbertext1--small{
font-size: 1.6rem;
}
.ranking__numbertext1::before{
content: "";
position: absolute;
left: -30%;
top: 20%;
width: 2.5rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(58deg);
transform-origin: left center;
}
.ranking__numbertext1::after{
content: "";
position: absolute;
left: 105%;
top: 90%;
width: 2.5rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(-65deg);
transform-origin: left center;
}
.ranking__numbertext2{
font-family:'Zen Old Mincho', serif ;
font-size: 2.4rem ;
position: absolute;
top: 10.5rem;
margin-left: 38%;
}
.ranking__first--container{
position: relative;
text-align: center;
display: flex;
justify-content: center;
top: 15rem;
}
.ranking__deco--img{
width: 90vw;
}
.ranking__firsttext1{
position: absolute;
margin-top: -1%;
font-family:"Times New Roman", Times, serif;
font-size: 12.0rem;
font-style: italic;
font-weight: bold;
background: linear-gradient(to bottom, #C08A30, #F9E570, #B4760D);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ranking__firsttext1--small{
font-family:'Zen Old Mincho', serif ;
font-size: 5.5rem ;
font-style: normal;
font-weight: bold;
}
.ranking__firsttext2{
position: absolute;
margin-top: 35%;
font-family:'Zen Old Mincho', serif ;
font-size: 2.8rem ;
font-weight: bold;
background: linear-gradient(to bottom, #C08A30, #F9E570, #B4760D);-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.ranking__firsttext2--small{
font-size: 2.0rem ;
font-weight: bold;
}
.pc-br{
display: none;
}
@media screen and (min-width: 769px) {
.ranking__number--container{
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.ranking__bg--img{
width: 100%;
height: auto;
display: block;
top:-17rem;
}
.ranking__ribbon {
position: relative;
width: 100%;
}
.ranking__ribbon--img{
width: 50%;
height: auto;
display: block;
top:12rem;
}
.ranking__ribbon--text{
position: absolute;
top: -1.5rem;
left: 25.5%;
width: 50%;
height: auto;
font-family: "Zen Maru Gothic";
color:#ffffff;
letter-spacing:0.6rem;
}
.ranking__numbertext--container{
width: 100%;
position: relative;
left: 50%;
transform: translateX(-50%);
}
.ranking__numbertext1{
font-family: "Hina Mincho" ;
font-size: 4.2rem;
position: absolute;
top: 17rem;
margin-left: 28%;
transform: rotate(-10deg);
}
.ranking__numbertext1--small{
font-size: 2.8rem;
}
.ranking__numbertext1::before{
content: "";
position: absolute;
left: -30%;
top: 20%;
width: 5.0rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(58deg);
transform-origin: left center;
}
.ranking__numbertext1::after{
content: "";
position: absolute;
left: 105%;
top: 90%;
width: 5.0rem;
height: 0.1rem;
background: #1C1C1C;
transform: rotate(-65deg);
transform-origin: left center;
}
.ranking__numbertext2{
font-family:'Zen Old Mincho', serif ;
font-size: 4.8rem ;
position: absolute;
top: 16.5rem;
margin-left: 45%;
}
.ranking__first--container{
width: 100%;
position: relative;
top: 25rem;
left: 0%;
transform: translateX(-50%);
}
.ranking__deco--img{
position: absolute;
width: 100%;
top: -3rem;
left: 50%;
transform: translateX(-50%);
}
.ranking__firsttext1{
position: absolute;
margin-top: -2%;
font-family:"Times New Roman", Times, serif;
font-size: 26.0rem;
font-style: italic;
font-weight: bold;
background: linear-gradient(to bottom, #C08A30, #F9E570, #B4760D);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
left:21% ;
}
.ranking__firsttext1--small{
font-family:'Zen Old Mincho', serif ;
font-size: 11.4rem ;
font-style: normal;
font-weight: bold;
}
.ranking__firsttext2{
position: absolute;
margin-top: 3.3%;
font-family:'Zen Old Mincho', serif ;
font-size: 10.2rem ;
font-weight: bold;
background: linear-gradient(to bottom, #C08A30, #F9E570, #B4760D);-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
left: 50%;
text-align: left;
line-height: 1;
}
.ranking__firsttext2--small{
font-size: 6.1rem ;
font-weight: bold;
}
.pc-br {
display: block;
}}
.voice{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_voice_sp.jpg);
aspect-ratio: 375/1760;
}
@media screen and (min-width: 769px) {
.voice{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_voice_pc.jpg);
aspect-ratio: 1920/1320;
}
}
.voice__title--container{
position: relative;
text-align: center;
}
.voice__subtitle{
position: absolute;
width: 80%;
left: 50%; /* 親の中央を基準 */
transform: translateX(-50%);
text-align: center;
font-family:'Zen Old Mincho', serif ;
font-size: 2rem ;
font-weight: normal;
line-height: 2.8rem;
top:3.5rem;
background-color: rgb(255, 255, 255);
border-radius: 2.4rem;
padding: 0.5rem 0.8rem ;
box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.1);
}
.voice__maintitle{
position: absolute;
width: 100%;
left: 50%;
transform:translateX(-50%);
text-align: center;
line-height: 1.2rem;
font-family:'Zen Old Mincho', serif ;
font-size: 2.8rem ;
font-weight: 500;
color: #FF7A73;
text-shadow: 0.1rem 0.1rem 0.3rem rgb(186, 186, 186);
top: 9rem;
}
@media screen and (min-width: 769px) {
.voice__title--container{
position: relative;
text-align: center;
}
.voice__subtitle{
position: absolute;
width: 25%;
left: 50%; /* 親の中央を基準 */
transform: translateX(-50%);
text-align: center;
font-family:'Zen Old Mincho', serif ;
font-size: 3.2rem ;
font-weight: normal;
line-height: 3.2rem;
top:9rem;
background-color: rgb(255, 255, 255);
border-radius: 2.4rem;
padding: 0.5rem 2.0rem ;
box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.1);
}
.voice__maintitle{
position: absolute;
width: 100%;
left: 50%;
transform:translateX(-50%);
text-align: center;
line-height: 1.2rem;
font-family:'Zen Old Mincho', serif ;
font-size: 4.8rem ;
font-weight: 600;
color: #FF7A73;
text-shadow: 0.1rem 0.1rem 0.3rem rgb(186, 186, 186);
top: 17rem;
}
}
.voice__text--container{
position: relative;
top: 15rem;
}
.voice__list{
list-style: none;
margin: 0;
padding: 0;
top: 40%;
display: flex;
flex-direction: column;
transform: none;
gap: 1.0rem;
}
.voice__container1{
position: relative; /* 子を絶対位置で配置可能に */
width: 100%;
margin-bottom: 2rem;
}
.voice__textbg--img1{
position: absolute; /* 絶対位置で右に固定 */
right: 0; /* 右端に配置 */
top: 19.5rem;
width: 97%; /* 適宜サイズ調整 */
height: auto;
}
.voice__images1{
align-items: baseline;
}
.voice__bg--img1{
position: absolute; /* 絶対位置で右に固定 */
right: 0; /* 右端に配置 */
top: 7rem;
width: 82%; /* 適宜サイズ調整 */
height: auto;
box-shadow: 0.3rem 0.4rem 0.4rem rgba(0, 0, 0, 0.2);
}
.voice__woman--img1{
position: absolute; /* 絶対位置で右に固定 */
right: 7%;
top: -3.4rem;
width: 70%; /* 適宜サイズ調整 */
height: auto;
}
.voice__age1{
position: absolute;
right: 0%;
top: 17rem;
font-family:"Times New Roman", Times, serif;
font-size: 1.8rem;
color: #ffffff;
display: inline-block;
padding: 0.5rem 2rem;
border-radius: 2.4rem 0 0 2.4rem;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%);
}
.voice__age1--japanese{
font-family:"Zen Maru Gothic";
}
.voice__text1{
top: 24rem;
position: relative;
text-align: center;
}
.voice__text1--title{
position: absolute;
text-align: center;
left: 23%;
font-family:"Hina Mincho" ;
font-size: 2.4rem;
}
.voice__text1--title::before{
content: "";
display: block;
position: absolute;
top: -5rem;
left: -7rem;
bottom: 30%;
width: 45%;
height: auto;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../images/english1_voice_sp.png);
}
.voice__text1--title::after{
content: "";
display: block;
position:absolute;
left: -4.5rem;
top: 8rem;
width: 30rem;
height: 1px;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%); ;
}
.voice__text1--text{
position: absolute;
text-align: left;
top: 9rem;
left: 12%;
right: 5%;
font-family:"Zen Maru Gothic";
font-size: 1.4rem;
line-height: 1.5;
}
.voice__container2{
position: relative;
margin-top:48rem ;
margin-bottom: 2rem;
width: 100%;
margin-left: 0;
margin-right: 0;
padding: 0;
}
.voice__textbg--img2{
position: absolute;
left: 0;
top: 22rem;
width: 97%;
height: auto;
display: block;
object-fit: cover;
}
.voice__images2{
align-items: baseline;
text-align: left;
}
.voice__bg--img2{
position: absolute;
left: 0;
top: 10rem;
width: 82%;
height: auto;
box-shadow: 0.3rem 0.4rem 0.4rem rgba(0, 0, 0, 0.2);
}
.voice__woman--img2{
position: absolute;
left: 12%;
top: -3.9rem;
width: 65%;
height: auto;
}
.voice__age2{
position: absolute;
left: 0%;
top: 20rem;
font-family:"Times New Roman", Times, serif;
font-size: 1.8rem;
color: #ffffff;
display: inline-block;
padding: 0.5rem 2rem;
border-radius: 0 2.4rem 2.4rem 0 ;
background:linear-gradient(90deg, #cb9320 0%, #AA6905 100%);
}
.voice__age2--japanese{
font-family:"Zen Maru Gothic";
}
.voice__text2{
top: 26rem;
position: relative;
text-align: center;
}
.voice__text2--title{
position: absolute;
text-align: center;
left: 15%;
font-family:"Hina Mincho" ;
font-size: 2.4rem;
}
.voice__text2--title::before{
content: "";
display: block;
position: absolute;
top: -5rem;
right: -6rem;
bottom: 30%;
width: 45%;
height: auto;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../images/english2_voice_sp.png);
}
.voice__text2--title::after{
content: "";
display: block;
position:absolute;
left: -3.4rem;
top: 8rem;
width: 30rem;
height: 1px;
background:linear-gradient(90deg, #cb9320 0%, #AA6905 100%); ;
}
.voice__text2--text{
position: absolute;
text-align: left;
top: 9rem;
right: 8%;
left: 5%;
font-family:"Zen Maru Gothic";
font-size: 1.4rem;
line-height: 1.5;
}
.voice__container3{
position: relative; /* 子を絶対位置で配置可能に */
width: 100%;
top: 55rem;
margin-bottom: 2rem;
}
.voice__textbg--img3{
position: absolute; /* 絶対位置で右に固定 */
right: 0; /* 右端に配置 */
top: 18.5rem;
width: 97%; /* 適宜サイズ調整 */
height: auto;
}
.voice__images3{
align-items: baseline;
}
.voice__bg--img3{
position: absolute; /* 絶対位置で右に固定 */
right: 0; /* 右端に配置 */
top: 6.5rem;
width: 82%; /* 適宜サイズ調整 */
height: auto;
box-shadow: 0.3rem 0.4rem 0.4rem rgba(0, 0, 0, 0.2);
}
.voice__woman--img3{
position: absolute; /* 絶対位置で右に固定 */
right: 7%;
top: -3.4rem;
width: 70%; /* 適宜サイズ調整 */
height: auto;
}
.voice__age3{
position: absolute;
right: 0%;
top: 17rem;
font-family:"Times New Roman", Times, serif;
font-size: 1.8rem;
color: #ffffff;
display: inline-block;
padding: 0.5rem 2rem;
border-radius: 2.4rem 0 0 2.4rem;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%);
}
.voice__age3--japanese{
font-family:"Zen Maru Gothic";
}
.voice__text3{
top: 22rem;
position: relative;
text-align: center;
}
.voice__text3--title{
position: absolute;
text-align: center;
left: 18%;
top:0.8rem;
font-family:"Hina Mincho" ;
font-size: 2.4rem;
}
.voice__text3--title::before{
content: "";
display: block;
position: absolute;
top: -5rem;
left: -5rem;
bottom: 30%;
width: 45%;
height: auto;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../images/english3_voice_sp.png);
}
.voice__text3--title::after{
content: "";
display: block;
position:absolute;
left: -2.5rem;
top: 7.5rem;
width: 30rem;
height: 1px;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%); ;
}
.voice__text3--text{
position: absolute;
text-align: left;
top: 9.5rem;
left: 11%;
right: 4%;
font-family:"Zen Maru Gothic";
font-size: 1.4rem;
line-height: 1.5;
}
@media screen and (min-width: 769px) {
.voice__text--container{
position: relative;
top: 20rem;
}
.voice__list{
list-style: none;
margin: 0;
padding: 0;
top: 40%;
display: flex;
flex-direction: column;
transform: none;
gap: 1.0rem;
}
.voice__container1{
position: relative; /* 子を絶対位置で配置可能に */
width: 100%;
}
.voice__textbg--img1{
position: absolute;
left: 22.4%;
top: 5.5rem;
width: 37.8%;
}
.voice__images1{
align-items: baseline;
}
.voice__bg--img1{
position: absolute; /* 絶対位置で右に固定 */
right: 21.8%; /* 右端に配置 */
top: 4rem;
width: 20.8%; /* 適宜サイズ調整 */
height: auto;
box-shadow: none;
}
.voice__woman--img1{
display: none;
}
.voice__age1{
position: absolute;
right: 22.35%;
top: 28rem;
font-family:"Times New Roman", Times, serif;
font-size: 2.0rem;
color: #ffffff;
display: inline-block;
padding: 0.5rem 2rem;
border-radius: 2.4rem 0 0 2.4rem;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%);
}
.voice__age1--japanese{
font-family:"Zen Maru Gothic";
}
.voice__text1{
top: 12rem;
position: relative;
text-align: center;
}
.voice__text1--title{
position: absolute;
text-align: center;
left: 25%;
font-family:"Hina Mincho" ;
font-size: 3.2rem;
}
.voice__text1--title::before{
content: "";
display: block;
position: absolute;
top: -9rem;
left: -5.5rem;
bottom: 80%;
width: 30%;
height: auto;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../images/english1_voice_sp.png);
}
.voice__text1--title::after{
content: "";
display: block;
position:absolute;
left: -3rem;
top: 6rem;
width: 62.4rem;
height: 0.5px;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%); ;
}
.voice_text--br1{
display: none;
}
.voice__text1--text{
position: absolute;
text-align: left;
top: 8rem;
left: 24.5%;
right:auto;
width: 31%;
font-family:"Zen Maru Gothic";
font-size: 1.8rem;
line-height: 1.5;
}
.voice__container2{
position: relative;
margin-top:26rem ;
width: 100%;
margin-left: 0;
margin-right: 0;
padding: 0;
}
.voice__textbg--img2{
position: absolute;
right: 22.4%;
left: 39.7%;
top: 10rem;
width:37.8%;
height: auto;
display: block;
object-fit: cover;
}
.voice__images2{
align-items: baseline;
text-align: left;
}
.voice__bg--img2{
position: absolute;
left: 22.4%;
top: 7.5rem;
width: 20.8%;
height: auto;
box-shadow: none;
}
.voice__woman--img2{
display: none;
}
.voice__age2{
position: absolute;
left: 22.4%;
top: 35rem;
font-family:"Times New Roman", Times, serif;
font-size: 2.0rem;
color: #ffffff;
display: inline-block;
padding: 0.5rem 2rem;
border-radius: 0 2.4rem 2.4rem 0 ;
background:linear-gradient(90deg, #cb9320 0%, #AA6905 100%);
}
.voice__age2--japanese{
font-family:"Zen Maru Gothic";
}
.voice__text2{
top: 16rem;
position: relative;
text-align: center;
}
.voice__text2--title{
position: absolute;
text-align: center;
left: 41.5%;
font-family:"Hina Mincho" ;
font-size: 3.2rem;
}
.voice__text2--title::before{
content: "";
display: block;
position: absolute;
top: -9rem;
right: 49rem;
bottom: 80%;
width: 30%;
height: auto;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../images/english2_voice_sp.png);
}
.voice__text2--title::after{
content: "";
display: block;
position:absolute;
left: 3.5rem;
top: 6rem;
width: 62.4rem;
height: 0.8px;
background:linear-gradient(90deg, #cb9320 0%, #AA6905 100%); ;
}
.voice__text2--text{
position: absolute;
text-align: left;
top: 8.5rem;
right:auto;
left: 44%;
width: 31%;
font-family:"Zen Maru Gothic";
font-size: 1.8rem;
line-height: 1.5;
}
.voice_text--br2{
display: none;
}
.voice__container3{
position: relative; /* 子を絶対位置で配置可能に */
width: 100%;
top: 33rem;
}
.voice__textbg--img3{
position: absolute;
left: 22.4%;
top: 10rem;
width: 37.8%;
height: auto;
}
.voice__images3{
align-items: baseline;
}
.voice__bg--img3{
position: absolute; /* 絶対位置で右に固定 */
right:21.8% ; /* 右端に配置 */
top: 10rem;
width: 20.8%; /* 適宜サイズ調整 */
height: auto;
box-shadow: none;
}
.voice__woman--img3{
display: none;
}
.voice__age3{
position: absolute;
right: 22.4%;
top: 35.5rem;
font-family:"Times New Roman", Times, serif;
font-size: 2.0rem;
color: #ffffff;
display: inline-block;
padding: 0.5rem 2rem;
border-radius: 2.4rem 0 0 2.4rem;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%);
}
.voice__age3--japanese{
font-family:"Zen Maru Gothic";
}
.voice__text3{
top: 16.5rem;
position: relative;
text-align: center;
}
.voice__text3--title{
position: absolute;
text-align: center;
left: 25%;
font-family:"Hina Mincho" ;
font-size: 3.2rem;
}
.voice__text3--title::before{
content: "";
display: block;
position: absolute;
top: -9rem;
left: -5.5rem;
bottom: 80%;
width: 30%;
height: auto;
background-size: contain;
background-repeat: no-repeat;
background-image: url(../images/english3_voice_sp.png);
}
.voice__text3--title::after{
content: "";
display: block;
position:absolute;
left: -3rem;
top: 6rem;
width: 62.4rem;
height: 0.6px;
background:linear-gradient(90deg, #AA6905 0%, #cb9320 100%); ;
}
.voice_text--br3{
display: none;
}
.voice__text3--text{
position: absolute;
text-align: left;
top: 8rem;
left: 24.5%;
right:auto;
width: 31%;
font-family:"Zen Maru Gothic";
font-size: 1.8rem;
line-height: 1.5;
}}
.flow{
background-size:cover;
background-repeat: no-repeat;
background-color: #ffff;
aspect-ratio: 375/650;
}
@media screen and (min-width: 769px) {
.flow{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_flow_pc.jpg);
aspect-ratio: 1920/580;
}}
.flow__title{
padding-top: 5rem;
text-align: center;
font-family:'Zen Old Mincho', serif ;
font-size: 2.8rem ;
font-weight: 500;
}
@media screen and (min-width: 769px) {
.flow__title{
padding-top: 7rem;
text-align: center;
font-family:'Zen Old Mincho', serif ;
font-size: 4.8rem ;
font-weight: 500;
}}
.flow__list--wrap{
padding: 0.3rem;
margin: 6rem 2rem ;
position: relative;
}
.flow__line{
position: absolute;
left: 20%;
top: 4rem;
height: 95%;
}
.flow__list{
margin: 0;
padding: 0;
list-style: none;
}
.flow__item1{
display: flex;
left: 9%;
}
.flowitem__step1{
font-family: 'Charmonman';
font-size: 1.5rem;
position: relative;
top:2rem;
left: 1%;
z-index: 0;
}
.flowitem__step1::before{
content: "";
position: absolute;
top: 0rem;
left: -1rem;
width: 2.2rem;
height: 2.2rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(15px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step1--number{
font-size: 3.2rem;
}
.flow__contents1{
position: relative;
left: 15%;
width: 30%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title1{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 1.6rem;
top: -10%;
left: 18%;
writing-mode: horizontal-tb;
}
.flow__title1--icon
{ position: absolute;
top:25%;
left: 2%;
width: 80%;
}
.flow__text1{
position: absolute;
left: 55%;
padding-top: 7%;
width: 50%;
font-family:"Zen Maru Gothic" ;
font-size: 1.4rem;
}
.flow__item2{
display: flex;
left: 9%;
padding-top: 25%;
}
.flowitem__step2{
font-family: 'Charmonman';
font-size: 1.5rem;
position: relative;
top:2.5rem;
left: 1%;
z-index: 0;
}
.flowitem__step2::before{
content: "";
position: absolute;
top: 0rem;
left: -1rem;
width: 2.2rem;
height: 2.2rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(15px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step2--number{
font-size: 3.2rem;
}
.flow__contents2{
position: relative;
left: 15%;
width: 30%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title2{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 1.6rem;
top: -10%;
left: 25%;
writing-mode: horizontal-tb;
}
.flow__title2--icon
{ position: absolute;
top:25%;
left: 2%;
width: 80%
}
.flow__text2{
position: absolute;
left: 55%;
padding-top: 6%;
width: 50%;
font-family:"Zen Maru Gothic" ;
font-size: 1.4rem;
}
.flow__item3{
display: flex;
left: 9%;
padding-top: 25%;
}
.flowitem__step3{
font-family: 'Charmonman';
font-size: 1.5rem;
position: relative;
top: 3rem;
left: 1%;
z-index: 0;
}
.flowitem__step3::before{
content: "";
position: absolute;
top: 0rem;
left: -1rem;
width: 2.2rem;
height: 2.2rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(15px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step3--number{
font-size: 3.2rem;
}
.flow__contents3{
position: relative;
left: 15%;
width: 30%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title3{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 1.6rem;
top: -10%;
left: 25%;
writing-mode: horizontal-tb;
}
.flow__title3--icon
{ position: absolute;
top:25%;
left: 2%;
width: 80%
}
.flow__text3{
position: absolute;
left: 55%;
padding-top: 7%;
width: 50%;
font-family:"Zen Maru Gothic" ;
font-size: 1.4rem;
}
.flow__item4{
display: flex;
left: 9%;
padding-top: 25%;
}
.flowitem__step4{
font-family: 'Charmonman';
font-size: 1.5rem;
position: relative;
top:4rem;
left: 1%;
z-index: 0;
}
.flowitem__step4::before{
content: "";
position: absolute;
top: 0rem;
left: -1rem;
width: 2.2rem;
height: 2.2rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(15px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step4--number{
font-size: 3.2rem;
}
.flow__contents4{
position: relative;
left: 15%;
width: 30%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title4{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 1.6rem;
top: 1%;
left: 25%;
writing-mode: horizontal-tb;
}
.flow__title4--icon
{ position: absolute;
top:50%;
left: 2%;
width: 80%
}
.flow__text4{
position: absolute;
left: 55%;
padding-top: 12%;
width: 50%;
font-family:"Zen Maru Gothic" ;
font-size: 1.4rem;
}
@media screen and (min-width: 769px) {
.flow__list--wrap{
padding: 0.3rem;
top:6rem;
position: relative;
max-width: 1200px;
margin: 0 25%;
}
.flow__line{
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -8rem;
width: 77%;
}
.flow__list{
margin: 0 100;
padding: 0;
list-style: none;
display: flex;
justify-content: space-between; /* 均等に配置 */
gap: 0;
}
.flow__item1{
flex: 1;
}
.flowitem__step1{
font-family: 'Charmonman';
font-size: 2.4rem;
position: relative;
top: -1rem;
left: 40%;
z-index: 0;
}
.flowitem__step1::before{
content: "";
position: absolute;
top: 0rem;
left: -3rem;
width: 5.0rem;
height: 5.0rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(13px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step1--number{
font-size: 4.0rem;
}
.flow__contents1{
position: relative;
top: -4rem;
left: 3%;
width: 60%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title1{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 2.8rem;
top: 12rem;
left: 0%;
writing-mode: horizontal-tb;
}
.flow__title1--icon
{ position: absolute;
top:16rem;
left: -15%;
width: 100%;
}
.flow__text1{
position: absolute;
left: 2%;
top: 20rem;
width: 80%;
font-family:"Zen Maru Gothic" ;
font-size: 1.8rem;
}
.flow__item2{
flex: 1;
}
.flowitem__step2{
font-family: 'Charmonman';
font-size: 2.4rem;
position: relative;
left: 40%;
top:-25rem;
z-index: 0;
}
.flowitem__step2::before{
content: "";
position: absolute;
top: 0rem;
left: -3rem;
width: 5.0rem;
height: 5.0rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(15px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step2--number{
font-size: 4.0rem;
}
.flow__contents2{
position: relative;
top: -27.5rem;
left: 10%;
width: 60%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title2{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 2.8rem;
top: 12rem;
left: 0%;
writing-mode: horizontal-tb;
}
.flow__title2--icon
{ position: absolute;
top:15rem;
left: -23%;
width: 100%
}
.flow__text2{
left: 30%;
top: 20rem;
width: 100%;
font-family:"Zen Maru Gothic" ;
font-size: 1.8rem;
}
.flow__item3{
flex: 1;
}
.flowitem__step3{
font-family: 'Charmonman';
font-size: 2.4rem;
position: relative;
left: 40%;
top:-25rem;
z-index: 0;
}
.flowitem__step3::before{
content: "";
position: absolute;
top: 0rem;
left: -3rem;
width: 5.0rem;
height: 5.0rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(15px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step3--number{
font-size: 4.0rem;
}
.flow__contents3{
position: relative;
top: -27.5rem;
left: 10%;
width: 60%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title3{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 2.8rem;
top: 12rem;
left: 3%;
writing-mode: horizontal-tb;
}
.flow__title3--icon
{ position: absolute;
top: 15rem;
left: -28%;
width: 100%
}
.flow__text3{
position: absolute;
left: 52%;
top: 20rem;
width: 30%;
font-family:"Zen Maru Gothic" ;
font-size: 1.8rem;
}
.flow__item4{
flex: 1;
}
.flowitem__step4{
font-family: 'Charmonman';
font-size: 2.4rem;
position: relative;
left: 40%;
top:-25rem;
z-index: 0;
}
.flowitem__step4::before{
content: "";
position: absolute;
top: 0rem;
left: -3rem;
width: 5.0rem;
height: 5.0rem;
border-radius: 50%;
background: #00bcd4; /* 円の色 */;
filter: blur(15px); /* ぼかし効果 */
opacity: 1; /* 透明度調整 */
z-index: -1;
}
.flowitem__step4--number{
font-size: 4.0rem;
}
.flow__contents4{
position: relative;
top: -27.5rem;
left: 10%;
width: 60%;
display:flex ;
flex-direction: column;
gap: 0.1rem;
}
.flow__title4{
position: absolute;
font-family:"Zen Maru Gothic" ;
font-size: 2.8rem;
top: 12rem;
left: 1%;
writing-mode: horizontal-tb;
}
.flow__title4--icon
{ position: absolute;
top: 15rem;
left: -23%;
width: 100%
}
.flow__text4{
position: absolute;
left: 80%;
top: 15.5rem;
width: 30%;
font-family:"Zen Maru Gothic" ;
font-size: 1.8rem;
}}
.qa{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_qa_sp.jpg);
aspect-ratio: 375/1160;
}
@media screen and (min-width: 769px) {
.qa{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_qa_pc.jpg);
aspect-ratio: 1920/1375;}}
.qa__title--container{
position: relative;
width: 100%;
height: 10.1rem;
background-color:#98D8E0 ;
top: 0%;
display: flex;
justify-content: center;
}
.qa__title--container::before,
.qa__title--container::after{
content: "";
position: absolute;
left: 0;
width: 100%;
height: 1px;
background-color: #ffffff;
}
.qa__title--container::before {
top: 5%;
}
.qa__title--container::after {
bottom: 5%;
}
.qa__title1{
margin-top: 6%;
font-family:'Zen Old Mincho', serif ;
font-size: 2.8rem;
font-weight: 500;
color: #ffff;
}
.qa__title--circle{
display: inline-flex;
justify-content: center;
align-items: center;
font-family: 'Times New Roman', serif;
font-size: 2.2rem;
color: #98D8E0;
width: 2.4rem;
height: 2.4rem;
border-radius: 50% ;
background:#ffffff;
left: 0.8em;
margin: 0 0.2em;
}
.qa__title2{
position: absolute;
margin-top: 16%;
font-size: 1.4rem;
font-weight: 500;
color: #ffff;
}
@media screen and (min-width: 769px) {
.qa__title--container{
position: relative;
width: 100%;
height: 21.8rem;
background-color:#98D8E0 ;
top: 0%;
display: flex;
justify-content: center;
}
.qa__title--container::before,
.qa__title--container::after{
content: "";
position: absolute;
left: 0;
width: 100%;
height: 1px;
background-color: #ffffff;
}
.qa__title--container::before {
top: 5%;
}
.qa__title--container::after {
bottom: 5%;
}
.qa__title1{
margin-top: 2%;
font-family:'Zen Old Mincho', serif ;
font-size: 6.2rem;
font-weight: 500;
color: #ffff;
}
.qa__title--circle{
display: inline-flex;
justify-content: center;
align-items: center;
font-family: 'Times New Roman', serif;
font-size: 4.0rem;
color: #98D8E0;
width: 4.3rem;
height: 4.3rem;
border-radius: 50% ;
background:#ffffff;
left: 0em;
right:1.5em;
margin: 0 0.3em;
}
.qa__title2{
position: absolute;
margin-top: 6.5%;
font-size: 2.8rem;
font-weight: 500;
color: #ffff;
}}
.qa__list{
list-style: none;
margin: 0;
padding: 0;
margin-top: 3rem;
display: block;
align-items: center;
justify-content: center;
}
.qa__item1{
width: 80%;
background-color: #ffff;
margin: 0 auto 3rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item1--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item1--question::after{
position: absolute;
content: "";
width:28rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: -1rem;
bottom: 0%;
align-items: center;
}
.qa__question1--q{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:1.3rem ;
margin-right: 1rem;
margin-bottom: 0.3rem;
}
.qa__question1--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem; ;
margin-bottom: 1rem;
}
.qa__item1--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer1--a{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:0.3rem ;
margin-right: 1rem;
}
.qa__answer1--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.4rem;
margin-top: 1.2rem;
margin-bottom: 1.7rem;
}
.qa__item2{
width: 80%;
background-color: #ffff;
margin: 0 auto 3rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item2--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item2--question::after{
position: absolute;
content: "";
width:28rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: -1rem;
bottom: 0%;
align-items: center;
}
.qa__question2--q{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:1.3rem ;
margin-right: 1rem;
margin-bottom: 0.3rem;
}
.qa__question2--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem; ;
margin-bottom: 1rem;
}
.qa__item2--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer2--a{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:0.3rem ;
margin-right: 1rem;
}
.qa__answer2--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.4rem; ;
margin-bottom: 1.7rem;
}
.qa__item3{
width: 80%;
background-color: #ffff;
margin: 0 auto 3rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item3--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item3--question::after{
position: absolute;
content: "";
width:28rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: -1rem;
bottom: 0%;
align-items: center;
}
.qa__question3--q{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:1.3rem ;
margin-right: 1rem;
margin-bottom: 0.3rem;
}
.qa__question3--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem; ;
margin-bottom: 1rem;
}
.qa__item3--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer3--a{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:0.3rem ;
margin-right: 1rem;
}
.qa__answer3--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.4rem; ;
margin-bottom: 1.7rem;
}
.qa__item4{
width: 80%;
background-color: #ffff;
margin: 0 auto 3rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item4--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item4--question::after{
position: absolute;
content: "";
width:28rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: -1rem;
bottom: 0%;
align-items: center;
}
.qa__question4--q{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:1.3rem ;
margin-right: 1rem;
margin-bottom: 0.3rem;
}
.qa__question4--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem; ;
margin-bottom: 1rem;
}
.qa__item4--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer4--a{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:0.3rem ;
margin-right: 1rem;
}
.qa__answer4--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.4rem; ;
margin-bottom: 1.7rem;
}
.qa__item5{
width: 80%;
background-color: #ffff;
margin: 0 auto 3rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item5--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item5--question::after{
position: absolute;
content: "";
width:28rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: -1rem;
bottom: 0%;
align-items: center;
}
.qa__question5--q{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:1.3rem ;
margin-right: 1rem;
margin-bottom: 0.3rem;
}
.qa__question5--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem; ;
margin-bottom: 1rem;
}
.qa__item5--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer5--a{
font-family:'Zen Old Mincho', serif ;
font-size: 2.6rem;
margin-top:0.3rem ;
margin-right: 1rem;
}
.qa__answer5--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.4rem; ;
margin-bottom: 2rem;
}
@media screen and (min-width: 769px) {
.qa__list{
list-style: none;
margin: 0;
padding: 0;
margin-top: 4rem;
display: block;
align-items: center;
justify-content: center;
}
.qa__item1{
width: 40%;
background-color: #ffff;
margin: 0 auto 4rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item1--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item1--question::after{
position: absolute;
content: "";
width:72.6rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: 0rem;
bottom: 0%;
align-items: center;
}
.qa__question1--q{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:1.3rem ;
margin-right: 2rem;
margin-left: 1rem;
margin-bottom: 2.3rem;
}
.qa__question1--text{
font-family: "Zen Maru Gothic" ;
font-size: 2.4rem; ;
margin-bottom: 0.3rem;
}
.qa__item1--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer1--a{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:0 ;
margin-right: 2rem;
margin-left: 1rem;
}
.qa__answer1--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem; ;
margin-right: 1rem;
margin-bottom: 3rem;
}
.qa__item2{
width: 40%;
background-color: #ffff;
margin: 0 auto 4rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item2--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item2--question::after{
position: absolute;
content: "";
width:72.6rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: 0rem;
bottom: 0%;
align-items: center;
}
.qa__question2--q{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:1.3rem ;
margin-right: 2rem;
margin-left: 1rem;
margin-bottom: 0.3rem;
}
.qa__question2--text{
font-family: "Zen Maru Gothic" ;
font-size: 2.4rem; ;
margin-bottom: 2.3rem;
}
.qa__item2--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer2--a{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:0 ;
margin-right: 2rem;
margin-left: 1rem;
}
.qa__answer2--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem;
margin-right: 1rem;
margin-bottom: 3rem;
}
.qa__item3{
width: 40%;
background-color: #ffff;
margin: 0 auto 4rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item3--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item3--question::after{
position: absolute;
content: "";
width:72.6rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: 0rem;
bottom: 0%;
align-items: center;
}
.qa__question3--q{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:1.3rem ;
margin-right: 2rem;
margin-left: 1rem;
margin-bottom: 0.3rem;
}
.qa__question3--text{
font-family: "Zen Maru Gothic" ;
font-size: 2.4rem; ;
margin-bottom: 2.3rem;
}
.qa__item3--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer3--a{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:0 ;
margin-right: 2rem;
margin-left: 1rem;
}
.qa__answer3--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem;
margin-right: 1rem;
margin-bottom: 3rem;
}
.qa__item4{
width: 40%;
background-color: #ffff;
margin: 0 auto 4rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item4--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item4--question::after{
position: absolute;
content: "";
width: 72.6em;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: 0rem;
bottom: 0%;
align-items: center;
}
.qa__question4--q{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:1.3rem ;
margin-right: 2rem;
margin-left: 1rem;
margin-bottom: 0.3rem;
}
.qa__question4--text{
font-family: "Zen Maru Gothic" ;
font-size: 2.4rem; ;
margin-bottom: 2.3rem;
}
.qa__item4--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer4--a{
font-family:'Zen Old Mincho', serif ;
font-size: 4rem;
margin-top:0 ;
margin-right: 2rem;
margin-left: 1rem;
}
.qa__answer4--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem;
margin-right: 1rem;
margin-bottom: 3rem;
}
.qa__item5{
width: 40%;
background-color: #ffff;
margin: 4rem auto 4rem;
padding: 0rem 2rem 0rem 2rem;
}
.qa__item5--question{
position: relative;
display: flex;
align-items: baseline;
padding-bottom: 0;
color: #64C4D0;
}
.qa__item5--question::after{
position: absolute;
content: "";
width:72.6rem ;
height: 1px;
background-color: #64C4D0;
top: 100%;
left: 0rem;
bottom: 0%;
align-items: center;
}
.qa__question5--q{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:1.3rem ;
margin-right: 2rem;
margin-left: 1rem;
margin-bottom: 0.3rem;
}
.qa__question5--text{
font-family: "Zen Maru Gothic" ;
font-size: 2.4rem; ;
margin-bottom: 2.3rem;
}
.qa__item5--answer{
position: relative;
display: flex;
align-items: baseline;
}
.qa__answer5--a{
font-family:'Zen Old Mincho', serif ;
font-size: 4.0rem;
margin-top:0 ;
margin-right: 2rem;
margin-left: 1rem;
}
.qa__answer5--text{
font-family: "Zen Maru Gothic" ;
font-size: 1.8rem; ;
margin-bottom: 2.5rem;
margin-right: 1rem;
}}
.campaign{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_campaign_sp.jpg);
aspect-ratio: 375/916;
}
@media screen and (min-width: 769px) {
.campaign{
background-size:cover;
background-repeat: no-repeat;
background-image: url(../images/bg_campaign_pc.jpg);
aspect-ratio: 1920/1627;
}}
.campaign_maintext{
font-family: 'Zen Old Mincho', serif;
font-size: 3.0rem;
font-weight: 600;
margin-top: 3.5rem ;
margin-bottom: 2.5rem;
}
.campaign_maintext--small{
font-size: 2.0rem;
font-weight: 600;
}
.campaign__text--container{
text-align: center;
padding-top: 0.1rem;
position: relative;
}
.campaign__maintext--img{
position: absolute;
left: 1%;
padding-top: 6%;
width: 98%;
display: block;
text-align: center;
}
@media screen and (min-width: 769px) {
.campaign_maintext{
font-family: 'Zen Old Mincho', serif;
font-size: 5.0rem;
font-weight: 600;
margin-top: 6.5rem ;
margin-bottom: 2.5rem;
}
.campaign_maintext--small{
font-size: 3.6rem;
font-weight: 600;
}
.campaign__text--container{
text-align: center;
padding-top: 0.1rem;
position: relative;
}
.campaign__maintext--img{
position: absolute;
left: 50%;
transform: translateX(-50%);
padding-top: 2%;
width: 40%;
display: block;
text-align: center;
}}
.campaign--container{
position: relative;
align-items: center;
}
.campaign_maintext1{
position: absolute;
font-family: 'Zen Old Mincho', serif ;
line-height: 0.2;
text-align: center;
top:3rem;
left: 13%;
width: 75%;
font-size: 2.8rem;
font-weight: 600;
}
.campaign_maintext1--red{
color:#FF7A73 ;
}
.campaign_maintext1--small{
font-size: 2.2rem;
font-weight: 600;
}
.campaign_maintext2{
position: absolute;
padding-top: -2.0rem;
font-family: 'Zen Old Mincho', serif ;
line-height: 2.7;
text-align: center;
top:3.5rem;
left: 13%;
width: 75%;
font-size: 2.8rem;
font-weight: 600;}
.campaign_maintext2--small{
font-size: 2.2rem;
font-weight: 600;
}
.campaign__product--img{
position: absolute;
left: 2.5%;
width: 48%;
top: 15.0rem;
}
.campaign_productname{
position: absolute;
left: 46%;
top: 16rem;
font-family: 'Zen Old Mincho', serif ;
font-size: 2.8rem;
font-weight: 600;
}
.campaign__fv--img{
position: absolute;
left: 25.0%;
width: 70%;
top: 11.0rem;
}
.campaign_text1{
position: absolute;
left: 45%;
top: 21rem;
width: 8.5rem;
height: 2.8rem;
border:0.1rem solid #FF7A73;
border-radius: 30px;
background-color: transparent;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.6rem;
color: #FF7A73;
}
.campaign_text2_sp{
position: absolute;
left: 70%;
top: 21rem;
width: 8.5rem;
height: 2.8rem;
border: 0.1rem solid #FF7A73;
border-radius: 30px;
background-color: transparent;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.6rem;
color: #FF7A73;
}
.campaign_text2_pc{
display: none;
}
.campaign__discount_sp{
position: absolute;
left: 49%;
top: 25rem;
width: 15.4rem;
height: 8.4rem;
border-radius: 50%;
background-color: #FF7A73;
justify-content: center;
align-items: center;
display: flex;
font-size: 5.6rem;
color: white;
font-family: "Times New Roman", Times, serif;
font-weight: bold;
font-style: italic;
}
.campaign__discount_sp::after{
content: "";
position: absolute;
bottom: 1.5rem;
left: -2rem;
transform: translateY(-110%);
transform: rotate(-290deg);
border-width: 2.2rem 2.2rem 2rem 4.5rem;
border-style: solid;
border-color: transparent #ff7a73 transparent transparent;
}
.campaign__discount_pc{
display: none;
}
.campaign__discount--small{
font-size: 2.0rem;
font-weight: bold;
display: flex;
}
.campaign__discount--smallitalic{
font-size: 2.0rem;
font-weight: bold;
font-style: italic;
display: flex;
}
.campaign__discount::after{
content: "";
position: absolute;
bottom: -1.2rem; /* 下方向に配置 */
left: 3rem; /* 横位置 */
border: 1rem solid transparent; /* 透明の三角を作る */
border-top-color:#FF7A73; /* 上側の三角だけ色をつける */
transform: rotate(23deg);
}
.campaign__price--small{
position: absolute;
top: 36.5rem;
left:8%;
display: flex;
font-size: 1.4rem;
font-family: 'Zen Old Mincho', serif ;
}
.campaign__price{
position: absolute;
top: 38rem;
left:8%;
display: flex;
font-size: 2.8rem;
font-family: "Times New Roman", Times, serif;
}
.campaign__price::after{
content: "";
position: absolute;
left: 1%;
top: 85%;
width: 7.2rem;
height: 0.1rem;
background: #FF7A73;
transform: rotate(-20deg);
transform-origin: left center;
}
.campaign__price--small2{
font-size: 1.0rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
}
.campaign__price--small3{
font-size: 1.3rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
line-height: 1.1;
}
.arrow {
width: 7.3rem;
height: 4.0rem;
background-color:#FF7A73;
clip-path: polygon(0% 0%, 70% 0%, 100% 100%, 0% 100%);
position: absolute;
top: 36.5rem;
left: 33%;
padding-left: 3%;
padding-right: 1%;
align-items: center;
display: flex;
font-size: 1.6rem;
font-family:"Zen Maru Gothic";
color: #ffff;
line-height: 1.0;
}
.campaign__discountprice{
position: absolute;
top: 34rem;
left: 55%;
display: flex;
font-size: 7.2rem;
font-family: "Times New Roman", Times, serif;
color: #FF7A73;
}
.campaign__discountprice--small1{
font-size: 1.2rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
color: #1C1C1C;
line-height: 4.5;
}
.campaign__discountprice--small2{
font-size: 2.8rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
line-height: 0.01;
}
.campaign__button--img{
position: absolute;
width: 96%;
left: 2.5%;
top: 70.5rem;
}
.campaign__bg--img{
left: 0.2%;
width: 98%;
display: block;
margin-top: 3%;
margin-left: 1%;
margin-right: 1%;
}
@media screen and (min-width: 769px) {
.campaign--container{
position: relative;
align-items: center;
}
.campaign_maintext1{
position: absolute;
font-family: 'Zen Old Mincho', serif ;
line-height: 0.2;
text-align: center;
top:5rem;
left: 0.3%;
width: 75%;
font-size: 5.0rem;
font-weight: 600;
}
.campaign_maintext1--red{
color:#FF7A73 ;
}
.campaign_maintext1--small{
font-size: 3.6rem;
font-weight: 600;
}
.campaign_maintext2{
position: absolute;
top:5rem;
left: 23.5%;
font-size: 5.0rem;
transform: translateY(-6.2rem); }
.campaign_maintext2--small{
font-size: 4.0rem;
font-weight: 600;
}
.campaign__product--img{
position: absolute;
left: 21%;
width: 18%;
top: 15.0rem;
}
.campaign_productname{
position: absolute;
left: 55%;
top: 20rem;
font-family: 'Zen Old Mincho', serif ;
font-size: 5.6rem;
font-weight: 600;
z-index: 0;
}
.campaign_productname::after{
content: "";
position: absolute;
left: 1%;
bottom: 0.2em; /* テキストの下から少し上に上げると自然 */
width: 100%;
height: 0.5em; /* マーカーの太さ */
background-color:rgba(252, 243, 150, 0.6); /* マーカーの色 */
z-index: -1;
}
.campaign__fv--img{
position: absolute;
left: 32.0%;
width: 30%;
top: 13.0rem;
}
.campaign_text1{
display: none;
}
.campaign_text2_sp{
display: none;
}
.campaign_text2_pc{
position: absolute;
left: 70%;
top: 38rem;
border: 0.1rem solid #FF7A73;
padding: 0.3em ;
display: inline-block;
border-radius: 4px;
background-color: transparent;
font-size: 4.0rem;
color: #FF7A73;
font-weight: 600;
line-height: 1em;
text-align: center;
}
.campaign__discount_sp{
display: none;
}
.campaign__discount-top {
position: absolute;
top: -5rem;
left: 52%;
transform: translateX(-50%);
color: #FF7A73;
font-size: 3.1rem;
font-family: "Zen Maru Gothic" ;
font-weight: bold;
text-align: center;
width:120% ;
font-style: normal;
}
.campaign__discount_pc {
position: absolute;
top: 40rem;
left: 45%;
transform: translate(-50%, -50%);
width: 20.1rem;
height: 20.1rem;
border-radius: 50%;
background-color: #FF7A73;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-family: "Times New Roman", Times, serif;
font-size: 11.6rem;
font-weight: bold;
font-style: italic;
color: white;
z-index: 10;
}
.campaign__discount_pc p {
margin: 0; /* ← これ大事！ */
line-height: 1; /* 行間を詰める */
text-align: center;
}
.campaign__discount_pc span {
font-size: 3.6rem;
}
.campaign__circle--sub{
font-size: 4.0rem;
}
.campaign__price--small{
position: absolute;
top: 29.5rem;
left:52%;
display: column;
font-size: 3.8rem;
font-family: 'Zen Old Mincho', serif ;
}
.campaign__price{
position: absolute;
top: 27rem;
left:61%;
display: column;
font-size: 6.8rem;
font-family: "Times New Roman", Times, serif;
}
.campaign__price::after{
content: "";
position: absolute;
left: -95%;
top: 85%;
width: 38rem;
height: 0.2rem;
background: #FF7A73;
transform: rotate(-8deg);
transform-origin: left center;
}
.campaign__price--small2{
font-size: 2.0rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
transform: translateY(0.8rem);
}
.campaign__price--small3{
font-size: 3.0rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
transform: translateY(0.8rem);
line-height: 1.1;
}
.arrow{
visibility: hidden;
}
.campaign__discountprice{
position: absolute;
top: 32rem;
left: 51.5%;
display: flex;
font-size: 18rem;
font-family: "Times New Roman", Times, serif;
color: #FF7A73;
}
.campaign__discountprice--small1{
font-size: 2rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
color: #1C1C1C;
line-height: 4.5;
transform: translateY(4.2rem);
}
.campaign__discountprice--small2{
font-size: 5.6rem;
font-family: 'Zen Old Mincho', serif ;
display: flex;
line-height: 0.01;
transform: translateY(4.2rem);
}
.campaign__button--img{
position: absolute;
justify-content: center;
align-items: center;
width: 55%;
left: 22.5%;
top: 123rem;
}
.campaign__bg--img{
left: 23%;
width: 60%;
display: block;
margin-top: 3%;
margin-left: 20%;
margin-right: 20%;
}}
.footer{
background-size:cover;
background-repeat: no-repeat;
background-color: #84CAD1;
aspect-ratio: 375/60;
}
@media screen and (min-width: 769px) {
.footer{
background-size:cover;
background-repeat: no-repeat;
background-color: #84CAD1;
aspect-ratio: 1920/100;
}
}
.footer p {
margin: 0;
}
.footer__menu{
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding:3% 5%;
font-family:"Zen Maru Gothic";
color: #1C1C1C;
font-size: 1.4rem;
}
.footer__copy{
text-align: center;
padding-bottom: 3%;
font-family:"Zen Maru Gothic";
color: #1C1C1C;
font-size: 1.2rem;
}
@media screen and (min-width: 769px) {
.footer p {
margin: 0;
}
.footer__menu{
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding:1.5% 27% 1% 27%;
font-family:"Zen Maru Gothic";
color: #1C1C1C;
font-size: 1.6rem;
}
.footer__copy{
text-align: center;
padding-bottom: 1.2%;
font-family:"Zen Maru Gothic";
color: #1C1C1C;
font-size: 1.2rem;
}}