.font-num { font-family: 'Lato', sans-serif; }

.font-maru { font-family: 'Zen Maru Gothic', sans-serif; }

.font-nsj { font-family: 'Noto Sans JP', sans-serif; }

.mypage-nav { position: fixed; top: 0; left: 0; width: 220px; height: 100%; background-color: #39ab93; }
@media screen and (max-width: 960px) { .mypage-nav { position: static; width: 100%; height: initial; background-color: transparent; } }

@media screen and (max-width: 960px) { .mypage-header { display: flex; align-items: center; justify-content: space-between; height: 80px; padding-left: 30px; border-bottom: 1px solid #39ab93; } }
.mypage-header .mypage-logo { margin: 0 0.5em; padding: 0.5em 1em; border-bottom-left-radius: 0.5em; border-bottom-right-radius: 0.5em; background-color: #fff; }
@media screen and (max-width: 960px) { .mypage-header .mypage-logo { width: 12em; margin: 0; padding: 0; } }
@media screen and (max-width: 750px) { .mypage-header .mypage-logo { width: 10em; } }
.mypage-header .header-menu { display: none; }
@media screen and (max-width: 960px) { .mypage-header .header-menu { display: flex; border: none; background-color: #39ab93; } }

.mypage-menu { margin-top: 1em; }
@media screen and (max-width: 960px) { .mypage-menu { display: none; position: fixed; top: 80px; left: 0; z-index: 9999; width: 100%; margin-top: 0; padding-bottom: 1em; background-color: #39ab93; } }
.mypage-menu ul { border-top: 1px solid rgba(255, 255, 255, 0.5); }
.mypage-menu ul li { border-bottom: 1px solid rgba(255, 255, 255, 0.5); }
.mypage-menu ul li a { display: block; color: #fff; padding: 1em; font-size: 0.8888888889rem; text-decoration: none; }
.mypage-menu ul li._current { background-color: #fff; }
.mypage-menu ul li._current a { color: #39ab93; }
.mypage-menu dl { margin-top: 1.5em; font-size: 0.8888888889rem; }
.mypage-menu dl dt { margin-bottom: 0.5em; padding: 0 1em; color: #eeeeee; }
.mypage-menu dl dd a { display: block; padding: 0.5em 1em; color: #eeeeee; text-decoration: none; }
.mypage-menu dl i { margin-right: 0.5em; }

.mypage-main { margin-left: 220px; padding: 30px 30px 60px; line-height: 1.6; }
@media screen and (max-width: 960px) { .mypage-main { margin-left: 0; } }
@media screen and (max-width: 750px) { .mypage-main { padding: 30px 4% 60px; } }
.mypage-main .mypage-main-in { max-width: 1400px; margin: 0 auto; }

.table-form tr th { width: 14em; }
@media screen and (max-width: 960px) { .table-form tr th { width: 100%; } }

.entrylog-item { display: block; position: relative; margin-bottom: 1.5em; padding: 1em; border-radius: 1em; background-color: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); color: #000; text-decoration: none; overflow: hidden; }
.entrylog-item .entrylog-status { position: absolute; top: 0; right: 0; min-width: 6em; padding: 0.5em; color: #fff; text-align: center; }
.entrylog-item .entrylog-status._status-1 { background-color: #72c441; }
.entrylog-item .entrylog-status._status-2 { background-color: #d69547; }
.entrylog-item .entrylog-status._status-3 { background-color: #d64747; }
.entrylog-item .entrylog-status._status-4 { background-color: #4787d6; }
.entrylog-item .entrylog-status._status-9 { background-color: #999; }
.entrylog-item .detail-top { line-height: 1.5; }

.contact-sec { position: absolute; bottom: 0; right: 0; display: flex; flex-direction: column; width: calc(100% - 220px); height: 100%; }
@media screen and (max-width: 960px) { .contact-sec { width: 100%; height: calc(100% - 80px); } }
.contact-sec .contact-timeline { flex: 1; padding: 30px; overflow-y: auto; }
@media screen and (max-width: 750px) { .contact-sec .contact-timeline { padding: 30px 4%; } }
.contact-sec .contact-box { display: flex; justify-content: space-between; margin-bottom: 1em; }
.contact-sec .contact-box .contact-fig { width: 5em; }
@media screen and (max-width: 750px) { .contact-sec .contact-box .contact-fig { width: 3.6em; }
  .contact-sec .contact-box .contact-fig:last-child { display: none; } }
.contact-sec .contact-box .contact-fig figure { position: relative; padding-top: 100%; border-radius: 50%; overflow: hidden; }
.contact-sec .contact-box .contact-fig figure img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.contact-sec .contact-box .contact-fig p { font-size: 0.7777777778rem; text-align: center; }
@media screen and (max-width: 750px) { .contact-sec .contact-box .contact-fig p { font-size: 0.6666666667rem; } }
.contact-sec .contact-box .contact-content { position: relative; flex: 1; margin: 0 1.25em; }
.contact-sec .contact-box .contact-content .contact-content-in { position: relative; z-index: 1; padding: 1em; border-radius: 1em; background-color: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); }
@media screen and (max-width: 750px) { .contact-sec .contact-box .contact-content .contact-content-in { padding: 0.5em 0.75em; } }
.contact-sec .contact-box .contact-content::before, .contact-sec .contact-box .contact-content::after { content: ''; position: absolute; top: 2.5em; width: 1em; height: 1em; transform: rotate(-45deg) skew(20deg, 20deg); }
@media screen and (max-width: 750px) { .contact-sec .contact-box .contact-content::before, .contact-sec .contact-box .contact-content::after { top: 1.8em; } }
.contact-sec .contact-box .contact-content::before { z-index: 2; background-color: #fff; }
.contact-sec .contact-box .contact-content::after { box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); }
.contact-sec .contact-box .contact-content .contact-txt { font-size: 0.8888888889rem; }
@media screen and (max-width: 750px) { .contact-sec .contact-box .contact-content .contact-txt { font-size: 0.7777777778rem; } }
.contact-sec .contact-box .contact-content .contact-time { display: block; color: #999; font-size: 0.7777777778rem; text-align: right; }
@media screen and (max-width: 750px) { .contact-sec .contact-box._admin .contact-fig { display: none; } }
@media screen and (max-width: 750px) { .contact-sec .contact-box._admin .contact-content { margin: 0; } }
.contact-sec .contact-box._admin .contact-content .contact-content-in { background: #fdf1cc; }
.contact-sec .contact-box._admin .contact-content::before, .contact-sec .contact-box._admin .contact-content::after { display: none; }
.contact-sec .contact-box._me { flex-direction: row-reverse; }
.contact-sec .contact-box._me .contact-content::before, .contact-sec .contact-box._me .contact-content::after { right: 0; margin-right: -0.5em; }
@media screen and (max-width: 750px) { .contact-sec .contact-box._me .contact-content { margin-left: 0; } }
.contact-sec .contact-box._you .contact-content .contact-content-in { background: #ebf2f6; }
.contact-sec .contact-box._you .contact-content::before, .contact-sec .contact-box._you .contact-content::after { left: 0; margin-left: -0.5em; }
.contact-sec .contact-box._you .contact-content::before { background: #ebf2f6; }
@media screen and (max-width: 750px) { .contact-sec .contact-box._you .contact-content { margin-right: 0; } }

.contact-footer .contact-message { display: flex; align-items: center; padding: 0.75em 1em 0.5em; }
.contact-footer .contact-message .contact-message-txt { flex: 1; margin-right: 0.5em; }
.contact-footer .contact-message .contact-message-txt textarea { padding: 0.5em; font-size: 16px; }
.contact-footer .contact-message .btn { padding: 0.5em 1em; }
.contact-footer .contact-message .sys-message-btn:disabled { background-color: #999; }
.contact-footer .contact-btns { position: relative; display: flex; padding: 0 1em 0.75em; }
.contact-footer .contact-btns .btn { width: 9em; padding: 0.5em 1em; }
.contact-footer .contact-btns .btn-back { width: 7em; background-color: #999; }
.contact-footer .contact-btns._entry { justify-content: center; }
.contact-footer .contact-btns._entry .btn-back { position: absolute; top: 0; left: 1em; }

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