/* 顔文字検索ページ(顔文字のタグ検索)のスタイル */


/* ナビリンクの「顔文字検索」を太字にする (PC版のみ) */
@media (min-width: 769px) {
   .nav_item.kaomoji_search {
      font-weight: bold;
   }
}



/* 検索結果 (親要素) */
div.results {
    width: 100%;
    margin-top: 1.5rem;
    height: auto;
}

div.results p.notice {
   color: #666;
   text-align: center;
   font-weight: bold;
}


/* 検索結果の表示リスト */
div.results ul.kaomoji_lists {
}


/* 検索結果の表示リスト */
div.results ul.kaomoji_lists li.kaomoji_list {
   color: #666;
   cursor: pointer;
   display: flex;
   justify-content: space-between;
   align-items: center; /* 垂直に中央揃え */
   padding-top: 10px;
   padding-bottom: 5px;
   padding-left: 10px;
   padding-right: 10px;
   border-left: 3px dashed #ddd;
   border-bottom: 1px solid #aaa;
   margin-top: 1.0rem;
}

/* 検索結果の表示リスト(マウスホバー) */
div.results ul.kaomoji_lists li.kaomoji_list:hover {
   color: #555;
   border-left: 3px solid #555;
   border-bottom: 1px solid white;
   background-color: #ddfcdc;
   background: -webkit-repeating-linear-gradient(-45deg, #eee, #eee 5px, #ffffff 5px, #ffffff 10px);/*ストライプ*/
   background: repeating-linear-gradient(-45deg, #eee, #eee 5px, #ffffff 5px, #ffffff 10px);/*ストライプ*/
   font-weight: bold;
}


/* 顔文字テキスト */
div.results ul.kaomoji_lists li.kaomoji_list .kaomoji_text {
   width: 78%;
}

/* JSアニメーション用クラス (顔文字コピー) */
.copy_text_copying {
   font-size: 15px;
   font-weight: bold;
   padding-left: 0.8rem;
   padding-right: 0.8rem;
   background-color: #555;
   border-radius: 3px;
   align-self: flex-end; /* copy_textだけ下端に揃える */
}


/* 「コピー！」テキスト */
div.results ul.kaomoji_lists li.kaomoji_list .copy_text {
   font-size: 15px;
   align-self: flex-end; /* copy_textだけ下端に揃える */
   background-color: #777;
   border-radius: 3px;
}

/* 「コピー！」テキスト (ホバー時) */
div.results ul.kaomoji_lists li.kaomoji_list .copy_text:hover {
   font-weight: bold;
   background-color: #555;
}

/* 画面サイズに応じてフォントの大きさを変える */
@media (max-width: 1440px) {
   /* JSアニメーション用クラス (顔文字コピー) */
   .copy_text_copying {
      font-size: 14px;
   }

   div.results ul.kaomoji_lists li.kaomoji_list .copy_text {
      font-size: 14px;
   }
}


@media (max-width: 1024px) {
   .copy_text_copying {
      font-size: 13px;
   }

   div.results ul.kaomoji_lists li.kaomoji_list .copy_text {
      font-size: 13px;
   }
}

@media (max-width: 768px) {
   .copy_text_copying {
      font-size: 12px;
   }

   div.results ul.kaomoji_lists li.kaomoji_list .copy_text {
      font-size: 12px;
      padding: 3px;
   }
}