/***************************
 * メニュー消し
 **************************/
aside.dc-col.dc-layout-basic-2col__aside, 
.breadcrumbs, 
.dc-header, 
.dc-footer-anasuta, 
.dc-app-download, 
.dc-footer--nav {
    display: none!important;
}
/***************************
 * 全体ここから
 **************************/
.type-flowchart {
    margin: auto;
    padding: 0 0 5rem;
    max-width: 980px;
}
.type-flowchart p {
    font-size: 1.3rem;
    letter-spacing: 2px;
    line-height: 2;
    text-align: center;
    word-break: break-all;
}
.type-flowchart img {
    height: auto;
    width: 100%;
}
.type-flowchart ul {
    margin: 0;
    padding: 0;
}
.type-flowchart ul li {
    list-style: none;
}
.type-flowchart h3 {
    font-size: 1.5rem;
    margin: 3rem auto;
    text-align: center;
}
/***************************
 * ボタン
 **************************/
.type-flowchart .blk-button {
    background: #000;
    color: #fff;
    display: block;
    font-size: 1.5rem;
    line-height: 2;
    margin: 2rem auto;
    padding: 10px 0;
    text-align: center;
    width: 40%;
}
/*11/29追加　アテンション文言*/
.add.atn-txt {
    display: block;
    font-size: .9rem;
    margin-top: -10px;
    text-align: center;
}

/***************************
 * 1ページ目ここから
 **************************/
/***************************
 * 円の部分
 **************************/
.type-flowchart .circle {
    height: 200px;
    position: relative;
    width: 100%;
}
.type-flowchart .circle.circle1, 
.type-flowchart .circle.circle2 {
    align-items: center;
    border-radius: 50%;
    color: #fff;
    display: flex;
    font-size: 1.3rem;
    height: 200px;
    justify-content: center;
    mix-blend-mode: screen;
    position: absolute;
    width: 200px;
}
.type-flowchart .circle.circle1 {
    background: #f5b525;
    left: calc(50% - 15px);
}
.type-flowchart .circle.circle2 {
    background: #457fbb;
    right: calc(50% - 15px);
}
/***************************
 * フロー
 **************************/
.type-flowchart .circle-step {
    align-items: center;
    display: flex;
    justify-content: space-evenly;
    margin-bottom: 4rem;
    width: 100%;
}
.type-flowchart .circle-step li {
    align-items: center;
    display: flex;
    flex: 1;
    flex-direction: column;
    position: relative;
}
.type-flowchart .circle-step li h4 {
    margin: 0 auto 1.2rem;
}
.type-flowchart .circle-step li p {
    background: #fff;
    border: solid 1px;
    border-radius: 100px;
    color: #000;
    height: 180px;
    line-height: 180px;
    text-align: center;
    width: 180px;
}
.type-flowchart .circle-step li:nth-child(2)::before, 
.type-flowchart .circle-step li:nth-child(2)::after {
    content: "▶";
    font-size: 2rem;
    position: absolute;
    top: 50%;
}
.type-flowchart .circle-step li:nth-child(2)::before {
    left: -10px;
    
}
.type-flowchart .circle-step li:nth-child(2)::after {
    right: -10px;
}


/***************************
 * 2ページ目ここから
 **************************/
.type-flowchart h2 {
    text-align: center;
    font-size: 2rem;
}
.type-flowchart .camera-attention p {
    text-align: justify;
}
.type-flowchart .camera-attention li:nth-child(3) p {
    border: 1px solid #ccc; 
    max-height: 100px;
    overflow-y: scroll;
    padding: 5px; 
}
/* Firefoxのスクロールバーを隠す */
.type-flowchart .camera-attention li:nth-child(3) p {
    scrollbar-width: none;
    -ms-overflow-style: none;  /* IE と Edge でのスクロールバーを隠す */
}
.type-flowchart .camera-attention li:nth-child(3) p::-webkit-scrollbar {
    display: none;
}
.type-flowchart .form {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: 15px 0 0;
}
.type-flowchart .form label {
    font-size: 1.3rem;
}
.type-flowchart .blk-button.next-before {
    background: #ddd;
}



/***************************
 * 3ページ目ここから
 **************************/
.type-flowchart .subtxt {
    display: block;
    text-align: right;
}



/***************************
 * 6ページ目ここから
 **************************/
.type-flowchart .question {
    margin-bottom: 4rem;
}
.type-flowchart .question span {
    display: block;
}
.type-flowchart .question h4 {
    background: #ddd;
    padding: 10px 2rem;
    width: fit-content;
}
.type-flowchart .question span, 
.type-flowchart .question h4 {
    font-size: 1.3rem;
    margin: 0 auto 2rem;
    text-align: center;
}



/************************************************
 * iPad
 ***********************************************/
@media screen and (max-width: 1024px) {
    .type-flowchart {
        width: 750px;
    }
}



/************************************************
 * スマホここから
 ***********************************************/
@media screen and (max-width: 600px) {
    .type-flowchart h3 {
        font-size: 1.25rem;
        margin: 1.5rem auto;
    }
    .type-flowchart p {
        font-size: 1rem;
        letter-spacing: 2px;
        line-height: 2;
    }
    .type-flowchart .blk-button {
        font-size: 1rem;
    }
    /***************************
     * 1ページ目ここから
     **************************/
    .type-flowchart {
        width: 100%;
    }
    .type-flowchart .circle.circle1, 
    .type-flowchart .circle.circle2 {
        font-size: 1rem;
        height: 135px;
        width: 135px;
    }
    .type-flowchart .circle.circle1 {
        left: calc(40% + 30px);
    }
    .type-flowchart .circle.circle2 {
        right: calc(40% + 30px);
    }
    .type-flowchart .circle-step li p {
        font-size: .8rem;
        font-weight: bold;
        height: 100px;
        line-height: 100px;
        width: 100px;
    }
    .type-flowchart .circle-step li:nth-child(2)::before, 
    .type-flowchart .circle-step li:nth-child(2)::after {
        font-size: 1rem;
        top: 57%;
    }

    /***************************
     * 2ページ目ここから
     **************************/
    .type-flowchart .camera-attention p {
        font-size: .9rem;
        margin: auto;
        width: 90%;
    }
    .type-flowchart .form label {
        font-size: 1rem;
        padding-left: 10px;
    }

    /***************************
     * 6ページ目ここから
     **************************/
    .type-flowchart .question span, 
    .type-flowchart .question h4 {
        font-size: 1rem;
    }



}