.message-list{width:30%;padding:0;margin:0;list-style:none;border-right:.1rem solid rgba(0,0,0,.1)}.message-list__item{position:relative;padding:1.5rem 4rem 1.5rem 1.5rem;border-bottom:.1rem solid rgba(0,0,0,.1);background:#fff;-webkit-transition:background .2s;transition:background .2s}.message-list__item__date{font-size:12px;color:#9e9e9e}.message-list__item__title{color:#004365}.message-list__item__arrow{position:absolute;right:2rem;top:1.5rem;width:1rem;height:calc(100% - 3rem);background:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 8 14' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.969 7.286a.461.461 0 00-.134-.308L1.594.737a.461.461 0 00-.308-.134.461.461 0 00-.308.134l-.67.67c-.08.08-.134.2-.134.307 0 .107.054.228.134.308l5.263 5.264-5.263 5.263c-.08.08-.134.201-.134.308 0 .12.054.228.134.308l.67.67c.08.08.2.134.308.134a.461.461 0 00.308-.134l6.24-6.241c.081-.08.135-.201.135-.308z' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat;background-size:contain;background-position:50%}.message-list__item.is-unread .message-list__item__title{font-weight:700}.message-list__item:hover{background:#f2f2f2;cursor:pointer}.message-list__item.is-selected,.message-list__item:active{background:rgba(35,126,156,.1)}.message-list__item--final{color:#c2c2c2;padding:1.5rem}.message-box{overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;max-height:100%}.message-box,.message-box__content{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.message-box__content{overflow:auto;width:63rem;padding:3rem 2rem}.message-box ul.message-list{overflow:auto;width:27rem}.message-box>.message-list.fullscreen{width:100%;border:.1rem solid rgba(0,0,0,.1);border-radius:3px}.message-box__content.fullscreen{width:100%;background-color:#fff;padding:0 2rem 2rem}.message-box__content__header{position:sticky;top:0;background:#fff;padding:2rem 2rem 1.5rem 6rem;border-bottom:.1rem solid rgba(0,0,0,.1);margin-bottom:2rem}.message-box__content__back{width:3rem;height:100%;position:absolute;left:1rem;top:0;-webkit-transform:rotate(90deg);transform:rotate(90deg);cursor:pointer}.message-box__content__title{font-size:16px}.message-box__content__date{font-size:12px;color:#c2c2c2}@media screen and (min-width:721px){.message-box>.message-box__content.fullscreen,.message-box>.message-list.fullscreen{display:none}}@media screen and (max-width:720px){.message-box>.message-box__content:not(.fullscreen),.message-box>.message-list:not(.fullscreen){display:none}}.message-list{height:calc(100vh - 33rem)}@media screen and (max-width:720px){.message-box{margin:0 -1.5rem;max-height:calc(100vh - 33rem)}}