:root {
    --content: 1400px;
    /* --type-color-A: #f45d2c;
    --type-color-B: #41788c;
    --type-color-C: #58789d;
    --type-color-D: #8f5b49;
    --type-color-E: #5a7751;
    --type-color-F: #8a764c;
    --type-color-G: #487983;
    --type-color-H: #8a4c7b; */
    --type-color-A: #dd7c3d;
    --type-color-B: #f3b200;
    --type-color-C: #67ab43;
    --type-color-D: #3d74bb;
    --type-color-E: #7440aa;
    --type-color-F: #e66ac5;
    --type-color-G: #c72b1d;
    --type-color-H: #bb5f2b;
    --type-base-text: #2f2c2a;
    --type-base-surface: #f7f2ee;
    --type-base-border: #d9cec6;
}

.style-A {
    --type-accent: var(--type-color-A);
}

.style-B {
    --type-accent: var(--type-color-B);
}

.style-C {
    --type-accent: var(--type-color-C);
}

.style-D {
    --type-accent: var(--type-color-D);
}

.style-E {
    --type-accent: var(--type-color-E);
}

.style-F {
    --type-accent: var(--type-color-F);
}

.style-G {
    --type-accent: var(--type-color-G);
}

.style-H {
    --type-accent: var(--type-color-H);
}

.shindan-wrp {
    padding: 0 min(1em, 3vw);
}

.question-img {
    width: 100%;
    display: block;
    max-width: 590px;
    margin: 1em auto;
}

@media screen and (max-width:767px) {
    .question-img {
        margin: 10vw auto 6vw;
    }
}

.section__header .title .logo {
    display: inline-block;
    width: 3.6em;
}

.section__header .title .logo img {
    width: 100%;
    height: auto;
}

.section__header .title .sml {
    display: inline-block;
    padding: 0;
    vertical-align: .5em;
    font-weight: 600;
    letter-spacing: .1em;
}

.type-code-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--type-accent, var(--type-color-A));
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 800;
    line-height: 1;
}

.type-code-badge--small {
    width: 44px;
    height: 44px;
    font-size: 20px;
}

.type-code-badge--medium {
    width: 58px;
    height: 58px;
    font-size: 24px;
}