@charset 'utf-8';

/* comments
------------------------------------------------ */
.comments--box{ max-width: 765px; margin-bottom: 60px; padding: 20px 19px; border:1px solid #EC92B5; border-radius: 5px; background-color: #F9F9F9; }
#comments{ padding-top: 55px; }
.comments-title{ margin-bottom: 20px; display: flex; flex-wrap: wrap; align-items: center; }
.comment-reply-title{ padding: 4px 0; width: 180px; font-size: 1.5rem; font-weight: 400; background-color: #EC92B5; color:#fff; text-align: center; font-family: 'Hanuman', serif; box-shadow: 0 3px 3px rgba(0,0,0,0.1); }
.comments-title i{ margin-left: 20px; padding-left: 32px; font-size: 1.8rem; font-weight: 400; font-family: 'Noto Sans', sans-serif; color:#777777; font-style: normal; background:url(../../img/share/cmn.png) no-repeat 0 center / contain; }
#respond .comment-reply-title{ margin-bottom: 10px; }

.comment--user-row{ display: flex; flex-wrap: wrap; align-items: flex-start; font-size: 1.5rem; color:#777777; }
.comment--content-data{ margin-top: 6px; padding-left: 15px; font-size: 1.4rem; line-height: calc(30 / 14); color:#000; font-weight: 400; }
.comment--content-data p { font-size: 1.4rem; line-height: calc(30 / 14); color:#000; font-weight: 400; }
.comment-author .says{ color:#121212; }
.comment-edit-link{ color:#e84383; font-size: 1.2rem; }
.commentmetadata .data-txt{ color:#777; font-family: 'Noto Sans', sans-serif; }
.comments--box .reply{  }
.comment-reply-link{ font-weight: bold; font-style: italic; color:#0f5fad; font-size: 1.4rem; font-family: 'Hanuman', serif; text-decoration: underline; }
.comment-list .children{ padding-left: 15px; }
.comment-list >li+li{  margin-top: 20px; }

.comment-respond{ max-width: 700px; }
.comment-respond label{ font-size: 1.6rem; color:#777; }
.comment-respond .input-form{ padding: 5px 10px; width: 100%; font-size: 1.2rem; border-radius: 0; border:1px solid #CACAC8; outline: none; color:#121212; }
.comment-respond  textarea{ height: 66px; padding: 5px 10px; width: 100%; font-family: 'Siemreap','Poppins', sans-serif; font-size: 1.2rem; font-weight: 400; color:#121212; outline: none; border-radius: 0; border:1px solid #CACAC8; resize: none; }
.comment-form-author{ margin-bottom: 10px; }
.comment-form-email{ margin-bottom: 10px; }

.form-submit{ margin-top: 20px; }
#comment-submit{ transition: .2s ease; padding: 0.4em; width: 150px; display: block; border:0; border-radius: 2px; color:#fff; font-size: 1.8rem; font-family: 'Hanuman', serif; font-weight: 400; background-color: #0f5fad; border:2px solid #0f5fad; cursor: pointer; }
#comment-submit:hover{ background-color: #fff; color:#0f5fad; }

.logged-in-as{ margin-bottom: 10px; }

@media only screen and (min-width: 768px) {
    
}
@media only screen and (max-width: 1024px) and (min-width: 768px) {
}

@media only screen and (max-width: 767px) {
    .comments--box{ padding-bottom: 15px; }
    .comments-title{ justify-content: space-between; }	
    .comment-reply-title{ width: 160px; padding: 5px 0 1px; }
    .comments-title i{ padding-left: 30px; font-size: 1.5rem; margin: 0; }
    .comment--user-row{ font-size: 1.6rem; }
    .comment-author .says,
    .comment-author .says a{ color:#0F5FAD; }
    .comment--content-data{ padding-left: 0; margin: 0; }
    .comment-list .children{ padding-left: 10px; }
    .comment-list >li+li{  margin-top: 15px; }
    .comment-edit-link{ font-size: 1.2rem; }
    .comment--content-data p{ line-height: normal; }
    .comment-respond label{ font-size: 1.4rem; }
    .form-submit{ margin-top: 10px; }
    #comment-submit{ width: 100%; }
}