@charset "UTF-8";
/* CSS Document */

ul.mailtip {
  position: absolute;
  list-style: none;
  background-color: #fcfeff;
  border: 1px solid #97bccc;
  border-radius: 0 0 10px 10px;
  max-width: 600px;
  max-height: 145px; 
  overflow: hidden;
  overflow-y: auto;
  white-space: nowrap;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  z-index: 100;
}
ul.mailtip {
  display: block;
  overflow: hidden;
  overflow-y: auto;
}

@media screen and (max-width:600px) {
	ul.mailtip {
        min-width: 88vw !important;
        width: 88vw !important;
		max-height: 28vw;
        top: 32% !important;
        left: 5% !important;
        overflow: auto !important;
        overflow-x: auto !important;
	}
}
	
ul.mailtip li p {
  font: normal 18px/1.7 'Noto Sans JP', YuGothic, 'Yu Gothic', 'ヒラギノ角ゴシック', 'Hiragino Sans', sans-serif !important;
  text-align: left;
  line-height: 40px;
  cursor: pointer;
  margin: 0 9px;
  overflow: hidden;
  word-wrap: break-word;
  height: 40px;
  white-space: nowrap;
  text-overflow: ellipsis!important;
  max-width:90% !important;
  padding-top: 0;
}
@media screen and (min-width: 601px) and (max-width: 1279px) {
ul.mailtip li p {
  font: normal 2.3vw/1.7 'Noto Sans JP', YuGothic, 'Yu Gothic', 'ヒラギノ角ゴシック', 'Hiragino Sans', sans-serif !important;
  }
}

ul.mailtip li p {
  display: flex;
  max-width: 100%; 
  white-space: nowrap;
  overflow: hidden;
}
ul.mailtip li:last-child {
  border-radius: 0px 0px 10px 10px;
}
ul.mailtip li.active {
  background: #eaeaea;
}
ul.mailtip li.hover {
  background: #e7f6ff;
}

@media screen and (max-width:600px) {
	ul.mailtip li p {
	  text-align: left;
	  cursor: pointer;
	  margin: 0 9px;
	  overflow: hidden;
	  word-wrap: break-word;
	  height: 40px;
	}
	ul.mailtip li:last-child {
	  border-radius: 0px 0px 10px 10px;
	}
	ul.mailtip li.active {
	  background: #eaeaea;
	}
	ul.mailtip li.hover {
	  background: #e7f6ff;
	}
}


.email-name {
	display: inline-block;
	max-width: 60%; 
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	vertical-align: middle;
}
@media screen and (max-width:600px) {
  .email-name {
    max-width: 50%; 
  }
}

  .email-domain {
    display: inline-block;
	white-space: nowrap;
  }