@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Hanuman:wght@100;300;400;700;900&family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&display=swap');
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote,
pre,abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
html{
    font-size: 1px;
}
body {
line-height:1.2;
color:#333;
font-family: var(--unnamed-font-family-noto-sans-jp), sans-serif;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
text-decoration: none;
background:transparent;
color:#333;
}
.clearfix::after {
content:"";
display: block;
clear: both;
font-size: 0;
}
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1rem dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
hr {
display:block;
height:1rem;
border:0;
border-top:1rem solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
img {
Width:100%;
}
*,*::after,*::before{
Box-sizing:border-box;
}
p{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-16)/27.2rem var(--unnamed-font-family-noto-sans-jp);
}
.pc{
    display: block;
}
.sp{
    display: none;
}
:root {

    /* Colors: */
    --unnamed-color-156aa0: #156AA0;
    --unnamed-color-ac3534: #AC3534;
    --unnamed-color-f4b200: #F4B200;
    --unnamed-color-286545: #286545;
    --unnamed-color-ffffff: #FFFFFF;
    --unnamed-color-080404: #080404;
    --unnamed-color-f2e6d5: #F2E6D5;
    --unnamed-color-f5efe7: #F5EFE7;
    --unnamed-color-262626: #262626;
    
    /* Font/text values */
    --unnamed-font-family-noto-sans-jp: Noto Sans JP;
    --unnamed-font-family-hanuman: Hanuman;
    --unnamed-font-style-normal: normal;
    --unnamed-font-weight-bold: bold;
    --unnamed-font-weight-medium: 500;
    --unnamed-font-weight-normal: normal;
    --unnamed-font-size-13: 13rem;
    --unnamed-font-size-16: 16rem;
    --unnamed-font-size-18: 18rem;
    --unnamed-font-size-20: 20rem;
    --unnamed-font-size-26: 26rem;
    --unnamed-font-size-32: 32rem;
    --unnamed-character-spacing-0-45: 0.45rem;
    --unnamed-character-spacing-0-52: 0.52rem;
    --unnamed-character-spacing-0-64: 0.64rem;
    --unnamed-character-spacing-0-4: 0.4rem;
    --unnamed-character-spacing-0-33: 0.33rem;
    --unnamed-character-spacing-0-32: 0.32rem;
    --unnamed-line-spacing-36: 36rem;
    --unnamed-line-spacing-39: 39rem;
    --unnamed-line-spacing-40: 40rem;
    --unnamed-line-spacing-48: 48rem;
    --unnamed-line-spacing-87: 87rem;
    --unnamed-line-spacing-27-200000762939453: 27.200000762939453rem;
    }

main{
    max-width: 100%;
    min-width: 1080rem;
    margin: 0 auto;
    background-color: var(--unnamed-color-f5efe7);
}
body.fixed{
    height: 100%;
    overflow: hidden;
}
/* header */
.fixed-btn{
    width: 160rem;
    height: auto;
    position: fixed;
    display: block;
    bottom: 50rem;
    right: calc( 50vw/ ( 1366/ 100));
    z-index: 6;
    filter: drop-shadow(0rem 20rem 20rem rgba(244,178,0,.8));
}
header{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    transition: all ease .3s;
}
header.scroll{
    background-color: #fff;
}
header .scroll-logo{
    display: none;
}
.scroll .fixed-logo{
    display: none;
}
.scroll .scroll-logo{
    display: block;
}
header.scroll .header-list a{
    color: #080404;
}
.header-inner{
    margin: 0 auto;
    max-width: 1366rem;
    padding: 16rem 30rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
header.scroll .header-list a.video{
    color: #FFFFFF;
}
header.scroll .header-list a.login{
    background-color: #F5EFE7;
}
.btn{
	border-radius:9999rem;/* 幅や高さが変わっても角丸にできる */
  width:-moz-fit-content; /* Firefox */
  width:fit-content; /* other browsers */
  display: block;
}
.header-list .btn{
    margin-right: 0;
    transition: all ease .3s;
}
.header-list .login{
    background-color: #fff;
    padding: 12rem 37rem;
    color: #000 !important;
    margin-right: 15rem;
}
header .header-list .login:hover{
    opacity: .5;
}
header .header-list .video:hover{
    background-color: #000;
}
.video{
    background-color: var(--unnamed-color-f4b200);
    padding: 15rem 37rem;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-18)/27rem var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-ffffff);
}
.btn-block .video{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) 23rem/27rem var(--unnamed-font-family-noto-sans-jp);
    padding: 22rem 46rem;
}
main .btn-block .btn{
    box-shadow: 0rem 8rem 24rem var(--unnamed-color-f4b200);
    display: block;
    padding: 23rem 66rem;
    margin-left: auto;
    margin-right: auto;
}
main .btn-block{
    text-align: center;

}

main .btn-block p{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-13)/27.2rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-33);
    color: var(--unnamed-color-080404);
}
.js-fade {
    opacity: 0;
    visibility: hidden;
    transform: translateY(50rem);
    transition: opacity 1s,visibility 1s, transform 1s;
}
.fadein,
.fadein02 {
    opacity : 0;
    transition: opacity 1s,visibility 1s, transform 1s;
    visibility: hidden;
    transform: translateY(50rem);
}
    
.fadein.active,
.fadein02.active{
    opacity : 1;
    visibility: visible;
    transform: translateY(0rem);
}
.scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0rem);
}
.js-fadeTop {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-80rem);
    transition: opacity 1s,visibility 1s, transform 1s;
}
.js-fadeTop.scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0rem);
}
.header-logo{
    width: 94rem;
    height: 58rem;
}
.header-list{
    display: flex;
    align-items: center;
}
.header-list a{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) 14rem/27.2rem var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-ffffff);
    margin-right: 30rem;
}

.fv-container{
    max-width: 100%;
    min-width: 1080rem;
    padding-top: 54.9%;
    background: url('../img/kb-fv.jpg') no-repeat center/contain;
    position: relative;
}
.fv-text-block{
    position: absolute;
    bottom: calc( 35vw/ ( 1366/ 100));
    left: calc( 145vw/ ( 1366/ 100));
}
.fv-text-block h2{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 48rem/62.4rem var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-ffffff);
    text-shadow: 0rem 0rem 10rem var(--unnamed-color-080404);
}
.fv-copy{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-20)/42rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-4);
    color: var(--unnamed-color-ffffff);
    margin-top: 15rem;
    margin-bottom: 30rem;
}
.dots{
    background-image: radial-gradient(circle at center, #fff 20%, transparent 20%); /* 点の色とサイズ調整 */
    background-position: top right; /* 点の位置 */
    background-repeat: repeat-x; /* 横方向に繰り返し */
    background-size: 20.4rem 5rem; /* 点の間隔とサイズ調整 */
    padding-top: 5rem; /* 縦方向の位置調整 */
}
.strong{
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    border-radius: 5rem;
    color: var(--unnamed-color-156aa0);
    padding: 2rem 8rem 4rem;
    margin: 0 5rem;
}
.btn-block .btn{
    box-shadow: 0rem 8rem 24rem #08040499;
}
.btn-block p{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-13)/27.2rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-33);
    color: var(--unnamed-color-ffffff);
    margin-top: 10rem;
}
.concept-container{
    background-color: var(--unnamed-color-f2e6d5);
    padding: 75rem 0 180rem;
}
.concept-top-block{
    width: 550rem;
    margin: 0 auto;
}
.con-img-block{
    position: relative;
    width: 495rem;
    margin: 10rem auto 25rem;
}
.con-img-block::after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
    border-top-right-radius: 3rem;
    border-top-left-radius: 3rem;
	box-shadow: inset 0 0 3rem 3rem #F2E6D5;
}
.flex{
    display: flex;
}
.concept-bottom-block{
    width: 840rem;
    margin: 0 auto;
    justify-content: space-between;
}
.text-title{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-32)/var(--unnamed-line-spacing-48) var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-64);
    color: var(--unnamed-color-156aa0);
}
.sub-text{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-20)/var(--unnamed-line-spacing-40) var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-4);
    color: var(--unnamed-color-080404);
}
.concept-bottom-block .sub-text{
    width: 480rem;
}
.trouble-container{
    background: var(--unnamed-color-f5efe7) 0% 0% no-repeat padding-box;
}
.trouble-block{
    transform: translateY(-80rem);
    padding-bottom: 40rem;
}
.tro-title-block{
    width: 840rem;
    height: 224rem;
    background: url('../img/trouble-title-bg.png') no-repeat center/contain;
    padding: 45rem 0;
    text-align: center;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-26)/var(--unnamed-line-spacing-48) var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-ffffff);
    margin: 0 auto;
}
.block-l-text{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 42rem/69rem var(--unnamed-font-family-noto-sans-jp);
}
.inner{
    width: 840rem;
    margin: 0 auto;
}
.yellow{
    color: var(--unnamed-color-f4b200);
}
.tro-list {
    margin-top: 20rem;
    justify-content: space-between;
    margin-bottom: 50rem;
}
.tro-list li{
    width: 240rem;
}
.tro-list li p{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 23rem/36.8rem var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-080404);
    text-align: center;
}
.access-block{
    padding:30rem 60rem;
    justify-content: space-between;
    background: #F2E6D5 0% 0% no-repeat padding-box;
    border-radius: 60rem;
    margin-top: 70rem;
}
.access-block img{
    width: 220rem;
    height: 150rem;
}
.access-block-text{
    width: 460rem;
}
.access-block h4{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-16)/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-4);
}
.bule-link{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-16)/28.8rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-4);
    color: var(--unnamed-color-156aa0);
    text-decoration: underline;
}
.like-container{
    margin-bottom: -80rem;
}
.sub-title-block{
    background: var(--unnamed-color-156aa0) 0% 0% no-repeat padding-box;
    text-align: center;
    padding-top: 70rem;
}
.sub-title-block.large{
    padding-bottom: 295rem;
}
.sub-title-block .block-l-text{
    color: var(--unnamed-color-ffffff);
    position: relative;
}
.sub-title-block .block-l-text::after{
    content: "";
    display: block;
    position: absolute;
    bottom: -45rem;
    left: 50%;
    transform: translateX(-50%);
    width: 75rem;
    height: 15rem;
    background: url('../img/content-title-boder.png') no-repeat center/contain;
}
.like-list{
    width: 1080rem;
    margin: 0 auto;
    padding: 70rem 120rem 10rem;
    background: var(--unnamed-color-f2e6d5) 0% 0% no-repeat padding-box;
    border-radius: 60rem;
    transform: translateY(-200rem);
}
.like-lists img{
    width: 400rem;
    height: 280rem;
}
.like-lists{
    margin-bottom: 60rem;
    justify-content: space-between;
    align-items: center;
}
.like-list .text-title{
    margin-bottom: 20rem;
}
.like-list-right{
    width: 390rem;
}
.num{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 28rem/48rem var(--unnamed-font-family-hanuman);
    color: var(--unnamed-color-262626);
}
.level-container .sub-text{
    margin-top: 95rem;
    width: 840rem;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    margin-bottom: 0;
    color: var(--unnamed-color-ffffff);
}
.level-container .sub-title-block.large{
    padding-bottom: 170rem;
}
.level-block{
    transform: translateY(-100rem);
    padding-bottom: 20rem;
}
.video-slider{
    width: 1080rem;
    height: 388rem;
    margin: 0 auto 70rem;
    overflow: hidden;
}
.video-slider li{
    width: 290rem;
    height: 164rem;
    margin-right: 40rem;
    border-radius: 10rem;
    overflow: hidden;
    
}
.video-slide-bottom li{
    transform: translateX(-60rem);
}
.video-slide-top,
.video-slide-bottom{
    height: 194rem;
    align-items: center;
    filter: drop-shadow(0 0rem 6rem #0000004D);
}
.flow-list-block{
    margin-top: 120rem;
}
.block-title{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 42rem/69rem var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-156aa0);
    width:-moz-fit-content; /* Firefox */
    width:fit-content; /* other browsers */
    margin: 0 auto 75rem;
    position: relative;
}
.block-title:after{
    content: "";
    display: block;
    width: 100%;
    height: 4rem;
    background: url('../img/text-under-line.png') repeat-x left/contain;
}
.flow-list {
    width: 880rem;
    margin: 0 auto 120rem;
    align-items: top;
    justify-content: space-between;
}
.flow-list li{
    width: 172rem;
    
}
.flow-list li{
    position: relative;
}
.flow-list .arrow::after{
    content: "";
    display: block;
    width: 29rem;
    height: 23rem;
    background: url('../img/arrow.png') no-repeat center/contain;
    position: absolute;
    top: calc(172rem/2);
    right: -47rem;
    transform: translateY(-50%);
}
.flow-list li p{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/32.4rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-45);
    text-align: center;
    margin-top: 5rem;
}
.flow-list li:last-of-type::before{
    content: "";
    display: block;
    width: 84rem;
    height: 84rem;
    background: url("/assets/img/flow-icon.png") no-repeat center/contain;
    position: absolute;
    top: -20%;
    left: 20rem;
}
.voice-list {
    flex-wrap: wrap;
    width: 1080rem;
    margin: 0 auto;
    justify-content: space-between;
}
.voice-list li{
    width: calc((100% - 60rem) / 3 );
    background: #F2E6D5 0% 0% no-repeat padding-box;
    border-radius: 60rem 60rem 60rem 0;
    padding: 40rem 30rem;
}
.voice-list li img{
    width: 80rem;
    height: 80rem;
}
.voice-img p{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-45);
    color: var(--unnamed-color-080404);
    margin-bottom: 30rem;
}
.voice-img{
    text-align: center;
}
.voice-list h5{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-26)/var(--unnamed-line-spacing-39) var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-52);
    margin-bottom: 20rem;
}
.voice-list-top{
    margin-bottom: 30rem;
}
.men{
    color: var(--unnamed-color-156aa0);
}
.women{
    color: #AC3450;
}
.staff-inner{
    width: 1080rem;
    margin: 0 auto;
    justify-content: space-between;
    margin-bottom: 120rem;
}
.staff-left{
    width: 510rem;
}
.staff-right{
    width: 510rem;
}
.staff-text{
    padding: 30rem;
    background: #F2E6D5 0% 0% no-repeat padding-box;
    border-radius: 0rem 0rem 60rem 0rem;
}
.staff-right .text-title{
    margin-bottom: 25rem;
}
.staff-name{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-16)/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-4);
    display: flex;
    align-items: center;
    margin-bottom: 10rem;
}
.staff-name span{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 28rem/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
    margin-left: 20rem;
}
.staff-texts{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-16)/28.8rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-4);
}

.video-container{
    background: var(--unnamed-color-f2e6d5) 0% 0% no-repeat padding-box;
    padding-bottom: 170rem;
}
.video-container .sub-title-block{
    padding-bottom: 128rem;
    margin-bottom: 83rem;
}
.video-container .sub-text{
    width: 840rem;
    margin: 0 auto 50rem;
}
.video-block{
    width: 840rem;
    margin: 0 auto;
    align-items: flex-start;
    justify-content: space-between;
}
.video-left{
    width: 515rem;
}
.video-left h5{
    width: 168rem;
    height: 45rem;
    background: #156AA0 0% 0% no-repeat padding-box;
    border-radius: 15rem 15rem 0rem 0rem;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-20)/24rem var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-ffffff);
    text-align: center;
    line-height: 45rem;
}
.video-price-block{
    border-radius: 0rem 15rem 15rem 15rem;
    background: var(--unnamed-color-ffffff) 0% 0% no-repeat padding-box;
    position: relative;
    padding: 30rem 39rem;
}
.price-down{
    width: 128rem;
    height: 128rem;
    position: absolute;
    top: 30rem;
    right: 39rem;
}
.price-lists{
    margin-left: 26rem;
}
.price-title{
    height: auto;
    background: var(--unnamed-color-f2e6d5) 0% 0% no-repeat padding-box;
    writing-mode: vertical-rl;
    text-align: center;
    margin-right: 10rem;
    border-radius: 5rem;
}
.befor-price{
    margin-bottom: 7rem;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-18)/28.8rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-45);
}
.befor-price span{
    text-decoration: line-through;
}
.after-price{
    margin-top: 43rem;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-32)/28.8rem var(--unnamed-font-family-noto-sans-jp);
    color: var(--unnamed-color-262626);
    position: relative;
    width:-moz-fit-content; /* Firefox */
    width:fit-content; /* other browsers */
}
.after-price:after{
    content: "";
    position: absolute;
    display: block;
    width: 29rem;
    height: 23rem;
    background: url('../img/under-arrow.png') no-repeat center/contain;
    top: -34rem;
    left: 50%;
    transform: translateX(-50%);
}
.video-right{
    width: 300rem;
    padding: 30rem 0 30rem 75rem;
    background: var(--unnamed-color-f5efe7) 0% 0% no-repeat padding-box;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-18)/27rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-45);
    margin-top: 45rem;
}
.price-text-list li{
    position: relative;
    margin-bottom: 5rem;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-18)/35rem var(--unnamed-font-family-noto-sans-jp);
}
.price-text-list li::before{
    content: "";
    display: inline-block;
    width: 35rem;
    height: 35rem;
    background: url('../img/check-img.png') no-repeat center/contain;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-125% , -2%);
}
.video-left-bottom-text{
    margin-top: 15rem;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-13)/27.2rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-33);
}
.digest-container .tro-title-block{
    background: url('../img/video-title.png') no-repeat center/contain;
    transform: translateY(-70rem);
}
.digest-container .tro-title-block .icon{
    padding: 3rem 15rem;
    border-radius:9999rem;/* 幅や高さが変わっても角丸にできる */
    width:-moz-fit-content; /* Firefox */
    width:fit-content; /* other browsers */ 
    margin-left: 5rem;
}
.digest-container .tro-title-block span.jokyu{
    margin-right: 5rem;
}
span.shokyu{
    background: var(--unnamed-color-286545) 0% 0% no-repeat padding-box;
}
span.tyukyu{
    background: var(--unnamed-color-ac3534) 0% 0% no-repeat padding-box;
}
span.jokyu{
    background: var(--unnamed-color-156aa0) 0% 0% no-repeat padding-box;
}
.dige-block{
    width: 840rem;
    margin: -35rem auto 0;
    padding-bottom: 120rem;
}
.dige-text-block{
    padding: 40rem 60rem;
    margin-bottom: 102rem;
    background: var(--unnamed-color-f2e6d5) 0% 0% no-repeat padding-box;
    border-radius: 60rem;
    position: relative;
}
.dige-text-block.jokyu{
    margin-bottom: 60rem;
}
.dige-text-block h5{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-32)/var(--unnamed-line-spacing-48) var(--unnamed-font-family-noto-sans-jp);
    margin-bottom: 5rem;
}
.dige-text-block::after{
    content: "";
    position: absolute;
    width: 296rem;
    height: 159rem;
    transform: translateY(-50%);
    top: 0;
}
.shokyu h5{
    color: var(--unnamed-color-286545);
}
.shokyu::after{
    background: url('../img/video-lists01.png') no-repeat center/contain;
    right: 60rem;
}
.tyukyu h5{
    color: var(--unnamed-color-ac3534);
    text-align: right;
}
.tyukyu::after{
    background: url('../img/video-lists02.png') no-repeat center/contain;
    left: 60rem;
}
.jokyu h5{
    color: var(--unnamed-color-156aa0);
}
.jokyu::after{
    background: url('../img/video-lists03.png') no-repeat center/contain;
    right: 60rem;
}

.faq-container{
    margin-bottom: -40rem;
}
.faq-container .sub-title-block.large{
    padding-bottom: 255rem;
}

/*アコーディオン全体*/
.accordion-area{
    list-style: none;
    width: 96%;
    max-width: 840rem;
    margin:0 auto;
    transform: translateY(-160rem);
}

.accordion-area li{
    margin: 30rem 0;
    background: var(--unnamed-color-f2e6d5) 0% 0% no-repeat padding-box;
    border-radius: 15rem;
}


/*アコーディオンタイトル*/
.title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/28.8rem var(--unnamed-font-family-noto-sans-jp);
    letter-spacing: var(--unnamed-character-spacing-0-45);
    color: var(--unnamed-color-080404);
    padding: 45rem 100rem 42rem;
    transition: all .5s ease;
}

/*アイコンの＋と×*/
.title::after{
    position: absolute;
    content:'';
    width: 16rem;
    height: 13rem;
    background: url('../img/under-arrow.png') no-repeat center/contain;

}
.title::after{    
    top:50%;
    transform: translateY(-50%);
    right: 100rem;
}

/*　closeというクラスがついたら形状変化　*/


.title.closed::after{
	transform: rotate(-180deg);
}

/*アコーディオンで現れるエリア*/
.box {
    /*はじめは非表示*/
    display: none;
    margin: 0 100rem;
    padding: 43rem 0;
    border-top: 1rem solid #000;
}

footer{
    background-color: #000;
    padding: 70rem 0;
    min-width: 1080rem;
}

.youtube{
    width: 51rem;
    height: 37rem;
}
.insta{
    width: 40rem;
    height: 40rem;
}
.twitter{
    width: 36rem;
}
.face{
    width: 38rem;
}
.sns li{
    margin-right: 30rem;
}
.footer-top{
    width: 631rem;
    margin-bottom: 47rem;
    margin-left: auto;
    margin-right: auto;
    justify-content: space-between;
}
.site-link{
    align-items: center;
}
.site-link a{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) 15rem/28rem Zen Kaku Gothic New;
    letter-spacing: var(--unnamed-character-spacing-0-45);
    color: var(--unnamed-color-ffffff);
    text-decoration: underline;
    margin-right: 10rem;
}
.copy{
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) 12rem/28rem Zen Kaku Gothic New;
    color: var(--unnamed-color-ffffff);
    text-align: center;
}

.header-inner-slide{
    position: fixed;
    z-index: 50;
    width: 390rem;
    top: 0;
    right: 0;
    height: calc( var(--vh, 1vh) * 100);
    background-color: #156AA0;
    padding-top: 107rem;
    transition: all .5s ease;
    overflow-y: scroll;
}
.close.header-inner-slide{
    right: -100%;
}
.header-inner-slide .header-list{
    display: block;
}
.header-inner-slide .header-list li{
    text-align: center;
}
.header-inner-slide .header-list li a{
    text-decoration: underline;
    text-align: center;
    margin-right: 0;
}
.header-inner-slide .header-list li{
    margin-bottom: 30rem;
}
.header-inner-slide .header-list .btn{
    text-decoration: none;
    margin: 0 auto;
}
.hum{
    width: 96rem;
    height: 96rem;
    position: fixed;
    top: 14rem;
    right: 4rem;
    z-index: 60;
    display: none;
    cursor: pointer;
}

@media screen and (max-width:1160px) {
    header .header-list{
        display: none;
    }
    .hum{
        display: block;
    }
    .header-inner{
        padding-top: 30rem;
    }
}
@media screen and (max-width:1080px) {
    .fv-container{
        padding: 0;
        height: 593rem;
    }
}
@media screen and (max-width:896px) {
    header{
        position:absolute;
    }
    html{
        font-size: calc( 1vw/ ( 390/ 100));
    }
    main{
        width: 100%;
        min-width: auto;
    }
    p{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-16)/27.2rem var(--unnamed-font-family-noto-sans-jp);
        color: var(--unnamed-color-080404);
    }
    .pc{
        display: none;
    }
    .sp{
        display: block;
    }
    .fv-container{
        min-width: auto;
        height: 762rem;
        background: url('../img/kb-fv-sp.jpg') no-repeat center/contain;
    }
    .fv-text-block{
        bottom: auto;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        text-align: center;
    }
    .fv-text-block h2{
        margin-top: 130rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-32)/var(--unnamed-line-spacing-48) var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-64);
        margin-bottom: 190rem;
    }
    .fv-text-block .btn{
        margin-left: auto;
        margin-right: auto;
    }
    .video{
        padding: 19rem 54rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-20)/var(--unnamed-line-spacing-27-200000762939453) var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
    }
    .btn-block p{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-13)/27.2rem var(--unnamed-font-family-noto-sans-jp);
    }
    .concept-top-block{
        width: 330rem;
    }
    .con-img-block{
        width: 100%;
    }
    .flex{
        flex-direction: column;
    }
    .inner{
        width: 330rem;
    }
    .concept-bottom-block .sub-text{
        width: 100%;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-16)/32rem var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
    }
    .text-title{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/40.8rem var(--unnamed-font-family-noto-sans-jp);
    }
    .tro-title-block{
        width: 330rem;
        background: url('../img/trouble-title-bg-sp.png') no-repeat center/contain;
        height: 146rem;
        padding: 18rem 0;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/22rem var(--unnamed-font-family-noto-sans-jp);
    }
    .block-l-text{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 28rem/40rem var(--unnamed-font-family-noto-sans-jp);
    }
    .concept-container{
        padding: 45rem 0 69rem;
    }
    .trouble-block{
        transform: translateY(-49rem);
        padding-bottom: 11rem;
    }
    .tro-list li{
        width: 210rem;
    }
    .tro-list{
        align-items: center;
        margin-bottom: 20rem;
    }
    .tro-list li p{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/27rem var(--unnamed-font-family-noto-sans-jp);
        margin-bottom: 30rem;
        margin-top: 10rem;
    }
    .access-block-text{
        width: 100%;
    }
    .access-block{
        padding: 30rem;
        align-items: center;
        margin-top: 50rem;
        border-radius: 30rem;
    }
    .access-block img{
        margin-bottom: 15rem;
    }
    .like-list{
        width: 330rem;
        padding: 30rem;
        border-radius: 30rem;
    }
    .like-lists img{
        width: 100%;
        height: auto;
    }
    .like-list-right{
        width: 100%;
    }
    .num{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/28rem var(--unnamed-font-family-hanuman);
        color: var(--unnamed-color-262626);
        text-align: center;
        margin-top: 15rem;
    }
    .like-lists{
        margin-bottom: 30rem;
    }
    .like-list .text-title{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/40.8rem var(--unnamed-font-family-noto-sans-jp);
        text-align: center;
        margin-bottom: 10rem;
    }
    .like-lists:last-of-type{
        margin-bottom: 0;
    }
    .sub-title-block.large{
        padding-bottom: 123rem;
    }
    .like-list{
        transform: translateY(-68rem);
    }
    .sub-title-block .block-l-text{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/31.2rem var(--unnamed-font-family-noto-sans-jp);
    }
    .sub-title-block .block-l-text::after{
        bottom: -25rem;
        height: 10rem;
        width: 50rem;
    }
    .like-container{
        margin-bottom: -8rem;
    }
    .level-container .sub-text{
        margin-top: 55rem;
        width: 100%;
        padding: 0 30rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-16)/27.2rem var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
    }
    .video-slider{
        width: 100%;
        height: 192rem;
        margin-bottom: 35rem;
        transform: translateY(-15rem);
    }
    .video-slide-top, .video-slide-bottom{
        height: 96rem;
        flex-direction: row;
    }
    .video-slider li{
        width: 134rem;
        height: 76rem;
        margin-right: 20rem;
    }
    .video-slide-bottom li{
        transform: translateX(-40rem);
    }
    .level-container .sub-title-block.large{
        padding-bottom: 65rem;
    }
    .sub-title-block{
        padding-top: 30rem;
    }
    #level{
        margin-bottom: 60rem;
    }
    .level-block{
        transform: translateY(-35rem);
    }
    .block-title{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/var(--unnamed-line-spacing-39) var(--unnamed-font-family-noto-sans-jp);
        margin-bottom: 30rem;
    }
    .flow-list-block{
        margin-top: 60rem;
    }
    .flow-list{
        width: 100%;
        padding: 0 30rem;
        margin-bottom: 40rem;
    }
    .flow-list li{
        width: 100%;
        display: flex;
        align-items: center;
        margin: 0 auto ;
    }
    .flow-list li img{
        width: 108rem;
    }
    .flow-list li p{
        text-align: left;
        margin-left: 21rem;
    }
    .flow-list li p.list04{
        transform: translateY(-15rem);
    }
    .flow-list li.arrow{
        margin-bottom: 23rem;
    }
    .flow-list .arrow::after{
        width: 20rem;
        height: 19rem;
        background: url('../img/under-arrow.png') no-repeat center/contain;
        top: auto;
        bottom: -20rem;
        right: auto;
        left:50%;
        transform: translateX(-50%);
    }
    .flow-list li:last-of-type::before{
        left: auto;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
    }
    .voice-list.flex{
        width: 330rem;
        flex-direction: row;
    }
    .voice-list li{
        margin: 0 auto;
        width: 330rem;
        border-radius: 30rem 30rem 30rem 0rem;
        padding: 30rem;
        height: auto !important;
    }
    .slick-track {
        display: flex;
      }
      .slick-slide {
        height: auto !important;
      }
    .voice-list li img{
        width: 60rem;
        height: 60rem;
        margin: 0 auto;
    }
    .voice-img p{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-16)/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
        margin-bottom: 5rem;
    }
    .voice-list h5{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
    }
    .staff-inner{
        width: 100%;
        padding: 0 30rem;
        margin-bottom: 60rem;
    }
    .staff-left{
        width: 100%;
    }
    .staff-right{
        width: 100%;
    }
    .staff-right .text-title{
        margin-top: 20rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/40.8rem var(--unnamed-font-family-noto-sans-jp);
        margin-bottom: 15rem;
    }
    .sub-text{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-16)/32rem var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
        color: var(--unnamed-color-080404);
        margin-bottom: 30rem;
    }
    .slick-prev, .slick-next{
        top: auto;
        bottom: -10rem;
        z-index: 3;
        transform: translateY(100%);
        
    }
    .slider-num{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-16)/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: 0;
        color: var(--unnamed-color-156aa0);
        position: absolute;
        bottom: -50rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .slick-prev, .slick-next{
        width: 44rem;
        height: 44rem;
    }
    .slick-prev:before{
        content: "";
        display: block;
        width: 44rem;
        height: 44rem;
        background: url('../img/slider-arrow.png') no-repeat center/contain;
        opacity: 1;
    }
    .slick-prev{
        left: 80rem;
    }
    .slick-next{
        right: 80rem;
    }
    .slick-next:before{
        content: "";
        display: block;
        width: 44rem;
        height: 44rem;
        background: url('../img/slider-next.png') no-repeat center/contain;
        opacity: 1;
    }
    .staff-name{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-16)/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
    }
    .staff-name span{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/var(--unnamed-line-spacing-36) var(--unnamed-font-family-noto-sans-jp);
        color: var(--unnamed-color-080404);
    }
    .staff-texts{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-16)/28.8rem var(--unnamed-font-family-noto-sans-jp);
    }
    .video-container .sub-title-block{
        padding-bottom: 55rem;
        margin-bottom: 30rem;
    }
    .video-container .sub-text{
        width: 100%;
        padding: 0 30rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-16)/27.2rem var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
        margin-bottom: 30rem;
    }
    .video-block{
        width: 100%;
    }
    .video-left{
        width: 100%;
        position: relative;
    }
    
    .video-price-block{
        border-radius: 30rem;
        width: 330rem;
        margin: 0 auto;
        padding: 30rem;
        padding-top: 87rem;
    }
    .price-lists.flex{
        flex-direction: row;
    }
    .price-lists{
        margin-left: 0;
    }
    .befor-price{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-18)/28.8rem var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-45);
    }
    .price-title{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-13)/19.8rem var(--unnamed-font-family-noto-sans-jp);
        border-radius: 5rem;
    }
    .after-price{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-26)/28.8rem var(--unnamed-font-family-noto-sans-jp);
        text-align: center;
        margin-top: 38rem;
        margin-left: auto;
        margin-right: auto;
    }
    .after-price:after{
        width: 29rem;
        height: 23rem;
    }
    .video-left h5{
        width: 270rem;
        height: 55rem;
        background: url('../img/price-title.png') no-repeat center/contain;
        border-radius: 0;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-20)/42rem var(--unnamed-font-family-noto-sans-jp);
        position: absolute;
        top: 30rem;
        left: 50%;
        transform: translateX(-50%);
        z-index: 3;
    }
    .price-down{
        width: 85rem;
        height: 85rem;
        top: -22rem;
        right: 0;
        z-index: 4;
    }
    .video-right{
        width: 330rem;
        margin: 30rem auto 0;
    }
    .price-text-list li{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-18)/27rem var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-45);
        color: var(--unnamed-color-262626);
        margin-bottom: 12rem;
    }
    .price-text-list li::before{
        transform: translate(-125% , -11%);
    }
    .video-left-bottom-text{
        padding: 0 30rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-normal) var(--unnamed-font-size-13)/27.2rem var(--unnamed-font-family-noto-sans-jp);
    }
    .video-container{
        padding-bottom: 140rem;
    }
    .digest-container .tro-title-block .icon{
        display: inline-block;
    }
    .digest-container .tro-title-block{
        background:url('../img/video-title-sp.png') no-repeat center/contain;
        height: 173rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/var(--unnamed-line-spacing-27-200000762939453) var(--unnamed-font-family-noto-sans-jp);
        transform: translateY(-80rem);
    }
    .dige-block{
        width: 100%;
        padding: 50rem 30rem 60rem;
    }
    .dige-text-block{
        margin-bottom: 162rem;
        border-radius: 30rem;
        padding: 30rem;
    }
    .tyukyu::after{
        left: 50%;
        transform: translate(-50%,-90%);
    }
    .shokyu::after,
    .jokyu::after{
        right: auto;
        left: 50%;
        transform: translate(-50%,-90%);
    }
    .dige-text-block h5{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) 24rem/var(--unnamed-line-spacing-40) var(--unnamed-font-family-noto-sans-jp);
        text-align: center;
    }
    .dige-text-block.jokyu{
        margin-bottom: 50rem;
    }
    .faq-container .sub-title-block.large{
        padding-bottom: 155rem;
    }
    .accordion-area{
        transform: translateY(-90rem);
        width: 100%;
        padding: 0 30rem;
    }
    .title{
        padding: 20rem 30rem;
        padding-right: 80rem;
        padding-bottom: 20rem;
    }
    .accordion-area li:first-of-type{
        margin-top: 0;
    }
    .box{
        margin: 0 30rem;
        padding: 20rem 0 30rem;
    }
    .title::after{
        right: 30rem;
    }
    footer{
        min-width: auto;
        padding: 50rem 0;
    }
    .footer-top{
        width: 100%;
        margin-bottom: 30rem;
    }
    .sns.flex{
        flex-direction: row;
        margin: 0 auto 30rem;
    }
    .fixed-btn{
        display: none;
    }
    .sp-btn-nav{
        position: fixed;
        z-index: 5;
        bottom: 20rem;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        width: 330rem;
        justify-content: space-between;
        margin: 0 auto;
    }


    .sp-btn-nav .btn{
        padding: 13rem 28rem 15rem;
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) var(--unnamed-font-size-18)/20rem var(--unnamed-font-family-noto-sans-jp);
        letter-spacing: var(--unnamed-character-spacing-0-4);
        filter: drop-shadow(0rem 7rem 3rem rgba(8,4,4,0.4));
    }
    .sp-btn-nav .login{
        background-color: #F2E6D5;
    }
    .header-inner-slide .header-list li a{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-bold) var(--unnamed-font-size-18)/27rem var(--unnamed-font-family-noto-sans-jp);
    }
    .header-inner-slide .header-list .btn{
        font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) 14rem/27rem var(--unnamed-font-family-noto-sans-jp);
        width: 180rem;
        padding: 12rem 0;
        text-align: center;
    }
    .header-inner-slide .header-list li:nth-last-child(2){
        margin-bottom: 15rem;
        margin-top: 60rem;
    }
}