@charset "utf-8";

body {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3",
        "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック",
        sans-serif;
    color: #000;
}
input,
select {
    vertical-align: middle;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3",
        "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック",
        sans-serif;
}
textarea {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3",
        "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック",
        sans-serif;
}

html {
    font-size: 62.5%;
}
.wrapper {
    line-height: 1.7647058823;
    margin: 0 auto;
}
*,
:after,
:before {
    box-sizing: border-box;
}
p,
ul {
    margin: 0;
}
a {
    text-decoration: none;
    color: #000;
}
p {
    font-size: 1.5rem;
}
address {
    font-style: normal;
}
small {
    font-size: 1.2rem;
}
body {
    margin-top: 13.3rem;
}
img {
    max-width: 100%;
    height: auto;
}
button {
    cursor: pointer;
}
/************* partslist *************/
.pt_10 {
    padding-top: 1rem;
}
.pt_20 {
    padding-top: 2rem;
}
.pb_10 {
    padding-bottom: 1rem;
}
/* header */
header {
    position: fixed;
    z-index: 900;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
}
.headertop,
.headerbtm {
    width: 960px;
    margin: 0 auto;
}
.headerbtm .header_app {
    display: none;
}
.test-center span {
    display: inline-block;
}
.logoarea {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 2.2rem;
}
.logoarea p:first-child {
    width: 145px;
    margin-right: 2.5rem;
}
.logoarea p:last-child {
    font-size: 1.7rem;
}
.logoarea img {
    width: 100%;
    height: auto;
    display: block;
}
.header_nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
}
.header_nav ul {
    list-style-type: none;
    padding-left: 0;
    margin-top: 0;
    display: flex;
    align-items: center;
}
.header_nav li {
    display: inline-block;
    margin: 0 2rem;
}
.header_nav li:first-child {
    margin-left: 0;
}
.header_current {
    border-bottom: 3px solid #1069c4;
}
.header_nav li a {
    display: block;
    padding: 1rem 0 0.5rem 0;
    font-size: 1.5rem;
}
.header_nav li a:hover {
    color: #1069c4;
}
.header_nav li a.sp_show {
    display: none;
}
.header_nav li a.pc_show {
    display: block;
}
.header_nav li a.sp_text::before {
    content: "学習の進め方";
}
.header_nav_br_center {
    text-align: center;
}
.header_nav_br_center span {
    display: none;
}
.header_app {
    width: 14rem;
    height: 4rem;
}
.header_app a {
    position: relative;
    display: block;
    font-size: 1.5rem;
    color: #fff;
    background-color: #faaf18;
    height: 100%;
    line-height: 2.5;
    border-radius: 4px;
}
.header_app a::after {
    position: absolute;
    right: 1.5rem;
    top: 37%;
    content: "";
    display: inline-block;
    background: url(../img/right_arrow.png) no-repeat;
    background-size: contain;
    vertical-align: middle;
    width: 0.7rem;
    height: 1rem;
}
.header_app a span {
    margin-left: 1.7rem;
}
.header_app a span.header-btn-margin {
    margin-left: 25%;
}
.header_app a:hover {
    opacity: 0.7;
}
.is-shadow {
    box-shadow: 0 6px 6px rgba(0, 0, 0, 0.05);
}
.header_nav_logout {
    margin-top: 1rem;
    padding-bottom: 2.9rem;
}
.nyukai_btn p a {
    display: inline-block;
    padding: 5px 15px;
    background-color: orange;
    color: white;
    border: 2px solid orange;
    border-radius: 4px;
    text-decoration: none;
    position: absolute;
    top: 10px;
    right: 120px;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
    font-size: 1rem;
}
.mypage_btn p a {
    display: inline-block;
    padding: 5px 15px;
    background-color: white;
    color: black;
    border: 2px solid black;
    border-radius: 4px;
    text-decoration: none;
    position: absolute;
    top: 10px;
    right: 50px;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
    font-size: 1rem;
}
/* header end */

/* breadcrumbs */
.breadcrumbs {
    width: 960px;
    margin: 0 auto;
    padding: 2.5rem 0;
}
.breadcrumbs ol {
    list-style-type: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    margin: 0;
}
.breadcrumbs li a {
    position: relative;
    font-size: 1.2rem;
    padding-right: 2.5rem;
    color: #1069c4;
}
.breadcrumbs li:last-child a {
    color: #000;
}
.breadcrumbs li:not(:last-child) a::after {
    position: absolute;
    content: "";
    display: inline-block;
    background: url(../img/breadcrumbs_arrow.png) no-repeat;
    background-size: contain;
    vertical-align: middle;
    width: 0.5rem;
    height: 0.6rem;
    top: 50%;
    margin-top: -0.2rem;
    right: 0.9rem;
}
/* breadcrumbs end */

/* h1 title */
.main_ttl_wrap {
    width: 100%;
    background-color: #dcf4ff;
    padding-top: 50px;
}
.main_ttl_wrap_logout {
    padding-top: 0;
}
.main_ttlcategory .main_ttl {
    font-size: 4rem;
    margin: 0;
    padding-bottom: 4rem;
}
/* h1 title end */

.conts_in8,
.conts_in7,
.conts_in6,
.conts_in5,
.conts_in4,
.conts_in3,
.conts_in {
    width: 960px;
    margin: 0 auto;
}
.conts_in3 {
    padding-bottom: 3rem;
}
.conts_in4 {
    padding-bottom: 4rem;
}
.conts_in5 {
    padding-bottom: 5rem;
}
.conts_in6 {
    padding-bottom: 6rem;
}
.conts_in7 {
    padding-bottom: 7rem;
}
.conts_in8 {
    padding-bottom: 8rem;
}

/* diagnosis */
.diagnosis_wrap {
    margin: 5rem auto;
}
.diagnosis_text {
    margin-top: 2rem;
}
.diagnosis_text p {
    font-size: 1.7rem;
}
/* diagnosis end */

/* lead text */
.lead p {
    font-size: 1.7rem;
    margin: 5rem 0;
}
/* lead text end */

/* flow */
.flow_wrap {
    width: 100%;
    position: relative;
    border: solid 8px #bee6f9;
    padding: 1.5rem 3rem 3rem 3rem;
    min-height: 351px;
    margin-bottom: 4.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.flow_wrap:last-child {
    margin-bottom: 0;
}
.flow_wrap:not(:last-child):after {
    position: absolute;
    content: "";
    background: url(../img/flow_arrow.png) no-repeat;
    background-size: contain;
    display: block;
    bottom: -4.5rem;
    left: 50%;
    width: 4.7rem;
    height: 2.5rem;
    transform: translateX(-50%);
}
.flow_wrap .flow_img {
    margin-left: 3.5rem;
    margin-top: 6.5rem;
}
.flow_wrap .flow_img img {
    max-width: 300px;
}
.flow_text_wrap {
    width: 63%;
}
.flow_text_wrap .flow_num {
    font-size: 3rem;
    color: #0e69c4;
    font-weight: 700;
    margin: 0;
}
.thir_ttl {
    font-size: 2rem;
    line-height: 1.3;
    border-left: solid 5px #0e69c4;
    padding-left: 1.4rem;
    margin: 1.5rem 0;
}
.margin_t25{
    margin-top: 2.5rem;
}
.flow_text_wrap .flow_text {
    margin-bottom: 1rem;
}
.annotation {
    padding-top: 1rem;
    font-size: 1.3rem;
    color: #e6201a;
}
.annotation_k_otoiawase{
    padding-top: 1rem;
    font-size: 1.7rem;
    color: #e6201a;
}
/* flow end */


/* flow2 */
.flow2_wrap {
    width: 100%;
    position: relative;
    border: solid 8px #bee6f9;
    padding: 1.5rem 3rem 3rem 3rem;
    min-height: 251px;
    margin-bottom: 4.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.flow2_wrap:last-child {
    margin-bottom: 0;
}
.flow2_wrap:not(:last-child):after {
    position: absolute;
    content: "";
    background: url(../img/flow_arrow.png) no-repeat;
    background-size: contain;
    display: block;
    bottom: -4.5rem;
    left: 50%;
    width: 4.7rem;
    height: 2.5rem;
    transform: translateX(-50%);
}
.flow2_wrap .flow2_img {
    display: block;
    margin: auto;
}
.flow2_text_wrap {
    width: 100%;
}
.flow2_text_wrap .flow2_num {
    font-size: 3rem;
    color: #0e69c4;
    font-weight: 700;
    margin: 0;
}
.thir_ttl {
    font-size: 2rem;
    line-height: 1.3;
    border-left: solid 5px #0e69c4;
    padding-left: 1.4rem;
    margin: 1.5rem 0;
}
.margin_t25{
    margin-top: 2.5rem;
}
.flow2_text_wrap .flow2_text {
    margin-bottom: 1rem;
}
.annotation {
    padding-top: 1rem;
    font-size: 1.3rem;
    color: #e6201a;
}
.annotation_k_otoiawase{
    padding-top: 1rem;
    font-size: 1.7rem;
    color: #e6201a;
}


.flow2_btn {
    color: #fff;
    display: block;
    margin: auto;
    justify-content: center;
    align-items: center;
    padding: .2rem 2rem ;
    font-size: 1.8rem;
    line-height: 1.5333333333;
    letter-spacing: 0.035em;
    height: 4rem;
    position: relative;
    cursor: pointer;
    background-color: #0e69c4;
    border-radius: .4rem;
    border: .1rem solid #0e69c4;

}

.flow2_btn:hover  {
    opacity: 0.7;
}

/* flow2 end */



/* balloon */
.conts_wrap {
    background-color: #eff1f1;
}
.balloon_wrap {
    padding-top: 7rem;
}
.seco_ttl_center,
.seco_ttl_center_w {
    position: relative;
    font-size: 3rem;
    text-align: center;
    margin-top: 0;
    margin-bottom: 4rem;
}
.seco_ttl_center::before {
    position: absolute;
    content: "";
    background: url(../img/h2left.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 3.1rem;
    height: 4.3rem;
    bottom: 0;
}
.seco_ttl_center::after {
    position: absolute;
    content: "";
    background: url(../img/h2right.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 3.1rem;
    height: 4.3rem;
    bottom: 0;
}
.balloon_wrap .seco_ttl_center::before {
    left: 35%;
}
.balloon_wrap .seco_ttl_center::after {
    right: 35%;
}
.shidou .seco_ttl_center::before {
    left: 18%;
}
.shidou .seco_ttl_center::after {
    right: 19%;
}
.balloon {
    margin-bottom: 5.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.balloon:nth-of-type(even) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}
.balloon:last-of-type {
    margin-bottom: 0;
}
.balloon_left,
.balloon_right {
    position: relative;
    display: inline-block;
    padding: 2rem 3rem;
    background: #fff;
    border: solid 4px #7dcdf4;
    border-radius: 5px;
}
.balloon_left {
    margin-left: 3rem;
}
.balloon_right {
    margin-right: 3rem;
}
.balloon_left::before,
.balloon_right::before {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -12px;
    border: 12px solid transparent;
    z-index: 2;
}
.balloon_left::before {
    left: -24px;
    border-right: 12px solid #fff;
}
.balloon_right::before {
    right: -24px;
    border-left: 12px solid #fff;
}

.balloon_left::after,
.balloon_right::after {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -14px;
    border: 14px solid transparent;
    z-index: 1;
}
.balloon_left::after {
    left: -31px;
    border-right: 14px solid #7dcdf4;
}
.balloon_right:after {
    right: -31px;
    border-left: 14px solid #7dcdf4;
}
.balloon_img img {
    max-width: 190px;
}
/* balloon end*/

/* support */
.support_wrap {
    padding-top: 6rem;
}
.seco_ttl_left {
    font-size: 3rem;
    border-bottom: solid 4px #7dcdf4;
    padding-bottom: 1rem;
    margin-top: 0;
    margin-bottom: 3rem;
}
.bg_blue .thir_ttl {
    margin-top: 0;
}
.bg_blue {
    background-color: #edfaff;
    padding: 2.5rem 3rem;
    margin: 2rem 0;
    border-radius: 5px;
}
.bg_blue:last-child {
    margin-bottom: 0;
}
.support:last-of-type {
    margin-bottom: 0;
}
.bg_blue_img {
    margin-top: 2.5rem;
    max-width: 62.8rem;
}
/* support end*/

/* dues */
table {
    table-layout: fixed;
    width: 100%;
    text-align: center;
    border-collapse: collapse;
    border: 2px solid #d9d9d9;
    font-size: 1.5rem;
    margin: 2rem auto 0 auto;
}
table thead {
    background-color: #1069c4;
    color: #fff;
}
table tbody th {
    background-color: #eff1f1;
}
th,
td {
    border: 1px solid #d9d9d9;
    padding: 2rem 0;
}
.annotation_bk_wrap {
    padding-bottom: 2rem;
}
.annotation_bk {
    text-indent: -1em;
    padding-left: 1em;
    font-size: 1.3rem;
}
.annotation_bk:first-child {
    padding-top: 2rem;
}
.bg_blue ul {
    padding-left: 2rem;
}
.dues_list ul li {
    font-size: 1.5rem;
    padding-bottom: 0.5rem;
}
/* dues end */

.text_link {
    font-size: 1.5rem;
    color: #1069c4;
    border-bottom: solid 1px #1069c4;
}
.text_link.word-break {
    word-break: break-all;
}
.thir_ttl_text_link p:nth-of-type(2) {
    padding-top: 1.5rem;
}
.thir_ttl_text_anno .annotation_bk {
    padding-top: 1.5rem;
}
.text_link_add {
    padding-bottom: 1.5rem;
}
.text_link_add + .annotation {
    padding-top: 0;
}
h4 {
    font-size: 1.5rem;
    margin: 0 0 1rem 0;
}
h4.brackets {
    margin-left: -0.8rem;
}

/* primary */
.workbook {
    width: 16%;
    display: inline-block;
    vertical-align: top;
}
.primary_text {
    display: inline-block;
    margin-left: 2.5rem;
    width: 80%;
}

.reproduction {
    position: relative;
    padding: 2.5rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.reproduction:not(:first-of-type) {
    border-top: 1px dotted #d9d9d9;
}
.reproduction:first-of-type {
    padding-top: 1rem;
}
.listen_btn {
    position: relative;
    cursor: pointer;
    background-color: #fff;
    border-radius: 40px;
    border: 1px solid #0e69c4;
}
.listen_btn a {
    color: #0e69c4;
    font-size: 1.3rem;
    display: block;
    padding: 0.7rem 3.5rem 0.7rem 1.5rem;
}
.listen_btn a::after {
    position: absolute;
    content: "";
    background: url(../img/reproduction.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 1.5rem;
    height: 1.3rem;
    right: 1rem;
    bottom: 30%;
}
/* primary end */

/* faq */
/************* tab *************/
.faq li {
    list-style: none;
}
.tab-container {
    font-size: 1.5rem;
    text-align: center;
    width: 100%;
    padding: 0 2.5rem 4rem 2.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.tab-container li {
    width: 100%;
}
.tab {
    position: relative;
    padding: 1em;
    background-color: #eff1f1;
    transition: all 0.2s;
    cursor: pointer;
}
.tab:first-of-type {
    border-radius: 4px 0 0 4px;
}
.tab:last-of-type {
    border-radius: 0 4px 4px 0;
}
.tab:not(:last-of-type) {
    margin-right: 0.5em;
}
/* tab current */
.current {
    color: #eaeaea;
    background-color: #1069c4;
}

.current::before {
    content: "";
    position: absolute;
    border-left: 6px dashed transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #1069c4;
    left: 50%;
    margin-left: -6px;
    bottom: -6px;
}
/* tab menu */
.menu-box {
    width: 100%;
    padding: 0;
    font-size: 2rem;
    display: none;
}
.menu-box.is-show {
    display: block;
}
.accArea {
    border-radius: 4px;
    transition: all 0.2s;
    cursor: pointer;
    background-color: #edfaff;
    padding: 0 3.5rem;
    margin-bottom: 2rem;
}
.accBtn {
    display: block;
    padding: 2rem 7.5rem 2rem 5rem;
    font-size: 18px;
    position: relative;
    font-weight: bold;
    line-height: 1.4;
}
.qaArea .txtQ::before {
    position: absolute;
    content: "";
    background: url(../img/faq.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 3.5rem;
    height: 3.5rem;
    left: 0;
    top: 1.6rem;
}
.accBtn:after {
    content: "";
    display: inline_block;
    position: absolute;
    top: 50%;
    background-image: url(../img/plus.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 2.1rem;
    height: 2.1rem;
    right: 0;
    margin-top: -1.1rem;
}
.open.accBtn:after {
    background-image: url(../img/minus.png);
    margin-top: 0;
}
.accIn {
    border-top: 1px dotted #d9d9d9;
}
.txtA {
    position: relative;
    padding: 2rem 7.5rem 2rem 5rem;
}
.txtA::before {
    position: absolute;
    content: "";
    background: url(../img/fqa_a.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 3.5rem;
    height: 3.5rem;
    left: 0;
    top: 1.6rem;
}
.by {
    padding: 2rem 0;
    text-align: right;
}
.btn-more {
    display: block;
    margin: 3rem 0 0 auto;
    position: relative;
    color: #0e69c4;
    font-size: 1.3rem;
    background-color: #fff;
    border: 1px solid #0e69c4;
    border-radius: 4px;
    padding: 1rem 3rem 1rem 1.5rem;
}
.btn-more::after {
    position: absolute;
    right: 1.3rem;
    top: 50%;
    margin-top: -0.5rem;
    content: "";
    display: inline-block;
    background: url(../img/btn_more_icon.png) no-repeat;
    background-size: contain;
    vertical-align: middle;
    width: 1rem;
    height: 1rem;
}
.accArea.is-hidden {
    display: none;
    opacity: 0;
}
/* faq end */

/*kaihi*/
.display_inline {
    display: inline;
}
.important_kaihi {
    padding-left: 1rem;
    font-size: 1.7rem;
}
/*kaihi end*/

/* benefits */
.conts_wrap_blue {
    background-color: #7dcdf4;
    position: relative;
    z-index: -2;
}
.benefits_wrap {
    padding-top: 6rem;
}
.seco_ttl_center_w {
    color: #fff;
}
.benefits_ttl .seco_ttl_center_w {
    max-width: 49%;
    width: 100%;
    margin: 0 auto 2rem auto;
}
.benefits_ttl {
    position: relative;
}
.annotation_w {
    color: #fff;
    font-size: 1.3rem;
    text-align: center;
}
.seco_ttl_center_w::before {
    position: absolute;
    content: "";
    background: url(../img/h2White_left.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 3.1rem;
    height: 4.3rem;
    bottom: 0;
}
.seco_ttl_center_w::after {
    position: absolute;
    content: "";
    background: url(../img/h2White_right.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 3.1rem;
    height: 4.3rem;
    bottom: 0;
}
.benefits_wrap .seco_ttl_center_w::before {
    transform: translateX(-100%);
    left: 0;
}
.benefits_wrap .seco_ttl_center_w::after {
    transform: translateX(100%);
    right: 0;
}
.benefits {
    margin-top: 4.5rem;
    position: relative;
}
.benefits::before {
    position: absolute;
    content: "";
    background: url(../img/left_woman.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 11.6rem;
    height: 14.2rem;
    top: -13rem;
    left: 10%;
}
.benefits::after {
    position: absolute;
    content: "";
    background: url(../img/right_woman.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 11.6rem;
    height: 14.2rem;
    top: -13rem;
    right: 10%;
    z-index: -1;
}
.bg_white {
    background-color: #fff;
    padding: 2.5rem 3rem;
    margin: 2rem 0;
    border-radius: 5px;
}
.benefits_conts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.benefits_conts.bg_white {
    padding-right: 0;
    position: relative;
}
.benefits_conts > div:first-of-type {
    width: 35%;
    border-left: 1px dotted #d9d9d9;
}
.benefits_text {
    width: 65%;
    padding-right: 3.5rem;
}
.benefits_conts figure {
    width: 42.5%;
    margin: auto;
}
.benefits_conts:nth-of-type(4) figure {
    width: 60.5%;
}
.benefits_conts figcaption {
    text-align: center;
    margin-top: 1rem;
}
/* benefits end*/

/* test */
.page_test {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /* gap: 10px 15px; */
    padding: 2rem 2rem;
    background-color: #edfaff;
    border-radius: 4px;
    margin-top: 3rem;
    margin-bottom: 6rem;
}
.test_btn:nth-of-type(3n) {
    margin-right: 0;
}
.test_btn:nth-of-type(-n+3) {
    margin-top: 0;
}
.test_btn {
    width: calc(100% / 3 - 10px);
    margin-right: 15px;
    margin-top: 10px;
}
.test_btn a {
    text-align: left;
    background-color: #1069c4;
    padding: 1rem 0;
    color: #fff;
    width: 100%;
    display: flex;
    align-items: left;
    justify-content: left;
    border-radius: 5px;
    position: relative;
}
.test_btn a span {
    font-size: 1.5rem;
    margin-left: 15px;
}
.test_btn a:hover {
    opacity: 0.7;
}
.test_btn a::after {
    position: absolute;
    content: "";
    top: 50%;
    background-image: url(../img/test_btn.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.4rem;
    height: 1.2rem;
    right: 12px;
    margin-top: -5px;
}
.ongen_btn:nth-of-type(3n) {
    margin-right: 0;
}
.ongen_btn:nth-of-type(-n+3) {
    margin-top: 0;
}
.ongen_btn {
    width: calc(100% / 3 - 10px);
    margin-right: 15px;
    margin-top: 10px;
}
.ongen_btn a {
    text-align: center;
    background-color: #1069c4;
    padding: 1rem 0;
    color: #fff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    position: relative;
}
.ongen_btn a span {
    font-size: 1.5rem;
}
.ongen_btn a:hover {
    opacity: 0.7;
}
.ongen_btn a::after {
    position: absolute;
    content: "";
    top: 50%;
    background-image: url(../img/test_btn.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.4rem;
    height: 1.2rem;
    right: 12px;
    margin-top: -5px;
}
.test_text {
    width: 100%;
    margin-left: 0;
}
.reproduction:last-of-type {
    padding-bottom: 1rem;
}
.primary_test {
    margin: 3rem 0 6rem 0;
}
.anchor h2 {
    padding-top: 165px;
    margin-top: -165px;
}
.question {
    font-size: 1.7rem;
}
.promise_btn_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 2rem 2rem;
    background-color: #edfaff;
    border-radius: 4px;
    margin-top: 3rem;
}
.promise_btn {
    width: 70%;
    margin: auto;
}
.promise_btn a {
    text-align: center;
    background-color: #1069c4;
    padding: 1rem 0;
    color: #fff;
    width: 100%;
    border-radius: 5px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.promise_btn_wrap a:hover {
    opacity: 0.7;
}
.promise_btn a::after {
    position: absolute;
    content: "";
    top: 50%;
    background-image: url(../img/right_arrow.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.4rem;
    height: 1.2rem;
    right: 12px;
    margin-top: -5px;
}
.promise_btn a span {
    font-size: 1.5rem;
}
.kyozai_btn_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 2rem 2rem;
    background-color: #edfaff;
    border-radius: 4px;
    margin-top: 3rem;
    margin-bottom: 6rem;
}
.kyozai_btn {
    width: calc(100% / 2 - 1rem);
    margin-right: 2rem;
    margin-top: 10px;
}
.kyozai_btn:nth-of-type(2n) {
    margin-right: 0;
}
.kyozai_btn:nth-of-type(-n+2) {
    margin-top: 0;
}
.kyozai_btn a {
    text-align: center;
    background-color: #1069c4;
    padding: 1rem 0;
    color: #fff;
    width: 100%;
    border-radius: 5px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.kyozai_btn a span {
    font-size: 1.5rem;
}
.kyozai_btn a:hover {
    opacity: 0.7;
}
.kyozai_btn a::after {
    position: absolute;
    content: "";
    top: 50%;
    background-image: url(../img/right_arrow.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.4rem;
    height: 1.2rem;
    right: 12px;
    margin-top: -5px;
}
/* test end */

/* progress */
.progress_content_wrap {
    margin-bottom: 6rem;
}
.progress_ttl {
    font-size: 3rem;
    text-align: center;
    margin-bottom: 3rem;
}
.progress_btn_wrap {
    padding: 2rem 2rem;
    background-color: #edfaff;
    border-radius: 4px;
    margin-top: 3rem;
    margin-bottom: 3rem;
}
.progress_btn a {
    text-align: center;
    background-color: #1069c4;
    padding: 1rem 0;
    color: #fff;
    width: 100%;
    border-radius: 5px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.progress_btn a span {
    font-size: 1.5rem;
}
.progress_btn a:hover {
    opacity: 0.7;
}
.progress_btn a::after {
    position: absolute;
    content: "";
    top: 50%;
    background-image: url(../img/right_arrow.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.4rem;
    height: 1.2rem;
    right: 12px;
    margin-top: -5px;
}
.progress_tab_wrap {
    margin-bottom: 3rem;
}
.progress_tab {
    display: flex;
    background-color: #fff;
    position: relative;
    border-radius: 5px 5px 0 0;
}
.progress_tab div {
    flex: 1;
    text-align: center;
    padding: 10px;
    font-size: 1.5rem;
    cursor: pointer;
    position: relative;
}
.progress_tab div:first-of-type {
    border-radius: 5px 0 0 0;
}
.progress_tab div:last-of-type {
    border-radius: 0 5px 0 0;
}
.progress_tab div:hover {
    opacity: 0.7;
}
.progress_tab div.active {
    color: #fff;
    background-color: #1069c4;
}
.progress_tab div.active:hover {
    opacity: 0.7;
}

.progress_tab_content-wrapper {
    overflow: hidden;
    position: relative;
    margin-top: 25px;
}
.progress_tab_content {
    width: 100%;
    position: absolute;
    top: 0;
    left: 100%;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}
.progress_tab_content.active {
    left: 0;
    opacity: 1;
}

.progress_tab_content table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    border: none;
}
.progress_tab_content th, td {
    border: 1px solid #ddd;
    text-align: left;
    padding: 8px;
    color: #000;
    text-align: center;
}
.progress_tab_content th {
    background-color: #dcf4ff;
}
.progress_tab_content tr {
    background-color: #fff;
}
.progress_tab_content tr th:first-child {
    width: 15%;
}
.progress_no_data {
    font-size: 1.7rem;
    font-weight: bold;
    text-align: center;
}
.progress_link {
    text-align: center;
}
.progress_link a {
    font-size: 1.7rem;
    text-decoration: underline;
}
/* progress end */

/* inquiry */
.inquiry_wrap {
    padding-top: 5rem;
}
.inquiry_ttl {
    font-size: 3rem;
    text-align: center;
    margin-bottom: 0.5rem;
}
.inquiry_text {
    text-align: center;
}
.inquiry_timestamp {
    text-align: center;
}
.inquiry {
    margin-top: 3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    background-color: #fff;
    border-radius: 5px;
}
.inquiry .mail,
.inquiry .tel {
    position: relative;
    width: 50%;
}
.inquiry .mail {
    padding: 5rem 0;
}
.inquiry .mail p,
.inquiry .tel p {
    display: inline-block;
}
.inquiry .mail p {
    padding-left: 5rem;
    font-size: 2rem;
    max-width: 233px;
    width: 100%;
    position: relative;
}
.inquiry .mail p::before {
    position: absolute;
    content: "";
    background: url(../img/mail.png) no-repeat;
    background-size: contain;
    width: 3.8rem;
    height: 2.7rem;
    left: 35px;
    top: 50%;
    margin-top: -1.5rem;
    transform: translateX(-100%);
}
.inquiry .tel {
    padding: 2rem 0 3rem 0;
}
.inquiry .tel::before {
    content: "";
    background: -webkit-gradient(
            linear,
            left top,
            left bottom,
            from(rgba(171, 173, 174, 1)),
            color-stop(20%, rgba(171, 173, 174, 1)),
            color-stop(20%, rgba(0, 0, 0, 0)),
            to(rgba(0, 0, 0, 0))
        )
        0% 0%;
    background: -o-linear-gradient(
            top,
            rgba(171, 173, 174, 1),
            rgba(171, 173, 174, 1) 20%,
            rgba(0, 0, 0, 0) 20%,
            rgba(0, 0, 0, 0) 100%
        )
        0% 0%;
    background: linear-gradient(
            to bottom,
            rgba(171, 173, 174, 1),
            rgba(171, 173, 174, 1) 20%,
            rgba(0, 0, 0, 0) 20%,
            rgba(0, 0, 0, 0) 100%
        )
        0% 0%;
    background-size: 1px 5px;
    width: 1px;
    height: 70%;
    position: absolute;
    top: 15%;
    left: 0;
}
.inquiry .tel p:first-child {
    font-size: 4rem;
    padding-left: 5rem;
    max-width: 353px;
    width: 100%;
    position: relative;
}
.inquiry .tel p:first-child:before {
    position: absolute;
    content: "";
    background: url(../img/tel.png) no-repeat;
    background-size: contain;
    width: 5.4rem;
    height: 3rem;
    left: 62px;
    top: 32%;
    transform: translateX(-100%);
}
.inquiry .tel p:last-child {
    padding-left: 9rem;
    display: block;
}
/* inquiry end*/

/* footer */
footer {
    background-color: #edfaff;
    border-top: 4px solid #7dcdf4;
    padding-top: 1.5rem;
    position: relative;
}
.footertop,
.footermiddle,
.footerbtm {
    width: 960px;
    margin: auto;
}
.footertop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 5.5rem;
}
footer .logoarea {
    display: block;
    width: 17rem;
}
footer .logoarea p:last-child {
    padding-top: 1.5rem;
}
.footer_address_wrap {
    padding-right: 3.5rem;
}
.footer_address {
    padding-left: 1.5rem;
    width: 65%;
}
.company {
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-size: 1.5rem;
}
.footer_right_top {
    padding-left: 2.5rem;
}
.footer_right_top .footer_accBtn {
    margin-bottom: 1rem;
    font-size: 1.5rem;
    line-height: 1.7647058823;
    font-weight: 500;
    padding: 0;
}
.footer_right_top .footer_accBtn::after {
    content: none;
}
.address {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 2rem;
}
.oosaka,
.tokyo {
    font-size: 1.3rem;
    flex-shrink: 0;
}
.address div:last-of-type {
    font-size: 1.2rem;
    padding-left: 2rem;
}
.footer_left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.footer_left,
.footer_right {
    width: 50%;
}
.footer_right {
    border-left: 1px solid #abadae;
    margin-top: 2rem;
}
.activities {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 2rem;
}
.activities.footer_accIn {
    border: none;
}
.activities_l,
.activities_r {
    width: 50%;
    padding-left: 2.5rem;
}
.actibities_item:not(:last-child) {
    font-size: 1.2rem;
    margin-bottom: 1.5rem;
}
.actibities_item a {
    position: relative;
    padding-right: 2rem;
}
.actibities_item a::after {
    position: absolute;
    content: "";
    top: 5px;
    background-image: url(../img/footer_icon_rectangle.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.2rem;
    height: 1.2rem;
    right: 0;
}
.footermiddle {
    padding-bottom: 2rem;
}
.footer_nav ul {
    list-style: none;
    padding: 0;
}
.footer_nav li {
    display: inline-block;
    border-right: 1px solid #abadae;
}
.footer_nav li:first-child {
    border-left: 1px solid #abadae;
}
.footer_nav li a {
    padding: 0.5rem 1.5rem;
    font-size: 1.2rem;
}
.footerbtm {
    padding: 1.4rem 0;
    text-align: center;
}
.footer_blue {
    z-index: 0;
}
/* footer end*/

/* pagetop */
.page_top {
    position: fixed;
    bottom: 8rem;
    right: 7rem;
}
.page_top a {
    display: block;
}
.page_top a:hover {
    opacity: 0.7;
}
.absolute {
    position: absolute;
    right: 7rem;
    bottom: 28rem;
}
.del_marker {
    list-style: none;
    padding-left: 0;
}

/* pagetop end */

@media screen and (max-width: 960px) {
    .wrapper,
    .headertop,
    .headerbtm,
    .breadcrumbs,
    .conts_in,
    .conts_in3,
    .conts_in4,
    .conts_in5,
    .conts_in6,
    .conts_in7,
    .conts_in8,
    .footertop,
    .footermiddle,
    .footerbtm {
        width: 100%;
    }
    header,
    .wrap,
    .main_ttl_wrap,
    .diagnosis_wrap,
    .lead_wrap,
    .conts_wrap,
    .conts_wrap_blue,
    .footer_left,
    .footermiddle {
        padding-right: 1.5rem;
        padding-left: 1.5rem;
    }
    .address:first-of-type {
        width: 49%;
    }
    .flow_wrap {
        height: auto;
    }
}

@media screen and (min-width: 884px) {
    .header_handle,
    .sp-bottom-btn,
    .sp-bottom-btn-nyukai,
    .no_pc,
    .nyukai_btn,
    .mypage_btn
     {
        display: none;
    }
}
@media screen and (max-width: 883px) {
    body {
        margin-top: 5.7rem;
    }
    body.noscroll {
        overflow: hidden;
    }
    p,
    h4 {
        font-size: 1.7rem;
    }
    header {
        padding: 0;
    }
    .no_sp {
        display: none;
    }
    .ham_btn {
        position: absolute;
        top: 0;
        right: 0;
        width: 55px;
        height: 55px;
        cursor: pointer;
    }
    .display-none {
        display: none;
    }
    /*
    .menu_btn{
        position: absolute;
        font-weight: bold;
        top:50%;
        left: 50%;
        text-align:center;
        transform: translate(-50%, -50%);
    }
    */
    .menu_btn{
        display: block;
        font-weight: bold;
        font-size: .9rem;
        position: absolute;
        top: 26px;
        width: 40px;
        text-align: center;
        left: -9px;
        color: #333;
        letter-spacing: -0.05em;
    }
    .header_handle {
        padding: 0;
        border: 0;
        background: 0 0;
        cursor: pointer;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        position: absolute;
        top: 15px;
        right: 15px;
        width: 22px;
        height: 22px;
    }
    .header_handle span {
        position: absolute;
        right: 0;
        width: 22px;
        height: 2px;
        background-color: #333;
        transition: all 0.2s 0s ease;
    }
    .header_handle span:nth-child(1) {
        top: 0;
    }
    .header_handle span:nth-child(2) {
        top: 50%;
        transform: translate(0, -50%);
        margin: auto;
    }
    .header_handle span:nth-child(3) {
        bottom: 0;
    }
    .header_handle.show span:nth-child(1) {
        top: 50%;
        transform: translate(0, -50%) rotate(45deg);
    }
    .header_handle.show span:nth-child(2) {
        opacity: 0;
    }
    .header_handle.show span:nth-child(3) {
        top: 50%;
        transform: translate(0, -50%) rotate(-45deg);
    }

    .logoarea-group .header_app_mypage {
        display: none;
    }
    .logoarea {
        padding: 1.2em 0em 1.2em 1.5em;
    }
    .logoarea p:first-child {
        width: 82px;
        margin-right: 1.8rem;
    }
    .logoarea p:last-child {
        font-size: 1.1rem;
    }
    .headerbtm {
        position: fixed;
        background-color: #fff;
        height: 80vh;
        padding: 0 1.5rem;
        left: 100%;
        transition: all 0.3s linear;
        overflow-y: scroll;
    }
    /*
    .headerbtm .header_app_mypage {

    }
    */
    .headerbtm.show {
        left: 0;
    }
    .header_nav,
    .header_nav li {
        display: block;
        margin: 0;
    }
    .header_nav ul {
        display: block;
    }
    .header_nav li {
        border-bottom: solid 1px #dedffb;
        letter-spacing: 0.04em;
    }
    .header_nav li a {
        position: relative;
        padding: 2.05rem 3rem 2.05rem 0;
        font-size: 1.5rem;
        line-height: 1.5333333333;
    }
    .header_nav li a::after {
        position: absolute;
        content: "";
        display: inline-block;
        background-size: contain;
        vertical-align: middle;
        width: 1.2rem;
        height: 1.5rem;
        top: 50%;
        margin-top: -0.6rem;
        right: 0rem;
    }
    .header_nav li a.sp_show {
        display: block;
    }
    .header_nav li a.pc_show {
        display: none;
    }
    .header_nav li a.sp_text::before {
        content: "通信学習の進め方";
    }
    .header_nav li:last-child {
        padding: 0 0 50px 0;
    }
    .header_nav_br_center {
        text-align: left;
    }
    .header_nav_br_center br {
        display: none;
    }
    .header_nav_br_center span {
        display: inline-block;
    }
    .headerbtm .header_app {
        display: block;
    }
    .header_app {
        width: 100%;
        margin: 2rem 0;
        height: 4.3rem;
        text-align: center;
    }
    .header_app a {
        line-height: 2.7;
    }
    #header-inner02 {
        left: 100%;
        -webkit-transition: all 0.3s linear;
        -o-transition: all 0.3s linear;
        transition: all 0.3s linear;
    }

    .breadcrumbs {
        display: none;
    }
    .main_ttlcategory .main_ttl {
        padding: 2.5rem 0;
        font-size: 3rem;
    }
    .diagnosis_text p {
        font-size: 1.6rem;
    }
    .lead p {
        font-size: 1.6rem;
        margin: 4rem 0;
    }
    .flow {
        padding-bottom: 5rem;
    }
    .flow_wrap {
        display: block;
        padding: 1.5rem;
        margin-bottom: 3.7rem;
    }
    .flow_wrap:not(:last-child):after {
        width: 3.6rem;
        bottom: -4.3rem;
    }
    .flow_wrap .flow_img {
        width: 100%;
        margin: auto;
        text-align: center;
    }
    .flow_wrap .flow_img img {
        max-width: 100%;
    }
    .flow_text_wrap {
        width: 100%;
    }
    .flow_text_wrap .flow_num {
        font-size: 2.2rem;
    }
    .annotation,
    .annotation_bk,
    .annotation_w {
        font-size: 1.2rem;
    }
    .annotation_k_otoiawase{
        font-size: 1.6rem
    }
    .thir_ttl {
        margin: 1rem 0;
        padding-left: 1rem;
        font-size: 1.8rem;
    }
    .margin_t25{
        margin-top: 2.5rem;
    }
    .seco_ttl_center {
        font-size: 2.2rem;
        max-width: 58%;
        width: 100%;
        margin: 0 auto 4rem auto;
    }
    .balloon_wrap {
        padding-top: 4rem;
    }
    .balloon_wrap .seco_ttl_center::before {
        transform: translateX(-100%);
        left: 0;
    }
    .balloon_wrap .seco_ttl_center::after {
        transform: translateX(100%);
        right: 0;
    }
    .balloon_left,
    .balloon_right {
        width: 70%;
        padding: 1.5rem;
    }
    .balloon_left {
        margin-left: 2.5rem;
    }
    .balloon_right {
        margin-right: 2.5rem;
    }
    .balloon_img {
        width: 30%;
        align-self: flex-start;
    }
    .balloon_img img {
        max-width: 100%;
    }
    .balloon_left::before {
        left: -21px;
    }
    .balloon_right::before {
        right: -21px;
    }
    .balloon_left::before,
    .balloon_right::before {
        top: 27px;
        margin: 0;
    }
    .balloon_left::after,
    .balloon_right::after {
        top: 25px;
        margin: 0;
    }
    .balloon_left::after {
        left: -29px;
    }
    .balloon_right:after {
        right: -29px;
    }
    .seco_ttl_center_w {
        font-size: 2.2rem;
        max-width: 70.7%;
        width: 100%;
        margin: 0 auto 4rem auto;
    }
    .benefits_wrap .seco_ttl_center_w::before {
        transform: translateX(-100%);
        left: 0;
    }
    .benefits_wrap .seco_ttl_center_w::after {
        transform: translateX(100%);
        right: 0;
    }
    .benefits_conts figcaption {
        margin-top: 0.5rem;
    }
    .seco_ttl_left {
        font-size: 2.2rem;
    }
    .bg_blue {
        padding: 2rem;
    }
    .support_wrap {
        padding-top: 5rem;
    }
    .bg_blue_img {
        max-width: 100%;
        width: 100%;
    }
    table {
        font-size: 1.4rem;
    }
    th {
        padding: 0.5rem 2rem;
    }
    .annotation_bk:first-child {
        padding-top: 1.5rem;
    }
    .annotation_bk_wrap {
        padding-bottom: 0.5rem;
    }
    .bg_blue ul li {
        font-size: 1.4rem;
    }
    .bg_blue ul li:last-child {
        padding-bottom: 0;
    }
    .text_link {
        font-size: 1.4rem;
    }
    .thir_ttl_text_link p:nth-of-type(2) {
        padding-top: 0.8rem;
    }
    .thir_ttl_text_anno .annotation_bk {
        padding-top: 0.5rem;
    }
    .shop .bg_blue:first-of-type {
        margin-top: 0;
    }
    .text_link_add {
        padding-bottom: 0.8rem;
    }
    .bg_blue .pt_20 {
        padding-top: 1rem;
    }
    .workbook {
        display: block;
        margin: 0 auto 1rem auto;
        width: 38%;
    }
    .primary_text {
        width: 100%;
        margin: 0;
    }
    .reproduction {
        padding: 1.3rem 0;
    }
    .faq_wrapper {
        padding-bottom: 5rem;
    }
    .tab-container {
        font-size: 1.2rem;
        padding: 0 0 2.5rem 0;
        line-height: 1.167;
    }
    .current::before {
        bottom: -5px;
    }
    .tab {
        padding: 1rem 0.5rem;
    }
    .accArea {
        padding: 0 2rem;
    }
    .accBtn,
    .txtA {
        padding: 2rem 3rem 2rem 4rem;
    }
    .qaArea .txtQ::before,
    .txtA::before {
        width: 3rem;
        height: 3rem;
        top: 1.8rem;
    }

    .benefits_wrapper {
        padding-bottom: 6rem;
    }
    .benefits_ttl {
        line-height: 1.364;
    }
    .benefits_ttl .annotation_w {
        display: none;
    }
    .benefits_wrap {
        padding-top: 4rem;
    }
    .benefits_ttl .seco_ttl_center_w {
        max-width: 70.3%;
        margin-bottom: 7rem;
    }
    .benefits::before,
    .benefits::after {
        width: 6rem;
        height: 7.5rem;
        top: -6.5rem;
    }
    .benefits::before {
        left: 19%;
    }
    .benefits::after {
        right: 19%;
    }
    .benefits_conts {
        display: block;
    }
    .benefits_conts.bg_white {
        padding: 2rem;
    }
    .benefits_conts > div:first-of-type {
        width: 100%;
        border-left: none;
        border-bottom: 1px dotted #d9d9d9;
        padding-bottom: 1.9rem;
        margin-bottom: 1.9rem;
    }
    .benefits_conts figure {
        width: 27%;
    }
    .benefits_conts:nth-child(2) figure,
    .benefits_conts:nth-child(3) figure {
        width: 32%;
    }
    .benefits_text {
        width: 100%;
    }
    .test_btn {
        width: 100%;
        margin-right: 0;
        margin-top: 5px;
    }
    .test_btn:nth-of-type(-n+3):not(:first-of-type) {
        margin-top: 5px;
    }
    .test_btn a span {
        font-size: 1.3rem;
        padding: 0 3.5rem 0 1rem;
        line-height: 1.167;
    }
    .ongen_btn {
        width: 100%;
        margin-right: 0;
        margin-top: 5px;
    }
    .ongen_btn:nth-of-type(-n+3):not(:first-of-type) {
        margin-top: 5px;
    }
    .ongen_btn a span {
        font-size: 1.3rem;
        padding: 0 3.5rem 0 1rem;
        line-height: 1.167;
    }
    .promise_btn {
        width: 100%;
        margin: 0;
    }
    .promise_btn a span {
        font-size: 1.3rem;
        padding: 0 3.5rem 0 1rem;
        line-height: 1.167;
    }
    .kyozai_btn {
        width: 100%;
        margin-right: 0;
        margin-top: 5px;
    }
    .kyozai_btn:nth-of-type(-n+2):not(:first-of-type) {
        margin-top: 5px;
    }
    .kyozai_btn a {
        padding: 1rem 0;
    }
    .kyozai_btn a span {
        font-size: 1.3rem;
        padding: 0 3.5rem 0 1rem;
        line-height: 1.167;
    }
    .test_seco_ttl {
        margin-bottom: 1.5rem;
    }
    .anchor h2 {
        padding-top: 65px;
        margin-top: -65px;
    }
    .question {
        font-size: 1.6rem;
    }
    .reproduction {
        display: block;
        padding-top: 1rem;
    }
    .reproduction:first-of-type {
        padding-top: 0;
    }
    .reproduction > p {
        padding-bottom: 1rem;
    }
    .listen_btn {
        display: inline-block;
    }
    .primary_test {
        margin-bottom: 5rem;
    }
    .test_wrapper {
        padding-bottom: 6rem;
    }

    .progress_ttl {
        font-size: 2.2rem;
    }
    .progress_tab_content tr th:first-child {
        width: auto;
    }

    .inquiry_wrapper {
        padding-bottom: 4rem;
    }
    .inquiry_wrap {
        padding-top: 2.5rem;
    }
    .inquiry_ttl {
        font-size: 2.2rem;
    }
    .inquiry_text {
        text-align: left;
    }
    .inquiry {
        display: block;
        padding: 2rem;
    }
    .inquiry .mail,
    .inquiry .tel {
        width: 100%;
    }
    .inquiry .tel::before {
        content: none;
    }
    .inquiry .tel {
        border-top: 1px dotted #d9d9d9;
        padding: 2rem 0 0 0;
    }
    .inquiry .mail {
        padding: 0 0 2rem 0;
    }
    .inquiry .mail p {
        font-size: 1.8rem;
        padding-left: 3rem;
    }
    .inquiry .mail p::before {
        height: 2.4rem;
        width: 3.5rem;
        margin-top: -1rem;
        left: 18%;
    }
    .inquiry .tel p:first-child {
        font-size: 3rem;
        max-width: 260px;
    }
    .inquiry .tel p:first-child:before {
        width: 4.5rem;
        height: 2.7rem;
        left: 46px;
    }
    .inquiry .tel p:last-child {
        padding-left: 0;
    }
    .footertop,
    .footer_left,
    .footer_right {
        display: block;
        width: 100%;
    }
    .footertop {
        padding-bottom: 3rem;
    }
    .footertop .logoarea {
        display: block;
        width: 100%;
    }
    .footertop .logoarea .logoarea-top {
        padding: 1rem 0 0 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
        width: 100%;
    }
    .footertop .logoarea .logoarea-top p:first-child {
        width: 120px;
    }
    .footertop .logoarea .logoarea-top p:last-child {
        font-size: 1.6rem;
        padding: 0;
    }
    .footerbtm {
        padding-bottom: 1.5rem;
    }
    .footerbtm_inner {
        display: block;
        margin-bottom: 3rem;
    }
    .footer_address,
    .footer_address_wrap {
        width: 100%;
    }
    .footer_address {
        padding-left: 0;
    }
    .company {
        margin-top: 4rem;
        font-size: 1.4rem;
        margin-bottom: 0;
    }
    .footer_right {
        border: none;
        margin-top: 3rem;
    }
    .footer_right_top {
        background-color: #fff;
        border-top: 1px solid #cccccc;
        border-bottom: 1px solid #cccccc;
        padding: 0;
    }
    .footer_right_top .footer_accBtn {
        font-size: 1.4rem;
        padding: 1.6rem 3.5rem 1.6rem 1.5rem;
        line-height: 1.7647058823;
        font-weight: 500;
        margin: 0;
        display: block;
        position: relative;
    }
    .footer_right_top .footer_accBtn::after {
        content: "";
        top: 50%;
        background-image: url(../img/plus.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 2.1rem;
        height: 2.1rem;
        margin-top: -1.1rem;
        right: 1.5rem;
        position: absolute;
    }
    .activities {
        display: block;
        padding-top: 0;
    }
    .activities_l,
    .activities_r {
        width: 100%;
        padding-left: 0;
    }
    .actibities_item:not(:last-child) {
        margin: 0;
    }
    .actibities_item a {
        display: block;
        padding: 1.6rem 2.5rem 1.6rem 3rem;
        background-color: #fff;
        border-bottom: 1px solid #cccccc;
    }
    .actibities_item a::after {
        top: 50%;
        right: 2.5rem;
        margin-top: -6px;
    }
    .activities.footer_accIn {
        display: none;
    }
    .footer_right_top .footer_accBtn.open::after {
        background-image: url(../img/minus.png);
        margin-top: 0;
    }
    .footermiddle {
        text-align: center;
        font-size: 1.1rem;
    }
    .footer_nav li:nth-child(3) a {
        padding-left: 0;
        font-size: 1.05rem;
    }
    .footer_nav li a {
        padding: 0.5rem 1.3rem;
        font-size: 1.1rem;
    }
    .footer_nav li:nth-child(3),
    .footer_nav li:nth-child(4) {
        margin-top: 1.5rem;
    }
    /* .footer_list {
        text-align: left;
    }
    .footer_list ul {
        padding-left: 0;
        padding-top: 1.5rem;
    }
    .footerbtm .footer_list li {
        display: inline-block;
        margin-right: 1.5rem;
        margin-top: 1rem;
    }
    .footer_list li a::after {
        margin-top: -.3rem;
    }*/
    small {
        font-size: 1rem;
    }
    .page_top {
        right: 2rem;
        bottom: 3rem;
    }
    .page_top img {
        width: 4.5rem;
        height: 4.5rem;
    }
    .absolute {
        position: absolute;
        right: 2rem;
        bottom: 39rem;
    }
}
@media screen and (max-width: 450px) {
    .absolute {
        position: absolute;
        right: 2rem;
        bottom: 43rem;
    }
}
@media screen and (max-width: 350px) {
    th {
        padding: 0.5rem 1rem;
    }
    .inquiry .tel p:last-child {
        font-size: 1.2rem;
    }
    .absolute {
        position: absolute;
        right: 2rem;
        bottom: 59rem;
    }
}

/************* partslist end *************/

/* mypage */
.header_nav_mypage {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;

}
.header_nav_mypage li {
    margin: 0 2rem;
}
.welcome,
.member_num {
    display: inline-block;
}
.member_num {
    padding-left: 1rem;
    color: #0e69c4;
}
.welcome,
.member_name span {
    font-size: 1.3rem;
}
.member_name {
    font-size: 1.3rem;
}
.header_nav .header_app_mypage {
    display: none;
}
.header_app_mypage_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1rem;
    margin-top: 10px;
    background-color: #fff9d8;
    border-radius: 4px;
    border: 2px solid #faaf18;
}
.header_app_mypage_inner a:hover {
    opacity: 0.7;
}
.logout,
.member_num {
    font-size: 1rem;
}
.logout {
    padding: 0.5rem;
    background-color: #faaf18;
    color: #fff;
    border-radius: 4px;
    margin-left: 1.5rem;
}
.main_ttl_mypage span {
    font-size: 1.5rem;
    color: #1069c4;
    vertical-align: middle;
    margin-left: 1.5rem;
}
.not_completed_wrap {
    padding-top: 5rem;
}
.not_conpleted_inner {
    text-align: center;
    width: 48.5%;
    background-color: #fff1f1;
    border: 3px solid #e6201a;
    border-radius: 10px;
    padding: 2.5rem 2.5rem 3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
}
.not_conpleted_inner p:first-child {
    font-size: 2rem;
    color: #e6201a;
    padding-bottom: 0.5rem;
}
.not_conpleted_inner p:last-of-type {
    padding-bottom: 2rem;
}
.not_conpleted_inner div:first-of-type {
    font-size: 1.6rem;
    background-color: #faaf18;
    width: 90%;
    margin: auto auto 0 auto;
    border-radius: 25px;
    position: relative;
}
.not_conpleted_inner div:first-of-type a {
    color: #fff;
    padding: 1rem 0;
    display: block;
}
.not_conpleted_inner div:first-of-type a::after,
.center_btn_red::after,
.center_btn_blue::after {
    position: absolute;
    right: 1.5rem;
    top: 35%;
    content: "";
    display: inline-block;
    background: url(../img/right_arrow.png) no-repeat;
    background-size: contain;
    vertical-align: middle;
    width: 1rem;
    height: 1.5rem;
}
.not_conpleted_inner div:first-of-type:hover,
.center_btn_red:hover,
.center_btn_blue:hover {
    opacity: 0.7;
}
.not_conpleted {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.center_btn_red {
    font-size: 1.6rem;
    background-color: #e6201a;
    margin: 4.5rem auto;
    border-radius: 25px;
    position: relative;
    max-width: 269px;
    width: 100%;
}
.center_btn_red a {
    color: #fff;
    padding: 1rem 4.5rem;
    display: block;
}
.block-articles-list__date {
    font-size: 1.5em;
}
.block-articles-list__title {
    margin-top: 1rem;
}
.block-articles-list-item {
    border-bottom: 1px dotted #d9d9d9;
    margin-bottom: 3rem;
}
.block-articles-list-item a {
    display: block;
    padding-bottom: 3rem;
}
.center_btn_blue {
    background-color: #81d5fa;
    margin: 4.5rem auto 8rem auto;
    border-radius: 25px;
    position: relative;
    max-width: 250px;
    width: 100%;
    font-size: 1.6rem;
    text-align: center;
}
.center_btn_blue a {
    color: #fff;
    padding: 1rem 4.5rem;
    display: block;
}
.procedure_wrap {
    padding-top: 5rem;
}
.procedure_item_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-bottom: 4rem;
}
.procedure_item {
    width: 48.5%;
    margin-top: 3rem;
}
.procedure_item_title {
    font-size: 1.7rem;
    color: #fff;
    background-color: #1069c4;
    border-radius: 5px 5px 0 0;
    padding: 0.8rem 0 0.8rem 3rem;
}
.procedure_item_contents {
    background-color: #fff;
    padding: 1.5rem 0;
    border-radius: 0 0 5px 5px;
    min-height: 111px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.procedure_item_contents > ul,
.procedure_item_contents_inner {
    width: 73.5%;
    padding-right: 4.5rem;
}
.procedure_item_contents li {
    font-size: 1.5rem;
}
.procedure_item_contents_inner .annotation_bk {
    padding-left: 4rem;
    padding-top: 0.5rem;
}
.procedure_item_btn {
    position: relative;
    width: 26.5%;
    text-align: center;
    min-height: 81px;
    line-height: 81px;
    border-left: 1px dotted #d9d9d9;
    font-size: 1.5rem;
    padding-right: 2rem;
}
.procedure_item_btn a {
    display: block;
}
.procedure_item_btn::after {
    position: absolute;
    content: "";
    background: url(../img/right_arrow_blue.png) no-repeat;
    background-size: contain;
    display: inline-block;
    width: 1rem;
    height: 1.5rem;
    right: 20%;
    bottom: 38%;
}
.procedure_item_bottom {
    background-color: #fff;
    padding: 2rem 2.5rem;
    border: 3px solid #0e69c4;
    border-radius: 10px;
}
.procedure_btn_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 2rem 2rem;
    background-color: #edfaff;
    border-radius: 4px;
    margin-top: 3rem;
    margin-bottom: 6rem;
}
.procedure_btn {
    width: calc(100% / 2 - 1rem);
    margin-right: 2rem;
    margin-top: 10px;
}
.procedure_btn:nth-of-type(even) {
    margin-right: 0;
}
.procedure_btn:nth-of-type(-n+2) {
    margin-top: 0;
}
.procedure_btn a {
    text-align: left;
    background-color: #1069c4;
    padding: 1rem 0;
    color: #fff;
    width: 100%;
    border-radius: 5px;
    position: relative;
    display: flex;
    align-items: left;
    justify-content: left;
}
.procedure_btn a span {
    font-size: 1.5rem;
    margin-left: 15px;
}
.procedure_btn a:hover {
    opacity: 0.7;
}
.procedure_btn a::after {
    position: absolute;
    content: "";
    top: 50%;
    background-image: url(../img/test_btn.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.4rem;
    height: 1.2rem;
    right: 12px;
    margin-top: -5px;
}
.explanation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.explanation:not(:last-child) {
    margin-bottom: 1.5rem;
}
.type {
    background-color: #eff1f1;
    font-size: 1.5rem;
    padding: 0.3rem 1rem;
    margin-right: 1rem;
    flex-shrink: 0;
}
@media screen and (max-width: 960px) {
    .header_nav_mypage li {
        margin: 0 1.7rem;
    }
    .header_nav_mypage li a {
        font-size: 1.4rem;
    }
}
@media screen and (max-width: 883px) {
    .main_ttl_mypage span {
        font-size: 1.4rem;
    }
    .header_nav_mypage {
        margin-top: 0;
    }
    .header_nav_mypage li {
        margin: 0;
    }
    .header_nav .header_app_mypage {
        display: block;
    }
    .header_app_mypage {
        margin-top: 2.5rem;
    }
    .header_app_mypage_inner {
        width: 25.6rem;
    }
    .not_conpleted {
        display: block;
    }
    .not_conpleted_inner {
        width: 100%;
    }
    .not_conpleted_inner p:not(:first-child) {
        text-align: left;
    }
    .not_conpleted_inner p:first-child {
        font-size: 1.8rem;
    }
    .not_conpleted_inner div:first-of-type {
        font-size: 1.5rem;
        width: 100%;
        max-width: 28.5rem;
    }
    .question {
        margin-bottom: 2rem;
    }
    .center_btn_red {
        max-width: 28.5rem;
        margin: 4rem auto 3rem auto;
    }
    .topics_wrap .seco_ttl_left {
        margin-bottom: 2.2rem;
    }
    .block-articles-list__date {
        font-size: 1.4rem;
    }
    .block-articles-list__title {
        margin-top: 0.5rem;
    }
    .block-articles-list-item {
        margin-bottom: 2.2rem;
    }
    .block-articles-list-item a {
        padding-bottom: 2.2rem;
    }
    .center_btn_blue {
        margin: 4rem auto 5rem auto;
    }
    .procedure_wrapper {
        padding-bottom: 4rem;
    }
    .procedure_wrap {
        padding-top: 3.5rem;
    }
    .procedure_btn {
        width: 100%;
        margin-right: 0;
    }
    .procedure_btn:not(:first-child) {
        margin-top: 1rem;
    }
    .procedure_item_wrap {
        display: block;
        padding-bottom: 3rem;
    }
    .procedure_item {
        width: 100%;
        margin-top: 2.5rem;
    }
    .procedure_item:not(:first-child) {
        margin-top: 2rem;
    }
    .procedure_item_title {
        padding-left: 2rem;
    }
    .procedure_item_contents {
        display: block;
        padding-bottom: 0;
        min-height: 0;
    }
    .procedure_item_contents > ul,
    .procedure_item_contents_inner {
        width: 100%;
    }
    .procedure_item_btn {
        border-left: none;
        border-top: 1px dotted #d9d9d9;
        width: 100%;
        min-height: 43px;
        line-height: 43px;
        padding-right: 0;
        margin-top: 1rem;
    }
    .procedure_item_btn::after {
        content: none;
    }
    .procedure_item_btn a span {
        position: relative;
        padding-right: 1rem;
    }
    .procedure_item_btn a span::after {
        position: absolute;
        content: "";
        background: url(../img/right_arrow_blue.png) no-repeat;
        background-size: contain;
        display: inline-block;
        width: 1rem;
        height: 1.5rem;
        right: -1rem;
        bottom: 8%;
    }
    .procedure_item_bottom {
        padding: 1.5rem 2rem;
    }
    .type {
        font-size: 1.4rem;
    }
}
@media screen and (max-width: 350px) {
    .not_conpleted_inner:nth-child(2) div:first-of-type {
        font-size: 1.2rem;
    }
    .main_ttl_mypage span {
        margin-left: 0;
    }
    .procedure_item_title {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        font-size: 1.6rem;
    }
}

/* mypage end */

/* terms */
.thir_ttl_text_list {
    padding-bottom: 7.8rem;
}
.terms_wrap {
    padding-bottom: 5rem;
}
.blue_num {
    list-style: none;
    counter-reset: li;
    padding-left: 0;
}
.blue_num > li {
    font-size: 1.5rem;
    position: relative;
    padding-left: 2rem;
    margin-bottom: 1rem;
}
.blue_num > li::before {
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #1069c4;
    counter-increment: li;
    content: counter(li) ".";
}
.brackets_num {
    list-style-type: none;
    /* counter-reset: cnt; */
    padding-left: 0;
}
.brackets_num li,
.blue_num .bg_blue li {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    padding-left: 2em;
    text-indent: -2em;
}
/* .brackets_num > li::before {
    counter-increment: cnt;
    content: "（" counter(cnt) ")";
} */
.list_style_none li {
    list-style-type: none;
    padding-left: 3.5rem;
}
.brackets_num ul li:last-child {
    margin-bottom: 0;
}
.terms {
    table-layout: auto;
    width: 100%;
    margin-bottom: 1.5rem;
}
.terms th,
.terms td {
    padding: 1.5rem 2rem;
}
.terms th {
    width: 25.3%;
}
.terms td {
    text-align: left;
}
.right-txt {
    font-size: 1.5rem;
    text-align: right;
}
@media screen and (max-width: 883px) {
    .thir_ttl_text_list {
        padding-bottom: 5.5rem;
    }
    .terms_wrap {
        padding-bottom: 4rem;
    }
    .terms_wrap li {
        font-size: 1.4rem;
    }
    .terms {
        font-size: 1.4rem;
    }
    .terms th {
        width: 27.5%;
    }
    .terms th,
    .terms td {
        padding: 1.5rem;
    }
    .right-txt {
        font-size: 1.4rem;
    }
}
/* terms end */

/* topics-list */
.topics_first {
    padding-top: 3rem;
    margin-top: 5rem;
    border-top: 1px dotted #d9d9d9;
}
.pagination {
    list-style: none;
    text-align: center;
    padding: 0;
    margin-bottom: 7rem;
}
.pagination li {
    display: inline-block;
    background-color: #eff1f1;
    margin: 0 0.5rem;
    border-radius: 2px;
}
.pagination li a {
    display: block;
    padding: 0.9rem 1.4rem;
}
.pagination li.pager_on a {
    background-color: #0e69c4;
    color: #fff;
    cursor: auto;
    border-radius: 2px;
}
.topics_last {
    margin-bottom: 4.5rem;
}
@media screen and (max-width: 883px) {
    .topics_first {
        margin-top: 4rem;
        padding-top: 2.2rem;
    }
    .topics_last {
        margin-bottom: 4rem;
    }
    .pagination {
        margin-bottom: 6rem;
    }
}
/* topics-list end */

/* topics */
.topics_detail_header {
    border-bottom: 1.5px solid rgba(217, 217, 217, 0.5);
    padding: 4rem 0 3rem 0;
    margin-bottom: 3.5rem;
}
.topics_detail_header h2 {
    font-size: 3rem;
    margin-bottom: 0;
}
.topics_detail_text {
    margin-bottom: 7.5rem;
}
.topics_detail_text p {
    padding-bottom: 1rem;
    font-size: 1.7rem;
}
.topics_detail_text_photo1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-flow: row-reverse;
    flex-flow: row-reverse;
    margin-bottom: 5rem;
}
.topics_detail_text_photo1 p {
    width: 68.5%;
}
.detail_photo1_img {
    margin-left: 3rem;
    width: 31.5%;
}
.detail_photo2_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 4rem;
}
.detail_photo2_img {
    width: 31.5%;
}
.detail_photo2_img:first-child {
    margin-right: 3rem;
}
.qr_p {
    margin: 2.5rem 0;
}
.qr_text {
    font-size: 1.5rem;
}
.bg_blue_qr {
    max-width: 14rem;
    margin-top: 1rem;
}
.otoiawase_sample_p {
    margin-top: 2.5rem;
    margin-bottom: -1.5rem;
}
.oversea_p {
    margin-top: 2rem;
}
@media screen and (max-width: 883px) {
    .topics_detail_header {
        padding: 3.5rem 0 2.5rem 0;
        margin-bottom: 3rem;
    }
    .topics_detail_header h2 {
        font-size: 2.2rem;
    }
    .topics_detail_text {
        margin-bottom: 4.5rem;
    }
    .topics_detail_text p {
        font-size: 1.6rem;
    }
    .topics_detail_text_photo1 {
        display: block;
        margin-bottom: 4.5rem;
    }
    .detail_photo1_img,
    .topics_detail_text_photo1 p {
        width: 100%;
    }
    .detail_photo1_img {
        margin: 0 0 1.5rem 0;
    }
    .detail_photo2_wrap {
        display: block;
        margin-top: 2.5rem;
    }
    .detail_photo2_img {
        width: 100%;
    }
    .detail_photo2_img:first-child {
        margin: 0 0 2rem 0;
    }
    .detail_btn_more {
        margin: 3rem auto 6rem auto;
    }
    .qr_p {
        margin: 2.5rem 0;
    }
    .qr_p p,
    .qr_text {
        font-size: 1.4rem;
    }
}
/* topics end */

/* top */
.mv_wrap {
    max-width: 1250px;
    margin: auto;
}
.mv {
    width: 100%;
    height: 0;
    padding-top: 36%;
    background: url(../img/mv-pc.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    position: relative;
}
.is-button-fixed-1 .side-btn {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}
.is-button-fixed-1 .side-btn-nyukai {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}
.side-btn {
    width: 5.5rem;
    display: block;
    position: fixed;
    right: 0;
    top: 355px;
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    z-index: 10;
}
.side-btn-nyukai {
    width: 5.5rem;
    display: block;
    position: fixed;
    right: 0;
    top: 170px;
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    z-index: 10;
}
.important_notices {
    padding: 1.5rem;
    background-color: #fff1f1;
    border: 3px solid #e6201a;
    margin-top: 2.5rem;
}
.important_notices_type {
    color: #fff;
    background-color: #e6201a;
    font-size: 1.3rem;
}
.important_notices_date {
    font-size: 1.3rem;
}
.important_notices_text {
    font-size: 1.3rem;
    padding-top: 0.5rem;
}
.top_lead {
    margin: 4rem 0 4rem 0;
}
.top_lead_blue_ttl {
    font-size: 2.6rem;
    color: #1069c4;
    text-align: center;
}
.top_read_text {
    font-size: 1.7rem;
    margin: 4rem 0 2rem 0;
}
.top_read_text_bd {
    width: 100%;
    position: relative;
    border: solid 8px #bee6f9;
    padding: 1.5rem;
}
.howToBtnLink {
    display: block;
    width: 320px;
    height: 48px;
    border-radius: 24px;
    background-color: #7DCDF4;
    color: #fff;
    font-weight: 700;
    font-size: 1.7rem;
    text-align: center;
    line-height: 3;
    margin-bottom: 1.5rem;
    position: relative;
}
.howToBtnLink::after {
    content: "";
    width: 10px;
    height: 10px;
    border-right: 2px solid #FFF;
    border-top: 2px solid #FFF;
    display: inline-block;
    transform: rotate(45deg);
    display: inline-block;
    position: absolute;
    top: 42%;
    bottom: 50%;
    right: 20px;
}
.howToBtnLink:hover {
    --bg-opacity: 1;
    background-color: rgba(154,209,236,var(--bg-opacity));
}
/* .linkArrow {
    font-size: 15px;
    display: inline-block;
    position: relative;
    padding-left: 14px;
    text-indent: -14px;
    line-height: 1.3;
    text-decoration: underline;
    margin-top: 10px;
    margin-bottom: 10px;
}
.linkArrow:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 8px;
    height: 16px;
    background-image: url(/common_2019/img/arrow/arrow_blue_r.svg);
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0 5px 0 0;
} */
.top_read_text2 {
    font-size: 1.5rem;
    margin: 1rem 0 1.5rem 0;
}
@media screen and (max-width: 883px) {
    header {
        z-index: 300;
    }
    .mv {
        background: url(../img/mv-sp.jpg);
        width: 100%;
        height: 0;
        padding-top: 93.47%;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        position: relative;
    }
    .important_notices {
        margin-top: 1.5rem;
    }
    .is-button-fixed-1 .side-btn {
        display: none;
    }
    .is-button-fixed-1 .side-btn-nyukai {
        display: none;
    }
    .is-button-fixed-1 .sp-bottom-btn {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    .is-button-fixed-1 .sp-bottom-btn-nyukai {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    .sp-bottom-btn {
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
        text-align: center;
        position: fixed;
        bottom: 0;
        width: 100%;
        z-index: 301;
        transition: 0.3s;
    }
    .sp-bottom-btn a {
        font-size: 1.5rem;
        color: #fff;
        padding: 2rem 0;
        background-color: #81d5fa;
        display: block;
    }
    .sp-bottom-btn span {
        position: relative;
        padding-left: 3rem;
    }
    .sp-bottom-btn span::before {
        position: absolute;
        content: "";
        background: url(../img/sp-bottm-btn.png) no-repeat;
        background-size: contain;
        display: inline-block;
        width: 2.5rem;
        height: 2.6rem;
        left: 0;
    }
    .sp-bottom-btn-nyukai {
        -webkit-transform: translateY(200%);
        -ms-transform: translateY(200%);
        transform: translateY(200%);
        text-align: center;
        position: fixed;
        bottom: 65px;
        width: 100%;
        z-index: 301;
        transition: 0.3s;
    }
    .sp-bottom-btn-nyukai a {
        font-size: 1.5rem;
        color: #fff;
        padding: 2rem 0;
        background-color: #faaf18;
        display: block;
    }
    .sp-bottom-btn-nyukai span {
        position: relative;
        padding-left: 3rem;
    }
    .sp-bottom-btn-nyukai span::before {
        position: absolute;
        content: "";
        background: url(../img/sp-bottm-btn.png) no-repeat;
        background-size: contain;
        display: inline-block;
        width: 2.5rem;
        height: 2.6rem;
        left: 0;
    }
    .top_lead {
        margin: 2.5rem 0 4.5rem 0;
    }
    .top_lead_blue_ttl {
        font-size: 2rem;
    }
    .howToBtnLink {
        margin: 2vh auto 0;
    }
    .top_read_text {
        padding: 0;
        font-size: 1.7rem;
    }
}
/* top end */

/* d-1 */
.tomonokai {
    margin: 1rem 0 0.5rem 0;
}
.navidial {
    font-size: 2rem;
}
.navidial span {
    font-size: 1.5rem;
}
.bold {
    font-weight: bold;
}
.margin_no li {
    margin: 0;
}
/* d-1end */

/* m-1 */
.lead_anno {
    padding-bottom: 5.5rem;
}
.lead_anno p {
    margin-bottom: 1rem;
}
.lead_anno .annotation_bk {
    font-size: 1.5rem;
}
@media screen and (max-width: 883px) {
    .lead_anno .annotation_bk {
        font-size: 1.4rem;
    }
}
/* m-1 end */

/* ここから headerのトグルボタン（btn-group）の新規追加したcss */
.btn-group {
    display: flex;
    align-items: center;
}
.toggle-btn-wrap {
    border-radius: 2.15rem;
    border: 0.3rem solid #f3f3f3;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.45rem;
    min-width: 28.6rem;
    height: 4.9rem;
    box-sizing: border-box;
    text-align: center;
    margin: 0 2rem 0 0;
}
.sp-toggle-btn-wrap {
    display: none;
}
.sp-white-learning {
    display: none;
}
.sp-blue-learning {
    display: none;
}
.logoarea-group {
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
}
.white-learning {
    width: 13.05rem;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.6428571428;
    color: #1e1e1e;
    padding: 0.6rem 1.625rem;
    box-sizing: border-box;
}
.blue-learning {
    width: 13.05rem;
    font-size: 1.4rem;
    line-height: 1.6428571428;
    color: #fff;
    border-radius: 1.75rem;
    background-color: #81d5fa;
    padding: 0.6rem 1.625rem;
    box-sizing: border-box;
}
@media screen and (max-width: 883px) {
    .btn-group {
        display: none;
    }
    .toggle-btn-wrap {
        display: none;
    }
    .sp-toggle-btn-wrap {
        border-radius: 2.15rem;
        border: 0.3rem solid #f3f3f3;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.4rem 0.45rem;
        width: 100%;
        height: 4.9rem;
        box-sizing: border-box;
        text-align: center;
        margin: 1rem 2rem 0 0;
    }
    .sp-white-learning {
        width: 16.3rem;
        max-width: 100%;
        font-size: 1.4rem;
        font-weight: bold;
        line-height: 1.6428571428;
        color: #1e1e1e;
        padding: 0.6rem 1.625rem;
        box-sizing: border-box;
        display: block;
    }
    .sp-blue-learning {
        width: 16.3rem;
        max-width: 100%;
        font-size: 1.4rem;
        line-height: 1.6428571428;
        color: #fff;
        border-radius: 1.75rem;
        background-color: #81d5fa;
        padding: 0.6rem 1.625rem;
        box-sizing: border-box;
        display: block;
    }
}
/* ここまで headerのトグルボタン（btn-group）の新規追加したcss */

/* 学習ステータス START*/

.study-status {
    font-size: 1.4rem;
    margin: auto;
    border-collapse: collapse;
}
.study-status th {
    padding: 5px;
    text-align: center;
    background-color: #dcf4ff;
    color: #000000;
}
.study-status td {
    padding: 5px;
    text-align: center;
    background-color: #FFFFFB;
}
.study-status-current {
    color: #1069C4;
    font-weight:  bold;
}
@media (min-width: 481px) {
    .study-status-pc{
        display: none;
    }
}
@media (max-width: 480px) {
    .study-status-sp{
        display: none;
    }
}
/* 学習ステータス END */
