:root{
    --base: #FFF5E7;
    --cta-base:#FFF2C7;
    --orange: #FC9236;
    --sub-orange: #E5720E;
    --dark-orange: #f27d16;
    --yellow: #FFd900;
    --blown: #532300;
    --white: #fff;
    --beige: #F1DFC5;
}

* {
    font-family: "dnp-shuei-mgothic-std", sans-serif !important;
}

html{ margin-top: 0!important; }

.grecaptcha-badge{ display: none; }

.eng,
.eng * {
    font-family: "learning-curve", serif !important;
}

.pc{ display: none; }

body{
    margin: 0;
    background: var(--base);
    text-align: center;
    overflow-x: hidden
}

a{ text-decoration: none; color: #000; }

p,ul,dl,dd,dt,h1,h2,h3{ padding: 0; margin: 0; line-height: 1; }

li{ list-style: none; }

section:not(.key) > div{ margin: 0 4%; }

.img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

header {
    padding: 5.333vw 4.267vw;
    z-index: 10000;
    position: fixed;
    top: 0;
    right: 0;
}

header .logo{ margin-top: 4.267vw; }

header nav {
    position: fixed;
    z-index: 999;
    top: 0;
    right: -120%;
    width: 88%;
    height: 100vh;
    background: var(--orange);
    transition: all 0.6s ease-in-out;
    line-height: 1;
    box-shadow: 0px 4px 4px rgb(174 83 4 / 50%); 
}

header nav.panelactive {
    right: 0;
}

header nav ul {
    width: 69.333vw;
    margin: 0 auto;
}

header nav li {
    list-style: none;
    text-align: center;
}

header nav li a {
    display: block;
    padding: 3.733vw;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 0.05em;
    text-align: center;
    color: var(--white);
    border-bottom: 1px solid var(--white);
}

header nav li:last-child a{ border: none; }

header .lp_nav div{
    width: fit-content;
    margin: 5.333vw auto 0;
}

header div a:last-child {
    margin-top: 5.333vw;
}

.openbtn {
    position: relative;
    z-index: 9999;
    top: 0;
    right: 1.067vw;
    cursor: pointer;
    width: 6.4vw;
    height: 4.267vw;
    opacity: 0;
    transition: all .3s ease-in-out;
}

.openbtn.visible { opacity: 1; }

.openbtn span {
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 0;
    height: 0.4vw;
    background-color: var(--blown);
    width: 100%;
    border-radius: 0.533vw;
}

.openbtn span:nth-of-type(1) {
    top: 0;
}

.openbtn span:nth-of-type(2) {
    top: 0;
    bottom: 0;
    margin: auto 0;
}

.openbtn span:nth-of-type(3) {
    bottom: 0;
}

.openbtn.active span {
    background: var(--white);
}

.openbtn.active span:nth-of-type(1) {
    top: 0.667vw;
    transform: translateY(6px) rotate(-45deg);
}

.openbtn.active span:nth-of-type(2) {
    opacity: 0;
}

.openbtn.active span:nth-of-type(3) {
    transform: translateY(-6px) rotate(45deg);
}

nav .tel{ margin: 7.467vw auto 0; color: var(--white); font-size: 3.733vw; line-height: 1.6; }

nav .tel a{ color: var(--white); font-size: 4.8vw; }

h2{ text-align: center; position: relative; }

h2 span{
    display: inline-block;
    margin-bottom: 2.133vw;
    font-size: 4.8vw;
}

h2 p{ 
    font-size: 6.4vw;
}

h2 span,h2 p{
    position: relative;
    z-index: 20;
    color: var(--blown);
}

h2 .eng{ 
    position: absolute; 
    font-size: 12.8vw;
    font-weight: 400;
    z-index: 0;
}

.key h1,.merit h2 p,.merit h2 span,.schedule h2 p,.schedule h2 span{ color: var(--white); }

li p{ 
    line-height: 1.6;
}

.key > div{
    height: 135.467vw;
    background: url(../img/lp/key_sp.webp) no-repeat;
    background-size: cover;
    position: relative;
}

.key .copy{
    font-size: 5.867vw;
    font-weight: 600;
    letter-spacing: 0.14em;
    color: var(--white);
    writing-mode: vertical-rl;
    position: relative;
    top: 9.333vw;
    right: -86.5%;
}

.key .txt{
    padding: 6.4vw 9.6vw 8.533vw 10.667vw;
    background: var(--orange);
    position: absolute;
    left: -4%;
    bottom: -16vw;
    border-top-right-radius: 7.467vw;
    border-bottom-right-radius: 7.467vw;
    outline: 2px solid var(--white);
    outline-offset: -3.2vw;
}

.key .txt h1{ line-height: 1; font-weight: 600; text-align: center; color: var(--white); }

.key .txt h1 span{ font-size: 3.467vw; }

.key .txt h1 p{ margin: 1.867vw 0 2.667vw; font-size: 6.4vw; letter-spacing: 0.1em; }

.key .txt > p{ font-size: 3.2vw; font-weight: 600; letter-spacing: 0.07em; color: var(--yellow); }

.lead{
    padding: 24.8vw 0 11.733vw;
}

.lead h2 p::before{
    content: '';
    width: 89.333vw;
    height: 8vw;
    background: url(../img/lp/underline.svg) no-repeat;
    background-size: contain;
    position: absolute;
    bottom: -4.267vw;
    left: 0;
    right: 0;
    z-index: -10;
}

.lead >div .now{ width: fit-content; margin: 0 auto 6.4vw; position: relative; color: var(--orange); }

.lead >div .now::after{
    content: '';
    width: 108%;
    height: 5.333vw;
    background: url(../img/lp/frame.svg) no-repeat;
    background-size: contain;
    position: absolute;
    bottom: -3.2vw;
    left: -5.5%;
}

.lead >div > p{ margin-top: 6.4vw; line-height: 1.8; }

.lead .flex{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6.4vw;
    margin-top: 6.4vw;
}

.lead .img{
    width: 36.267vw;
    height: 36.267vw;
    border-radius: 50%;
    overflow: hidden;
}

.merit{
    padding: 11.733vw 0 10.667vw;
    border-radius: 16px;
    background: var(--orange);
    position: relative;
}

.merit::before,.merit::after,.schedule::before,.schedule::after{
    content: '';
    width: 100%;
    height: 27.2vw;
    background: url(../img/lp/charm_bg.webp) no-repeat;
    background-size: contain;
    position: absolute;
    top: -1.067vw;
    left: 0;
    z-index: 10;
}

.merit::after,.schedule::after{
    top: unset;
    bottom: -1.067vw;
    background-position-y: bottom;
}

.merit h2 .eng{
    color: var(--sub-orange);
    transform: rotate(-12deg);
    top: -4.267vw;
    left: 6.4vw;
}

.merit li{
    margin-top: 12.8vw;
    position: relative;
    z-index: 20;
}

.merit h3{ position: relative; }

.merit h3 span:not(.number){ color: var(--white); font-size: 4.8vw; }

.merit h3 .number{ 
    color: var(--dark-orange);
    font-size: 21.333vw;
    font-weight: 300;
    letter-spacing: -0.07em;
    position: absolute;
    top: -6.4vw; 
    right: 4.267vw;
    z-index: -10;
}

.merit h3 p{
    display: inline-block;
    padding: 1.6vw 0.8vw 1.867vw 1.333vw;
    margin-right: 0.8vw;
    background: var(--yellow);
    color: var(--blown);
    font-size: 6.4vw;
    line-height: 1;
    border-radius: 8px;
}

.merit li > p{ color: var(--white); text-align: left; }

.merit li .img{
    height: 42.667vw;
    margin: 3.2vw 0;
    border-radius: 4.267vw;
    overflow: hidden;
    outline: 1px solid var(--white);
    outline-offset: -2.133vw;
}

.merit li:first-child .img img{ object-position: center 30%; } 

.merit li:last-child .img img{ object-position: top; } 

.cta{ 
    padding: 8.533vw 0 10.667vw; 
    background: var(--cta-base);
    position: relative;
}

.cta::before,.cta::after{
    content: '';
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 4%;
    background-image : linear-gradient(to bottom, var(--orange) 8px, transparent 8px );
    background-size: 2px 16px;
    background-repeat: repeat-y;
}

.cta::after{ left: unset; right: 4%; }

.cta p span{ 
    display: inline-block;
    font-size: 5.333vw; 
    font-weight: 600; 
    line-height: 1.8;
    position: relative;
    z-index: 10;
}

.cta p span::before{
    content: '';
    width: 105%;
    height: 7.467vw;
    background: url(../img/lp/underline.svg) no-repeat;
    background-size: contain;
    filter: brightness(10);
    position: absolute; 
    bottom: -1.6vw;
    left: -2.4vw;
    z-index: -10;
}

.cta .flex{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6.4vw;
    margin-top: 6.4vw;
}

.cta a,header div a,.recruit .btn input,.complete a{ 
    display: block; 
    width: 77.867vw;
    padding: 5.067vw 0;
    border: 2px solid var(--blown);
    background: var(--yellow);
    font-size: 4.8vw;
    font-weight: 600;
    line-height: 1;
    border-radius: 80px;
    transition: all .2s ease-in-out;
}

.cta a:hover,header div a:hover,.recruit .btn input:hover,.complete a:hover{
    background: var(--blown);
    color: var(--white);
} 

.flow,.faq{
    padding: 10.667vw 0;
    background-image: linear-gradient(rgba(255,245,231,0.9), rgba(255,245,231,0.9)),url(../img/lp/noise.webp);
    background-repeat: repeat;
    background-size: 100px;
    border-radius: 4.267vw;
    position: relative;
}

.flow{ padding: 12.8vw 0 6.4vw; }

.flow::before,.faq::before,.merit >div::after,.schedule > div::before,.terms > div::after{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--cta-base);
    background-size: cover;
    top: 0;
    left: 0;
    z-index: -10;
}

.merit >div::after,.schedule > div::before{
    height: 10.667vw;
}

.merit >div::after{
    top: unset;
    bottom: 0;
}

.flow h2{ margin-bottom: 8.533vw; }

.flow h2 .eng{
    top: -7.467vw;
    right: 0;
    transform: rotate(7deg);
    color: #f1dfc5;
}

.flow li{
    display: flex;
    align-items: center;
    gap: 5.333vw;
    margin-bottom: 11.733vw;
}

.flow li:last-child { margin-bottom: 0; }

.flow li .img{
    width: 29.867vw;
    height: 30.933vw;
    position: relative;
}

.flow li:not(:last-child) .img::after{
    content: '';
    width: 8.533vw;
    height: 5.333vw;
    background: url(../img/lp/triangle.svg) no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -8.533vw;
    margin: 0 auto;
}

.flow li .img img{ border-radius: 3.2vw; }

.flow .txt{ width: 52.8vw; text-align: left; }

.flow h3{ margin-bottom: 3.2vw; color: var(--blown); }

.schedule{ padding: 10.667vw 0; background: var(--orange); border-radius: 4.267vw; position: relative; }

.schedule h2{ margin-bottom: 5.333vw; }

.schedule h2 .eng{
    color: var(--dark-orange);
    left: 0;
    top: -3.2vw;
    transform: rotate(-12deg);
    z-index: 10;
}

.schedule li,.voice li{
    padding: 4.267vw;
    margin-top: 4.267vw;
    background: var(--white);
    border-radius: 4.267vw;
    position: relative;
    z-index: 20;
}

.schedule li,.voice li,.faq dl,footer img,.recruit .btn input{
    cursor: pointer;
}

.schedule li .profile,.schedule dl,.voice li .profile{
    display: flex;
    gap: 4.267vw;
}

.schedule .profile,.voice .profile{ 
    align-items: center;
    text-align: left;
    position: relative;
}

.schedule .profile::before,.schedule .profile::after,.voice .profile::before,.voice .profile::after,.faq .profile::before,.faq .profile::after{
    content: '';
    position: absolute;
    right: 0.533vw;
	width: 12px;
	height: 12px;
	border-top: 4px solid var(--orange);
	border-right: 4px solid var(--orange);
	transform: rotate(135deg);
    transition: all .2s ease-in-out;
}

.voice .profile::before,.voice .profile::after,.faq .profile::before,.faq .profile::after{
    border-top: 4px solid var(--blown);
    border-right: 4px solid var(--blown);
}

.schedule .profile::before,.voice .profile::before,.faq .profile::before{
    transform: rotate(-45deg);
    opacity: 0;
}

.schedule .profile.active::before,.voice .profile.active::before,.faq .profile.active::before{
    opacity: 1;
}
.schedule .profile.active::after,.voice .profile.active::after,.faq .profile.active::after{
    opacity: 0;
}

.schedule li .profile .img,.voice li .profile .img{
    width: 20.267vw;
    height: 20.267vw;
}

.schedule li .profile .img img,.voice li .profile .img img{
    border-radius: 2.667vw;
}

.schedule li .profile h3,.voice li .profile h3{
    font-size: 4.267vw;
    font-weight: 600;
    line-height: 1.6;
    color: var(--blown);
}

.schedule .list,.voice .list{ display: none; }

.schedule .list.active,.voice .list.active{ display: block; }

.schedule dl:not(:last-child){ margin-bottom: 3.2vw; }

.schedule dl{ margin-top: 6.4vw; }

.schedule dl:not(:last-child) dd::after{
    content: '';
    width: 4px;
    height: 84%;
    position: absolute;
    top: 7.467vw;
    left: -13.867vw;
    background-image: radial-gradient(circle, var(--yellow) 2px, transparent 2px);
    background-position: left top;
    background-repeat: repeat-y;
    background-size: 4px 10px;
}

.schedule dt{ width: 20.267vw; margin-top: 1.333vw; text-align: center;}

.schedule dd{ width: 56.533vw; font-size: 3.733vw; line-height: 1.6; text-align: left; position: relative; }

.voice{
    padding: 10.667vw 0;
    background: var(--base);
    border-bottom-left-radius: 4.267vw;
    border-bottom-right-radius: 4.267vw;
    border-radius: 4.267vw;
    position: relative;
}

.voice::after,.step::before{
    content: '';
    width: 100%;
    height: 40px;
    z-index: -10;
    background: var(--cta-base);
    position: absolute;
    left: 0;
    bottom: 0;
}

.voice h2{ margin-bottom: 5.333vw; }

.voice h2 .eng{
    color: var(--beige);
    left: 0;
    top: -6.4vw;
    transform: rotate(-12deg);
}

.voice li{
    background: var(--white);
    border: 1px solid var(--blown);
}

.voice .list{ margin-top: 4.267vw; text-align: left; }

.step,.terms{
    background: var(--white);
    position: relative;
}

.step{
    padding: 10.667vw 0;
    border-top-left-radius: 4.267vw;
    border-top-right-radius: 4.267vw;
}

.step::before{
    top: 0;
    bottom: unset;
}

.step h2{ margin-bottom: 6.4vw; }

.step h2 .eng,.terms h2 .eng{
    top: -6.4vw;
    left: 2.133vw;
    color: var(--yellow);
    transform: rotate(-12deg);
}

.step ul{
    position: relative;
}

.step ul::before{
    content: '';
    width: 8px;
    height: 76.8vw;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 5.333vw;
    background: var(--blown);
    z-index: 10;
    margin: auto 0;
}

.step li{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 19.2vw;
    padding: 0 3.2vw 0 4.267vw;
    margin-top: 3.2vw;
    border: 1px solid var(--blown);
    border-radius: 4.267vw;
    overflow: hidden;
    z-index: 20;
    position: relative;
    background: var(--white);
}

.step li p{ 
    font-size: 4.8vw;
    font-weight: 600;
    color: var(--blown);
    position: relative;
    z-index: 30;
}

.step li:last-child p::before{
    content: '';
    width: 90%;
    height: 102%;
    background: url(../img/lp/underline.svg) no-repeat;
    background-size: contain;
    position: absolute;
    bottom: -4.267vw;
    right: 0;
    z-index: -10;
}

.step .img{ width: 29.867vw; height: 100%; }

.step .img img{ object-position: bottom; object-fit: contain; }

.terms{ 
    padding-bottom: 10.667vw;
    border-bottom-left-radius: 4.267vw;
    border-bottom-right-radius: 4.267vw; 
}

.terms h2 .eng{
    top: unset;
    bottom: -5.333vw;
    left: unset;
    right: 5.333vw;
}

.terms .pr{
    margin: 7.467vw 0 5.333vw;
    overflow: hidden;
}

.terms .pr h3{
    padding: 5.333vw 0;
    background: var(--orange);
    color: var(--white);
    border-top-left-radius: 4.267vw;
    border-top-right-radius: 4.267vw;
}

.terms .pr ul{
    border: 1px solid var(--orange);
    border-top: none;
    padding: 4.267vw 0;
    border-bottom-left-radius: 4.267vw;
    border-bottom-right-radius: 4.267vw;
}

.terms .pr li{ 
    padding: 0 10.667vw;
    font-size: 3.733vw;
    font-weight: 600;
    color: var(--blown);
    text-align: left;
}

.terms .pr li:first-child{
    margin-bottom: 3.733vw;
}

.terms .detail{ margin-left: 8.533vw; }

.terms dl{
    display: flex;
    gap: 4.267vw;
    margin-top: 2.133vw;
}

.terms dt,.terms dd{ font-size: 3.733vw; color: var(--blown); }

.terms dt{ width: 11.733vw; font-weight: 600; line-height: 1.6; text-align: left; }

.terms dd{ text-align: left; line-height: 1.6; }

.faq h2{ margin-bottom: 8.533vw; }

.faq h2 .eng{ 
    color: var(--beige);
    right: 0;
    bottom: -5.333vw;
    transform: rotate(-7deg); 
}

.faq dl{
    padding: 3.2vw 3.2vw 3.2vw 4.267vw;
    margin-top: 3.2vw;
    border-radius: 4.267vw;
    background: var(--white);
    border: 1px solid var(--blown);
    text-align: left;
}

.faq .profile::before, .faq .profile::after{ width: 10px; height: 10px; top: 0; bottom: 0.8vw; margin: auto 0; right: 2.133vw; } 

.faq span{ margin-top: 1.333vw; }

.faq .list{
    display: none;
}

.faq dt,.faq dd div{ color: var(--blown); display: flex; gap: 2.133vw; }

.faq dt{ position: relative; }

.faq dt,.faq dd span{ font-weight: 600; }

.faq dd{ margin-top: 1.6vw; }

.faq p{ line-height: 1.6; }

.cta .flex div p{ margin-bottom: 2.133vw; font-weight: 600; color: var(--blown); }

footer{ padding: 3.733vw 0 1.067vw; background: var(--blown); line-height: 2; }

footer div{ display: flex; align-items: center; justify-content: center; gap: 7.467vw; }

footer a{ line-height: 1; }

footer .insta{ gap: 2.133vw; }

footer .insta p { font-size: 3.733vw; color: var(--white); }

footer .address{ margin: 2.133vw auto 1.067vw; line-height: 2; }

footer .address span{ font-size: 3.2vw; }

footer small,footer .address{ font-size: 10px; color: var(--white); }

/* --------- フォーム --------- */
.recruit{
    margin: 0 4%;
}

.recruit *{ box-sizing: border-box; }

.recruit h1,.privacy h1,.complete h1{ 
    margin: 9.6vw 0;
    font-size: 7.467vw;
    line-height: 1.4;
    color: var(--blown);
}

.recruit:not(.confirm,.complete,.privacy) h1{ margin-bottom: 4.267vw; }

.recruit form >p{margin-bottom: 9.6vw; font-size: 3.733vw; line-height: 1.6;}

.recruit table {
    width: 100%;
    border: none;
}

.recruit tr {
    display: flex;
    flex-direction: column;
    text-align: left;
}

.recruit th,
.recruit td {
    width: 100%;
    padding: 0;
    background: unset;
    text-align: left;
    font-size: 4.267vw;
}

.recruit th {
    display: flex;
    align-items: self-end;
    margin-bottom: 1.067vw;
}

.recruit th p {
    font-weight: 600;
}

.recruit th strong,
.recruit th span {
    margin-left: 1.067vw;
    font-size: 3.2vw;
    line-height: 1.2;
    vertical-align: text-bottom;
}

.recruit th strong {
    color: #FF3000;
}

.recruit th span {
    font-weight: 400;
}

.recruit .wpcf7-list-item {
    display: block;
    margin: 0;
}

.recruit td {
    margin-bottom: 4.267vw;
    position: relative;
}

.recruit tr:first-child td .wpcf7-list-item {
    margin-bottom: 2.133vw;
}

.recruit td input {
    width: 100%;
}

.recruit td span>input,
.recruit td span>textarea,
.recruit td span>select {
    border-radius: 0;
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid var(--blown);
    padding: 0.533vw 1.6vw;
    border-radius: 1.067vw;
}

.recruit td span>select {
    width: 100%;
    background: var(--white);
}

.recruit tr:nth-child(5) td span::after,
.recruit tr:nth-child(6) td span::after {
    content: '';
    width: 2.667vw;
    height: 2.133vw;
    position: absolute;
    top: 1.067vw;
    bottom: 0;
    right: 2.133vw;
    background: linear-gradient(to bottom left, var(--blown) 50%, transparent 50%) top left/ 50% 100% no-repeat,
        linear-gradient(to bottom right, var(--blown) 50%, transparent 50%) top right / 50% 100% no-repeat;
    margin: auto 0;
}

.recruit td textarea {
    width: 100%;
    height: 42.667vw;
    resize: vertical;
}

#autozip{ display: none!important; opacity: 0; }

.recruit span a {
    color: var(--blown);
    text-decoration: underline;
}

.recruit p{
    margin-top: 4.267vw;
    font-size: 4.267vw;
}

.recruit .btn {
    margin: 6.4vw auto 12.8vw;
}

.recruit .btn input {
    width: 100%;
    color: var(--blown);
}

.confirm .btn input:first-child {
    background: #e1e1e1;
    border: none;
    color: #000;
    margin-bottom: 8.533vw;
}

.recruit .btn span {
    display: none;
}

.recruit .wpcf7-not-valid-tip {
    font-size: 0.8em;
}

.wpcf7 form .wpcf7-response-output {
    display: none;
}

.recruit .wpcf7-acceptance{ font-size: 3.733vw; }

.complete {
    height: calc(100svh - 16vw);
    padding: 9.6vw 0 12.8vw;
}

.complete p {
    margin: 5.333vw auto;
    line-height: 2;
}

.complete a {
    margin-top: 8.533vw;
    width: 100%;
    font-size: 4.267vw;
    line-height: 1.4;
}

.t-footerFixed{ padding-bottom: 0px!important; }

/* --------- プライバシーポリシー --------- */

.privacy{
    margin: 0 4%;
}

.privacy h2{
    margin-bottom: 6.4vw;
    font-size: 4.8vw;
}

.privacy div{
    margin-bottom: 4.267vw;
    text-align: left;
}

.privacy h3,.privacy p,.privacy li{
    line-height: 1.6;
}

.privacy h3{
    margin-bottom: 1.067vw;
    font-size: 4.267vw;
}

.privacy p,.privacy li{
    font-size: 3.733vw;
}

/*　＝＝＝＝＝＝＝＝＝＝＝＝　PC　＝＝＝＝＝＝＝＝＝＝＝＝　*/

@media screen and (min-width:979px) {

    .pc{ display: block; }
    .sp{ display: none; }

    body{ position: relative; min-height: 100vh; padding-bottom: 157px; }
    
    header{ padding: 24px; }
    
    .openbtn{ width: 40px; height: 24px; right: 0; }
    
    .openbtn span{ height: 4px; }
    
    .openbtn.active span:nth-of-type(1){ top: 8px; }

    header nav{ width: 520px;}
    
    header nav ul{ width: 360px; }
    
    header nav li a{ padding: 16px; }

    nav .tel{ margin-top: 48px; font-size: 16px; }

    nav .tel a{ pointer-events: none; font-size: 18px; }

    footer{ width: 100%; padding: 24px 0 16px; position: absolute; bottom: 0; }

    .cta a, header div a, .recruit .btn input, .complete a,header .lp_nav div a{ width: 360px; padding: 24px 0; font-size: 20px; }

    header div a:last-child,header .lp_nav div{ margin-top: 24px; }

    .key > div{ width: 100%; height: 37.333vw; background: url(../img/lp/key.webp) no-repeat center center; background-size: cover; }

    .key .copy{ height: 100%; font-size: 2.4vw; line-height: 1.6; letter-spacing: 0.2em; top: 0; bottom: 0; right: 0; left: 0; margin: auto; }

    .key .copy span:first-child{ margin-top: -4vw; }
    .key .copy span:last-child{ margin-top: 16vw; }

    .key .txt h1 span,.key .txt > p{ font-size: 20px; }

    .key .txt h1 p{ margin: 12px 0 18px; font-size: 38px; letter-spacing: 0.08em; }

    .key .txt {
        padding: 40px 64px 42px 136px;
        left: -4%;
        bottom: -96px;
        border-top-right-radius: 32px;
        border-bottom-right-radius: 32px;
        outline-offset: -8px;
    }

    .lead{ padding: 120px 0 88px; }

    .lead >div .now{ margin-bottom: 24px; font-size: 18px; }

    .lead >div .now::after { height: 40px; bottom: -32px; }

    h2 span{ margin-bottom: 16px; font-size: 24px; }

    h2,h2 p,.merit h3,.cta div p,.terms .detail{ width: fit-content; margin: 0 auto; font-size: 32px; }

    .lead h2 p::before{ width: 105%; height: 70%; background-size: cover; bottom: -8px; left: -3%; }

    h2 .eng{font-size: 72px; }

    .lead >div > p{ margin-top: 32px; }

    .lead .flex{ margin-top: 32px; gap: 48px; }

    .lead .img{ width: 200px; height: 200px; }

    .merit::before, .merit::after, .schedule::before, .schedule::after{ background: url(../img/lp/charm_bg_pc.svg) no-repeat; height: 1.067vw; top: -3px; background-size: cover; background-position-x: center; }

    .merit::after, .schedule::after{ top: unset; bottom: -3px; background-position-y: bottom; }

    .merit{ padding: 80px 0; }

    .merit h2 .eng{  top: -40px; left: -40px; }

    .merit h3 p{ padding: 8px 8px 8px 16px; margin-right: 8px; font-size: 32px; }

    .merit h3 span:not(.number) { font-size: 28px; }

    .merit h3 .number{ font-size: 96px; bottom: -2px; top: unset; right: 0px; }

    .merit li{ width: 480px; margin: 80px auto 0; }

    .merit li .img{ height: 200px; margin: 32px auto; border-radius: 16px; outline-offset: -8px; }

    .cta{ padding: 72px 0; }

    .cta p span{ font-size: 28px; }

    .cta .flex{ justify-content: center; flex-direction: row; align-items: end; gap: 40px; margin-top: 56px; }

    .cta p span::before{ content: none; }

    .cta > div > p{ position: relative; }

    .cta > div > p::before {
    content: '';
    width: 107%;
    height: 32px;
    background: url(../img/lp/underline.svg) no-repeat;
    background-size: cover;
    filter: brightness(10);
    position: absolute;
    bottom: 0;
    left: -30px;
    z-index: 10;
    }

    .flow,.schedule,.voice,.step,.faq { padding: 80px 0; border-radius: 16px; }

    .flow h2 .eng{ top: -32px; right: -56px; }

    .flow li{ justify-content: center; gap: 40px; margin-bottom: 80px; }

    .flow li .img{ width: 160px; height: 160px; }

    .flow li:not(:last-child) .img::after { width: 40px; height: 24px; bottom: -26%; }

    .flow .txt{ width: 448px; }

    .flow h3{ margin-bottom: 24px; font-size: 24px; }

    .schedule h2 .eng{ top: -40px; left: -56px; }

    .schedule ul,.voice ul,.faq dl,.step ul,.terms .pr{ width: 560px; margin: 0 auto; }

    .schedule ul,.voice ul{ width: 720px; }

    .schedule li, .voice li,.faq dl { padding: 24px; margin-top: 40px; border-radius: 16px; }

    .schedule li .profile .img, .voice li .profile .img{ width: 120px; height: 120px; }

    .flow h2,.step h2,.faq h2 { margin-bottom: 56px; }

    .flow li .img img { border-radius: 16px; }

    .schedule li .profile .img img, .voice li .profile .img img{ border-radius: 12px; }

    .schedule li .profile h3, .voice li .profile h3{ font-size: 24px; }

    .schedule li .profile, .schedule dl, .voice li .profile{ gap: 32px; }

    .schedule dl{ margin-top: 40px; }

    .schedule dt{ width: 144px; margin-top: 6px; }

    .schedule dl:not(:last-child) dd::after{ height: 103%; top: 33px; left: -106px; }

    .schedule dd{ width: 472px; font-size: 16px; }
    
    .voice h2 .eng{ left: -24px; top: -48px; }

    .voice .list{ margin-top: 24px; }

    .step h2 .eng{ top: -40px; left: -56px; }

    .step li{ height: 120px; padding: 0 40px; margin-top: 32px; border-radius: 16px; }
    
    .step li p{ font-size: 24px; }

    .step li .img{ width: 176px; }
    
    .step li:nth-child(4) .img{ width: 182px; }

    .step ul::before{ width: 4px; height: 100%; left: 46px; }

    .step li:last-child p::before{ bottom: -24px; }

    .terms{ padding-bottom: 80px; border-bottom-left-radius: 16px; border-bottom-left-radius: 16px; }

    .terms h2 .eng{ bottom: -32px; right: -104px;}

    .terms .pr{ margin: 40px auto; }

    .terms .pr h3{ padding: 32px; border-top-left-radius: 16px; border-top-right-radius: 16px; font-size: 20px; }

    .terms .pr li{ padding: 0 108px; font-size: 18px; }

    .terms .pr ul{ padding: 32px 0; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; }

    .terms .pr li:first-child{ margin-bottom: 24px; }

    .terms dl{ gap: 8px; margin-top: 16px; }

    .terms dt, .terms dd{ font-size: 16px; }

    .terms dt{ width: 56px; }
    
    .faq h2 .eng{ bottom: -30px; right: -136px; }

    .faq dl,.faq dd{ margin-top: 16px; }

    .faq span{ margin-top: 6px; }

    .faq dt{ font-size: 18px; }

    .faq dt, .faq dd div{ gap: 16px; }

    .faq .profile::before, .faq .profile::after{ bottom: 6px; right: 16px; }

    .cta .flex div p{ margin-bottom: 16px; font-size: 16px; }
    
    footer div{ gap: 40px; }

    footer .address{ margin: 8px auto 0; }

    footer .address span{ font-size: 12px; }

    footer .insta{ gap: 8px; }

    footer .insta p{ font-size: 12px; }

    /* --------- フォーム --------- */

    .form h1, .privacy h1,.recruit h1,.complete h1{ margin: 80px auto; font-size: 32px; }

    .recruit:not(.confirm,.complete,.privacy) h1{ margin-bottom: 24px; }

    .recruit form >p{margin-bottom: 56px; font-size: 14px; }

    .recruit table{ width: 720px; margin: 0 auto; }

    .recruit p,.recruit th, .recruit td{ font-size: 18px; }

    .recruit p{ margin-top: 0; }

    .recruit td{ margin-bottom: 32px; }

    .recruit th strong, .recruit th span{ margin-left: 6px; font-size: 14px; }

    .recruit td span>input, .recruit td span>textarea, .recruit td span>select { border-radius: 8px; padding: 8px 12px; }

    .recruit tr:nth-child(5) td span::after, .recruit tr:nth-child(6) td span::after{ width: 20px; height: 16px; top: 8px; right: 12px; }

    .recruit td textarea{ height: 240px; }

    .recruit .btn{ margin: 32px auto 80px; }

    .recruit .btn input{ margin: 0 auto; }
    .confirm .btn input:first-child{ margin: 0 auto 40px; }

    .recruit .wpcf7-acceptance{ font-size: 16px; }

    .t-footerFixed{ padding-bottom: 80px!important; }

    .complete{ height: unset; padding: 96px 0 160px; }

    .complete h1{ margin-bottom: 32px; }

    .complete p{ margin: 32px auto; }

    .complete a{ width: 368px; padding: 16px 0; margin: 0 auto; font-size: 18px; }

    .privacy{ width: 1024px; margin: 0 auto 80px; }

    .privacy h2{ margin-bottom: 40px; font-size: 24px; }

    .privacy div{ margin-bottom: 40px; }

    .privacy h3{ margin-bottom: 8px; font-size: 20px; }

    .privacy p, .privacy li{ font-size: 16px; }
}