._idx { background: url("../img/character/body_bg001.png") no-repeat center top; }
@media screen and (max-width: 960px) { ._idx { background-image: url("../img/character/sp/body_bg001.png"); background-size: 100% auto; } }

.character-in { position: relative; }

.character-main { position: relative; height: 618px; padding: 110px 0 40px; }
@media screen and (max-width: 1200px) { .character-main { display: flex; padding-left: 16.6666666667%; } }
@media screen and (max-width: 960px) { .character-main { display: block; height: initial; padding: 35.2941176471% 0 60px; } }
.character-main .character-faq { z-index: 999; position: absolute; top: 0; right: 0; width: 100%; max-width: 330px; margin-top: 30px; }
@media screen and (max-width: 1200px) { .character-main .character-faq { position: static; margin-top: -6.6666666667%; } }
@media screen and (max-width: 960px) { .character-main .character-faq { max-width: 100%; margin: 0 0 40px; } }
.character-main .character-faq .character-faq-box { position: relative; border: 2px solid #004ba3; background-color: #fff; border-radius: 2em; }
.character-main .character-faq .character-faq-box._tab { display: none; }
@media screen and (max-width: 960px) { .character-main .character-faq .character-faq-box._tab { display: block; } }
.character-main .character-faq .character-faq-close { display: none; position: absolute; top: 0; right: 0; width: 29px; margin-top: -15px; margin-right: -10px; cursor: pointer; }
.character-main .character-faq .character-faq-heading { display: flex; align-items: center; padding: 10px 15px; cursor: pointer; }
.character-main .character-faq .character-faq-heading .ico { width: 2em; margin-right: 0.5em; }
.character-main .character-faq .character-faq-heading span { font-weight: 400; }
.character-main .character-faq .character-faq-list { display: none; padding: 10px 10px 20px; }
@media screen and (max-width: 960px) { .character-main .character-faq .character-faq-list { display: block; } }
.character-main .character-faq .character-faq-list .character-faq-list-con { max-height: 440px; margin-bottom: 1rem; padding-right: 10px; overflow-y: auto; }
@media screen and (max-width: 960px) { .character-main .character-faq .character-faq-list .character-faq-list-con { max-height: 60vh; } }
.character-main .character-faq .character-faq-list .character-faq-list-con::-webkit-scrollbar { width: 2px; }
.character-main .character-faq .character-faq-list .character-faq-list-con::-webkit-scrollbar-track { background-color: #fff; }
.character-main .character-faq .character-faq-list .character-faq-list-con::-webkit-scrollbar-thumb { background-color: #004ba3; }
.character-main .character-faq .character-faq-list ul li { margin-bottom: 10px; padding: 10px 15px; background: #e5f2fc url("../img/common/ico_arrow02_r.svg") no-repeat right 8px center; background-size: 6px auto; cursor: pointer; }
.character-main .character-faq .character-faq-list ul li:last-child { margin-bottom: 0; }
.character-main .character-faq .character-faq-list ul li:hover { background-color: #bdd4f7; }
.character-main .character-faq .character-faq-list .character-faq-arrow { width: 65px; height: 15px; margin: 0 auto; transform: scale(1, -1); cursor: pointer; }
@media screen and (max-width: 960px) { .character-main .character-faq .character-faq-list .character-faq-arrow { display: none; } }
@media screen and (max-width: 960px) { .character-main .character-faq .character-faq-modal { display: none; position: fixed; top: 0; left: 0; z-index: 99999; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.58); }
  .character-main .character-faq .character-faq-modal .character-faq-modal-in { position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 4.6666666667%; }
  .character-main .character-faq .character-faq-modal .character-faq-modal-con { margin: auto; padding-bottom: 8.8235294118%; } }
.character-main .character-faq .character-faq-modal .character-faq-modal-close { display: none; width: 5.8823529412%; margin: 0 2.9411764706% 2.9411764706% auto; cursor: pointer; }
@media screen and (max-width: 960px) { .character-main .character-faq .character-faq-modal .character-faq-modal-close { display: block; } }
.character-main .character-faq.active .character-faq-close { display: block; }
@media screen and (max-width: 960px) { .character-main .character-faq.active .character-faq-modal { display: block; } }
.character-main .character-con { position: relative; width: 100%; max-width: 400px; margin: 0 auto; }
@media screen and (max-width: 1200px) { .character-main .character-con { flex: 1; } }
@media screen and (max-width: 960px) { .character-main .character-con { max-width: initial; margin-bottom: 5.8823529412%; padding-top: 41.9117647059%; } }
.character-main .character-box { position: relative; width: 100%; padding: 40px 0; border: 3px solid #004ba3; background-color: #fff; font-size: 2.0rem; border-radius: 1em; }
.character-main .character-box::before { content: ''; position: absolute; left: -28px; bottom: -5px; display: block; width: 41px; height: 20px; background: url("../img/character/ico_fhukidashi.png") no-repeat right top; background-size: contain; }
@media screen and (max-width: 960px) { .character-main .character-box::before { left: initial; bottom: initial; top: -25px; right: 4rem; width: 39px; height: 25px; background-image: url("../img/character/sp/ico_fhukidashi.png"); background-position: left bottom; } }
.character-main .character-talk { width: 90%; max-height: 390px; margin: 0 auto; padding-right: 10px; overflow-y: auto; }
@media screen and (max-width: 960px) { .character-main .character-talk { min-height: 3.5em; } }
.character-main .character-talk::-webkit-scrollbar { width: 2px; }
.character-main .character-talk::-webkit-scrollbar-track { background-color: #fff; }
.character-main .character-talk::-webkit-scrollbar-thumb { background-color: #004ba3; }
.character-main .character-icon { position: absolute; top: 0; left: 0; transition: all 1s; }
@media screen and (max-width: 960px) { .character-main .character-icon { left: 50%; } }
.character-main .character-icon._hide { opacity: 0; }
.character-main .character-icon._icon01 { width: 86.25%; margin-top: 21.25%; margin-left: -78.75%; }
@media screen and (max-width: 1200px) { .character-main .character-icon._icon01 { width: 71.25%; margin-top: 36.25%; margin-left: -63.75%; } }
@media screen and (max-width: 960px) { .character-main .character-icon._icon01 { width: 345px; margin-top: 0; margin-left: -172px; } }
@media screen and (max-width: 750px) { .character-main .character-icon._icon01 { width: 46%; margin-left: -22.9333333333%; } }
.character-main .character-icon._icon02 { width: 67%; margin-top: 21.25%; margin-left: -66.25%; }
@media screen and (max-width: 1200px) { .character-main .character-icon._icon02 { width: 52%; margin-top: 36.25%; margin-left: -51.25%; } }
@media screen and (max-width: 960px) { .character-main .character-icon._icon02 { width: 268px; margin-top: 0; margin-left: -134px; } }
@media screen and (max-width: 750px) { .character-main .character-icon._icon02 { width: 35.7333333333%; margin-left: -17.8666666667%; } }

@media screen and (max-width: 750px) { .js-charaopen .header { z-index: initial; } }

/*# sourceMappingURL=character.css.map */