html {
    font-family:
      'Source Sans Pro',
      -apple-system,
      BlinkMacSystemFont,
      'Segoe UI',
      Roboto,
      'Helvetica Neue',
      Arial,
      sans-serif;
    font-size: 16px;
    word-spacing: 1px;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    box-sizing: border-box;
    background-color: #FFFFFF;
}


.custom_ccp_area {
    height: 100%;
    width: 100%;
    background-color: #85C7F2;
}

.customer_info_area {
    width: 69%;
    height: 100%;
    display: inline-block;
    vertical-align: top;
}

.ccp_area {
    width: 30%;
    height: 100%;
    display: inline-block;
    vertical-align: top;
}

.ccp_div {
    height: 33rem;
}

.ccp_div_full {
    height: 37rem;
}
  
.info_div {
    text-align:center;
    background-color: #FFFFFF;
    font-family: 'Meiryo UI','メイリオ', Meiryo,sans-serif;
    font-size: 20px;
    height: 8rem;
}


#customer_furigana{
    font-size: 1rem;
}

.history_area{
    width: 100%;
    height: 27rem;
    vertical-align: top;
    display: inline-block;
}

.history_area #contact_history {
    height: 90%;
    overflow-y: scroll;
    scrollbar-width: none;
}

/* Chrome, Safari 対応 */
#contact_history::-webkit-scrollbar {
    display:none;
}

.history_item {
    background-color: red;
}

.agent_status_area {
    height: 20rem;
    width: 100%;
    vertical-align: top;
    display: inline-block;
}

.own_status_area {
    height: 41%;
    width: 100%;
    vertical-align: top;
    display: inline-block;
}


.agent_status_area #other_agent_status {
    height: 90%;
    width: 100%;
    overflow-y: scroll;
    scrollbar-width: none;
}


/* Chrome, Safari 対応 */
#other_agent_status::-webkit-scrollbar {
    display:none;
}





#agentStatusButton {
    height: 6rem;
    width: 11.31rem;
    font-size: 2rem;
}

#acceptPhoneButton {
    height: 6rem;
    width: 11.31rem;
    font-size: 2rem;
}

#deletePhoneButton {
    height: 6rem;
    width: 11.31rem;
    font-size: 2rem;
}

#agentStatus{
    width: 5rem;
    height: 4rem;
}

.agent_status_tag {
    margin-top: 1rem;
}

.display_none {
    display: none;
}

.agent_status_button_area {
    text-align: center;
}

.call_button_area{
    text-align: center;
}