@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/
/* input非表示 */

body{
    margin: 0!important;
    background: #efefef!important;
    padding: 0 15px;
}

#container{
	max-width: 640px;
	margin: 0 auto;
    background: #fff;
}
a:hover{
    background: none!important;
}

.user-post-box h2{line-height: 100%!important;}

.user-post-box{
    border-bottom: dotted 1px #ccc;
    border-radius: 0!important;
}

#wpdcom.wpd-layout-2 .wpd-reply.wpd_comment_level-2{
    margin-bottom: 10px!important;
}

.top-eye-catch{
    padding-left: 35px;
}

.user-post-box{ position:relative; padding-left:56px; }
.lk-left-label{
  position:absolute; left:10px; top:14px;
  min-width:36px; height:22px; line-height:22px;
  text-align:center; font-size:12px; font-weight:700;
  border-radius:6px; background:#111; color:#fff;
}
.lk-left-label-new{ background:#f17c8e; }
.lk-left-label-comments{ background:#666; }

.meta span{font-size: 16px; color: #f17c8e; font-weight: bold;}

.a-wrap{
	 border: none!important;
}

/* 좋아요/싫어요 클릭 이펙트 */
.lk-vote-pop {
  position: absolute;
  font-size: 28px;
  pointer-events: none;
  z-index: 9999;
  animation: lk-vote-pop 0.6s ease-out forwards;
  will-change: transform, opacity;
}

@keyframes lk-vote-pop {
  0% {
    transform: translate(-50%, -50%) scale(0.3);
    opacity: 0;
  }
  30% {
    transform: translate(-50%, -80%) scale(1.4);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -130%) scale(0.8);
    opacity: 0;
  }
}



.wrap{width: 100%;}

body.wp-singular {
  background-color: #fff;
}

body:not(.wp-singular) {
  background-color: #fff;
}

.eye-catch .cat-label{
	display: none;
}
#gc_link_preview_json,
#gc-link-preview{ display:none !important; }


.clearfix:after {
  content: "";
  display: block;
  clear: both;
} 
.clearfix:before {
  content: "";
  display: block;
  clear: both;
} 
.clearfix {
  display: block;
}

.eye-catch-wrap{
	display: block!important;
}

.eye-catch img, .eye-catch amp-img{
	width: 70px!important;
	height: 70px;
	border-radius:70px;
	min-width: auto!important;
object-fit:cover;
  object-position:50% 50%;   
  display:block;             
}

.top-eye-catch img{
	width: 80px!important;
	height: 80px;
	border-radius:10px;
	margin-right: 15px;
	float: left;
object-fit:cover;
  object-position:50% 50%;  
  display:block;            
}

.top-eye-catch h2 a{
	font-size: 16px;
	font-weight: bold;
	color: #f17c8e;;
	display: block;
}

.post-item{
    background: #fff;
    border-radius: 10px;
    padding: 10px;
}



.more{
    display: block;
    width: 60%;
    padding: 7px;
    color: #fff;
    border-radius: 10px;
    background:#fff1f7;
    margin: 5px auto 0;
   background-image: linear-gradient(180deg, rgba(255, 177, 177, 1) 10%, rgba(255, 138, 166, 1));
    text-align: center;

}

.post-item h2{
        font-size: 18px;
        line-height: 140%;
        font-weight: normal;
    }


.meta{
display: flex;
  justify-content: space-between; /* ← 핵심 */
  align-items: center;

  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
}

.meta p{
    margin-right: 5px;
	font-size: 14px!important;
	color: #999;
	margin-bottom: 0!important;
}


/* 동그라미(오픈 버튼)만 안 보이게: DOM은 살아있어야 함 */
#sidebar-menu-open{
  position: fixed;
  left: -9999px;
  top: auto;
}

.wpd-thread-list{
    margin-top: 10px;
}

/* 래퍼(.sidebar-menu-button)나 #sidebar-menu-content를 display:none 하면 안 됨 */

#wpdcom .wpd-thread-head{
	border-bottom:none!important;
}

.sns-share-message,.footer-meta{
    display: none;
}

#wpdcom span{
    font-size: 14px!important;
    font-weight: normal!important;
}

.related-entry-card-thumb{
   float:none;
}

.a-wrap{
    border-bottom: dotted 1px #ddd;
}

.wpd-vote-up{color: #f17c8e;}


#wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info{
    margin-left:0!important;
    margin-top: 0!important;
}


#wpd-bubble-wrapper{bottom: 70px!important;}


.rx3{display:flex;gap:10px;align-items:center;margin:10px 0 0}
.rx3btn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;border:1px solid #ffd0dc;background:#fff;cursor:pointer;line-height:1}
.rx3ico{font-size:16px;color:#ff5c8a}
.rx3n{font-weight:800;color:#ff5c8a}
.rx3no .rx3ico,.rx3no .rx3n{color:#ff8fa8}
.rx3btn:hover{background:#fff3f7}
.rx3.is-love .rx3love{background:#ffe3ec}
.rx3.is-no .rx3no{background:#ffe3ec}
.rx3btn:disabled{opacity:.6;cursor:not-allowed}




.cat-label{
    position: relative;
}

.related-entry-heading{
    margin-bottom: 0;
}

.wpd-comment{border-bottom:solid 1px #ddd;}


.logo-text{
    padding: 0;
}

main.main, div.sidebar{
    padding: 0 10px;
}

.entry-title{
    padding: 0;
}
.related-entry-card-thumb img {
  display: none !important;
}

.wpd-form-head,.wpd_label,.wc_email-wrapper,.wpdf-reacted,.wpdf-hottest,.wc_name-wrapper,.wpd-thread-info ,.wpdtc{
	display: none!important;
}

/* === wpDiscuz：コメント一覧 → フォームを下に（確定） === */
#wpdcom {
  display: flex;
  flex-direction: column;
}

/* コメント一覧（上） */
#wpd-threads.wpd-thread-wrapper {
  order: 1;
}

#wpdcom{margin-top: 0!important;}

.user-post-box{width: auto!important;padding: 8px!important;}

/* コメントフォーム（下） */
.wpd-form-wrap {
  order: 2;
  margin-top: 30px;
}

#wpdcom .wpd-form .wpdiscuz-textarea-wrap{
    padding: 0!important;
}

#wpdcom #wpd-threads{margin:0 !important;}

/* ラベルボタン風 */
.wpuf-radio-block {
  width: 15%;
  box-sizing: border-box;
  padding: 5px 0;
  background-color: #6b91b1; /* 通常色：青 */
  color: #fff;
  border-radius: 6px;
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.3s;
}

/* 選択中のクラス */
.wpuf-radio-block.selected {
  background-color: #ccc; /* 選択時：グレー */
  color: #000;
}

.wpuf-fields{
    display: flex!important;
    flex-wrap: wrap;

}








.fab-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #ff6ca8;
  color: white;
  font-size: 14px;
  font-weight: bold;
  padding: 14px 16px;
  border-radius: 50px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  text-decoration: none;
  z-index: 1000;
  transition: background 0.3s ease;
}

.fab-button:hover {
  background-color: #e05590;
}

.top-post-box{
width:100%;
  height:auto;
    
}

.user-post-box {
    background: #fff;
    border-radius: 15px;
    padding: 15px;
    
}

.user-post-box span.text,.post-item span.text{
    display: none;
}


/* メニュー全体の位置調整（右上固定） */
.sidebar-menu-button {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 9999;
}

/* チェックボックス自体は非表示 */
#sidebar-menu-input {
  display: none;
}

/* ハンバーガーボタンの見た目 */
#sidebar-menu-open {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  background-color: #ff4081;
  border-radius: 50%;
  cursor: pointer;
  position: relative;
}

#sidebar-menu-open::before,
#sidebar-menu-open::after,
.sidebar-menu-caption {
  content: '';
  display: block;
  background-color: white;
  height: 2px;
  width: 22px;
  margin: 4px 0;
  transition: 0.3s;
}

/* 真ん中の線（.sidebar-menu-caption） */
.sidebar-menu-caption {
  background-color: white;
  height: 2px;
  width: 22px;
}

/* 開いたときに×に変化 */
#sidebar-menu-input:checked + #sidebar-menu-open::before {
  transform: rotate(45deg) translate(5px, 5px);
}

#sidebar-menu-input:checked + #sidebar-menu-open::after {
  transform: rotate(-45deg) translate(5px, -5px);
}

#sidebar-menu-input:checked + #sidebar-menu-open .sidebar-menu-caption {
  opacity: 0;
}

/* メニュー中身（開閉） */
#sidebar-menu-content {
  position: fixed;
  top: 0;
  right: 0;
  width: 260px;
  height: 100%;
  background-color: #fff;
  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.2);
  transform: translateX(100%);
  transition: transform 0.3s ease;
}

  #popup{
    display: none;
}

/* ポップアップwindow部分 */
#overlay {
    visibility: hidden;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 70;
    width: 100%;
    height: 100%;
}
/* オーバーレイの背景部分 */
#bg_gray {
    background: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 80;
}
/* ウィンドウ部分 */
#window {
    width: 90%;
    height: 95%;
    overflow-y: auto;
    padding: 20px;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 20px -6px rgba(0,0,0,0.6);
    z-index: 90;
    opacity: 0;
}
/* 閉じるボタン */
#btn_cloth {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #CE5D8B;
    border-radius: 5px;
    z-index: 100;
    cursor: pointer;
}
#btn_cloth:hover {
    opacity: 0.7;
}
#btn_cloth span,
#btn_cloth span::before {
    display: block;
    height: 3px;
    width: 25px;
    border-radius: 3px;
    background: #fff;
}
#btn_cloth span {
    transform: rotate(45deg);
}
#btn_cloth span::before {
    content: "";
    position: absolute;
    bottom: 0;
    transform: rotate(-90deg);
}


/* クリックで表示 */
#popup:checked ~ #overlay {
    visibility: visible;
}
#popup:checked ~ #overlay #window {
    animation: fadein 500ms forwards;
    animation-timing-function: ease-in-out;
}
@keyframes fadein {
    100% {
        opacity: 1;
    }
}


/* コンテンツ部分のスタイル */
body {
    margin: 30px;
}


#txt_label {
    cursor: pointer;
}
#txt_label:hover {
    opacity: 0.7;
}


#msg a {
    display: inline-block;
    color: #fff;
    background: #CE5D8B;
    border-radius: 20px;
    padding: 0.5em 1.5em;
    text-decoration: none;
}
#msg a:hover {
    opacity: 0.7;
}




div.sidebar{
    padding: 32px 10px!important;
}

#sidebar-menu-input:checked ~ #sidebar-menu-content {
  transform: translateX(0%);
}

/* 閉じるボタン（×） */
.sidebar-menu-close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 20px;
  color: #333;
  cursor: pointer;
}


/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

.reaction-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  padding: 10px 0;
}
.reaction-btn {
  border: none;
  background: #f0f0f0;
  border-radius: 20px;
  padding: 8px 14px;
  font-size: 1rem;
  cursor: pointer;
  transition: background 0.2s ease;
}
.reaction-btn:hover {
  background: #e0e0e0;
}
.reaction-btn .count {
  font-weight: bold;
  margin-left: 4px;
}

/************************************
SNS ボタンをまとめて小さくする
************************************/

/*トップシェアボタンの枠組み*/
.sns-share.ss-top .sns-share-buttons {
	justify-content: flex-end; /*左寄せ*/
}

/*ボトムシェア・フォローボタンの枠組み*/
.sns-share.ss-bottom .sns-share-buttons,
.sns-follow.sf-bottom .sns-follow-buttons,
.sns-follow.sf-widget .sns-follow-buttons {
	justify-content: flex-end; /*左寄せ*/
	flex-wrap: wrap; /*折り返す*/
}

/*シェア・フォローボタンの形*/
.sns-share.ss-top .sns-buttons a,
.sns-share.ss-bottom .sns-buttons a,
.sns-follow.sf-bottom .sns-buttons a,
.sns-follow.sf-widget .sns-buttons a {
	width: 35px; /*横幅*/
	height: 35px; /*高さ*/
	margin-right: 4px; /*右側の余白*/
	margin-left: 4px; /*左側の余白*/
	border-radius: 50%; /*丸み*/
	border: none;/*ボタンの枠線*/
}

/*シェアボタンのアイコン*/
.sns-share.ss-top .sns-buttons a .social-icon,
.sns-share.ss-bottom .sns-buttons a .social-icon {
	font-size: 25px; /*アイコンのサイズ*/
}

/*フォローボタンのアイコン*/
.sns-follow.sf-bottom .sns-follow-buttons .follow-button,
.sns-follow.sf-widget .sns-follow-buttons .follow-button {
	font-size: 25px; /*アイコンのサイズ*/
}

/*シェアボタンのキャプション*/
.sns-share.ss-top .sns-buttons a .button-caption,
.sns-share.ss-bottom .sns-buttons a .button-caption {
	display: none; /*非表示*/
}

/*シェア・フォローボタンのシェア数*/
.sns-share.ss-top .sns-buttons a .share-count,
.sns-share.ss-bottom .sns-buttons a .share-count,
.sns-follow.sf-bottom .sns-buttons a .follow-count,
.sns-follow.sf-widget .sns-buttons a .follow-count {
	right: 1px; /*右側からの距離*/
	bottom: 0; /*下側からの距離*/
	font-size: 10px; /*文字の大きさ*/
}

/*シェアメッセージ*/
.sns-share-message {
	text-align: left;
}




/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
 
.user-post-box {
width:49.5%;
}
 
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
  
    .user-post-box {
width:100%;
}
    
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
    
    .gimei .wpuf-fields,.enable_poll .wpuf-fields{display: initial !important; }
    
    .gimei,.enable_poll{float: right;
    width: 35%;}
    
    .wpuf-checkbox-block{font-size: 12px;
    color: #666;}
}

/* ガールズチャンネル風：シンプル引用 */
.gc-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 8px;
  margin-top:8px;
  border:1px solid #e5e5e5;
  border-radius:4px;
  background:#fafafa;
  text-decoration:none;
  color:inherit;
}

/* 썸네일 작게 */
.gc-card-img img{
  width:70px;
  height:70px;
  object-fit:cover;
  border-radius:2px;
  display:block;
}

/* 본문 */
.gc-card-body{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

.gc-card-host{
  font-size:11px;
  color:#888;
  line-height:1.2;
}

.gc-card-title{
  font-size:13px;
  font-weight:400;
  color:#333;
  line-height:1.3;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* wpDiscuz vote: 축약표기(3.6K) 대신 title 값(정확한 숫자) 표시 */
.wpd-vote-result-like,
.wpd-vote-result-dislike{
  font-size: 0 !important;  /* 기존 3.6K 텍스트 숨김 */
}

.wpd-vote-result-like::before,
.wpd-vote-result-dislike::before{
  content: attr(title) !important; /* title 값을 표시 */
  font-size: 14px;                /* 원하는 크기로 조절 */
  font-weight: 700;
}

/* 1) 기본 표시(3.6K / -64) 숨기기 */
.wpd-vote-result-dislike{
  font-size: 0 !important;
}

/* 2) title 값을 보여주되, 첫 글자(-)를 왼쪽에서 잘라내서 숨김 */
.wpd-vote-result-dislike::before{
  content: attr(title) !important;      /* title="-64"를 출력 */
  font-size: 14px;
  font-weight: 700;
  display: inline-block;

  /* 왼쪽 1ch 만큼 잘라내기 = 첫 글자( - ) 제거 효과 */
  -webkit-clip-path: inset(0 0 0 0.7ch);
  clip-path: inset(0 0 0 0.7ch);
}


#comments,.entry-content,#wpdcom .wpd-form-wrap{
	margin: 0!important;
}

#wpdcom .wpd-thread-list{padding: 0!important;}

.entry-header{
	background: #efefef;
	padding: 10px;
	margin-bottom: 15px;
	
}
/* =========================================================
   WPUF 投稿フォーム UI（最終版）
   - PC: 画像左 / タイトル+本文右 / チェック横並び / Submitが見える密度
   - Mobile: 縦積み
   ========================================================= */

/* scope */
.entry-content .wpuf-form-add.wpuf-style{
  --brand:#f17c8e;
  --line:#e8e8ee;
  --ink:#1f1f24;
  --muted:#8b8b98;

  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* reset list */
.entry-content .wpuf-form-add ul.wpuf-form{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

/* each row */
.entry-content .wpuf-form-add ul.wpuf-form > li{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 6px 0 !important; /* ← 압축 핵심 */
}

/* hide labels */
.entry-content .wpuf-form-add .wpuf-label{ display:none !important; }

/* fields */
.entry-content .wpuf-form-add .wpuf-fields{ width:100%; }

/* ---- Inputs (flat) ---- */
.entry-content .wpuf-form-add input[type="text"].textfield,
.entry-content .wpuf-form-add input[type="text"],
.entry-content .wpuf-form-add textarea,
.entry-content .wpuf-form-add select{
  width:100% !important;
  border: 1px solid var(--line) !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: var(--ink) !important;
  box-shadow: none !important;
  outline: none !important;
  font-size: 16px !important; /* iOS zoom 방지 */
}

/* title */
.entry-content .wpuf-form-add li.post_title input{
  height: 42px !important;
  padding: 9px 12px !important;
}

/* content editor wrapper */
.entry-content .wpuf-form-add .wp-editor-wrap{
  border: 1px solid var(--line) !important;
  border-radius: 6px !important;
  overflow:hidden;
  background:#fff !important;
  box-shadow:none !important;
}

/* editor height (압축) */
@media (max-width: 780px){
  .entry-content .wpuf-form-add iframe[id$="_ifr"]{ height: 280px !important; }
}
@media (min-width: 781px){
  .entry-content .wpuf-form-add iframe[id$="_ifr"]{ height: 260px !important; } /* PC에서 Submit 보이게 */
}

/* toolbar subtle */
.entry-content .wpuf-form-add .mce-top-part,
.entry-content .wpuf-form-add .mce-toolbar-grp{
  background: #fafafb !important;
  border-bottom: 1px solid var(--line) !important;
}
.entry-content .wpuf-form-add .mce-panel{ box-shadow:none !important; }

/* help text (subtle, compact) */
.entry-content .wpuf-form-add .wpuf-help{
  margin-top: 6px !important;
  color: var(--muted) !important;
  font-size: 12.5px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* =========================================================
   IMAGE UPLOAD
   ========================================================= */

/* 기본: 모바일은 세로 */
.entry-content .wpuf-form-add li.featured_image .wpuf-attachment-upload-filelist{
  display:flex;
  flex-direction:column;
  gap: 10px;
  align-items: stretch;
}

/* placeholder box */
.entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
  width: 100% !important;
  min-height: 120px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f6f6f8;
  overflow:hidden;
}

/* thumbnail */
.entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails li{
  width:100%;
  height:auto;
  border:0;
  background:transparent;
}
.entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails img{
  width:100%;
  height:auto;
  display:block;
}

/* upload button */
.entry-content .wpuf-form-add a.button.file-selector{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 40px;
  border-radius: 10px !important;
  border: 1px solid var(--line) !important;
  background: #fff !important;
  color: var(--brand) !important;
  font-weight: 700 !important;
  box-shadow:none !important;
  text-decoration:none !important;
}

/* =========================================================
   PC GRID: 画像左 / 右にタイトル+本文 / 下にチェック+Submit
   ========================================================= */


@media (min-width: 781px){

  /* 전체를 그리드로 */
  .entry-content .wpuf-form-add ul.wpuf-form{
    display: grid !important;
    grid-template-columns: 140px 1fr;
    grid-template-areas:
      "image  title"
      "image  content"
      "checks checks"
      "submit submit";
    column-gap: 16px !important;
    row-gap: 8px !important;
    align-items: start !important;
  }

  .entry-content .wpuf-form-add li.wpuf-el.featured_image{ grid-area: image !important; }
  .entry-content .wpuf-form-add li.wpuf-el.post_title{ grid-area: title !important; }
  .entry-content .wpuf-form-add li.wpuf-el.post_content{ grid-area: content !important; }
  .entry-content .wpuf-form-add li.wpuf-submit{ grid-area: submit !important; }

  /* 이미지영역: PC에서는 "NO IMAGE + 버튼"이 세로로 길어지지 않게 압축 */
  .entry-content .wpuf-form-add li.featured_image .wpuf-attachment-upload-filelist{
    gap: 8px !important;
  }
  .entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails{
    min-height: 110px !important;
  }

  /* 체크박스 라인: 한 줄로 가로정렬 + 좌우 끝으로 배치 */
  .entry-content .wpuf-form-add li.wpuf-el.enable_poll{
    grid-area: checks !important;
    margin-top: 2px !important;
  }
  .entry-content .wpuf-form-add li.wpuf-el.enable_poll .wpuf-fields{
    display:flex !important;
    justify-content: space-between !important; /* ← 왼쪽/오른쪽으로 벌리기 */
    align-items:center !important;
    gap: 18px !important;
    flex-wrap: nowrap !important;
  }

  /* 체크박스 클릭영역/줄바꿈 방지 */
  .entry-content .wpuf-form-add li.wpuf-el.enable_poll .wpuf-checkbox-block{
    margin: 0 !important;
    white-space: nowrap !important;
    display:inline-flex !important;
    align-items:center !important;
    gap: 8px !important;
  }

  /* submit: 위 여백 최소화 */
  .entry-content .wpuf-form-add li.wpuf-submit{
    margin-top: 6px !important;
  }
}

/* =========================================================
   MOBILE: stack (조금만 간격)
   ========================================================= */


/* (옵션) Submit 버튼이 너무 크면 조금만 슬림하게 */
.entry-content .wpuf-form-add li.wpuf-submit input[type="submit"],
.entry-content .wpuf-form-add li.wpuf-submit button[type="submit"]{
  padding: 12px 16px !important;
  border-radius: 12px !important;
}






/* ---- Checkboxes row (simple inline) ---- */


.entry-content .wpuf-form-add .wpuf-checkbox-block input[type="checkbox"]{
  width: 14px;
  height: 14px;
  accent-color: var(--brand);
}

/* ✅ enable_poll 체크박스만: 체크(✔) 흰색으로 커스텀 */
.entry-content .wpuf-form-add input[type="checkbox"]{
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 16px;
  height: 16px;
  border-radius: 4px;
  background: rgba(241,124,142,.28);     /* 박스색 = 핑크 유지 */
  border: 0;
  position: relative;
  cursor: pointer;
}




/* 체크 표시(흰색 ✔) */
.entry-content .wpuf-form-add input[type="checkbox"]::after{
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;                   /* 기본은 숨김 */
}

/* 체크되면 표시 */
.entry-content .wpuf-form-add input[type="checkbox"]:checked::after{
  opacity: 1;
}



/* ---- Submit button like screenshot (soft pink) ---- */
.entry-content .wpuf-form-add li.wpuf-submit{
  margin-top: 10px;
}
.entry-content .wpuf-form-add input[type="submit"].wpuf-submit-button{
  width: min(520px, 100%);
  height: 48px;
  border-radius: 4px !important;
  border: 0 !important;
  background: #f17c8e !important !important; /* 연한 핑크 */
  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing:.02em;
  box-shadow:none !important;
  cursor:pointer;
}
.entry-content .wpuf-form-add input[type="submit"].wpuf-submit-button:hover{
  background: #f17c8e !important;
}

/* =========================
   WPUF 画像エリア + Submit だけ整える
   Main: #f17c8e (simple/flat)
   ========================= */
.entry-content .wpuf-form-add.wpuf-style{
  --brand:#f17c8e;
  --line:#e9e9ef;
  --soft: rgba(241,124,142,.20);
  --soft2: rgba(241,124,142,.32);
}

/* ---------- 画像エリア ---------- */
.entry-content .wpuf-form-add li.wpuf-el.featured_image{
  /* 카드/그림자 제거 유지 */
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

/* 전체 업로드 박스: 정사각형 느낌으로 */
.entry-content .wpuf-form-add #wpuf-featured_image-313-upload-container{
  width: 70px;            /* 모바일에서 딱 예쁜 폭 */
  max-width: 70px;
}

/* 썸네일(= NO IMAGE 박스) */
.entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails{
  width: 140px !important;
  height: 140px !important;           /* ✅ 세로 길쭉함 제거 */
  min-height: 90px !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  background: #f6f6f8 !important;
  overflow: hidden;
  position: relative;
}

/* 비어있을 때 "画像" 느낌 텍스트 */
.entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails:empty::after{
  content: "IMAGE";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  letter-spacing:.08em;
  color: #b6b6c2;
  font-weight: 700;
}

/* 이미지가 들어오면 꽉 채우기 */
.entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display:block;
}

/* "画像を選択" 버튼: 작은 심플 버튼 */
.entry-content .wpuf-form-add li.featured_image a.button.file-selector{
  width: 140px;
  height: 43px;
  border-radius: 10px !important;
  border: 1px solid var(--soft2) !important;
  background:#f17c8e !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: none !important;
  text-decoration: none !important;
    margin-top: 0!important;
}

/* 画像 버튼 숨김 */
.entry-content .wpuf-form-add li.featured_image a.button.file-selector{
  display: none !important;
}

/* NO IMAGE 박스를 버튼처럼 */
.entry-content .wpuf-form-add li.featured_image 
ul.wpuf-attachment-list.thumbnails{
  cursor: pointer;
}


/* 모바일에서 이미지 영역이 너무 왼쪽에 붙으면 여백 */
@media (max-width: 780px){
  .entry-content .wpuf-form-add #wpuf-featured_image-313-upload-container{
    margin-left: 4px;
  }
  
  /* 부모 li들이 이상하게 width 먹지 않게 */
  .entry-content .wpuf-form-add ul.wpuf-form{
    display:block !important;
  }

  /* 이미지 li */
  .entry-content .wpuf-form-add li.featured_image{
    float: left !important;
    width: 70px !important;      /* ← 썸네일 폭 (원하면 110/130 가능) */

  }

  /* 타이틀 li */
  .entry-content .wpuf-form-add li.post_title{
    float: right !important;
    width: calc(100% - 80px) !important; /* 120 + 12(margin) */
  }

  /* float 줄바꿈 방지/정리 */
  .entry-content .wpuf-form-add li.post_title::after,
  .entry-content .wpuf-form-add li.featured_image::after{
    content:"";
    display:block;
    clear:both;
  }

  /* ✅ 썸네일 박스 = 정사각형 유지 */
  .entry-content .wpuf-form-add li.featured_image ul.wpuf-attachment-list.thumbnails{
    width: 70px !important;
    height: 70px !important;     /* ← 고정이 제일 안정적 */
    min-height: 70px !important;
    aspect-ratio: 1 / 1;
  }

  /* 타이틀 입력칸이 꽉 차게 */
  .entry-content .wpuf-form-add li.post_title input{
    width: 100% !important;
  }
}
    









/* ---------- Submit 버튼 ---------- */
.entry-content .wpuf-form-add li.wpuf-submit{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin-top: 18px;
    text-align: center;
}

/* 전체 폭 / 심플한 연핑크 버튼 */
.entry-content .wpuf-form-add input[type="submit"].wpuf-submit-button{
  width: 50%;
  max-width: 520px;            /* 데스크톱에서도 너무 길지 않게 */
  height: 48px;
  border-radius: 10px !important;
  border: 1px solid var(--soft2) !important;
  background: #f17c8e !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: .02em;
  text-shadow: none !important;         /* ✅ 파란 아웃라인/글자 효과 제거 */
  -webkit-text-stroke: 0 !important;
  box-shadow: none !important;
  outline: none !important;
    margin: 0 auto;
}

/* hover/active도 아주 심플하게 */
.entry-content .wpuf-form-add input[type="submit"].wpuf-submit-button:hover{
  background: rgba(241,124,142,.26) !important;
}
.entry-content .wpuf-form-add input[type="submit"].wpuf-submit-button:active{
  background: rgba(241,124,142,.30) !important;
  transform: translateY(1px);
}

/* focus 파란 테두리 제거 */
.entry-content .wpuf-form-add input[type="submit"].wpuf-submit-button:focus{
  box-shadow: 0 0 0 4px rgba(241,124,142,.18) !important;
  outline: none !important;
}

/* ===== 본문 입력칸 높이 줄이기 ===== */

/* TinyMCE iframe (실제 입력 영역) */
.entry-content iframe[id^="post_content_"][id$="_ifr"]{
  height: 220px !important;   /* ← 지금보다 약 절반 */
}

/* 혹시 textarea 모드로 바뀔 경우 대비 */
.entry-content textarea.wp-editor-area{
  height: 220px !important;
}

/* 모바일에서는 살짝 더 작게 */
@media (max-width: 780px){
  .entry-content iframe[id^="post_content_"][id$="_ifr"],
  .entry-content textarea.wp-editor-area{
    height: 200px !important;
  }
}

/* ===== NO IMAGE 강제 표시 (WPUF 대응) ===== */

/* 썸네일 박스 기준 */
.wpuf-attachment-list.thumbnails{
  position: relative;
}

body .wpuf-button{
    box-shadow: none!important;
}

/* 기본 NO IMAGE 표시 */
.wpuf-attachment-list.thumbnails::after{
  content: "IMAGE";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .06em;
  color: #bfbfc6;
  pointer-events: none;
}

/* 실제 이미지(li 또는 img)가 생기면 숨김 */
.wpuf-attachment-list.thumbnails li,
.wpuf-attachment-list.thumbnails img{
  position: relative;
  z-index: 2;
}

.wpuf-attachment-list.thumbnails li:not(:empty) ~ ::after,
.wpuf-attachment-list.thumbnails:has(img)::after{
  display: none;
}

/* === ガールズちゃんねる風 投票 === */

.gc-poll { margin:12px auto 0!important; width: 80%; }

.gc-poll-counts {
  display:flex;
  font-size:11px;
  color:#777;
  margin-bottom:4px;
}
.gc-spacer { flex:1; }

.gc-poll-labels {
  display:flex;
  justify-content:space-between;
  font-size:13px;
  font-weight:700;
  margin-bottom:6px;
}

.wc-field-submit{
    margin: 8px auto;
    width: 50%;
 
}

.body .article{
    margin-bottom: 0;
}

#wpdcom .wpd-prim-button{   padding: 10px!important;}

.gc-poll-bar {
  height:10px;
  background:#eee;
  border-radius:999px;
  overflow:hidden;
  display:flex;
}

.gc-seg { height:100%; }
.gc-seg.yes { background:#f17c8e; } /* 핑크 */
.gc-seg.no  { background:#ccc; }

.gc-poll-actions {
  display:flex;
  justify-content:space-between;
  margin-top:6px;
}

.gc-poll-actions button {
  background:none;
  border:0;
  font-weight:700;
  cursor:pointer;
}
/* 전체 필드 기준 */
.wpuf-el.post_content .wpuf-fields{
  position: relative;
 /* display: flex;*/
  flex-direction: column;
}

/* 안내문을 textarea 위로 */
.wpuf-el.post_content .wpuf-help{
  order: 1;
  margin: 0px!important;
  font-size: 13px;
  color: #888;
}

/* textarea */
#post_content_313{
  order: 2;
  padding-right: 40px;   /* 아이콘 공간 */
  padding-bottom: 36px;
    line-height: 130%;
}

/* 업로드 컨테이너를 textarea 안으로 */
#wpuf-insert-image-container{
  position: absolute !important;
  right: 10px;
  bottom: 10px;
  z-index: 10;
}

/* 버튼 = 완전 투명 */
#wpuf-insert-image_313{
  width: 24px;
  height: 24px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  font-size: 0;       /* 텍스트 제거 */
  line-height: 0;
  display: block;
}

/* 🔥 아이콘을 CSS로 지정 (SVG) */
#wpuf-insert-image_313::before{
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;

  /* 카메라 아이콘 (SVG, 색 #999) */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23999'%3E%3Cpath d='M9 3L7.17 5H4a2 2 0 00-2 2v11a2 2 0 002 2h16a2 2 0 002-2V7a2 2 0 00-2-2h-3.17L15 3H9zm3 15a4 4 0 110-8 4 4 0 010 8z'/%3E%3C/svg%3E");
}

/* 画像を追加 ← 텍스트만 숨김 */
#wpuf-insert-image_313{
  font-size: 0 !important;     /* 텍스트 렌더링 제거 */
}

/* 아이콘(span)은 다시 살림 */
#wpuf-insert-image_313 .wpuf-media-icon{
  font-size: 18px !important;
  display: inline-block;
}

#wpuf-insert-image_313{border: none!important;
border-radius:0!important;
    padding:0!important;
    margin: 0!important;
    

}

/* 기존 플러그인 아이콘/텍스트 완전 제거 */
#wpuf-insert-image_313 .wpuf-media-icon{
  display: none !important;
}

/* 파일 input 클릭 영역을 아이콘에 정확히 맞춤 */
#wpuf-insert-image-container .moxie-shim{
  width: 24px !important;
  height: 24px !important;
  top: 0 !important;
  left: 0 !important;
}

.wpuf-attachment-upload-filelist {
  display: flex;
  flex-direction: column;
}

/* 이미지 리스트를 위로 */
.wpuf-attachment-list {
  order: 1;
}

/* 업로드 버튼을 아래로 */
.wpuf-attachment-upload-filelist .file-selector {
  order: 2;
  margin-top: 10px; /* 간격 조절 */
}

/* 기본 */
.gc-rank-num {
  width:22px;
  height:22px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:12px;
  color:#fff;
}

/* 🥇 1위 - 금색 */
.gc-rank-item.rank-1 .gc-rank-num {
  background:#d4af37; /* gold */
}

/* 🥈 2위 - 은색 */
.gc-rank-item.rank-2 .gc-rank-num {
  background:#bfc3c7; /* silver */
}

/* 🥉 3위 - 똥색(브론즈) */
.gc-rank-item.rank-3 .gc-rank-num {
  background:#8b5a2b; /* bronze */
}

/* 4위 이하 */
.gc-rank-item:not(.rank-1):not(.rank-2):not(.rank-3) .gc-rank-num {
  background:#eee;
  color:#555;
}

 .lk-topic-list{padding-left: 0!important;}
    


/* ===============================
   Topic Tabs (新着 / 注目 / コメント多)
   =============================== */

.lk-topic-tabs-head {
  display: flex;
  gap: 6px;
  margin: 12px 0;
}

.lk-topic-tabs-head .lk-tab {
  flex: 1;
  text-align: center;
  padding: 8px 0;
  font-size: 14px;
  font-weight: 600;
  color: #666;
  background: #f5f5f5;
  text-decoration: none;
  transition: all .15s ease;
}

/* hover */
.lk-topic-tabs-head .lk-tab:hover {
  background: #eee;
}

/* active tab */
.lk-topic-tabs-head .lk-tab[aria-current="true"] {
  background: #f17c8e;
  color: #fff;
  font-weight: 700;
}

/* 아이콘 느낌 살리고 싶으면 
.lk-tab-new::before {
  content: "🆕 ";
}
.lk-tab-hot::before {
  content: "🔥 ";
}
.lk-tab-comments::before {
  content: "💬 ";
}
*/

body ul.wpuf-form li .wpuf-fields .wpuf-help{font-style: normal;}

/* 기준 컨테이너 */
.user-post-box{
  position: relative;
}

/* 공통 랭킹 뱃지 */
.user-post-box[class*="rank-"]::before{
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 5;

  width: 26px;
  height: 26px;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 13px;
  font-weight: 700;
  color: #fff;

  box-shadow: 0 2px 6px rgba(0,0,0,.15);
}

.rank-1,.rank-3,.rank-5{background: #fffaf3;}

.gc-popular-list{padding-left: 0!important;}

/* 🥇🥈🥉 TOP3 컬러 */
.user-post-box.rank-1::before{ content:"1"; background:#d4af37; }
.user-post-box.rank-2::before{ content:"2"; background:#bfc3c7; }
.user-post-box.rank-3::before{ content:"3"; background:#8b5a2b; }

/* 4~10위 공통 스타일 */
.user-post-box.rank-4::before{ content:"4"; background:#999; }
.user-post-box.rank-5::before{ content:"5"; background:#999; }
.user-post-box.rank-6::before{ content:"6"; background:#999; }
.user-post-box.rank-7::before{ content:"7"; background:#999; }
.user-post-box.rank-8::before{ content:"8"; background:#999; }
.user-post-box.rank-9::before{ content:"9"; background:#999; }
.user-post-box.rank-10::before{ content:"10"; background:#999; }

/* 2자리 숫자(10) 미세조정 */
.user-post-box.rank-10::before{
  font-size: 11px;
}

a:hover{color: #000!important;}

.wpd-field-comment{width: 100%;margin: 0 auto;}

#wpdcom .ql-editor{min-height: 200px!important;}
