@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Advent+Pro:ital,wght@0,100..900;1,100..900&display=swap');


*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    list-style: none;
}
::before,
::after{
    box-sizing: border-box;
}
fieldset{
    border: none;
}
img{
    vertical-align: top;
}

:root{
    --site-max-width:100%;
    --site-main-width:100%;
    --site-division:375;
    --site-content-width:350;
    --site-horizontal-ratio:calc(100vw / var(--site-division));
    --site-font-family-Noto-Sans-JP:"Noto Sans JP", sans-serif;
    --site-font-family-Barlow:"Barlow", sans-serif;
    --site-font-family-Advent-Pro:"Advent Pro", sans-serif;
    --site-padding:calc(calc(var(--site-division) - var(--site-content-width)) * var(--site-horizontal-ratio) / 2);
    --site-color-baseText:#333333;
    --site-linear-gradient:linear-gradient(to right,#BF5331,#EF6A5A);
}

*.mobile{
    display: initial;
}
*.desktop{
    display: none;
}

.box-100vw{
    width: 100vw;
    margin-left: calc((100% - 100vw - 0px) * 0.5);
}

.button{
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(359.02 * var(--site-horizontal-ratio));
    height: calc(60.54 * var(--site-horizontal-ratio));
    border-radius: calc(8.41 * var(--site-horizontal-ratio));
    background-color: #E83434;
    font-weight: bold;
    font-size: calc(20.18 * var(--site-horizontal-ratio));
    color: #ffffff;
    position: relative;
    text-decoration: none;
    margin: auto;
    box-shadow: 0 calc(3 * var(--site-horizontal-ratio)) calc(6 * var(--site-horizontal-ratio)) #d62e2e;
}
.button>span{
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(238.79 * var(--site-horizontal-ratio));
    height: calc(26.91 * var(--site-horizontal-ratio));
    border-radius: calc(8.41 * var(--site-horizontal-ratio));
    background-image: linear-gradient(40deg, #E6DEC7, #EFEBDB 51%, #E6DEC7 100%);
    font-weight: bold;
    font-size: calc(12.61 * var(--site-horizontal-ratio));
    color: #333333;
    position: absolute;
    top: 0%;
    left: 50%;
    transform: translate(-50%,-50%);
}

/* -------------------------------base(mobile)↓-------------------------------------- */
/* body start */
body{
    font-family: var(--site-font-family-Noto-Sans-JP);
    max-width: var(--site-max-width);
    color: var(--site-color-baseText);
}
/* body end */

/* header start */
header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #333333;
    padding: calc(15 * var(--site-horizontal-ratio)) calc(20 * var(--site-horizontal-ratio));
}
header.navOn{
    display: block;
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000000e8;
    z-index: 9999999;
    text-align: center;
    padding-left: 0;
    padding-right: 0;
}
header>a:first-child>img{
    width: calc(81 * var(--site-horizontal-ratio));
}
header>img{
    width: calc(50 * var(--site-horizontal-ratio));
}
header.navOn>img{
    display: none;
}
header>i{
    font-size: 0;
}
header.navOn>i{
    font-size: calc(24 * var(--site-horizontal-ratio));
    position: absolute;
    right: calc(20 * var(--site-horizontal-ratio));
    color: #ffffff;
}
header>nav{
    display: none;    
}
header.navOn>nav{
    margin-top: calc(10 * var(--site-horizontal-ratio));
    padding: calc(20 * var(--site-horizontal-ratio)) calc(20 * var(--site-horizontal-ratio)) 0;
    width: 100%;
    font-size: calc(18 * var(--site-horizontal-ratio));
}
header.navOn>nav>a{
    display: block;
    width: fit-content;
    color: var(--site-color-baseText);
    text-decoration: none;
    font-size: calc(16 * var(--site-horizontal-ratio));
    line-height: calc(36 * var(--site-horizontal-ratio));
    font-weight: 700;
    margin: auto;
    color: #ffffff;
}
header.navOn>nav>a.zoom{
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(220 * var(--site-horizontal-ratio));
    height: calc(42 * var(--site-horizontal-ratio));
    border-radius: calc(10 * var(--site-horizontal-ratio));
    background-color: #E83434;
    box-shadow: 0 calc(3 * var(--site-horizontal-ratio)) calc(6 * var(--site-horizontal-ratio)) #d62e2e;
}
/* header end */

/* fv start */
.fv{
    margin-top: calc(calc(97 - 80) * var(--site-horizontal-ratio));
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: calc(10 * var(--site-horizontal-ratio));
    padding-bottom: calc(calc(415 - 97 - 298.53 + 245) * var(--site-horizontal-ratio));
    background-image: url(../images/fv-mobile.png);
    background-position: bottom 0 right 0;
    background-repeat: no-repeat;
    background-size: 100% calc(245 * var(--site-horizontal-ratio));
    position: relative;
}
.fv::after{
    content: "";
    display: block;
    width: 100%;
    height: calc(245 * var(--site-horizontal-ratio));
    background-image: linear-gradient(to bottom,#ffffff 0,transparent 20%,transparent 100%);
    position: absolute;
    bottom: 0;
}
.fv>div:nth-of-type(1){
    margin: calc(calc(122.17 - 80) * var(--site-horizontal-ratio)) auto calc(calc(166.74 - 122.17 - 32.98) * var(--site-horizontal-ratio));
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 99999px;
    background-image: var(--site-linear-gradient);
    width: calc(281.17 * var(--site-horizontal-ratio));
    height: calc(32.98 * var(--site-horizontal-ratio));
    font-size: calc(17.36 * var(--site-horizontal-ratio));
    font-weight: bold;
    color: #ffffff;
    position: relative;
}
.fv>div:nth-of-type(1)::before{
    content: "";
    display: block;
    width: calc(53 * var(--site-horizontal-ratio));
    height: calc(25 * var(--site-horizontal-ratio));
    position: absolute;
    top: 0;
    left: calc(calc(207.96 - 47.41) * var(--site-horizontal-ratio));
    transform: translateY(-100%);
    background-image: var(--site-linear-gradient);
    mask-image:
        radial-gradient(circle at center, white 0 calc(45% - 1px), transparent 45% 100%),
        radial-gradient(circle at center, white 0 calc(45% - 1px), transparent 45% 100%);
    mask-size:
        calc(12 * var(--site-horizontal-ratio)) calc(12 * var(--site-horizontal-ratio)),
        calc(12 * var(--site-horizontal-ratio)) calc(12 * var(--site-horizontal-ratio));
    mask-position:
        top calc(5 * var(--site-horizontal-ratio)) left calc(2 * var(--site-horizontal-ratio)),
        top calc(5 * var(--site-horizontal-ratio)) right calc(8 * var(--site-horizontal-ratio));
    mask-repeat: no-repeat;
}
.fv>div:nth-of-type(1)::after{
    content: "";
    display: block;
    width: 100%;
    height: 36%;
    --clip-height: calc(14.83 * var(--site-horizontal-ratio));
    --clip-width: calc(9.83 * var(--site-horizontal-ratio));
    --clip-angle-position: 50%;
    clip-path: polygon(100% 0, 100% calc(100% - var(--clip-height)), calc(var(--clip-angle-position) + var(--clip-width)) calc(100% - var(--clip-height)), var(--clip-angle-position) 100%, calc(var(--clip-angle-position) - var(--clip-width)) calc(100% - var(--clip-height)), 0 calc(100% - var(--clip-height)), 0 0);
    padding-bottom: calc(var(--clip-height));
    position: absolute;
    bottom: 0;
    transform: translateY(90%);
    background-image: var(--site-linear-gradient);
}
.fv>div:nth-of-type(1)>span{
    font-size: calc(29.51 * var(--site-horizontal-ratio));
    align-self: end;
    transform: translateY(calc(-3 * var(--site-horizontal-ratio)));
    background-image: var(--site-linear-gradient);
    -webkit-background-clip: text;
    -webkit-text-stroke: calc(5 * var(--site-horizontal-ratio)) transparent;
    position: absolute;
    width: 100%;
    padding-left: calc(calc(202.49 - 47.41) * var(--site-horizontal-ratio));
}
.fv>p{
    width: calc(302 * var(--site-horizontal-ratio));
    margin: auto;
    text-align: center;
    font-weight: bold;
}
.fv>div:nth-of-type(2){
    margin-top: calc(20 * var(--site-horizontal-ratio));
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: calc(16 * var(--site-horizontal-ratio));
    font-weight: bolder;
    position: relative;
}
.fv>div:nth-of-type(2)::before,
.fv>div:nth-of-type(2)::after{
    content: "";
    display: block;
    width: calc(2 * var(--site-horizontal-ratio));
    height: calc(19 * var(--site-horizontal-ratio));
    background-color: #333333;
    position: absolute;
}
.fv>div:nth-of-type(2)::before{
    left: 0;
    transform: rotate(-35deg);
}
.fv>div:nth-of-type(2)::after{
    right: 0;
    transform: rotate(35deg);
}
.fv>div:nth-of-type(2)>img{
    width: calc(98.42 * var(--site-horizontal-ratio));
}
.fv>p>span:nth-of-type(1){
    display: block;
    padding-top: calc(8.51 * var(--site-horizontal-ratio));
    font-size: calc(24.3 * var(--site-horizontal-ratio));
    position: relative;
    width: fit-content;
    margin: auto;
}
.fv>p>span:nth-of-type(1)::before{
    content: "";
    display: block;
    width: calc(7.96 * var(--site-horizontal-ratio));
    height: calc(16.15 * var(--site-horizontal-ratio));
    background-image: url(../images/fv-mark.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    transform: translate(-100%,50%);
}
.fv>p>span:nth-of-type(1)~span{
    background-image: var(--site-linear-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.fv>p>span:nth-of-type(2){
    font-size: calc(60.75 * var(--site-horizontal-ratio));
}
.fv>p>span:nth-of-type(3){
    font-size: calc(47.73 * var(--site-horizontal-ratio));
}
.fv>p>span:nth-of-type(4){
    font-size: calc(34.71 * var(--site-horizontal-ratio));
    text-align: left;
}
.fv>span{
    margin-top: calc(6 * var(--site-horizontal-ratio));
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: calc(143.19 * var(--site-horizontal-ratio));
    height: calc(49.47 * var(--site-horizontal-ratio));
    font-size: calc(13.89 * var(--site-horizontal-ratio));
    font-weight: bold;
    background-image: linear-gradient(40deg, #C6AE6D60, #E7DEB960 51%, #CAB67E60 100%);
    box-shadow: calc(3.47 * var(--site-horizontal-ratio)) calc(3.47 * var(--site-horizontal-ratio)) 0 #333333;
    --border-radius: calc(6.07 * var(--site-horizontal-ratio));
}
.fv>span:nth-of-type(1){
    border-top-left-radius: var(--border-radius);
    border-bottom-left-radius: var(--border-radius);
    position: relative;
}
.fv>span:nth-of-type(1)::after{
    content: "";
    display: block;
    width: calc(19.22 * var(--site-horizontal-ratio));
    height: calc(19.22 * var(--site-horizontal-ratio));
    background-image: url(../images/plus.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(80%,-50%);
}
.fv>span:nth-of-type(2){
    border-top-right-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
}
.fv+.button{
    margin-top: calc(48.45 * var(--site-horizontal-ratio));
}
/* fv end */

/* designCourse start */
.designCourse{
    margin-top: calc(calc(143.99 - 48.45 - 60.54) * var(--site-horizontal-ratio));
    padding: calc(70 * var(--site-horizontal-ratio)) calc(10.66 * var(--site-horizontal-ratio)) calc(calc(637.31 - 190.83 - 376.48) * var(--site-horizontal-ratio));
    position: relative;
}
.designCourse::after{
    content: "";
    display: block;
    width: 100%;
    height: calc(425 * var(--site-horizontal-ratio));
    background-image: linear-gradient(83deg, #C6AE6D90, #E7DEB990 51%, #CAB67E90 100%);
    clip-path: polygon(0% 0%, 100% 0%, 100% 80%, 0 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.designCourse>dt{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: calc(32 * var(--site-horizontal-ratio));
    font-weight: bold;
}
.designCourse>dt>img{
    width: calc(70 * var(--site-horizontal-ratio));
}
.designCourse>dd{
    margin-top: calc(40 * var(--site-horizontal-ratio));
}
.designCourse>dd>img{
    width: calc(350 * var(--site-horizontal-ratio));
}
.designCourse>dd>p{
    margin-top: calc(27.69 * var(--site-horizontal-ratio));
    font-size: calc(28.41 * var(--site-horizontal-ratio));
    font-weight: bold;
    letter-spacing: 0.05em;
    display: flex;
    flex-wrap: wrap;
    gap: calc(8.2 * var(--site-horizontal-ratio));
}
.designCourse>dd>p>span:nth-of-type(1),
.designCourse>dd>p>span:nth-of-type(2)
{
    width: fit-content;
    background-color: #333333;
    color: #ffffff;
    padding: calc(4.1 * var(--site-horizontal-ratio)) calc(8.2 * var(--site-horizontal-ratio));
}
/* designCourse end */

/* voice start */
.voice{
    padding: calc(35 * var(--site-horizontal-ratio)) calc(12.5 * var(--site-horizontal-ratio)) calc(calc(1795 - 1614 - 111) * var(--site-horizontal-ratio));
}
.voice>span{
    display: block;
    text-align: center;
    font-size: calc(32 * var(--site-horizontal-ratio));
    font-weight: bold;
}
.voice>div{
    margin-top: calc(30 * var(--site-horizontal-ratio));
}
.voice>div:first-of-type{
    margin-top: calc(40 * var(--site-horizontal-ratio));
}
.voice>div>img{
    width: calc(330 * var(--site-horizontal-ratio));
    margin-right: 0;
    margin-left: auto;
    display: block;
}
.voice>div>div{
    display: flex;
    flex-direction: column;
    gap: calc(5 * var(--site-horizontal-ratio));
    margin-top: calc(20 * var(--site-horizontal-ratio));
}
.voice>div>div>span{
    width: fit-content;
    background-color: #333333;
    color: #ffffff;
    font-size: calc(20 * var(--site-horizontal-ratio));
    padding: 0 calc(5 * var(--site-horizontal-ratio));
}
.voice>div>p{
    margin-top: calc(16 * var(--site-horizontal-ratio));
    font-size: calc(16 * var(--site-horizontal-ratio));
    font-weight: 400;
    letter-spacing: 0.03em;
    line-height: 150%;
}
.voice>div>p>span{
    margin-top: calc(10 * var(--site-horizontal-ratio));
    display: block;
    text-align: right;
    font-size: calc(12 * var(--site-horizontal-ratio));
    letter-spacing: initial;
}
/* voice end */

/* fukidashi start */
.fukidashi{
    background-image: 
        linear-gradient(to right,#000000b0,#000000b0),
        url(../images/fukidashi.png);
    background-position: top 0 right 42%;
    background-size: cover;
    padding: calc(35 * var(--site-horizontal-ratio)) 0 calc(70 * var(--site-horizontal-ratio));
}
.fukidashi>div{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: calc(208 * var(--site-horizontal-ratio));
    height: calc(95 * var(--site-horizontal-ratio));
    font-size: calc(16 * var(--site-horizontal-ratio));
    border-radius: calc(16 * var(--site-horizontal-ratio));
    line-height: 180%;
    letter-spacing: 0.05em;
    background-color: #ffffff;
    font-weight: bold;
    box-shadow: calc(2 * var(--site-horizontal-ratio)) calc(2 * var(--site-horizontal-ratio)) 0 #333333;
    position: relative;
    z-index: 0;
}
.fukidashi>div::after{
    content: "";
    display: block;
    width: 100%;
    height: calc(calc(133 - 95) * var(--site-horizontal-ratio));
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: 0;
    transform: translateY(100%);
    background-image:
        radial-gradient(circle at center, white 0 calc(45% - 1px), transparent 45% 100%),
        radial-gradient(circle at center, #333333 0 calc(45% - 1px), transparent 45% 100%),
        radial-gradient(circle at center, white 0 calc(35% - 1px), transparent 35% 100%),
        radial-gradient(circle at center, #333333 0 calc(35% - 1px), transparent 35% 100%),
        radial-gradient(circle at center, white 0 calc(20% - 1px), transparent 20% 100%),
        radial-gradient(circle at center, #333333 0 calc(20% - 1px), transparent 20% 100%);
    background-size:
        calc(26 * var(--site-horizontal-ratio)),
        calc(26 * var(--site-horizontal-ratio)),
        calc(14 * var(--site-horizontal-ratio)),
        calc(14 * var(--site-horizontal-ratio)),
        calc(8 * var(--site-horizontal-ratio)),
        calc(8 * var(--site-horizontal-ratio));
    background-position:
        top calc(-13 * var(--site-horizontal-ratio)) right calc(50 * var(--site-horizontal-ratio)),
        top calc(-9 * var(--site-horizontal-ratio)) right calc(48 * var(--site-horizontal-ratio)),
        top calc(3 * var(--site-horizontal-ratio)) right calc(38 * var(--site-horizontal-ratio)),
        top calc(5.5 * var(--site-horizontal-ratio)) right calc(35.5 * var(--site-horizontal-ratio)),
        top calc(15 * var(--site-horizontal-ratio)) right calc(26 * var(--site-horizontal-ratio)),
        top calc(17 * var(--site-horizontal-ratio)) right calc(24 * var(--site-horizontal-ratio));
    background-repeat: no-repeat;
}
.fukidashi>div:nth-of-type(1){
    margin-right: calc(18.63 * var(--site-horizontal-ratio));
    margin-left: auto;
}
.fukidashi>div:nth-of-type(2){
    margin-left: calc(18.63 * var(--site-horizontal-ratio));
    margin-top: calc(calc(160 - 95 - 35) * var(--site-horizontal-ratio));
}
.fukidashi>span{
    width: fit-content;
    display: block;
    margin: calc(calc(313 - 35 - 230) * var(--site-horizontal-ratio)) auto 0;
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    font-size: calc(36 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    padding-bottom: calc(16 * var(--site-horizontal-ratio));
    background-image: url(../images/fukidashi-line.svg);
    background-repeat: no-repeat;
    background-position: bottom 0 right 0;
    background-size: 100%;
}
.fukidashi>p{
    margin: calc(20 * var(--site-horizontal-ratio)) auto 0;
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    font-size: calc(16 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
}
.fukidashi>.button{
    width: calc(340 * var(--site-horizontal-ratio));
    height: calc(72 * var(--site-horizontal-ratio));
    margin-top: calc(calc(444 - 395 - 29 + 20) * var(--site-horizontal-ratio));
    font-size: calc(24 * var(--site-horizontal-ratio));
}
.fukidashi>.button>span{
    width: calc(284 * var(--site-horizontal-ratio));
    height: calc(32 * var(--site-horizontal-ratio));
    font-size: calc(15 * var(--site-horizontal-ratio));
    border-radius: calc(5 * var(--site-horizontal-ratio));
}
/* fukidashi end */

/* reason start */
.reason{
    margin: calc(70 * var(--site-horizontal-ratio)) auto 0;
    padding-bottom: calc(100 * var(--site-horizontal-ratio));
}
.reason>div{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: calc(30 * var(--site-horizontal-ratio));
    font-weight: bold;
    letter-spacing: 0.05em;
    position: relative;
}
.reason>div::after{
    content: "";
    display: block;
    width: calc(1 * var(--site-horizontal-ratio));
    height: calc(35 * var(--site-horizontal-ratio));
    background-color: #333333;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%,calc(50 * var(--site-horizontal-ratio)));
}
.reason>div>span{
    font-size: calc(40 * var(--site-horizontal-ratio));
}
.reason>div>span::first-letter{
    font-size: calc(48 * var(--site-horizontal-ratio));
}
.reason>ol{
    margin-top: calc(calc(243 - 70 - 98 + 47) * var(--site-horizontal-ratio));
    display: flex;
    flex-direction: column;
    gap: calc(73 * var(--site-horizontal-ratio));
    counter-reset: reason;
}
.reason>ol>li{
    background-image: linear-gradient(40deg, #C6AE6D90, #E7DEB990 51%, #CAB67E90 100%);
    padding: calc(50 * var(--site-horizontal-ratio)) calc(20 * var(--site-horizontal-ratio));
    position: relative;
}
.reason>ol>li::before{
    width: 100%;
    counter-increment: reason;
    white-space: pre-wrap;
    font-family: var(--site-font-family-Advent-Pro);
    background-image: linear-gradient(to right, #BF533190, #EF6A5A90);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: calc(48.2 * var(--site-horizontal-ratio));
    font-size: calc(52.09 * var(--site-horizontal-ratio));
    font-weight: 500;
    font-style: italic;
    position: absolute;
    top: calc(-58 * var(--site-horizontal-ratio));
    padding:0 calc(20 * var(--site-horizontal-ratio));
    left: 0;
}
.reason>ol>li:nth-of-type(even)::before{
    text-align: right;
}
.reason>ol>li:nth-of-type(1)::before{
    content: "0"counter(reason) "\ASupport";
}
.reason>ol>li:nth-of-type(2)::before{
    content: "0"counter(reason) "\A Curriculum";
}
.reason>ol>li:nth-of-type(3)::before{
    content: "0"counter(reason) "\AMentor";
}
.reason>ol>li>img{
    width: 100%;
}
.reason>ol>li>div{
    margin-top: calc(25 * var(--site-horizontal-ratio));
    font-size: calc(20 * var(--site-horizontal-ratio));
    font-weight: bold;
    letter-spacing: 0.05em;
}
.reason>ol>li>p{
    margin-top: calc(10 * var(--site-horizontal-ratio));
    font-size: calc(15 * var(--site-horizontal-ratio));
    font-weight: 400;
    line-height: 160%;
    letter-spacing: 0.05em;
}
/* reason end */

/* support start */
.support{
    background-image: var(--site-linear-gradient);
    padding: calc(70 * var(--site-horizontal-ratio)) 0;
    display: flex;
    flex-direction: column;
    gap: calc(40 * var(--site-horizontal-ratio));
    color: #ffffff;
}
.support>div{
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: calc(30 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
}
.support>ol{
    width: calc(319 * var(--site-horizontal-ratio));
    margin: auto;
    display: flex;
    flex-direction: column;
    gap: calc(40 * var(--site-horizontal-ratio));
    counter-reset: support;
}
.support>ol>li{
    position: relative;
}
.support>ol>li::before{
    counter-increment: support;
    content: "0" counter(support);
    display: flex;
    justify-content: center;
    width: calc(66.18 * var(--site-horizontal-ratio));
    height: calc(46.33 * var(--site-horizontal-ratio));
    border-bottom-right-radius: calc(21 * var(--site-horizontal-ratio));
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(to right,#C65637,#C85739);
    font-size: calc(41.92 * var(--site-horizontal-ratio));
    font-weight: bold;
    line-height: calc(41 * var(--site-horizontal-ratio));
}
.support>ol>li>img{
    width: 100%;
}
.support>ol>li>div{
    margin-top: calc(20 * var(--site-horizontal-ratio));
    font-size: calc(24 * var(--site-horizontal-ratio));
    font-weight: bold;
    letter-spacing: 0.05em;
}
.support>ol>li>p{
    margin-top: calc(10 * var(--site-horizontal-ratio));
    font-size: calc(16 * var(--site-horizontal-ratio));
    font-weight: 400;
    letter-spacing: 0.03em;
    line-height: 150%;
}
/* support end */

/* teacher_splide start */
.teacher_splide{
    width: calc(330 * var(--site-horizontal-ratio));
    margin: auto;
    padding: calc(70 * var(--site-horizontal-ratio)) 0;
    position: relative;
}
.teacher_splide>span{
    font-size: calc(30 * var(--site-horizontal-ratio));
    font-weight: bold;
    letter-spacing: 0.05em;
    display: block;
    text-align: center;
}
.teacher_splide>.splide__track{
    margin-top: calc(40 * var(--site-horizontal-ratio));
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1){
    background-image: var(--site-linear-gradient);
    padding: calc(10 * var(--site-horizontal-ratio));
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row-reverse;
    color: #ffffff;
    letter-spacing: 0.05em;
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1)>figure{
    width: calc(117 * var(--site-horizontal-ratio));
    height: calc(117 * var(--site-horizontal-ratio));
    border-radius: 50%;
    overflow: hidden;
    position: relative;
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1)>figure>img{
    width: 100%;
    position: absolute;
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1)>figure>img[src='images/teacher3.jpg']{
    width: 150%;
    right: -30%;
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1)>span{
    font-size: calc(24 * var(--site-horizontal-ratio));
    font-weight: bold;
    display: flex;
    flex-direction: column;
    gap: calc(5 * var(--site-horizontal-ratio));
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1)>span>span{
    font-size: calc(16 * var(--site-horizontal-ratio));
    font-weight: 400;
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(2){
    border-image: var(--site-linear-gradient) 1 / calc(2 * var(--site-horizontal-ratio));
    padding: calc(15 * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio)) calc(30 * var(--site-horizontal-ratio));
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(2)>span{
    display: block;
    font-size: calc(16 * var(--site-horizontal-ratio));
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 120%;
    border-bottom: calc(1 * var(--site-horizontal-ratio)) solid #A8A8A8;
    padding-bottom: calc(5 * var(--site-horizontal-ratio));
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(2)>span:nth-of-type(2){
    margin-top: calc(16 * var(--site-horizontal-ratio));
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(2)>ul>li{
    margin-top: calc(5 * var(--site-horizontal-ratio));
    padding-left: calc(23 * var(--site-horizontal-ratio));
    display: flex;
    flex-direction: row;
    font-size: calc(16 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    line-height: 160%;
    background-image: linear-gradient(to right,#333,#333);
    background-size: calc(10 * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio));
    background-position:top calc(4 * var(--site-horizontal-ratio)) left calc(4 * var(--site-horizontal-ratio));
    background-repeat: no-repeat;
}
.teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(2)>p{
    margin-top: calc(5 * var(--site-horizontal-ratio));
    font-size: calc(16 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    line-height: 140%;
}
.teacher_splide>.splide__arrows{
    position: absolute;
    top: 50%;
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.teacher_splide>.splide__arrows>.splide__arrow{
    display: block;
    width: calc(20 * var(--site-horizontal-ratio));
    height: calc(20 * var(--site-horizontal-ratio));
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border: none;
    background-color: transparent;
}
.teacher_splide>.splide__arrows>.splide__arrow:is(.splide__arrow--prev){
    background-image: url(../images/arrow-prev.svg);
    transform: translateX(-100%);
}
.teacher_splide>.splide__arrows>.splide__arrow:is(.splide__arrow--next){
    background-image: url(../images/arrow-next.svg);
    transform: translateX(100%);
}
.teacher_splide>.splide__pagination{
    gap: calc(15 * var(--site-horizontal-ratio));
    margin-top: calc(40 * var(--site-horizontal-ratio));
}
.teacher_splide>.splide__pagination>li>button{
    display: block;
    width: calc(15 * var(--site-horizontal-ratio));
    height: calc(15 * var(--site-horizontal-ratio));
    border-radius: 50%;
    border: 0;
    background-color: #A8A8A8;
}
/* teacher_splide end */

/* course start */
.course{
    padding: calc(70 * var(--site-horizontal-ratio)) 0;
}
.course>span{
    font-size: calc(30 * var(--site-horizontal-ratio));
    font-weight: bold;
    letter-spacing: 0.05em;
    display: block;
    text-align: center;
}
.course>div{
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(345 * var(--site-horizontal-ratio));
    height: calc(57 * var(--site-horizontal-ratio));
    margin: calc(35 * var(--site-horizontal-ratio)) auto 0;
    border: calc(2.01 * var(--site-horizontal-ratio)) solid transparent;
    border-radius: calc(5.01 * var(--site-horizontal-ratio));
    background-image: linear-gradient(white, white), var(--site-linear-gradient);
    background-origin: border-box;
    background-clip: padding-box, border-box;
}
.course>div>span:nth-of-type(1){
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(79.08 * var(--site-horizontal-ratio));
    height: calc(24.03 * var(--site-horizontal-ratio));
    background-image: var(--site-linear-gradient);
    border-radius: calc(2.51 * var(--site-horizontal-ratio));
    color: #ffffff;
    font-size: calc(12.03 * var(--site-horizontal-ratio));
    margin-right: calc(10 * var(--site-horizontal-ratio));
}
.course>div>span:nth-of-type(2){
    background-image: var(--site-linear-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: calc(32.08 * var(--site-horizontal-ratio));
    font-weight: bold;
}
.course>div>span:nth-of-type(3){
    background-image: var(--site-linear-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: calc(18.05 * var(--site-horizontal-ratio));
    font-weight: bold;
    padding-top: calc(10 * var(--site-horizontal-ratio));
}
.course>div>span:nth-of-type(4){
    background-image: var(--site-linear-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: calc(32.08 * var(--site-horizontal-ratio));
    font-weight: bold;
}
.course>p{
    text-align: center;
    width: calc(345 * var(--site-horizontal-ratio));
    margin: calc(15 * var(--site-horizontal-ratio)) auto 0;
    font-size: calc(14 * var(--site-horizontal-ratio));
}
.course>ul{
    width: calc(340 * var(--site-horizontal-ratio));
    margin: calc(35 * var(--site-horizontal-ratio)) auto 0;
    display: flex;
    flex-direction: column;
    gap: calc(30 * var(--site-horizontal-ratio));
}
.course>ul>li{
    padding: calc(20 * var(--site-horizontal-ratio));
    box-shadow: calc(4 * var(--site-horizontal-ratio)) calc(4 * var(--site-horizontal-ratio)) 0 0 var(--color);
}
.course>ul>li:nth-of-type(1){
    --color:#EF6A5A;
}
.course>ul>li:nth-of-type(2){
    --color:#D85F46;
}
.course>ul>li:nth-of-type(3){
    --color:#BF5331;
}
.course>ul>li>span:nth-of-type(1){
    display: block;
    text-align: center;
    color: var(--color);
    font-size: calc(16 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
}
.course>ul>li>span:nth-of-type(2){
    display: block;
    margin-top: calc(10 * var(--site-horizontal-ratio));
    text-align: center;
    color: var(--color);
    font-size: calc(26 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-weight: bold;
    padding-bottom: calc(15 * var(--site-horizontal-ratio));
    background-image: linear-gradient(to right,#C3C3C3,#C3C3C3);
    background-position: bottom 0 left 50%;
    background-size: calc(185 * var(--site-horizontal-ratio)) calc(1 * var(--site-horizontal-ratio));
    background-repeat: no-repeat;
}
.course>ul>li>span:nth-of-type(3){
    display: block;
    margin-top: calc(10 * var(--site-horizontal-ratio));
    font-size: calc(20 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-weight: 500;
    padding-top: calc(15 * var(--site-horizontal-ratio));
    background-image: linear-gradient(to right,#C3C3C3,#C3C3C3);
    background-position: top 0 left 50%;
    background-size: calc(185 * var(--site-horizontal-ratio)) calc(1 * var(--site-horizontal-ratio));
    background-repeat: no-repeat;
}
.course>ul>li>p{
    font-size: calc(20 * var(--site-horizontal-ratio));
    display: flex;
    flex-direction: row;
    gap: calc(8 * var(--site-horizontal-ratio));
}
.course>ul>li>p:nth-of-type(1){
    margin-top: calc(15 * var(--site-horizontal-ratio));
}
.course>ul>li>p:nth-of-type(2){
    margin-top: calc(10 * var(--site-horizontal-ratio));
}
.course>ul>li>p::before{
    content: "";
    display: block;
    width: calc(33 * var(--site-horizontal-ratio));
    height: calc(33 * var(--site-horizontal-ratio));
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.course>ul>li>p:nth-of-type(1)::before{
    background-image: url(../images/course-learning.svg);
}
.course>ul>li>p:nth-of-type(2)::before{
    background-image: url(../images/course-support.svg);
}
.course>ul>li>ul>li{
    list-style: disc;
    list-style-position: inside;
    font-size: calc(20 * var(--site-horizontal-ratio));
    font-weight: 400;
}
/* course end */

/* steps start */
.steps{
    background-image: var(--site-linear-gradient);
    padding: calc(70 * var(--site-horizontal-ratio)) 0;
}
.steps>span{
    display: block;
    text-align: center;
    font-size: calc(30 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-weight: bold;
    color: #ffffff;
}
.steps>ol{
    width: calc(310 * var(--site-horizontal-ratio));
    margin: calc(35 * var(--site-horizontal-ratio)) auto 0;
    display: flex;
    flex-direction: column;
    gap: calc(34 * var(--site-horizontal-ratio));
    counter-reset: steps;
}
.steps>ol>li{
    background-color: #ffffff;
    padding: calc(20 * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio));
    position: relative;
}
.steps>ol>li::before{
    counter-increment: steps;
    content: "0" counter(steps);
    display: flex;
    justify-content: center;
    width: calc(49 * var(--site-horizontal-ratio));
    height: calc(40 * var(--site-horizontal-ratio));
    border-bottom-right-radius: calc(30 * var(--site-horizontal-ratio));
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(to right, #C65637, #C85739);
    font-size: calc(24 * var(--site-horizontal-ratio));
    font-weight: bold;
    color: #ffffff;
}
.steps>ol>li:first-of-type~li:after{
    content: "";
    display: block;
    width: calc(33 * var(--site-horizontal-ratio));
    height: calc(34 * var(--site-horizontal-ratio));
    background-image: url(../images/step-after.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%,-100%);
}
.steps>ol>li>img{
    display: block;
    width: calc(53 * var(--site-horizontal-ratio));
    margin: auto;
}
.steps>ol>li>span{
    display: block;
    margin-top: calc(8 * var(--site-horizontal-ratio));
    text-align: center;
    font-weight: bold;
    font-size: calc(20 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
}
.steps>ol>li>p{
    margin-top: calc(10 * var(--site-horizontal-ratio));
    font-size: calc(15 * var(--site-horizontal-ratio));
    letter-spacing: 0.03em;
    line-height: 120%;
}
/* steps end */

.steps+div.fukidashi{
    background-image: url(../images/fukidashi2-mobile.png);
}
.steps+div.fukidashi>span{
    font-size: calc(24 * var(--site-horizontal-ratio));
}

/* flows start */
.flows{
    padding: calc(70 * var(--site-horizontal-ratio)) 0;
}
.flows>span{
    font-size: calc(30 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-weight: bold;
    display: block;
    text-align: center;
}
.flows>ol{
    margin: calc(59.5 * var(--site-horizontal-ratio)) auto 0;
    width: calc(310 * var(--site-horizontal-ratio));
    display: flex;
    flex-direction: column;
    gap: calc(50 * var(--site-horizontal-ratio));
    counter-reset: flows;
}
.flows>ol>li{
    padding: calc(50 * var(--site-horizontal-ratio)) calc(15 * var(--site-horizontal-ratio));
    border: calc(4 * var(--site-horizontal-ratio)) solid transparent;
    border-radius: calc(10 * var(--site-horizontal-ratio));
    background-image: linear-gradient(white, white), var(--site-linear-gradient);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    position: relative;
}
.flows>ol>li::before{
    counter-increment: flows;
    content: counter(flows);
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(51 * var(--site-horizontal-ratio));
    height: calc(51 * var(--site-horizontal-ratio));
    background-image: var(--site-linear-gradient);
    font-size: calc(32 * var(--site-horizontal-ratio));
    color: #ffffff;
    font-weight: bold;
    border-radius: 9999px;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%,-50%);
}
.flows>ol>li>img{
    display: block;
    margin: auto;
    width: calc(79 * var(--site-horizontal-ratio));
}
.flows>ol>li>span{
    display: block;
    margin-top: calc(16 * var(--site-horizontal-ratio));
    font-size: calc(20 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-weight: bold;
    text-align: center;
}
.flows>ol>li>p{
    margin-top: calc(10 * var(--site-horizontal-ratio));
    font-size: calc(15 * var(--site-horizontal-ratio));
    letter-spacing: 0.03em;
    line-height: 120%;
    text-align: center;
}
/* flows end */

/* qa start */
.qa{
    padding: calc(35 * var(--site-horizontal-ratio)) 0;
}
.qa>span{
    font-size: calc(30 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-weight: bold;
    display: block;
    text-align: center;
}
.qa>dl{
    width: calc(365 * var(--site-horizontal-ratio));
    margin: calc(30 * var(--site-horizontal-ratio)) auto 0;
    display: flex;
    flex-direction: column;
    gap: calc(10 * var(--site-horizontal-ratio));
}
.qa>dl:first-of-type{
    margin-top: calc(40 * var(--site-horizontal-ratio));
}
.qa>dl>dt,
.qa>dl>dd{
    padding: calc(4 * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio)) calc(4 * var(--site-horizontal-ratio)) calc(67 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-size: calc(16 * var(--site-horizontal-ratio));
    position: relative;
    min-height: calc(51 * var(--site-horizontal-ratio));
    display: flex;
}
.qa>dl>dt{
    font-weight: bold;
    align-items: center;
    background-color: #E7E7E7;
    border-radius: 9999px;
}
.qa>dl>dd{
    line-height: 180%;
}
.qa>dl>dt::before,
.qa>dl>dd::before{
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(42 * var(--site-horizontal-ratio));
    height: calc(42 * var(--site-horizontal-ratio));
    letter-spacing: 0.05em;
    font-size: calc(20 * var(--site-horizontal-ratio));
    font-weight: bold;
    border-radius: 50%;
    position: absolute;
    top: calc(4 * var(--site-horizontal-ratio));
    left: calc(15 * var(--site-horizontal-ratio));
}
.qa>dl>dt::before{
    content: "Q";
    background-color: #333333;
    color: #ffffff;
}
.qa>dl>dd::before{
    content: "A";
    color: #333333;
    border: calc(1 * var(--site-horizontal-ratio)) solid #333333;
}
/* qa end */

/* footer start */
footer{
    background-color: #333333;
    padding: calc(30 * var(--site-horizontal-ratio)) 0;
}
footer>div{
    display: flex;
    justify-content: center;
    gap: calc(15 * var(--site-horizontal-ratio));
}
footer>div>a{
    text-decoration: none;
    color: #ffffff;
    font-size: calc(11 * var(--site-horizontal-ratio));
}
footer>small{
    display: block;
    margin-top: calc(17 * var(--site-horizontal-ratio));
    text-align: center;
    font-size: calc(16 * var(--site-horizontal-ratio));
    color: #ffffff;
}
/* footer end */

/* user_apply start */
.user_apply{
  background-color: #FFF6F6;
  margin: calc(30 * var(--site-horizontal-ratio)) auto 0;
  padding: calc(44 * var(--site-horizontal-ratio)) calc(34 * var(--site-horizontal-ratio));
}
.user_apply>div{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-weight: bold;
  line-height: calc(33.6 * var(--site-horizontal-ratio));
}
.user_apply>div>span:nth-of-type(1){
  font-size: calc(30 * var(--site-horizontal-ratio));
}
.user_apply>div>span:nth-of-type(2){
  font-size: calc(30 * var(--site-horizontal-ratio));
}
.user_apply>ul{
  display: flex;
  justify-content: space-between;
  counter-reset: steps;
  margin-top: calc(35 * var(--site-horizontal-ratio));
  background-image: url(../images/step-arrow.png);
  background-repeat: repeat-x;
  background-size: auto calc(19.5 * var(--site-horizontal-ratio));
  background-position: top 50% right 0;
}
.user_apply>ul>li{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30%;
  border: calc(1 * var(--site-horizontal-ratio)) solid #D35D42;
  --img-height:50;
  --radius:50;
  padding: calc(calc(10 + var(--img-height) + var(--radius)) * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio));
  font-size: calc(12 * var(--site-horizontal-ratio));
  line-height: 1.5;
  text-align: center;
  background-size: auto calc(var(--img-height) * var(--site-horizontal-ratio)),auto;
  background-position: top calc(var(--radius) * var(--site-horizontal-ratio) / 1.5) right 50%,top 0 left 0;
  background-repeat: no-repeat;
  position: relative;
}
.user_apply>ul>li:nth-of-type(1){
  background-image:
    url(../images/form-step1.png),
    linear-gradient(to bottom,#ffffff 0 60%,#F6DFDA 60% 100%);
}
.user_apply>ul>li:nth-of-type(2){
  background-image:
    url(../images/form-step2.png),
    linear-gradient(to bottom,#ffffff 0 60%,#F6DFDA 60% 100%);
}
.user_apply>ul>li:nth-of-type(3){
  background-image:
    url(../images/form-step3.png),
    linear-gradient(to bottom,#ffffff 0 60%,#F6DFDA 60% 100%);
}
.user_apply>ul>li::before{
  position: absolute;
  counter-increment: steps;
  content: counter(steps);
  position: absolute;
  top: calc(-10 * var(--site-horizontal-ratio));
  left: 50%;
  transform: translateX(-50%);
  color: #ffffff;
  font-size: calc(20 * var(--site-horizontal-ratio));
  z-index: 1;
}
.user_apply>ul>li::after{
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translate(-50%,-50%);
  content: "step";
  display: block;
  width: calc(var(--radius) * var(--site-horizontal-ratio));
  height: calc(var(--radius) * var(--site-horizontal-ratio));
  border-radius: 50%;
  background-color: #D35D42;
  text-align: center;
  color: #ffffff;
  font-weight: normal;
  font-size: calc(12 * var(--site-horizontal-ratio));
  padding-top: calc(5 * var(--site-horizontal-ratio));
}
.user_apply>form{
  background-color: #ffffff;
  margin: calc(calc(423 - 330 - 70.71) * var(--site-horizontal-ratio)) auto 0;
  padding: calc(1 * var(--site-horizontal-ratio)) calc(20 * var(--site-horizontal-ratio)) calc(50 * var(--site-horizontal-ratio));
}
.user_apply>form>label{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: calc(10 * var(--site-horizontal-ratio));
  width: 100%;
  margin-top: calc(calc(423 - 330 - 70.71) * var(--site-horizontal-ratio));
}
.user_apply>form>label>span{
  font-weight: bold;
  font-size: calc(13.53 * var(--site-horizontal-ratio));
  line-height: calc(20.5 * var(--site-horizontal-ratio));
  letter-spacing: 0.04em;
  width: 100%;
  display: flex;
  align-items: center;
  gap: calc(5 * var(--site-horizontal-ratio));
}
.user_apply>form>label:has(input[required])>span::after{
  content: "必須";
  background-color: #D9768B;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(29 * var(--site-horizontal-ratio));
  height: calc(12.76 * var(--site-horizontal-ratio));
  color: #ffffff;
  font-size: calc(7.73 * var(--site-horizontal-ratio));
  line-height: calc(20.5 * var(--site-horizontal-ratio));
  letter-spacing: 0.1em;
  border-radius: calc(1.21 * var(--site-horizontal-ratio));
}
.user_apply>form>label>input,
.user_apply>form>label>select,
.user_apply>form>label>textarea{
  border: 1px solid #FFA9AB;
  border-radius: calc(3.93 * var(--site-horizontal-ratio));
  color: #4A4949;
  font-weight: bold;
  font-size: calc(14 * var(--site-horizontal-ratio));
  line-height: calc(20.6 * var(--site-horizontal-ratio));
  letter-spacing: 0.04em;
  padding: calc(calc(63.28 - 54) * var(--site-horizontal-ratio));
}
.user_apply>form>label>input,
.user_apply>form>label>select{
  height: calc(45 * var(--site-horizontal-ratio));
}
.user_apply>form>label>input[name='user_last_name'],
.user_apply>form>label>input[name='user_first_name'],
.user_apply>form>label>input[name='user_reserve_date'],
.user_apply>form>label>select[name='user_reserve_time']
{
  width: calc(130 * var(--site-horizontal-ratio));
}
.user_apply>form>label>input[name='user_tel'],
.user_apply>form>label>input[name='user_email'],
.user_apply>form>label>select,
.user_apply>form>label>textarea
{
  width: 100%;
}
.user_apply>form>button[type=button]{
  margin: calc(calc(828 - 710 - 75) * var(--site-horizontal-ratio)) auto 0;
  width: calc(250 * var(--site-horizontal-ratio));
  height: calc(60 * var(--site-horizontal-ratio));
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: #e83434;
  color: #ffffff;
  font-weight: bold;
  font-size: calc(20 * var(--site-horizontal-ratio));
  line-height: calc(70 * var(--site-horizontal-ratio));
  letter-spacing: 0.05em;
  position: relative;
  border: none;
  box-shadow: 0 calc(3 * var(--site-horizontal-ratio)) calc(6 * var(--site-horizontal-ratio)) #a22828;
  cursor: pointer;
}
.user_apply>.apply-thanks{
  width: fit-content;
  text-align: center;
  margin: calc(15 * var(--site-horizontal-ratio)) auto 0;
  font-weight: 700;
  font-size: calc(14 * var(--site-horizontal-ratio));
  transform: translateY(50%);
  opacity: 0;
}
.user_apply>.apply-thanks-fadeIn{
  transform: translateY(0%);
  opacity: 1;
  transition: all 0.5s ease-in-out;
}
/* user_apply end */

/*== landscape responsive ==*/
@media screen and (max-width: 767px) and (orientation: landscape){
}
/*== landscape responsive ==*/
/* -------------------------------base(mobile)↑-------------------------------------- */

/* ---------------------------desktop(include ipad)↓--------------------------------- */
@media screen and (min-width: 768px){
    :root{
        --site-division: 1440;
        --site-padding: calc(60 * var(--site-horizontal-ratio));
        --site-content-width: 1320;
    }
    *.mobile{
        display: none;
    }
    *.desktop{
        display: initial;
    }

    .button{
        width: calc(427 * var(--site-horizontal-ratio));
        height: calc(72 * var(--site-horizontal-ratio));
        border-radius: calc(10 * var(--site-horizontal-ratio));
        font-size: calc(24 * var(--site-horizontal-ratio));
    }
    .button>span{
        width: calc(284 * var(--site-horizontal-ratio));
        height: calc(32 * var(--site-horizontal-ratio));
        border-radius: calc(10 * var(--site-horizontal-ratio));
        font-size: calc(15 * var(--site-horizontal-ratio));
    }

    /* header start */
    header.navOn{
        all: unset;
    }
    header,
    header.navOn{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: calc(15 * var(--site-horizontal-ratio)) calc(40 * var(--site-horizontal-ratio));
        height: calc(80 * var(--site-horizontal-ratio));
        z-index: 1;
        position: relative;
        background-color: #333333;
    }
    header>img{
        display: none;
    }
    header.navOn>i{
        font-size: 0;
    }
    header.navOn>nav{
        all: unset;
    }
    header.navOn>nav,
    header>nav{
        display: flex !important;
        align-items: center;
        gap: calc(30 * var(--site-horizontal-ratio));
    }
    header>nav>a{
        text-decoration: none;
        font-weight: 700;
        color: #ffffff;
        font-size: calc(15 * var(--site-horizontal-ratio));
        cursor: pointer;
    }
    header.navOn>nav>a.zoom,
    header>nav>a.zoom{
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(203 * var(--site-horizontal-ratio));
        height: calc(38 * var(--site-horizontal-ratio));
        border-radius: calc(7 * var(--site-horizontal-ratio));
        background-color: #E83434;
        box-shadow: 0 calc(3 * var(--site-horizontal-ratio)) calc(6 * var(--site-horizontal-ratio)) #d62e2e;
    }
    /* header end */

    /* fv start */
    .fv{
        margin-top: 0;
        column-gap: calc(15.62 * var(--site-horizontal-ratio));
        padding:0 35% calc(calc(578 - 389.55 - 67.23 - 80) * var(--site-horizontal-ratio));
        background-image: url(../images/fv-desktop.png);
        background-size: cover;
    }
    .fv::after{
        content: none;
    }
    .fv>div:nth-of-type(1){
        margin: calc(48 * var(--site-horizontal-ratio)) auto calc(calc(166.74 - 122.17 - 32.98) * var(--site-horizontal-ratio));
        width: calc(366.9 * var(--site-horizontal-ratio));
        height: calc(43.03 * var(--site-horizontal-ratio));
        font-size: calc(22.65 * var(--site-horizontal-ratio));
    }
    .fv>div:nth-of-type(1)::before{
        width: calc(68 * var(--site-horizontal-ratio));
        height: calc(33 * var(--site-horizontal-ratio));
        left: calc(calc(307.55 - 100.07) * var(--site-horizontal-ratio));
        mask-position:
            top calc(10 * var(--site-horizontal-ratio)) left calc(2 * var(--site-horizontal-ratio)),
            top calc(10 * var(--site-horizontal-ratio)) right calc(8 * var(--site-horizontal-ratio));
    }
    .fv>div:nth-of-type(1)::after{
        height: 34%;
    }
    .fv>div:nth-of-type(1)>span{
        font-size: calc(38.5 * var(--site-horizontal-ratio));
        transform: translateY(calc(-3 * var(--site-horizontal-ratio)));
        padding-left: calc(calc(320 - 117.05) * var(--site-horizontal-ratio));
    }
    .fv>p{
        width: calc(394.08 * var(--site-horizontal-ratio));
    }
    .fv>div:nth-of-type(2){
        margin-top: calc(30 * var(--site-horizontal-ratio));
        font-size: calc(20 * var(--site-horizontal-ratio));
    }
    .fv>div:nth-of-type(2)::before,
    .fv>div:nth-of-type(2)::after{
        width: calc(3 * var(--site-horizontal-ratio));
        height: calc(22 * var(--site-horizontal-ratio));
    }
    .fv>div:nth-of-type(2)>img{
        width: calc(128 * var(--site-horizontal-ratio));
    }
    .fv>p>span:nth-of-type(1){
        padding-top: calc(11.1 * var(--site-horizontal-ratio));
        font-size: calc(31.71 * var(--site-horizontal-ratio));
    }
    .fv>p>span:nth-of-type(1)::before{
        width: calc(12.96 * var(--site-horizontal-ratio));
        height: calc(20.15 * var(--site-horizontal-ratio));
    }
    .fv>p>span:nth-of-type(2){
        font-size: calc(79.27 * var(--site-horizontal-ratio));
    }
    .fv>p>span:nth-of-type(3){
        font-size: calc(62.28 * var(--site-horizontal-ratio));
    }
    .fv>p>span:nth-of-type(4){
        font-size: calc(45.3 * var(--site-horizontal-ratio));
    }
    .fv>span{
        margin-top: calc(10 * var(--site-horizontal-ratio));
        width: calc(186.85 * var(--site-horizontal-ratio));
        height: calc(64.55 * var(--site-horizontal-ratio));
        font-size: calc(18.12 * var(--site-horizontal-ratio));
        --border-radius: calc(10 * var(--site-horizontal-ratio));
        box-shadow: calc(4.53 * var(--site-horizontal-ratio)) calc(4.53 * var(--site-horizontal-ratio)) 0 #333333;
    }
    .fv>span:nth-of-type(1)::after{
        width: calc(25 * var(--site-horizontal-ratio));
        height: calc(25 * var(--site-horizontal-ratio));
    }
    .fv+.button{
        margin-top: calc(56 * var(--site-horizontal-ratio));
    }
    /* fv end */

    /* designCourse start */
    .designCourse{
        margin-top: calc(calc(168 - 40 - 88) * var(--site-horizontal-ratio));
        padding: calc(80 * var(--site-horizontal-ratio)) calc(10.66 * var(--site-horizontal-ratio)) calc(calc(600 - 220 - 263) * var(--site-horizontal-ratio));
    }
    .designCourse::after{
        height: calc(778 * var(--site-horizontal-ratio));
        clip-path: polygon(0% 0%, 100% 0%, 100% 55%, 0 100%);
    }
    .designCourse>dt{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .designCourse>dt>img{
        width: calc(81 * var(--site-horizontal-ratio));
    }
    .designCourse>dd>img{
        width: calc(382 * var(--site-horizontal-ratio));
    }
    .designCourse>dd{
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: center;
        gap: calc(40 * var(--site-horizontal-ratio));
    }
    .designCourse>dd>p{
        width: calc(425 * var(--site-horizontal-ratio));
        margin-top: 0;
        font-size: calc(34 * var(--site-horizontal-ratio));
        gap: calc(10* var(--site-horizontal-ratio));
    }
    .designCourse>dd>p>span:nth-of-type(1),
    .designCourse>dd>p>span:nth-of-type(2)
    {
        padding: calc(5 * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio));
    }
    /* designCourse end */


    /* voice start */
    .voice{
        padding: calc(80 * var(--site-horizontal-ratio)) calc(12.5 * var(--site-horizontal-ratio)) calc(calc(1178 - 163 - 895) * var(--site-horizontal-ratio));
        position: relative;
    }
    .voice::after{
        content: "CHAPTER TWO";
        color: #EFEFEF;
        font-size: calc(165 * var(--site-horizontal-ratio));
        font-weight: bold;
        writing-mode: vertical-rl;
        position: absolute;
        right: 0;
        top: 0;
    }
    .voice>span{
        font-size: calc(36 * var(--site-horizontal-ratio));
        letter-spacing: 0.05em;
    }
    .voice>div{
        margin: auto;
        margin-top: calc(80 * var(--site-horizontal-ratio));
        width: calc(788 * var(--site-horizontal-ratio));
        display: grid;
        grid-template-areas:
            "voice-img voice-div"
            "voice-img voice-p";
        align-items: center;
        column-gap: calc(50 * var(--site-horizontal-ratio));
    }
    .voice>div:nth-of-type(even){
        grid-template-areas:
            "voice-div voice-img"
            "voice-p voice-img";
    }
    .voice>div>img{
        width: calc(330 * var(--site-horizontal-ratio));
        grid-area: voice-img;
    }
    .voice>div>div{
        margin-top: calc(0 * var(--site-horizontal-ratio));
        grid-area: voice-div;
    }
    .voice>div>div>span{
        font-size: calc(24 * var(--site-horizontal-ratio));
    }
    .voice>div>p{
        grid-area: voice-p;
    }
    .voice>div>p>span{
        font-size: calc(14 * var(--site-horizontal-ratio));
    }
    /* voice end */

    /* fukidashi start */
    .fukidashi{
        background-position: top 0 right 0%;
        padding: calc(80 * var(--site-horizontal-ratio)) 0 calc(80 * var(--site-horizontal-ratio));
        display: grid;
        grid-template-areas:
            "fukidashi-fukidashi1  fukidashi-fukidashi2"
            "fukidashi-span  fukidashi-span"
            "fukidashi-p  fukidashi-p"
            "fukidashi-button  fukidashi-button";
        justify-content: center;
        column-gap: calc(40 * var(--site-horizontal-ratio));
    }
    .fukidashi>div:nth-of-type(1){
        margin: initial;
        grid-area: fukidashi-fukidashi1;
        justify-self: end;
    }
    .fukidashi>div:nth-of-type(2){
        margin: initial;
        grid-area: fukidashi-fukidashi2;
    }
    .fukidashi>span{
        margin: calc(calc(253 - 80 - 100) * var(--site-horizontal-ratio)) auto 0;
        grid-area: fukidashi-span;
    }
    .fukidashi>p{
        grid-area: fukidashi-p;
    }
    .fukidashi>.button{
        width: calc(427 * var(--site-horizontal-ratio));
        margin-top: calc(calc(444 - 395 - 29 + 20) * var(--site-horizontal-ratio));
        grid-area: fukidashi-button;
    }
    /* fukidashi end */

    /* reason start */
    .reason{
        margin: calc(80 * var(--site-horizontal-ratio)) auto 0;
        padding-bottom: calc(150 * var(--site-horizontal-ratio));
    }
    .reason>div{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .reason>div::after{
        height: calc(48 * var(--site-horizontal-ratio));
        transform: translate(-50%,calc(70 * var(--site-horizontal-ratio)));
    }
    .reason>div>span{
        font-size: calc(48 * var(--site-horizontal-ratio));
    }
    .reason>div>span::first-letter{
        font-size: calc(64 * var(--site-horizontal-ratio));
    }
    .reason>ol{
        margin: calc(calc(394 - 80 - 214 + 50) * var(--site-horizontal-ratio)) auto 0;
        gap: calc(100 * var(--site-horizontal-ratio));
        width: calc(calc(631 + 71 + 71) * var(--site-horizontal-ratio));
    }
    .reason>ol>li{
        background: none;
        padding: calc(0 * var(--site-horizontal-ratio)) calc(32 * var(--site-horizontal-ratio));
        display: grid;
        grid-template-areas:
            "reason-before reason-div"
            "reason-img reason-p";
        grid-template-columns: calc(278 * var(--site-horizontal-ratio)) 1fr;
        position: relative;
        column-gap: calc(10 * var(--site-horizontal-ratio));
    }
    .reason>ol>li::after{
        content: "";
        display: block;
        width: calc(663 * var(--site-horizontal-ratio));
        height: calc(362 * var(--site-horizontal-ratio));
        background-image: linear-gradient(40deg, #C6AE6D90, #E7DEB990 51%, #CAB67E90 100%);
        position: absolute;
        left: 50%;
        top: 0;
        transform: translate(-50%,calc(-52 * var(--site-horizontal-ratio)));
        z-index: -1;
    }
    .reason>ol>li:nth-of-type(even){
        grid-template-areas:
            "reason-div reason-before"
            "reason-p reason-img";
        grid-template-columns: 1fr calc(278 * var(--site-horizontal-ratio));
        padding-left: calc(100 * var(--site-horizontal-ratio));
        padding-right: 0;
    }
    .reason>ol>li::before{
        line-height: calc(61.1 * var(--site-horizontal-ratio));
        font-size: calc(63.08 * var(--site-horizontal-ratio));
        top: calc(0 * var(--site-horizontal-ratio));
        padding-left:0;
        left: 0;
        grid-area: reason-before;
    }
    .reason>ol>li>img{
        margin-top: calc(35 * var(--site-horizontal-ratio));
        grid-area: reason-img;
    }
    .reason>ol>li>div{
        margin-top: calc(0 * var(--site-horizontal-ratio));
        font-size: calc(24 * var(--site-horizontal-ratio));
        grid-area: reason-div;
    }
    .reason>ol>li>p{
        margin-top: calc(16 * var(--site-horizontal-ratio));
        font-size: calc(16 * var(--site-horizontal-ratio));
        line-height: 180%;
        grid-area: reason-p;
    }
    /* reason end */

    /* support start */
    .support{
        padding: calc(120 * var(--site-horizontal-ratio)) 0 0;
        background: none;
        position: relative;
    }
    .support::after{
        content: "";
        display: block;
        width: 100%;
        height: calc(850 * var(--site-horizontal-ratio));
        background-image: var(--site-linear-gradient);
        position: absolute;
        z-index: -1;
        top: 0;
        left: 0;
        transform: skew(0,8deg);
    }
    .support>div{   
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .support>ol{
        width: calc(1037 * var(--site-horizontal-ratio));
        flex-direction: row;
        justify-content: space-between;
        gap: initial;
    }
    .support>ol>li{
        width: calc(319 * var(--site-horizontal-ratio));
    }
    .support>ol>li:nth-of-type(2){
        margin-top: calc(calc(283 - 246) * var(--site-horizontal-ratio));
    }
    .support>ol>li:nth-of-type(3){
        margin-top: calc(calc(325 - 246) * var(--site-horizontal-ratio));
    }
    .support>ol>li:nth-of-type(1):before{
        background-image: linear-gradient(to right,#C65637,#C85739);
    }
    .support>ol>li:nth-of-type(2):before{
        background-image: linear-gradient(to right,#D15C41,#D45D43);
    }
    .support>ol>li:nth-of-type(3):before{
        background-image: linear-gradient(to right,#DE624B,#E0634D);
    }
    .support>ol>li>p{
        margin-top: calc(16 * var(--site-horizontal-ratio));
    }
    /* support end */

    /* teacher_splide start */
    .teacher_splide{
        margin-top: calc(100 * var(--site-horizontal-ratio));
        width: calc(calc(80 + 466 + 466) * var(--site-horizontal-ratio));
        padding: calc(80 * var(--site-horizontal-ratio)) 0;
    }
    .teacher_splide>span{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1){
        padding: calc(10 * var(--site-horizontal-ratio)) calc(30 * var(--site-horizontal-ratio));
    }
    .teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(1)>figure{
        margin-right: 10%;
    }
    .teacher_splide>.splide__track>.splide__list>.splide__slide>div:nth-of-type(2){
        padding: calc(20 * var(--site-horizontal-ratio)) calc(30 * var(--site-horizontal-ratio)) calc(30 * var(--site-horizontal-ratio));
    }
    .teacher_splide>.splide__arrows>.splide__arrow{
        width: calc(48 * var(--site-horizontal-ratio));
        height: calc(48 * var(--site-horizontal-ratio));
        cursor: pointer;
    }
    .teacher_splide>.splide__arrows>.splide__arrow:is(.splide__arrow--prev){
        transform: translateX(calc(-128 * var(--site-horizontal-ratio)));
        left: 0;
    }
    .teacher_splide>.splide__arrows>.splide__arrow:is(.splide__arrow--next){
        transform: translateX(calc(128 * var(--site-horizontal-ratio)));
        right: 0;
    }
    /* teacher_splide end */

    /* course start */
    .course{
        padding: calc(80 * var(--site-horizontal-ratio)) 0;
    }
    .course>span{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .course>div{
        width: calc(786 * var(--site-horizontal-ratio));
        height: calc(114 * var(--site-horizontal-ratio));
        margin: calc(40 * var(--site-horizontal-ratio)) auto 0;
        border: calc(4 * var(--site-horizontal-ratio)) solid transparent;
        border-radius: calc(10 * var(--site-horizontal-ratio));
    }
    .course>div>span:nth-of-type(1){
        width: calc(156 * var(--site-horizontal-ratio));
        height: calc(49 * var(--site-horizontal-ratio));
        border-radius: calc(5 * var(--site-horizontal-ratio));
        font-size: calc(24 * var(--site-horizontal-ratio));
        margin-right: calc(40 * var(--site-horizontal-ratio));
    }
    .course>div>span:nth-of-type(2){
        font-size: calc(64 * var(--site-horizontal-ratio));
    }
    .course>div>span:nth-of-type(3){
        font-size: calc(36 * var(--site-horizontal-ratio));
        padding-top: calc(20 * var(--site-horizontal-ratio));
    }
    .course>div>span:nth-of-type(4){
        font-size: calc(64 * var(--site-horizontal-ratio));
    }
    .course>p{
        width: calc(786 * var(--site-horizontal-ratio));
        font-size: calc(15 * var(--site-horizontal-ratio));
    }
    .course>ul{
        width: calc(1200 * var(--site-horizontal-ratio));
        margin: calc(40 * var(--site-horizontal-ratio)) auto 0;
        flex-direction: row;
        justify-content: center;
    }
    .course>ul>li{
        width: calc(380 * var(--site-horizontal-ratio));
        padding: calc(40 * var(--site-horizontal-ratio));
    }
    .course>ul>li>span:nth-of-type(2){
        font-size: calc(28 * var(--site-horizontal-ratio));
        padding-bottom: calc(30 * var(--site-horizontal-ratio));
        word-break: keep-all;
    }
    .course>ul>li>span:nth-of-type(3){
        font-size: calc(24 * var(--site-horizontal-ratio));
    }
    .course>ul>li>p{
        font-size: calc(24 * var(--site-horizontal-ratio));
    }
    .course>ul>li>p:nth-of-type(1){
        margin-top: calc(30 * var(--site-horizontal-ratio));
    }
    .course>ul>li>ul>li{
        font-size: calc(22 * var(--site-horizontal-ratio));
    }
    /* course end */

    /* steps start */
    .steps{
        padding: calc(80 * var(--site-horizontal-ratio)) 0;
        position: relative;
    }
    .steps::after{
        content: "CHAPTER TWO";
        color: #FFFFFF20;
        font-size: calc(140 * var(--site-horizontal-ratio));
        letter-spacing: 0.01em;
        font-weight: bold;
        writing-mode: vertical-rl;
        position: absolute;
        right: 0;
        top: calc(80 * var(--site-horizontal-ratio));
    }
    .steps>span{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .steps>ol{
        width: calc(852 * var(--site-horizontal-ratio));
        margin: calc(40 * var(--site-horizontal-ratio)) auto 0;
        gap: calc(34 * var(--site-horizontal-ratio));
    }
    .steps>ol>li{
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        padding: calc(15 * var(--site-horizontal-ratio)) calc(30 * var(--site-horizontal-ratio)) calc(15 * var(--site-horizontal-ratio)) calc(50 * var(--site-horizontal-ratio));
    }
    .steps>ol>li::before{
        width: calc(35.53 * var(--site-horizontal-ratio));
        height: calc(29 * var(--site-horizontal-ratio));
        border-bottom-right-radius: calc(21.75 * var(--site-horizontal-ratio));
        font-size: calc(18 * var(--site-horizontal-ratio));
    }
    .steps>ol>li:first-of-type~li:after{
        width: calc(42 * var(--site-horizontal-ratio));
        height: calc(35 * var(--site-horizontal-ratio));
    }
    .steps>ol>li>img{
        margin: initial;
        margin-right: calc(8 * var(--site-horizontal-ratio));
    }
    .steps>ol>li>span{
        margin-top: calc(0 * var(--site-horizontal-ratio));
        text-align: left;
        align-self: center;
        width: calc(calc(270 - 53) * var(--site-horizontal-ratio));
    }
    .steps>ol>li>p{
        width: calc(482 * var(--site-horizontal-ratio));
        margin-top: calc(0 * var(--site-horizontal-ratio));
        margin-left: calc(20 * var(--site-horizontal-ratio));
        font-size: calc(16 * var(--site-horizontal-ratio));
    }
    /* steps end */

    .steps+div.fukidashi{
        background-image: url(../images/fukidashi2-desktop.png);
    }
    .steps+div.fukidashi>span{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }

    /* flows start */
    .flows{
        padding: calc(80 * var(--site-horizontal-ratio)) 0 calc(120 * var(--site-horizontal-ratio));
    }
    .flows>span{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .flows>ol{
        margin: calc(40 * var(--site-horizontal-ratio)) auto 0;
        width: calc(970 * var(--site-horizontal-ratio));
        flex-direction: row;
        gap: calc(20 * var(--site-horizontal-ratio));
        justify-content: center;
    }
    .flows>ol>li{
        width: calc(310 * var(--site-horizontal-ratio));
        margin-top: calc(41.5 * var(--site-horizontal-ratio));
        padding: calc(50 * var(--site-horizontal-ratio)) calc(15 * var(--site-horizontal-ratio)) calc(30 * var(--site-horizontal-ratio));
    }
    .flows>ol>li>p{
        font-size: calc(16 * var(--site-horizontal-ratio));
        letter-spacing: 0.05em;
        line-height: 180%;
    }
    /* flows end */

    /* qa start */
    .qa{
        padding: calc(80 * var(--site-horizontal-ratio)) 0;
    }
    .qa>span{
        font-size: calc(36 * var(--site-horizontal-ratio));
    }
    .qa>dl{
        width: calc(802 * var(--site-horizontal-ratio));
    }
    .qa>dl>dt,
    .qa>dl>dd{
        padding: calc(4 * var(--site-horizontal-ratio)) calc(10 * var(--site-horizontal-ratio)) calc(4 * var(--site-horizontal-ratio)) calc(93 * var(--site-horizontal-ratio));
    }
    /* qa end */

    /* footer start */
    footer>div{
        gap: calc(30 * var(--site-horizontal-ratio));
    }
    footer>div>a{
        font-size: calc(14 * var(--site-horizontal-ratio));
    }
    footer>small{
        font-size: calc(20 * var(--site-horizontal-ratio));
    }
    /* footer end */

    /* user_apply start */
    .user_apply>ul{
        width: calc(500 * var(--site-horizontal-ratio));
        margin: calc(35 * var(--site-horizontal-ratio)) auto 0;
        background-size: auto calc(27 * var(--site-horizontal-ratio));
        background-position: top 50% right 0;
    }
    .user_apply>form{
        width: calc(500 * var(--site-horizontal-ratio));
    }
    .user_apply>form>label>input[name='user_last_name'],
    .user_apply>form>label>input[name='user_first_name'],
    .user_apply>form>label>input[name='user_reserve_date'],
    .user_apply>form>label>select[name='user_reserve_time']{
        width: calc(220 * var(--site-horizontal-ratio));
    }
    /* user_apply end */
}
/* ---------------------------desktop(include ipad)↑--------------------------------- */