@charset "UTF-8";
/*============================================================================*\
    teichaku check
\*============================================================================*/
html,body {
    height: 100%;
}
.content {
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    border: none;
    background-color: #E6EBEE;
    min-height: 100%;
    min-width: 1280px;
}
.hd-tcheck {
	background: #fff;
    padding: 0.5rem 2rem 1rem 0.2rem;
}
.hd-tcheck > .wrapper {
    padding-left: 0;
    padding-right: 0;
}
.h1wrap {
	padding: 0;
	width: 30.3%;
	margin: 0 0 0 1rem;
}
@media (min-width:18em) {
    .rp, rt {
        font-size: .35em;
    }
    .hd-tcheck {
        background: no-repeat url(/v1/images/hd_bg.png);
        background-size: cover;
        padding: 0.5rem 2rem 1rem 0.2rem;
    }
    .hd-tcheck > .wrapper {
        padding-left: .7rem;
        padding-right: 1rem;
    }
    .h1wrap {
        padding: 0;
        width: 12%;
        margin: 0;
    }
}

.bg-blue { background-color:    #0DB1F2!important; }
.bg-dark-blue { background-color: #3775BA!important; }
.bg-red { background-color:     #CD4E4E!important; }
.bg-green { background-color:   #30C16A!important; }
.bg-orange { background-color:  #DF6622!important; }
.bg-td-blue {background: #D5F0F7!important;}
.bg-td-yellow {background: #FFFBC7!important;}
.bg-td-red {background: #FBE0E4!important;}
.bg-td-deepred {background: #F4C8DB!important;}
.bg-td-gray {background: #EFEFEF!important;}
  
.cl-blue { color:   #00ADF1!important; }
.cl-red { color:    #CD4E4E!important; }
.cl-green { color:  #1FB15A!important; }
.cl-orange { color: #DF6622!important; }

.white-space {
    white-space: pre;
}

.hdttlwrap {
	background: no-repeat url(/v1/images/hd_bg_sp.png);
	background-size: cover;
	padding: 0;
	margin: .8rem 0 0 0;
    min-width: 100%;
}
.hdttl {
	letter-spacing: 1px;
	padding: 0.6rem .3rem .1rem;
	font-size: 1.2rem;
    white-space: nowrap;
	vertical-align: baseline;
	font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
.hdttl-sub {
    color: #0DB1F2;
    font-weight: bold;
    font-size: 3.58vw;
    margin: 0 0 0 .4rem;
    /*padding-top: .2em;*/
}
@media (min-width:18em) {
    .hdttlwrap {
        background: none;
        padding: 0;
        margin: 0;
        min-width: auto;
        min-width: inherit;
    }
    .hdttl {
        padding: 0.8rem 1rem 0.3rem 0.8rem;
        font-size: 1.6rem;
    }
    .hdttl-sub {
        font-size: 1.9rem;
        margin: 0 0 0 0.7rem;
    }
}

/*------------------------------------*\
    Step progress
\*------------------------------------*/
.step-progress {
	position: absolute;
	top: .7rem;
	right: 1rem;
}
.step-progress-item2 {
	font-size: 15pt;
	color: #fff;
	background: none;
	box-sizing: border-box;
	width: 2.54em;
	height: 1.75em;
    margin-left: .2em;
}

.step-progress-item2.done {
	background: no-repeat url(/v1/images/bg_step_done_sp.svg);
	background-size: contain;
	padding: 0 .6rem 0 0;
    width: 2.9375em;
}
.step-progress-item2.current {
	background: no-repeat url(/v1/images/bg_step_current_sp.svg);
	background-size: contain;
	padding: 0 .6rem 0 0;
    width: 2.9375em;
}
.step-progress-item2.next {
	background: no-repeat url(/v1/images/bg_step_next_sp.svg);
	background-size: contain;
	padding: 0 .6rem 0 0;
    width: 2.9375em;
    color: #0063af;
}
@media (min-width:18em) {
    .step-progress {
        position: relative;
        top: 0px;
        right: auto;
        padding: 0;
        margin: 0;
    }
    .step-progress-item2 {
        font-size: 15pt;
        width: 40px;
        height: 24px;
        line-height: 20px;
        margin-left: .05em;
        font-weight: bold;
    }
    .step-progress-item2.done {
        background: no-repeat url(/v1/images/bg_step_done_sp.svg);
        background-size: contain;
        width: 40px;
    }
    .step-progress-item2.current {
        background: no-repeat url(/v1/images/bg_step_current_sp.svg);
        background-size: contain;
        width: 40px;
    }
    .step-progress-item2.next {
        background: no-repeat url(/v1/images/bg_step_next_sp.svg);
        background-size: contain;
        width: 40px;
        opacity: 0.5;
    }
}

.pagettl {
    padding: 0rem 2rem 0rem;
    color: #fff;
}
/* .pagettl .pagettl-item:nth-child(2) {
    padding-top: 3.4rem;
} */
.pagettl .ttl-txt {
    font-weight: bold;
    font-size: 4.6vw;
    width: 100%;
    margin-bottom: .3rem;
}
.pagettl .ico-book {
    width: 2rem;
    margin: 0 0.5rem 0 0;
}
.pagettl .pages {
    font-size: 1.2rem;
}
.pagettl .code {
    font-family: Arial,"UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: 14px;
    text-align: right;
    margin-left: auto;
    line-height: 47px;
}

.calcwrap {
    padding: 6.8vw 5vw 4vw;
}
.yourarea {
    flex-basis:100%;
    max-width:100%;
    padding: 0 2rem 2rem;
    margin: 0;
}
.choicewrap {
    padding: 6.8vw 5vw 4vw;
}
.ico-star {
    font-size: 4.6vw;
    margin-bottom: .5em;
    font-weight: normal;
}
.ico-star.ans {
    margin-bottom: 2rem;
}
.ico-star > span {
    padding: 0;
    color: #3E3A39;
}
.ico-star > span:nth-child(1) {
    padding: 0 .4rem 0 0;
    display: inherit;
}
.ico-star img {
    width: 7.17vw;
}
.numtxt {
    font-size: 7.69vw;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}
.numtxt * {
    font-size: 1em;
}
.numtxt mn {
    padding: 1em;
}
.numtxt mfrac input {
    margin: auto;
    line-height: 1;
}
.mjx-n {
    margin: 0 .2rem;
}
.form-input,
.form-textarea,
.form-select {
    border-radius: 1.5rem;
    border-width: 2px;
    text-align: right;
    width: 3.06em;
    height: 1.6em;
}

.choicewrap {
    padding: 6.8vw 5vw 4vw;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}
.choicewrap .q-txt {
    font-size: 4.5vw;
    margin: .7em 0;
}
.choiceright {
    margin-top: 5vw;
    flex-basis: 100%;
}
.choiceright .q-txt {
    display: none;
}
.ico-ans + .choice-block2 {
    flex: 1;
}
.choicewrap .choice-block2 ul li {
    width: 100%;
}
.choicewrap .choice-block2 ul li + li {
    margin-top: 1rem;
}
.choicewrap .choice-block2 rp,
.choicewrap .choice-block2 rt {
    font-size: 2.3vw;
}
.choiceright .btn--tcheck--wrap {
    margin-top: 7vw;
}
.choice-inner {
	/* position: relative;
	padding-top: 11vw; */
}
.choicewrap .imgarea {
    padding: 10vw 5vw;
}

/* login */
.loginwrap {

}
.bal-red-top {
    font-size: 4.6vw;
    font-weight: 600;
    color: #FF0000;
    border: 2px solid #FF0000;
    border-radius: 1rem;
    background-color: #fff;
    padding: 0.7rem 0.2rem 0.1rem 0.1rem;
    margin: auto;
    position: relative;
}
.bal-red-top::after {
	content: "";
	position: absolute;
	width: 1.4rem;
	height: 1.4rem;
	left: 2.5em;
	bottom: 100%;
	background: #FFFFFF;
	border: 2px solid #FF0000;
	transform: rotate(45deg);
	border-width: 2px 0 0 2px;
	margin-bottom: -.55rem;
}
.loginwrap h2.bal {
    background: no-repeat url(/v1/images/bal_btm.svg);
	background-size: contain;
    font-size: 6.15vw;
    color: #0063AF;
    font-weight: 600;
    width: 90vw;
    height: 46.9vw;
    margin-top: -5vw !important;
    padding-bottom: 5vw;
}
.loginwrap.notlogin h2.bal {
    margin-top: 20vw !important;
}


/* correct */
.choicewrap.check-ans .choice-inner {
    position: relative;
}
.choicewrap.check-ans.correct .choice-inner::after {
    content: "";
    width: 84.61vw;
    height: 84.61vw;
    background: no-repeat url(/v1/images/ico_correct_sp.svg);
	background-size: contain;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.choicewrap.check-ans.incorrect .choice-inner::after {
    content: "";
    width: 79.85vw;
    height: 79.85vw;
    background: no-repeat url(/v1/images/ico_incorrect_sp.svg);
	background-size: contain;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.choicewrap.check-ans .btn--choice {
    pointer-events: none;
}
.choicewrap.check-ans .corr + .btn--choice::before {
    border: 4px solid #FF0000 !important;
}
.choicewrap.check-ans .corr + .btn--choice::after {
    display: none;
}


/* result */
.result-ttl {
    background-color: #504B4A;
    padding: 0;
    font-size: 5.64vw;
    height: 48px;
}
.result-ttl h2 {
    color: #fff;
    text-align: center;
}
.result-ttl h2 > span {
    position: relative;
}
.result-ttl h2 > span::before {
	content: "";
	display: block;
	position: absolute;
	right: 100%;
	top: -2vw;
	width: 18.56vw;
	height: 6.22vw;
    margin-right: .8em;
	background: no-repeat url(/v1/images/stars1.svg);
	background-size: contain;
}
.result-ttl h2 > span::after {
	content: "";
	display: block;
	position: absolute;
	left: 100%;
	top: -2vw;
	width: 18.56vw;
	height: 6.22vw;
    margin-left: .8em;
	background: no-repeat url(/v1/images/stars2.svg);
	background-size: contain;
}
.result-ttl h2 .yel {
    color: #FFE800;
}
.result-ttl h2 .yel ruby rt {
    color: #fff;
}
.resultwrap {
    padding: 5.38vw 0 0;
}
.resultwrap .result-inner {

}
.resultwrap .result-inner .result-left {
    width: 100%;
    padding: 0 2.56vw;
}
.resultwrap .result-inner .result-left ul {
    
}
.resultwrap .result-inner .result-left ul li {
    position: relative;
    padding-left: 10vw;
}
.resultwrap .result-inner .result-left ul li + li {
    margin-top: 7.58vw;
}
.resultwrap .result-inner .result-left ul li .box {
    border: 2px solid #3C82BF;
    border-radius: 1em;
    font-size: 4.6vw;
    position: relative;
    padding: .6em .5em .6em 2.4em;
    background-color: #fff;
    width: 73%;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}
.resultwrap .result-inner .result-left ul li .box::before {
    content: "";
    background: url(/v1/images/ico_correct_red.svg) left center no-repeat;
    width: 8.69vw;
    height: 8.69vw;
	background-size: contain;
    position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
    margin-right: 2vw;
}
.resultwrap .result-inner .result-left ul li.correct .box::before {
    /* background: url(./ico_correct_red.svg) left center no-repeat;
    background-size: contain; */
}
.resultwrap .result-inner .result-left ul li.incorrect .box::before {
    background: url(/v1/images/ico_incorrect_red.svg) left center no-repeat;
    background-size: contain;
}
.resultwrap .result-inner .result-left ul li.doublecorrect .box::before {
    background: url(/v1/images/ico_doublecorrect_red.svg) left center no-repeat;
    background-size: contain;
}
.incorrect-top {
    position: relative;
}
.correct-top {
    position: relative;
}
.correct-top::before {
    content: "";
    width: 8.2vw;
    height: 8.2vw;
    background: url(/v1/images/ico_correct_red.svg) left center no-repeat;
    background-size: contain;
    position: absolute;
    bottom: 100%;
    margin-bottom: .4em;
}
.incorrect-top::before {
    content: "";
    width: 8.2vw;
    height: 8.2vw;
    background: url(/v1/images/ico_incorrect_red.svg) left center no-repeat;
    background-size: contain;
    position: absolute;
    bottom: 100%;
    margin-bottom: .4em;
}
.doublecorrect-top::before {
    content: "";
    width: 8.2vw;
    height: 8.2vw;
    background: url(/v1/images/ico_doublecorrect_red.svg) left center no-repeat;
    background-size: contain;
    position: absolute;
    bottom: 100%;
    margin-bottom: .4em;
}
.resultwrap .result-inner .result-left ul li .box .num {
    position: absolute;
    left: 3vw;
    top: 50%;
    transform: translateY(-50%);
    background-color: #009CDD;
    width: 6.15vw;
    height: 6.15vw;
    border-radius: 100%;
    color: #fff;
    font-size: 3.58vw;
    font-family: 'Helvetica';
    line-height: 1;
}
.resultwrap .result-inner .result-left ul li .box p {
    margin: 0 0 .2em;
}
.resultwrap .result-inner .result-left ul li .box a {
    color: #fff;
    border-radius: .4em;
    font-size: 3.3vw;
    padding: .4em .3em .2em;
    line-height: 1;
}
.resultwrap .result-inner .result-left ul li .box a::before {
    background-color: #0075B4;
    border-bottom-color: #005B76;
    height: auto !important;
}
.resultwrap .result-inner .result-left ul li .btn--red {
    width: 130px;
    font-size: 4.1vw;
    font-weight: 600;
    color: #fff;
    padding: .5em .2em;
    text-align: left;
}
.resultwrap .result-inner .result-left ul li .btn--red::before {
    background-color: #E45461;
    border-bottom-color: #9A1659;
    height: auto !important;
}
.resultwrap .result-inner .result-left ul li .btn--blue {
    width: 130px;
    font-size: 4.1vw;
    font-weight: 600;
    color: #fff;
    padding: .5em .2em;
    text-align: left;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
.resultwrap .result-inner .result-left ul li .btn--blue::before {
    background-color: #0075B4;
    border-bottom-color: #363A4D;
    height: auto !important;
}
.resultwrap .result-inner .result-left ul li .btn--red span {
    
}
.resultwrap .result-inner .result-left ul li .txt-red {
    position: relative;
    background-color: #FACCD0;
    color: #E60012;
    font-size: 4.6vw;
    font-weight: 500;
    padding: .3em .8em .2em;
    margin: .5em 0 0 auto;
    width: 73.33vw;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}
.resultwrap .result-inner .result-left ul li .txt-red::before {
	content: "";
	background: url(/v1/images/ico_tree.svg) left center no-repeat;
	width: 6.41vw;
	height: 7.23vw;
	background-size: contain;
	position: absolute;
	top: 0;
	right: 100%;
	margin-top: -2.5vw;
}

.resultwrap .result-inner .result-right {
    padding: 0 5.06vw;
}
.resultwrap .result-inner .result-right .kaisetsuarea {
	width: 100%;
	margin: 14.76vw 0 4.87vw;
	border-radius: 10vw;
	padding: 0 6rem 30px 6rem;
}
.resultwrap .result-inner .result-right .kaisetsuarea .ans-ttl {
    font-size: 6.66vw;
    font-weight: 600;
	font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    color: #A55023;
    width: 61.53vw;
    height: 18vw;
    margin-bottom: 0;
    background-size: contain;
}
.resultwrap .result-inner .result-right .kaisetsuarea .scroll {
    height: 67vw;
    overflow-y: scroll;
    scrollbar-color: #FFE450 #C5C4C4;
    scrollbar-width: thin;
    margin-top: 4vw;
}
.resultwrap .result-inner .result-right .kaisetsuarea .scroll::-webkit-scrollbar{
    width: 12px;
}
.resultwrap .result-inner .result-right .kaisetsuarea .scroll::-webkit-scrollbar-track{
    background-color: #C5C4C4;
}
.resultwrap .result-inner .result-right .kaisetsuarea .scroll::-webkit-scrollbar-thumb{
    background-color: #FFE450;
}

.resultwrap .result-inner .result-right .kaisetsuarea .mv-wrap {
    margin-top: 0;
}
.resultwrap .result-inner .result-right .kaisetsuarea .mv-wrap .btn--mv {
    width: 43.58vw;
    height: 30vw;
    font-size: 3vw;
}
.resultwrap .result-inner .result-right .kaisetsuarea .mv-wrap .btn--mv::before {
    border-width: .7rem !important;
}
.resultwrap .result-inner .result-right .kaisetsuarea .mv-wrap .btn--mv img {
    width: 15.68vw;
    margin: 0 auto .1em;
}
.resultwrap .result-inner .result-right .kaisetsuarea .ans-txt {
    border: none;
    font-size: 4.6vw;
}
.btn--grad--blue {
    border-radius: 1em;
    color: #fff;
    font-size: 5.12vw;
    font-weight: 600;
    padding: .5em;
    width: 100%;
}
.btn--grad--blue::before {
    background: linear-gradient(90deg, #69B680 -2.12%, #69B680 -2.12%, #66B683 -2.11%, #63B685 -2.1%, #00B1D8 -2.09%, #3D62A6 99.97%, #3D62A6 99.98%, #3D62A6 99.99%, rgba(255, 225, 50, 0) 100%, #3D62A6 100%);
    border-bottom-color: #446074;
    height: auto !important;
}
.resultwrap .result-inner .result-bottom {
    background-color: #fff;
    margin-top: 7.43vw;
    padding: 5.25vw;
}
.resultwrap .result-inner .result-bottom .kumi-ban {
    width: 100%;
    color: #3C82BF;
    /* font-size: 4.1vw; */
}
.resultwrap .result-inner .result-bottom .kumi-ban span {
    flex-basis: 50%;
    max-width: 50%;
}
.resultwrap .result-inner .result-bottom .kumi-ban input {
    display: inline-block;
	width: 36.15vw;
	border: 2px solid #3C82BF;
	padding: .31em;
	border-radius: .4em;
    margin-right: .3em;
    text-align: center;
    color: #3C82BF;
}
.resultwrap .result-inner .result-bottom .kumi-ban .yourname {
    flex-basis: 100%;
    max-width: 100%;
    margin-top: 2vw;
}
.resultwrap .result-inner .result-bottom .kumi-ban .yourname input {
    width: 100%;
    text-align: left;
    padding-left: 1em;
    padding-right: 1em;
}
.btn--dl--wrap {
    width: 100%;
    text-align: center;
    margin-top: 2.77vw;
}
.btn--dl--wrap .btn--dl {
    border-radius: 1em;
    color: #fff;
    font-size: 4.6vw;
    padding-left: 3em;
}
.btn--dl--wrap .btn--dl::before {
    background: no-repeat url(/v1/images/ico_dl.svg) 1em center #3980B8;
	background-size: 5.89vw 5.12vw;
    border-bottom-color: #697F94;
    height: auto !important;
}

@media (min-width:18em) {
    .pagettl {
        padding: 0rem 2rem 0rem;
    }
    /* .pagettl .pagettl-item:nth-child(2) {
        padding-top: 0;
    } */
    .pagettl .ttl-txt {
        font-size: 2.4rem;
        width: auto;
        margin-bottom: 0;
    }
    .pagettl .ico-book {
        width: 3rem;
        margin: 0 0.5rem 0 1rem;
    }
    .pagettl .pages {
        font-size: 2.2rem;
    }
    .pagettl .code {
        font-size: 14px;
    }
    
    .calcwrap {
        padding: 2rem 2rem 1rem 1rem;
    }
    .calcleft {
        flex-basis:55%;
        max-width:55%
    }
    .yourarea {
        padding: 0 2rem 2rem 0;
        margin-top: 2.5rem;
        flex-basis:45%;
        max-width:45%
    }
    .ico-star {
        margin-bottom: 2rem;
        font-size: 2.5rem;
    }
    
    .ico-star > span:nth-child(1) {
        /* padding: 0 ; */
    }
    .ico-star img {
        width: 2.6rem;
    }
    .numtxt {
        font-size: 3.6rem;
    }
    .form-input,
    .form-textarea,
    .form-select {
        border-radius: 2rem;
        border-width: 3px;
        width: 3.07em;
        height: 1.6em;
    }

    .choicewrap {
        padding: 1.5rem 2rem 0 2rem;
    }
    .choicewrap .q-txt {
        font-size: 2.5rem;
        margin: .7em 0;
    }
    .choiceleft {
        flex-basis: 40%;
        max-width: 46.5rem;
        padding: .2rem 0 0 .5rem;
    }
    .choiceright {
        margin-top: 0;
        flex-basis: 54%;
        position: relative;
        padding-bottom: 0rem
    }
    .choiceleft .q-txt {
        display: none;
    }
    .choiceright .q-txt {
        display: block;
        margin: 0 0 1.5rem;
    }
    .choice-block2.col2-md ul li {
        width: 40%;
        margin: 0 1rem 1rem 0;
    }
    .choice-block2.col2-md ul li + li {
        margin-top: 0;
    }
    .choice-block2.col2-100-md ul li {
        width: 49%;
        margin: 0 0 1rem;
    }
    .choice-block2.col2-100-md ul li + li {
        margin-top: 0;
    }
    .choicewrap .choice-block2 rp,
    .choicewrap .choice-block2 rt {
        font-size: .4em;
    }
    .choice-inner > .choice-block2 {
        max-width: 67rem;
        /* margin: auto; */
    }
    .choice-inner > .choice-block2 ul li + li {
        margin-top: 1em;
    }
    .choicewrap .imgarea {
        padding: 3rem;
        border-radius: 4rem;
        min-height: 420px;
        min-width: 420px;
    }
    .choiceright .btn--tcheck--wrap {
        margin: 0;
        padding: 0;
        position: absolute;
        bottom: 0;
        right: 0;
    }

    /* correct */
    .choicewrap.check-ans.correct .choice-inner::after {
        background: no-repeat url(/v1/images/ico_correct.svg);
        background-size: contain;
        width: 30vw;
        height: 30vw;
        margin-top: -4rem;
        pointer-events: none;
    }
    .choicewrap.check-ans.incorrect .choice-inner::after {
        background: no-repeat url(/v1/images/ico_incorrect.svg);
        background-size: contain;
        width: 30vw;
        height: 30vw;
        margin-top: -4rem;
        pointer-events: none;
    }




    /* result */
    .result-ttl {
        padding: 0;
        font-size: 2.8rem;
    }
    .result-ttl h2 > span::before {
        top: -.2rem;
        width: 8.8rem;
        height: 2.9rem;
        margin-right: 1.5em;
    }
    .result-ttl h2 > span::after {
        top: -.2rem;
        width: 8.8rem;
        height: 2.9rem;
        margin-left: 1.2em;
    }
    .resultwrap {
        padding: 1rem 0 0;
    }
    .resultwrap .result-inner {
        max-width: 125.4rem;
        min-width: 1195px;
        margin: auto;
    }
    .resultwrap .result-inner .result-left {
        width: 62%;
        min-width: 790px;
        /* height: 45rem; */
        /* overflow-y: scroll; */
        /* scrollbar-color: #ADB8BE #F9F9F9; */
        /* scrollbar-width: thin; */
        padding: 0 1.2rem 0 .7rem;
    }
    .resultwrap .result-inner .result-left::-webkit-scrollbar{
        width: 12px;
    }
    .resultwrap .result-inner .result-left::-webkit-scrollbar-track{
        background-color: #F9F9F9;
    }
    .resultwrap .result-inner .result-left::-webkit-scrollbar-thumb{
        background-color: #ADB8BE;
    }
    .resultwrap .result-inner .result-left ul {
        
    }
    .resultwrap .result-inner .result-left ul li {
        position: relative;
        padding-left: 2.1em;
    }
    .resultwrap .result-inner .result-left ul li + li {
        margin-top: 2.5rem;
    }
    .resultwrap .result-inner .result-left ul li .box {
        border-radius: 1em;
        font-size: 2.2rem;
        padding: .2em .5em .2em 1.7em;
        width: 81.4%;
        min-width: 590px;
    }
    .resultwrap .result-inner .result-left ul li .box::before {
        width: 3rem;
        height: 3rem;
        margin-right: .5rem;
    }
    .correct-top::before {
        width: 4.2rem;
        height: 4.2rem;
        bottom: 100%;
    }
    .incorrect-top::before {
        width: 4.2rem;
        height: 4.2rem;
        bottom: 100%;
    }
    .resultwrap .result-inner .result-left ul li .box .num {
        position: absolute;
        left: .8rem;
        width: 2.4rem;
        height: 2.4rem;
        font-size: 1.4rem;
    }
    .resultwrap .result-inner .result-left ul li .box p {
        margin: 0;
    }
    .resultwrap .result-inner .result-left ul li .box a {
        border-radius: .4em;
        font-size: 1.3rem;
        padding: .4em .3em 0;
        line-height: 1;
    }
    .resultwrap .result-inner .result-left ul li .btn--red {
        width: 130px;
        font-size: 1.6rem;
        padding: .3em 0 .2em;
        text-align: center;
        letter-spacing: -.01em;
    }
    .resultwrap .result-inner .result-left ul li .btn--blue {
        width: 130px;
        font-size: 1.6rem;
        padding: .3em 0 .2em;
        text-align: center;
        letter-spacing: -.01em;
    }
    .resultwrap .result-inner .result-left ul li .txt-red {
        font-size: 1.8rem;
        padding: .3em .8em .2em;
        margin: .2em 0 0 auto;
        width: 94%;
    }
    .resultwrap .result-inner .result-left ul li .txt-red::before {
        width: 2.2rem;
        height: 2.5rem;
        margin-top: -.35rem;
    }

    .resultwrap .result-inner .result-right {
        padding: 0;
        width: 36.5%;
        max-width: 405px;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea {
        margin: 2.2rem .5rem 2rem 0;
        border-radius: 4rem;
        max-width: 100%;
        padding: 0 6rem 30px 6rem;
        width: auto;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea .ans-ttl {
        font-size: 2.6rem;
        width: 24rem;
        height: 7.5rem;
        line-height: 2;
        margin-top: -.4em;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea .scroll {
        height: 25rem;
        scrollbar-color: #ADB8BE #F9F9F9;
        margin-top: 2rem;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea .scroll::-webkit-scrollbar{
        width: 16px;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea .scroll::-webkit-scrollbar-track{
        background-color: #F9F9F9;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea .scroll::-webkit-scrollbar-thumb{
        background-color: #ADB8BE;
    }

    .resultwrap .result-inner .result-right .kaisetsuarea .mv-wrap .btn--mv {
        width: 17rem;
        height: 11.5rem;
        font-size: 20px;
        margin-top: 15px;
	    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea .mv-wrap .btn--mv img {
        width: 6.18rem;
    }
    .resultwrap .result-inner .result-right .kaisetsuarea .ans-txt {
        font-size: 2.4rem;
        line-height: 1.25;
    }
    .btn--grad--blue {
        border-radius: 2rem;
        font-size: 2rem;
        padding: .5em;
        width: 100%;
        /* max-width: 35rem; */
    }
    .resultwrap .result-inner .result-bottom {
        margin-top: 1.8rem;
        padding: .5rem 1rem;
        width: 100%;
    }
    .resultwrap .result-inner .result-bottom .kumi-ban {
        width: 100%;
        font-size: 18px;
    }
    .resultwrap .result-inner .result-bottom .kumi-ban span {
        flex-basis: 105px;
        max-width: 105px;
    }
    .resultwrap .result-inner .result-bottom .kumi-ban input {
        width: 6.8rem;
        padding: .31em;
        border-radius: .4em;
        margin-right: .3em;
        margin-top: 9px;
    }
    .resultwrap .result-inner .result-bottom .kumi-ban .yourname {
        flex-basis: 42%;
        max-width: 42%;
        margin-top: 0;
        padding-right: 1rem;
    }
    .resultwrap .result-inner .result-bottom .kumi-ban .yourname input {
        padding-left: .4em;
        padding-right: .4em;
        width: 41.4rem;
    }
    .btn--dl--wrap {
        width: auto;
        margin-top: 0;
    }
    .btn--dl--wrap .btn--dl {
        border-radius: 2rem;
        font-size: 1.6rem;
        padding: .8rem 3rem .8rem 3em;
    }
    .btn--dl--wrap .btn--dl::before {
        background-size: 2.8rem 2rem;
    }


    /* login */
    .loginwrap.notlogin {
        padding-top: 12.8rem;
    }
    .loginwrap.start-num-ttl .kumi-ban {
        order: inherit;
        max-width: 40rem;
    }
    .loginwrap.start-num-ttl .kumi-ban span {
        flex-basis: auto;
        max-width: 100%;
    }
    .bal-red-top {
        font-size: 2.3rem;
        margin: 1.3rem 0 0 auto;
    }
    .bal-red-top::after {
        content: "";
        position: absolute;
        width: 1.4rem;
        height: 1.4rem;
    }
    .dog-raises {
        width: 100%;
        align-items: flex-end;
    }
    .loginwrap h2.bal {
        background: no-repeat url(/v1/images/bal_left.svg);
        background-size: contain;
        font-size: 3.2rem;
        width: 49.2rem;
        height: 20rem;
        margin-top: 3rem !important;
        padding: 0 0 0 5rem;
        order: 2;
    }
    .loginwrap.notlogin h2.bal {
        margin-top: 3rem !important;
    }
    .ico-dog-raises {
        width: 22.2rem;
    }


    
}


/*------------------------------------*\
    Keyboard
\*------------------------------------*/
.form-kbd {
    max-width: 100%;
    background-color: #fff;
    padding: 1rem;
    border-radius: 2rem;
    font-size: 5.1vw;
}
.form-kbd__num { max-width: 27.2rem; }
.form-kbd__other { max-width: 10.4rem; }
.form-kbd > ol > li {
	width: 14.2%;
	padding: 0 .8vw;
}
.form-kbd__btn {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 65px;
	height: 65px;
	padding: 0;
	font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size: 1em;
	border-radius: 2.6vw;
    line-height: 1.4;
}
.btn.form-kbd__btn::before {
    background-color: #3980BB;
}
.btnright.btn2,
.btnright.btn3 {
    font-size: .45em;
}
@media (min-width:18em) {
	.form-kbd { 
        max-width: 605px;
        background-color: #fff;
        padding: 15px 30px 7.5px 30px;
        border-radius: 2rem;
        margin-top: 1rem;
    }
	.form-kbd__num { max-width: 44.1rem; }
	.form-kbd__other { max-width: 100%; }
	.form-kbd__btn {
		min-width: 65px;
		min-height: 65px;
        font-size: 4.8rem;
        border-radius: 2rem;
	}
    .form-kbd > ol {
        width: 72%;
        position: relative;
    }
    .form-kbd > ol > li {
        width: 20%;
        padding: 7.5px;
        margin: 0;
    }
    .form-kbd > ol > li.btnright {
        position: absolute;
    }
    .btnright.btn1 {
        top: 0;
        right: -20%;
        margin-right: -.3rem;
    }
    .btnright.btn2 {
        top: 0;
        right: -40%;
        margin-right: -.3rem;
    }
    .btnright.btn3 {
        bottom: 0;
        right: -40%;
        margin-right: -.3rem;
    }
    .btnright.btn2 .form-kbd__btn {
        font-size: 2rem;

    }
    .btnright.btn3 .form-kbd__btn {
        font-size: 1.7rem;

    }
}


/*------------------------------------*\
    Note
\*------------------------------------*/
.box-yel {
    border: 2px solid #FFEE00;
	border-radius: 2.2rem;
	background-color: #fff;
	box-shadow: .2rem .2rem .2rem .1rem rgba(0,0,0,.1);
}

.canvas-wrap {
    border-radius: 3rem;
    padding-top: 10px;
}
.canvas-wrap-inner {
    overflow: hidden;
    border-radius: 0 0 4rem 4rem;
    padding: 1rem 0 0 0;
}

.form-note-heading2 {
	font-size: 2.2rem;
	display: inline-block;
	position: relative;
	padding-top: .4rem;
	padding-bottom: .4rem;
	background: #008F45;
	color: #fff;
	width: 14rem;
	text-align: center;
	margin-left: -.8rem;
	position: relative;
}
.form-note-heading2::after {
	content: "";
    display: block;
    position: absolute;
    width: .9rem;
    height: .7rem;
    left: 0;
    top: 100%;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: .7rem 0 .7rem .9rem;
    border-color: #006837 transparent  transparent;
    z-index: 1;
}
.form-note-tool-btn {
	z-index: 1;
	width: 4rem;
	padding-right: .6rem;
	padding-left: .6rem;
}
.form-note-tool-btn__img { width: 2.8rem; }
.form-note-canvas {
	position: relative;
	/* padding-top: 87%; */
	background-color: #d9d9d9;
	background-image: linear-gradient(90deg, #fff 1.2rem, transparent 1%), linear-gradient(#fff 1.2rem, transparent 1%);
	background-position: center center;
	background-size: 1.4rem 1.4rem;
}
.form-note-canvas__inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.btn--pencil::before {
	background-color: #FFF7B9;
}
.btn--shadow.btn--pencil::before {
    border-color: #9D1659;
    border-width: 0 0 .5rem;
    bottom: -0.6rem;
    height: 4.3rem;
}
.btn--shadow.btn--pencil::after {
    content: "";
	position: absolute;
	z-index: -1;
	top: -.2rem;
	right: -.2rem;
	bottom: -.6rem;
	left: -.2rem;
	border-radius: inherit;
	transition: all .2s;
    border-bottom: none;
    border-style: solid;
    border-width: 2px;
	border-color: #E75461;
    width: 4rem;
    height: 4rem;
}
.btn--shadow:active::before,
.btn-radio:checked + .btn--shadow::before {
	bottom: -.3rem;
	border-bottom-width: .1rem;
	height: 4rem;
}
.btn--pencil:focus::before,
.btn--pencil:hover::before,
.btn-radio:focus + .btn--pencil::before { background-color: #FFF788; }
.btn--shadow.btn--pencil:focus::before,
.btn--shadow.btn--pencil:hover::before { border-color: #9D1659; }
.btn--pencil:focus::before,
.btn-radio:focus + .btn--pencil::before { box-shadow: 0 0 0 .4rem rgba(255,0,0,.38); }


.btn--erase::before {
	background-color: #fff;
}
.btn--shadow.btn--erase::before {
    border-color: #7C7C7C;
    border-width: 0 0 .5rem;
    height: 4.3rem;
}
.btn--shadow.btn--erase::after {
    content: "";
	position: absolute;
	z-index: -1;
	top: -.2rem;
	right: -.2rem;
	bottom: -.6rem;
	left: -.2rem;
	border-radius: inherit;
	transition: all .2s;
    border-bottom: none;
    border-style: solid;
    border-width: 2px;
	border-color: #666666;
    width: 4rem;
    height: 4rem;
}
.btn--erase:focus::before,
.btn--erase:hover::before,
.btn-radio:focus + .btn--erase::before { background-color: #eee; }
.btn--shadow.btn--erase:focus::before,
.btn--shadow.btn--erase:hover::before { border-color: #7C7C7C; }
.btn--erase:focus::before,
.btn-radio:focus + .btn--erase::before { box-shadow: 0 0 0 .4rem rgba(100,100,100,.38); }


@media (min-width:30em) {
	.form-note-canvas { background-position: top center; }
}

@media (min-width:18em) {
    .form-note-tool-btn {
        width: 7rem;
        height: 7rem;
    }
	.form-note-tool-btn__img {
        width: 4rem;
        margin-top: .3rem;
    }
    .btn--shadow.btn--pencil::after,
    .btn--shadow.btn--erase::after {
        width: 7rem;
        height: 7rem;
    }
    .btn--shadow:active::before,
    .btn-radio:checked + .btn--shadow::before {
        /* width: 7rem; */
        height: 7rem;
    }
    .btn--shadow.btn--pencil::before,
    .btn--shadow.btn--erase::before {
        /* width: 7rem; */
        height: 7.3rem;
    }
    .canvas-wrap {
        padding-top: 10px;
    }
    .canvas-wrap-inner {
        padding: 0;
    }
    .form-note-canvas {
        background-image: linear-gradient(90deg, #fff 1.8rem, transparent 1%), linear-gradient(#fff 1.8rem, transparent 1%);
        background-size: 2rem 2rem;
        height: 420px;
    }
}

/* Themes */
.btn--tcheck {
	color: #0063AF;
	border-radius: 1.8rem;
	font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	width: 25rem;
	padding: 1.5rem 0 1rem;
    font-size: 2rem;
}

.btn--tcheck::before {
    background: no-repeat url(/v1/images/btn_bg.png) #FFE132;
	background-size: contain;
	/* padding: 0 1rem 0 0; */
}
.btn--tcheck::after {
	content: "";
	display: block;
	position: absolute;
	left: .5rem;
	top: .1rem;
	width: 5.2rem;
	height: 5.2rem;
	background: no-repeat url(/v1/images/ico_dog_com.svg);
	background-size: contain;
}
.btn--tcheck.ico-dog-wlk::after {
    margin-top: 5px;
    background: no-repeat url(/v1/images/ico_dog_wlk.svg);
	background-size: contain;
}
.btn--tcheck.ico-dog-pen::after {
    background: no-repeat url(/v1/images/ico_dog_pen.svg);
	background-size: contain;
}
.btn--tcheck .arrow {
	float: right;
	margin-right: 1rem;
}
.btn--tcheck:focus::before,
.btn--tcheck:hover::before,
.btn-radio:focus + .btn--tcheck::before { background-color: #ffd212; }
.btn--tcheck:focus::before,
.btn-radio:focus + .btn--tcheck::before { box-shadow: 0 0 0 .4rem rgba(255,215,32,.38); }
.btn--tcheck:active::before { background-color: #ffd212; }

/* Shadow */
.btn--shadow.btn--tcheck::before {
    border-color: #C0BD4F;
    height: auto;
}
.btn--shadow.btn--tcheck:focus::before,
.btn--shadow.btn--tcheck:hover::before { border-color: #C0BD4F; }
.btn--tcheck:active::before { border-color: #C0BD4F; }

.ans-wrap {
    margin-top: 50px;
    margin-bottom: 2.5rem;
}
.ans-wrap > section {
    flex-basis: 100%;
    max-width: 100%;
}
.ans-wrap > section + section  {
    margin-top: 2rem;
}
.ico-ans {
    background: #E3017F;
    text-align: center;
    color: #fff;
    border-radius: 100%;
    padding: 1rem 0.5rem 0.5rem;
    min-width: 7rem;
    min-height: 7rem;
    font-size: 2.4rem;
    margin-right: 1rem;
}
.ico-ans.yours {
    background: #0063AF;
    padding: 0;
    line-height: 1;
}
.ico-ans.yours > span {
    font-size: 2.4rem;
}
.ico-ans.yours > span span {
    font-size: 1.45rem;
}
.ico-ans.yours + .ico {
    width: 40rem;
    height: auto;
    margin: 0 2rem 0 0;
}
.ansarea {
    padding: 0;
    margin: 0;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
    font-size: 3.2rem;
}
.anstxt {
    border: solid 3px#E3017F;
	padding: 0 .8rem;
    display: inline-block;
	
	background-color: #fff;
	color: inherit;
	line-height: 1.2;
	outline: 0;
	width: 9.375rem;
	height: 7.7rem;
    border-radius: 1.5rem;
	text-align: center;
    padding: .5rem .5rem;
    margin-left: .5rem;
    color: #E3017F;
}
.ansarea  * {
    /* font-size: 1em; */
}
.anstxt.yours {
    border: solid 3px#3C82BF;
    color: inherit;
}

.matsharea img {
    max-width: 100%;
    max-height: 100%;
    height: 28rem;
    /* height: 12rem; */
}
.matsharea {
	border: 2px solid #fe0;
	border-radius: 4rem;
	background-color: #fff;
	width: 100%;
	margin-top: 2rem;
    padding: 15px;
}
.footer {
    background-color: transparent;
}
@media (min-width:18em) {
    .ans-wrap > section {
        flex-basis: 48%;
        max-width: 48%;
    }
    .ans-wrap > section + section  {
        margin-top: 0;
        margin-left: 4%;
    }
	.btn-fixed {
        margin-bottom: 2.5rem;
    }
    .btn--tcheck--wrap {
        padding: 0 2rem 0.5rem 0;
    }
}



.imgarea.img1 {
    margin-bottom: 2.5rem;
}
.imgarea.img2 {
    margin-top: 1.5rem;
}
h2 + .choice-block {
    margin-top: 6vw;
}
.choice-block ul li {
    width: 100%;
}
.choice-block ul li {
    margin-bottom: 3%;
}
.choice-block ul li .btn {
    height: 15.4vw;
    font-size: 7.17vw;
    font-weight: normal;
	border-radius: 5vw;
    line-height: 1.4;
}
.choice-block ul li .btn::before {
    border-bottom: 0.25em solid #365471;
}
.choice-block ul li input[type="checkbox"]:checked + .btn::before,
.choice-block ul li .btn:active::before {
    height: auto;
    background-color: #6DA2CD;
    border-top: 0.25em solid #365471;
    border-bottom: none;
}
.choice-block ul li input:disabled + .btn {
    pointer-events: none;
}
.kaisetsuarea {
	font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
	width: 100%;
	height: auto;
	
	padding: 0 4.4vw 4vw;
    margin: 3.5vw 2rem 1.5rem;
}
.kaisetsuarea .ans-ttl {
	display: inline-block;
	background: no-repeat url(/v1/images/bg_ans_ttl.svg);
	background-size: contain;
	font-size: 4.6vw;
	color: #A85023;
	text-align: center;
	margin: -6vw 0 4vw;
	padding: .45em 1em 0.5em;
    min-width: 7.77em;
}
.kaisetsuarea .ans-txt {
    margin: .8em 0 0 0;
    border-top: 1px solid #D0D0D1;
    font-size: 3.58vw;
    padding: .5em 0 0;
}

.kaisetsuarea2 {
	width: 100%;
	height: auto;
	padding: 2vw 4.4vw 4vw;
    margin: 10vw 0 0;
    border-radius: 8vw;
}
.kaisetsuarea2 .ans-ttl {
	display: inline-block;
	background: no-repeat url(/v1/images/bg_ans_ttl2.svg);
	background-size: contain;
	font-size: 7.17vw;
	color: #A85023;
	text-align: center;
	margin: 0 0 5vw;
	padding: .2em .5em;
	min-width: 5.1em;
	line-height: 1;
	font-weight: 400;
}
.kaisetsuarea2 .ans-txt {
    font-size: 5.38vw;
    margin: 0;
    padding: 0 .3em;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}

.kaisetsuarea3 {
	width: 100%;
	height: auto;
	padding: 5.1vw;
    margin: 7.8vw 0;
    border-radius: 2rem;
}
.kaisetsuarea3 .ans-ttl {
	display: inline-block;
	background: no-repeat url(/v1/images/bg_ans_ttl2.svg);
	background-size: contain;
	font-size: 7.17vw;
	color: #A85023;
	text-align: center;
	margin: 0 0 5vw;
	padding: .2em .5em;
	min-width: 5.1em;
	line-height: 1;
	font-weight: 400;
}
.kaisetsuarea3 .ans-txt {
    margin: .8em 0 0 0;
    border-top: 1px solid #D0D0D1;
    font-size: 3.58vw;
    padding: .5em 0 0;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}

@media (min-width:18em) {
    .imgarea.img1 {
        margin-bottom: 5rem;
    }
    .imgarea.img2 {
        margin-top: 0;
    }
    h2 + .choice-block {
        max-width: 50rem;
        margin: auto;
    }
    .choice-block ul li {
        width: 24%;
    }
    .choice-block ul li {
        margin-bottom: 1rem;
    }
    .choice-block ul li .btn {
        height: 5vw;
        min-height: 5vw;
        font-size: 2.05vw;
        font-weight: normal;
        border-radius: 1.8vw;
        line-height: 1.4;
    }
    .kaisetsuarea {
        flex-basis: 52%;
        max-width: 52%;
        margin: 0;
        padding: 0 2em 1em;
        border-radius: 3rem;
    }
    .kaisetsuarea .ans-ttl {
        font-size: 2.8rem;
        margin: -.6em 0 .8em;
        padding: .45em 1em 0.5em;
        min-width: 8.92em;
        min-height: 2.85em;
    }
    .kaisetsuarea .ans-txt {
        margin: .8em 0 0 0;
        font-size: 2.1rem;
        padding: .5em 0 0;
    }
    .kaisetsuarea + .yourarea {
        margin: 0 0 0 3%;
        padding: 0;
        flex-basis: 42%;
        max-width: 42%;
    }

    .kaisetsuarea2 {
        width: 60%;
        padding: 1rem 2rem;
        margin: 4rem 0 0 0;
        border-radius: 4rem;
    }
    .kaisetsuarea2 .ans-ttl {
        font-size: 2.8rem;
        margin: 0 0 .5em;
    }
    .kaisetsuarea2 .ans-txt {
        font-size: 2.1rem;
        padding: 0 1.2em .5em;
    }
    .kaisetsuarea2 + * {
        width: 40%;
    }

    .kaisetsuarea3 {
        padding: 3.8rem;
        margin: 0;
        border-radius: 4rem;
    }
    .kaisetsuarea3 .ans-ttl {
        font-size: 2.8rem;
        margin: 0 0 .5em;
    }
    .kaisetsuarea3 .ans-txt {
        margin: .8em 0 0 0;
        font-size: 2.1rem;
        padding: .5em 0 0;
    }
}

.start-num-ttl {
    padding: 5vw 5vw 3vw;
}
.start-num-ttl .kumi-ban {
    width: 100%;
    color: #3C82BF;
    font-size: 4.1vw;
}
.start-num-ttl .kumi-ban span {
    flex-basis: 50%;
    max-width: 50%;
}
.start-num-ttl .kumi-ban input {
	display: inline-block;
	width: 36.15vw;
	border: 2px solid #3C82BF;
	padding: .31em;
	border-radius: .2em;
    margin-right: .3em;
    text-align: center;
    color: #3C82BF;
}
.start-num-ttl .kumi-ban + h2 {
    margin-top: 8vw;
}
.btn--choice {
	color: #000;
	border-radius: .8em;
	font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	width: 100%;
	padding: 0 .5em;
    font-size: 6.15vw;
    font-weight: 400;
    min-height: 2.7em;
    display: flex;
    align-items: center;
    letter-spacing: -.01em;
}
.btn--choice:active,
input:checked + .btn--choice {
    color: #fff;
}
.btn--choice:focus::before,
.btn--choice:hover::before,
.btn.btn--choice::before { background-color: #fff; }
.btn--choice:focus::before,
.btn--choice::before {
    box-shadow: none;
	border: solid 2px #3980BB !important;
	top: 0;
	bottom: 0;
}
.btn--choice::after {
	content: "";
	position: absolute;
	z-index: -2;
	top: -.2em;
	right: -.05em;
	bottom: -0.25em;
	left: -.05em;
	border-radius: inherit;
	transition: all .2s;
	border-bottom: solid .6em #365471;
}
.btn--choice:active::before,
input:checked + .btn--choice::before {
    border-bottom: none;
    background-color: #3980BB;
}
.btn--choice:active::after,
input:checked + .btn--choice::after {
    border-bottom: none;
}

/* Shadow */
.btn--shadow.btn--choice::before {
    border-color: #365471;
    height: auto;
}
.btn--shadow.btn--choice:focus::before,
.btn--shadow.btn--choice:hover::before { border-color: #365471; }
.btn--choice:active::before {
    border: none;
    background-color: #3980BB;
}
.modal-list {
    padding: 0 5vw;
}
.modal-list li {
    position: relative;
}
.modal-list li + li {
    margin-top: 1.8vw;
}
.modal-list li.checked::after {
	content: "";
	display: block;
	position: absolute;
	left: -4vw;
	bottom: -2vw;
	width: 22.3vw;
	height: 20vw;
	background: no-repeat url(/v1/images/ico_checked2.svg);
	background-size: contain;
}
.btn-start-block {
    padding: 4.4vw 7vw 0;
}
.btn-start-block > p {
    flex-basis: 100%;
}
.btn-start-block .btn--tcheck {
    width: 100%;
    font-weight: 600;
    font-size: 6.66vw;
    display: flex;
    align-items: center;
    min-height: 3.1em;
    padding-right: .5em;
}
.btn-start-block .btn--tcheck::after {
    width: 20vw;
    height: 20vw;
}
.btn-start-block .btn--tcheck .arrow {
    position: absolute;
    right: 0;
}
.btn-start-block.btn--disabled {
    opacity: 1;
    position: relative;
}
.btn-start-block.btn--disabled > * {
    position: relative;
}
.btn-start-block.btn--disabled > *::after {
    content: "";
    background: rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    border-radius: 1.8rem;
}
.btn-start-block.btn--disabled .btn {
    opacity: .5;
}

@media (min-width:18em) {
    .start-num-ttl {
        padding: 3rem 2rem 0;
    }
    .start-num-ttl .kumi-ban {
        max-width: 21.2rem;
        font-size: 2.6rem;
        order: 2;
        margin-left: auto;
    }
    .start-num-ttl .kumi-ban span + span {
        padding-left: .3rem;
    }
    .start-num-ttl .kumi-ban input {
        width: 6.8rem;
    }
    .start-num-ttl .kumi-ban + h2 {
        margin-top: 0;
        order: 1;
    }
    .btn--choice {
        border-radius: 1.8rem;
        font-size: 2.2rem;
        min-height: 6rem;
        padding: 0 .8em;
    }
    
    .modal-list {
        padding: 0 2rem;
        max-width: 67rem;
    }

    .modal-list li + li {
        margin-top: 1rem;
    }
    .modal-list li.checked::after {
        left: -1rem;
        bottom: -1rem;
        width: 7.7rem;
        height: 7.8rem;
    }
    .btn-start-block {
        padding: 1.5rem 0 2rem;
    }
    .btn-start-block > p {
        flex-basis: 100%;
    }
    .btn-start-block.btn--disabled > p {
        flex-basis: auto;
    }
    .btn-start-block .btn--tcheck {
        width: 33.3rem;
        font-size: 2.6rem;
        min-height: 8rem;
        margin: auto;
    }
    .btn-start-block.btn--disabled .btn--tcheck {
        margin: auto auto .4rem;
    }
    .btn-start-block .btn--tcheck::after {
        width: 8rem;
        height: 8rem;
    }
    .btn-start-block .btn--tcheck .arrow {
        position: absolute;
        right: 0;
    }
}

/**************************\
  Basic Modal Styles
\**************************/

.modal__overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.6);
    z-index: 1;
    font-size: 3.58vw;
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
.modal.blue .modal__overlay {
    background: none;
}

.modal__container {
    background-color: #fff;
    padding: 5.12vw;
    max-width: 89.74vw;
    border-radius: 6vw;
    overflow-y: auto;
    box-sizing: border-box;
    border: 2px solid #FFEE00;
}
.modal.blue .modal__container {
    border: 6px solid #2FB4D5;
    padding-top: .2rem;
}

.modal.blue video + span {
    font-size: 4.6vw;
    display: block;
    text-align: center;
}

.modal__title {
    font-size: 6.66vw;
    color: #000;
}

.modal__close {
    background: transparent;
    border: 0;
    margin-bottom: 1vw;
}

.modal__content {
    margin-top: 1em;
    margin-bottom: 1em;
    padding: 1em 0 0 0;
    border-top: 1px solid #D0D0D1;
}
.modal__content dl {
    border-bottom: 1px solid #D0D0D1;
    padding-bottom: 1em;
}
.modal__content dl dt {
    width: 22.58%;
}
.modal__content dl dd {
    width: 82%;
    margin: 0;
    padding-left: .8em;
    line-height: 1.4;
}
.modal__content dl dt.bt-gray {
    background: #787878;
    color: #fff;
    border-radius: .5em;
    padding: .5em;
}

.modal__container video {
    max-width: 100%;
} 
/**************************\
Demo Animation Style
\**************************/
@keyframes mmfadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes mmfadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

@keyframes mmslideIn {
from { transform: translateY(15%); }
    to { transform: translateY(0); }
}

@keyframes mmslideOut {
    from { transform: translateY(0); }
    to { transform: translateY(-10%); }
}

.micromodal-slide {
display: none;
}

.micromodal-slide.is-open {
display: block;
}

.micromodal-slide[aria-hidden="false"] .modal__overlay {
animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.micromodal-slide[aria-hidden="false"] .modal__container {
animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__overlay {
animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__container {
animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
will-change: transform;
}


@media (min-width:18em) {
    .modal__overlay {
        font-size: 2.1rem;
    }
    .modal__container {
        padding: 1.5em 1.8em;
        border-radius: 4rem;
    }
    .modal.blue video + span {
        font-size: 2.6rem;
    }
    .modal__title {
        font-size: 2.6rem;
    }
    .modal.blue .modal__container {
        border: 12px solid #2FB4D5;
        padding-top: .2rem;
    }
    
    .modal__close {
        background: transparent;
        border: 0;
        margin-bottom: .5rem;
    }
    .modal.blue .modal__close img { 
        width: 5rem;
        height: 5rem;
    }
    
    .modal__content {
        margin-top: .5em;
        margin-bottom: 0;
        padding: .8em 0 0 0;
    }
    .modal__content dl {
        padding-bottom: .8em;
        margin-bottom: .8em;
    }
    .modal__content dl dt {
        width: 10rem;
        font-size: 1.8rem;
    }
    .modal__content dl dd {
        width: 82%;
        margin: 0;
        padding-left: .8em;
        line-height: 1.4;
    }
    .modal__content dl dt.bt-gray {
        background: #787878;
        color: #fff;
        border-radius: .5em;
        padding: .5em;
    }
    
    .modal__container video {
        max-width: 100%;
    } 
    /**************************\
    Demo Animation Style
    \**************************/
    @keyframes mmfadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }
    
    @keyframes mmfadeOut {
        from { opacity: 1; }
        to { opacity: 0; }
    }
    
    @keyframes mmslideIn {
    from { transform: translateY(15%); }
        to { transform: translateY(0); }
    }
    
    @keyframes mmslideOut {
        from { transform: translateY(0); }
        to { transform: translateY(-10%); }
    }
    
    .micromodal-slide {
    display: none;
    }
    
    .micromodal-slide.is-open {
    display: block;
    }
    
    .micromodal-slide[aria-hidden="false"] .modal__overlay {
    animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    }
    
    .micromodal-slide[aria-hidden="false"] .modal__container {
    animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
    }
    
    .micromodal-slide[aria-hidden="true"] .modal__overlay {
    animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    }
    
    .micromodal-slide[aria-hidden="true"] .modal__container {
    animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
    }
    
    .micromodal-slide .modal__container,
    .micromodal-slide .modal__overlay {
    will-change: transform;
    }   
}


.mv-wrap {
    margin-top: 10vw;
}
.btn--mv {
	color: #DE412B;
	border-radius: 1em;
	width: 89.74vw;
    height: 58.97vw;
    max-width: 45rem;
    max-height: 25rem;;
	padding: 0;
    font-size: 5.12vw;
    font-weight: 600;
    display: flex;
    align-items: center;
    margin: auto;
    letter-spacing: 0;
}
.btn--mv img {
    display: block;
    margin: 0 auto .1em;
}
/* .btn--mv:active,
input:checked + .btn--mv {
    color: #fff;
} */
.btn--mv:focus::before,
.btn--mv:hover::before,
.btn.btn--mv::before { background-color: #FBE6E3; }
.btn--mv:focus::before,
.btn--mv::before {
    box-shadow: none;
	border: solid 1.5rem #DE412B !important;
	top: 0;
	bottom: 0;
}
.btn--mv::after {
	content: "";
	position: absolute;
	z-index: -2;
	top: -.2em;
	right: -.05em;
	bottom: -0.5em;
	left: -.05em;
	border-radius: inherit;
	transition: all .2s;
	border-bottom: solid 1.2em #945859;
}
.btn--mv:active::before,
input:checked +  .btn--mv::before {
    border-bottom: none;
}
.btn--mv:active::after,
input:checked +  .btn--mv::after {
    border-bottom: none;
}

/* Shadow */
.btn--shadow.btn--mv::before {
    border-color: #FBE6E3;
    height: auto;
}
.btn--shadow.btn--mv:focus::before,
.btn--shadow.btn--mv:hover::before { border-color: #FBE6E3; }
.btn--mv:active::before {
    border: none;
    background-color: #FBE6E3;
}

@media (min-width:18em) {
    .mv-wrap {
        margin-top: 1rem;
    }
    .btn--mv {
        border-radius: .8em;
        width: 30rem;
        height: 17rem;;
        font-size: 2.4rem;
        margin-top: 8rem;
    }
    .btn--mv img {
        margin: 0 auto .2em;
    }
    
}

.font-kyokasyo{
    font-family: "UDDigiKyokasho R", "UD Digi Kyokasho NP-R", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

.fraction{
    display: inline-block;
    vertical-align: middle;
    text-align: center;
}
.fraction_n,.fraction_d{
    display: block;
}
.fraction_n{
    border-bottom: 3px solid #333;
    padding: 0 10px 0 10px;
}
.txt-red .fraction_n {
    border-bottom: 3px solid #E60012;
}
.txt-white .fraction_n {
    border-bottom: 3px solid white;
}
.btn--choice:active .fraction_n {
    border-bottom: 3px solid white;
}
input:checked + .btn--choice .fraction_n {
    border-bottom: 3px solid white;
}

.kaisetsuarea .fraction {
	margin-bottom: 7px !important;
}

i {
    font-family: "Century Schoolbook",Times;
}
.underline {
    border-bottom: solid 2px;
}

.table.b-table>thead>tr>[aria-sort=none] {
    background-image: url(/v1/images/order.svg);
    background-repeat: no-repeat;
    background-size: 1em 2em;
    background-position: right 0.375rem center;
    padding-right: calc(0.75rem + 0.65em);
    cursor: pointer;
}
.table.b-table>thead>tr>[aria-sort=ascending] {
    background-image: url(/v1/images/order_asc.svg);
    background-repeat: no-repeat;
    background-size: 1em 2em;
    background-position: right 0.375rem center;
    padding-right: calc(0.75rem + 0.65em);
    cursor: pointer;
}
.table.b-table>thead>tr>[aria-sort=descending] {
    background-image: url(/v1/images/order_desc.svg);
    background-repeat: no-repeat;
    background-size: 1em 2em;
    background-position: right 0.375rem center;
    padding-right: calc(0.75rem + 0.65em);
    cursor: pointer;
}