@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
*/

/* 投稿同士の間隔を10pxに調整 */
.entry-card {
    margin-bottom: 10px !important;
}

.entry-content{margin-bottom:0px!important;}

/* .entry-card-wrap に影響を与えるスタイルをリセット */
.entry-card-wrap {
    display: block !important;
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
}

/* 親要素 #list の gap を適用 */
#list {
    display: flex !important;
    flex-wrap: wrap !important;
    row-gap: 10px !important;
    column-gap: 10px !important;
}

/* .f14px 直下のスペースを10pxに調整 */
.f14px + div {
    margin-top: 10px !important;
}

.navi {background-image: linear-gradient(to top, #995c00 40%, #ff9900 100%);}
.main{background-color: #f4f4f4;}

/*個別プロフ出勤表*/
.single-companion th.sunday,
.single-companion .sunday .date {background-color: #ffe6ff!important;color:#ff0000!important;}

.single-companion th.saturday,
.single-companion .saturday .date {background-color: #e6ffff!important;color:#0000ff!important;}

/*出勤一覧（日別）*/
ul.staff_block{display:flex;justify-content:center;flex-wrap:wrap;}
ul.staff_block:after {clear: both;}
ul.staff_block li {flex: 0 1 160px;box-sizing:border-box;
	box-sizing:border-box;
	list-style: none;
	padding: 0px;
	text-align: center;
	width:150px;
	background-color:#ffffff;}
ul.staff_block li img {
	box-shadow: none;
	width:130px;
}
ul.staff_block li .post-info {
	font-size: 16px!important;
	line-height: 1.5em;
}
ul.staff_block li .name{font-size:16px;margin-top:10px;}
ul.staff_block li a{text-decoration:none;}
.attendance{font-size:16px;font-family: 'Kaisei Decol','Osaka',sans-serif;margin-bottom:-20px;}

.attmgr_guide_weekly .saturday {background-color: #66b3ff!important;color:#0000ff!important;}
.attmgr_guide_weekly .sunday {background-color: #ff99ff!important;color:#ff0000!important;}
.attmgr_guide_weekly .current {background-color: #990000!important;color:#ffffff!important;}
.attmgr_guide_weekly .current a{color:#ffffff!important;}

/*パンくず*/
.breadcrumbs{font-size:12px;padding:10px;}
.breadcrumb-page{}
.breadcrumbs a {text-decoration: none;}


/* Flex Box*/
.flex-center{display:flex;justify-content:center;flex-wrap:wrap;}
.flex-between{display:flex;justify-content:space-between;flex-wrap:wrap;}
.flex-start{display:flex;justify-content:start;flex-wrap:wrap;}

.flex-p100{flex: 0 1 100px;box-sizing:border-box;}
.flex-p150{flex: 0 1 150px;box-sizing:border-box;}
.flex-p300{flex: 0 1 380px;box-sizing:border-box;}
.flex-p300ex{flex: 1 1 380px;box-sizing:border-box;}
.flex-p580ex{flex:1 1 580px;box-sizing:border-box;} /*1カラム50%*/

.flexb{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;justify-content:center;}
.flexb-p{box-sizing:border-box;}

/* Font */
.f10px{font-size:10px;}
.f12px{font-size:12px;}
.f14px{font-size:14px;}
.f16px{font-size:16px;}
.f18px{font-size:18px;}
.f20px{font-size:20px;}
.f24px{font-size:24px;}
.f28px{font-size:28px;}

.bold{font-weight:bold;}

/* Margin Padding */
.m2{margin:2px;}
.m5{margin:5px;}
.m10{margin:10px;}

.mt5{margin-top:5px;}
.mt10{margin-top:10px;}

.p5{padding:5px;}
.p10{padding:10px;}

/* カラー */
.brown{color:#990000;}
.red{color:#ff0000;}
.blue{color:#0000ff;}
.purple{color:#8c1aff;}

.bold{font-weight:bold;}

/* 女性プロフィール */
.honbun_bg{border-left:2px #ea930a solid;background-color:#ffffff;padding:10px;background-image:url("http://amber589.com/wp-content/uploads/2024/08/white_00043.jpg");background-size: cover;}
.prof_bg{background-image:url("http://amber589.com/wp-content/uploads/2024/08/white_00043.jpg");text-align:center;font-size:18px;font-weight:bold;padding:20px 0px;border-top:1px #990000 solid;border-bottom:1px #990000 solid;color:#990000;line-height:22px;background-size: cover;margin-bottom:20px;}

.com_specs{border-left:2px #ea930a solid;border-bottom:1px #cccccc dotted;box-sizing:border-box;line-height:35px;margin-bottom:10px;flex-wrap: wrap;}
.que{padding-left:15px;width:160px;color:#990000;background-image: linear-gradient(-20deg, #e9defa 0%, #fbfcdb 100%);}
.ans{padding-left:15px;background-color:#ffffff;flex:1;}

.play-info{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;width:100%;}/*基本プレイ*/
.play-info-ok{border:1px #cccccc solid;margin:2px;box-sizing:border-box;text-align:center;background-image: linear-gradient(to top, #995c00 40%, #ff9900 100%);color:#ffffff;border-radius:5px;flex: 1 0 150px;}
.play-info-ng{border:1px #cccccc solid;margin:2px;box-sizing:border-box;text-align:center;background:linear-gradient(#cccccc, #f2f2f2);border-radius:5px;color:#999999;flex: 1 0 150px;}
.play-info-txt{margin:10px 2px;line-height:22px;min-width:120px;font-size:12px;}
.pay-op{border:1px #cccccc solid;margin:2px;box-sizing:border-box;text-align:center;background:linear-gradient(#ffe6ff, #ff66ff);border-radius:5px;flex: 1 0 150px;}

/*各ページの下部にある出勤表の女性画像の縦*/
img.wp-post-image.avatar {
    height: 170px!important;
}

/*Top新人表示*/

.companion-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center; /* 中央寄せ（オプション） */
}
.companion-item {
    width: calc(16.66% - 10px); /* PC：6列（100% ÷ 6） */
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
    box-sizing: border-box;
    display: block;             /* <a>をブロック要素に */
    text-decoration: none;     /* リンクの下線を消す */
    color: inherit;            /* 親の文字色を使う */
    outline: none;             /* フォーカス枠を消す */
}
.companion-thumbnail img {
    max-width: 100%;
    height: auto;
}
.companion-title {
    font-size: 18px;
    margin-bottom: -5px;
    background: none;
    background-color: transparent;
}
.companion-details {
    font-size: 14px;
	padding-bottom:10px;
}
/* スマホ：1行に2投稿 */
@media screen and (max-width: 768px) {
    .companion-item {
        width: calc(50% - 10px);
    }
}

/*Top Topix表示*/

.topix-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center; /* 中央寄せ（オプション） */
}
.topix-item {
    width: calc(16.66% - 10px); /* PC：6列（100% ÷ 6） */
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none; /* リンクの下線を消す */
    color: inherit;         /* 親要素の文字色を継承 */
    outline: none;          /* フォーカス時のアウトラインを消す */
}
.topix-thumbnail img {
    max-width: 100%;
    height: auto;
}
.topix-title {
    font-size: 16px;
	line-height: 20px;
    background: none;
    background-color: transparent;
	margin-top:10px;
}
.topix-excerpt {
    font-size: 12px;
	line-height:14px;
    margin: 5px 0px;
}
/* スマホ：1行に2投稿 */
@media screen and (max-width: 768px) {
    .topix-item {
        width: 100%; /* スマホ表示で1列 */
    }
}

.is-style-alert-box::before,
.alert-box::before,
.alert::before {
  display:none;
  content: "\f06a";
  color: #f3aca9;
  border-right: 1px solid #f6b9b9;
}

/*コンパニオンページでのレビュー表示*/
.staff-reviews {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.review-item {
    padding: 15px;
    border: 1px solid #ddd;
    background: #f9f9f9;
    border-radius: 8px;
}

.review-item h4 {
    margin-bottom: 10px;
    font-size: 18px;
    color: #333;
}

.review-item p {
    margin: 5px 0;
    font-size: 14px;
}

.review-item a {
    display: inline-block;
    margin-top: 5px;
    padding: 2px 3px;
    background: #ffc266;
    color: #000;
    text-decoration: none;
    border-radius: 4px;
}

.review-item a:hover {
    background: #ffffff;
}

/* boxスペース */
.yellowbox {
	padding:20px 20px 20px 20px;
	border:solid 1px #ffcc00;
	background-color:#ffffe0;
	margin-bottom:20px;
	font-size: 14px;
}

.redbox {
	padding:20px 20px 20px 20px;
	border:solid 1px #ef5350;
	background-color:#ffebee;
	margin-bottom:20px;
	font-size: 14px;
}

.graybox {
	padding:20px 20px 20px 20px;
	border:solid 1px #ccc;
	background-color:#f3f3f3;
	margin-bottom:20px;
	font-size: 14px;
}

.purplebox {
	padding:20px;
	border:solid 1px #8c1aff;
	background-color:#f2e6ff;
	margin-bottom:20px;
	font-size: 14px;
}

/************************************
** エントランスの相互リンク
************************************/
.banner-container {
  display: flex;
  flex-wrap: wrap; /* バナーがコンテナ幅を超えたら次の行へ */
  justify-content: center; /* 中央寄せ */
  gap: 5px; /* バナー間の隙間 */
  max-width: 946px; /* 468px * 2 + 5px = 941px + 5px(右端の余白を考慮) */
  margin: 0 auto; /* コンテナ自体も中央寄せ */
}

.banner-item {
  flex-basis: 468px; /* 基本の幅を468pxに設定 */
  flex-grow: 0; /* 拡大させない */
  flex-shrink: 0; /* 縮小させない */
  height: 60px; /* バナーの縦幅 */
}

.banner-item img {
  display: block; /* 画像の下にできる余白をなくす */
  width: 100%;
  height: 100%;
  object-fit: contain; /* アスペクト比を維持し、要素に収まるように画像を調整 */
}

/* モバイル表示（例: 画面幅768px以下） */
@media (max-width: 768px) {
  .banner-container {
    max-width: 100%; /* コンテナを画面いっぱいに広げる */
    padding: 0 5px; /* 左右に余白を設定し、バナーが端につきすぎないようにする */
  }

  .banner-item {
    flex-basis: 100%; /* バナーの幅を100%にする */
    height: auto; /* 高さは自動調整 */
  }

  .banner-item img {
    height: auto; /* 画像の高さも自動調整し、アスペクト比を維持 */
  }
}

/************************************
** コンパニオン一覧のcss
************************************/
@media screen and (max-width: 768px) {
  .entry-card-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* ← これで中央寄せ */
    padding: 0 10px;
  }

  .entry-card-wrap {
    width: calc(50% - 10px) !important;
    margin: 0 5px 10px;
    box-sizing: border-box;
  }
}

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

/*固定ページの日付非表示*/
.page .date-tags {display: none;}

/*PCとスマホ＆タブの表示切替*/
.pc-only {display: block;}
.mob-only {display: none;}

/*1024px以下*/
@media screen and (max-width: 1024px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
.que{padding-left:20px;width:100%;color:#990000;background-color:#fff0fc;}
.ans{padding-left:20px;width:100%;flex:1;}

}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	.mob_sml{font-size:12px;}
    .pc-only {display: none;}
    .mob-only {display: block;}
}