@charset "utf-8";
/* ================================
   tb-components.css
   旧Shortcodes Ultimate / Liquid Speech Balloon 互換
   functions.php のインラインCSSから移行
================================ */

/* SU Spoiler icon: ShortcodesUltimateIcons → Font Awesome */
.tb-spoiler-icon {
font-family: "Font Awesome 6 Free" !important;
font-weight: 900 !important;
}
.tb-spoiler-icon-plus .tb-spoiler-icon:before { content: '\f068' !important; }
.tb-spoiler-icon-plus.tb-spoiler-closed .tb-spoiler-icon:before { content: '\f067' !important; }
.tb-spoiler-icon-arrow .tb-spoiler-icon:before { content: '\f078' !important; }
.tb-spoiler-icon-arrow.tb-spoiler-closed .tb-spoiler-icon:before { content: '\f054' !important; }
.tb-spoiler-icon-chevron .tb-spoiler-icon:before { content: '\f078' !important; }
.tb-spoiler-icon-chevron.tb-spoiler-closed .tb-spoiler-icon:before { content: '\f054' !important; }
.tb-spoiler-icon-caret .tb-spoiler-icon:before { content: '\f0d7' !important; }
.tb-spoiler-icon-caret.tb-spoiler-closed .tb-spoiler-icon:before { content: '\f0da' !important; }

/* Spoiler title cursor & styling */
.tb-spoiler-title { cursor: pointer; }
.tb-spoiler-content { transition: all 0.3s ease; }

/* SP sidebar: arrow icon overflow fix */
.otherMenu > ul li a,
.menu li a,
.contentNavArea aside li a,
.mainLeftArea li a {
padding-right: 28px !important;
word-break: break-all;
overflow-wrap: break-word;
}

/* FA icon spacing: 3-5px after icons */
.fa, .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands,
[class*="fa-"]:before {
margin-right: 4px;
}

/* ── clearfix & trim ── */
.tb-u-clearfix::after { content: ''; display: table; clear: both; }
.tb-u-trim > :first-child { margin-top: 0; }
.tb-u-trim > :last-child { margin-bottom: 0; }

/* ── row / column grid ── */
.tb-row { clear: both; zoom: 1; margin-bottom: 1.5em; }
.tb-row:before, .tb-row:after { display: table; content: ''; }
.tb-row:after { clear: both; }
.tb-column { display: block; float: left; box-sizing: border-box; }
.tb-row .tb-column { margin: 0 0 0 4%; }
.tb-row .tb-column:first-child { margin-left: 0; }
.tb-column-size-1-1 { width: 100%; }
.tb-column-size-1-2 { width: 48%; }
.tb-column-size-1-3 { width: 30.66%; }
.tb-column-size-2-3 { width: 65.33%; }
.tb-column-size-1-4 { width: 22%; }
.tb-column-size-3-4 { width: 74%; }
.tb-column img, .tb-column iframe { max-width: 100%; }
@media only screen and (max-width: 768px) {
.tb-row .tb-column { width: 100%; margin: 0 0 1.5em; float: none; }
.tb-row .tb-column:last-child { margin-bottom: 0; }
}

/* ── box (bubbles / default) ── */
.tb-box { margin: 0 0 1.5em; border-width: 2px; border-style: solid; overflow: hidden; }
.tb-box-title {
display: block;
font-size: 18px;
font-weight: bold;
padding: 10px 15px;
text-align: center;
color: #fff;
}
.tb-box-content { background-color: #fff; color: #444; padding: 1em; }
.tb-box-style-bubbles .tb-box-title {
background-image: url("../images/styles/style-bubbles.png");
background-position: 0 50%;
background-repeat: repeat-x;
}
.tb-box .txt_center,
.tb-box-content .txt_center { text-align: center; }

/* ── note ── */
.tb-note { margin: 0 0 1.5em; border-width: 1px; border-style: solid; }
.tb-note-inner { padding: 1em; border-width: 1px; border-style: solid; }

/* ── button ── */
.tb-button {
display: inline-block !important; text-align: center;
text-decoration: none !important; box-sizing: content-box !important;
transition: all 0.2s;
}
.tb-button-wide { display: block !important; margin: 1em 0; }
.tb-button-center { text-align: center; }
.tb-button span {
display: block !important; text-decoration: none !important;
box-sizing: content-box !important; transition: all 0.2s;
}
.tb-button-style-default { border-width: 1px; border-style: solid; }
.tb-button-style-default:hover { opacity: 0.7; }
.tb-button-style-flat, .tb-button-style-flat span { border: none; }
.tb-button-style-ghost { background: transparent !important; }
.tb-button-style-ghost span { border-width: 3px; border-style: solid; }

/* ── tabs ── */
.tb-tabs { margin: 0 0 1.5em; padding: 3px; border-radius: 3px; background: #eee; }
.tb-tabs-nav span {
display: inline-block; margin-right: 3px; padding: 10px 15px;
min-height: 40px; border-top-left-radius: 3px; border-top-right-radius: 3px;
color: #333; font-size: 13px; line-height: 20px; cursor: pointer;
transition: all 0.2s;
}
.tb-tabs-nav span:hover { background: #f5f5f5; }
.tb-tabs-nav span.tb-tabs-current { background: #fff; cursor: default; }
.tb-tabs-pane {
padding: 15px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px;
background: #fff; color: #333; font-size: 13px;
}
.tb-tabs-pane:not(.tb-tabs-pane-open) {
overflow: hidden !important; padding: 0 !important;
height: 0 !important; border: none !important;
}
.tb-tabs-vertical { display: flex; }
.tb-tabs-vertical .tb-tabs-nav { width: 30%; }
.tb-tabs-vertical .tb-tabs-nav > span { display: block; margin-right: 0; }
.tb-tabs-vertical .tb-tabs-panes { width: 70%; }
@media only screen and (max-width: 768px) {
.tb-tabs-vertical { flex-direction: column; }
.tb-tabs-vertical .tb-tabs-nav, .tb-tabs-vertical .tb-tabs-panes { width: 100%; }
}

/* ── table ── */
.tb-table { width: 100%; margin-bottom: 1.5em; }
.tb-table table { width: 100% !important; margin: 0 !important; border-collapse: collapse !important; border: 1px solid #ccc !important; }
.tb-table table th { text-align: center !important; padding: 1em !important; font-weight: bold !important; border: 1px solid #ccc !important; background: #f0f0f0 !important; }
.tb-table table td { padding: 0.5em 1em !important; border: 1px solid #ccc !important; background: #fff !important; }
.tb-table-responsive { overflow-x: auto; }
.tb-table-alternate table tr:nth-child(even) td { background-color: #f7f7f7 !important; }

/* ── accordion ── */
.tb-accordion { background: #faf7ee; }
.tb-accordion .tb-spoiler { padding: 10px; }

/* ── gallery ── */
.tb-gallery { margin-bottom: 1.5em; display: flex; flex-wrap: wrap; gap: 8px; }
.tb-gallery::after { content: ''; display: table; clear: both; }
.tb-gallery-item { position: relative; overflow: hidden; }
.tb-gallery-item a { display: block; width: 100%; height: 100%; }
.tb-gallery-item img {
display: block; margin: 0; padding: 3px;
border: 1px solid #ccc; background: #fff;
box-sizing: border-box; border-radius: 5px;
max-width: 100%; height: auto;
}
.tb-gallery-item:hover img { background: #eee; border: 1px solid #aaa; }

/* ── lightbox ── */
.tb-lightbox { cursor: pointer; }
.tb-lightbox-img { max-width: 100%; height: auto; }

/* ── photo gallery ── */
.tb-photo-gallery { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 1.5em; }
.tb-photo-gallery img { max-width: 100%; height: auto; border-radius: 5px; }

/* contents内のp, span後にmargin-bottom */
.contents p,
.contentArea p,
.searchArea p { margin-bottom: 10px; }

.contents span,
.contentArea span { display: inline; }

/* wp-block-image → tb-block-image */
.wp-block-image,
.tb-block-image {
margin: 15px 0;
text-align: center;
}
.wp-block-image img,
.tb-block-image img {
max-width: 100%;
height: auto;
}
.wp-block-image figcaption,
.tb-block-image figcaption {
font-size: 12px;
color: #999;
margin-top: 5px;
}

/* FAQ dt styling for accordion */
.faqList dt {
cursor: pointer;
background: #fef4f7;
padding: 12px 15px;
margin-bottom: 3px;
color: #f5568b;
font-weight: bold;
position: relative;
}
.faqList dt:hover { background: #fde8ef; }
.faqList dt span.open:before {
content: '\f067';
font-family: 'Font Awesome 6 Free';
font-weight: 900;
margin-right: 8px;
font-size: 12px;
}
.faqList dd {
padding: 12px 15px;
border-bottom: 1px dotted #ddd;
line-height: 1.8;
}
.faqList dd .a {
color: #f5568b;
font-weight: bold;
margin-right: 5px;
}

/* SP nav > symbol fix */
.menu li a:after,
.otherMenu ul li a:after {
content: '';
}

/* SP breadcrumb duplicate fix */
.breadcrumb + .breadcrumb { display: none; }

/* メインビジュアル下のカルーセルとの間隔 */
.subVisualArea { margin-top: 5px; }

/* Privacy policy heading */
.privacy-policy h2,
.page h2 {
color: #f5568b;
border-bottom: 2px solid #f5568b;
padding-bottom: 5px;
margin: 20px 0 10px;
font-size: 18px;
}

/* カスタム投稿の編集画面でテンプレート選択UI */

.tb-speech-balloon {
display: flex;
align-items: flex-start;
margin: 15px 0;
padding: 0;
clear: both;
}
.tb-speech-avatar {
flex-shrink: 0;
width: 60px;
height: 60px;
border-radius: 50%;
background: #eee;
margin-right: 12px;
}
.tb-speech-text {
position: relative;
background: #f7f7f7;
border-radius: 10px;
padding: 12px 16px;
flex: 1;
line-height: 1.7;
font-size: 14px;
}
.tb-speech-text p { margin: 0; }
.tb-speech-arrow {
position: absolute;
left: -8px;
top: 15px;
width: 0;
height: 0;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-right: 8px solid #f7f7f7;
}
/* Right-aligned balloon */
.tb-speech-right {
flex-direction: row-reverse;
}
.tb-speech-right .tb-speech-avatar {
margin-right: 0;
margin-left: 12px;
}
.tb-speech-right .tb-speech-arrow {
left: auto;
right: -8px;
border-right: none;
border-left: 8px solid #f7f7f7;
}
/* Color variants */
.tb-speech-00 .tb-speech-text {
background: #e8f5e9;
border: 1px solid #c1d4c5;
}
.tb-speech-00 .tb-speech-arrow {
border-right-color: #e8f5e9;
}
.tb-speech-06 .tb-speech-text {
background: #fce4ec;
border: 1px solid #f78da7;
}
.tb-speech-06 .tb-speech-arrow,
.tb-speech-right.tb-speech-06 .tb-speech-arrow {
border-left-color: #fce4ec;
border-right-color: #fce4ec;
}
/* Dashed border */
.tb-speech-dashed .tb-speech-text {
border-style: dashed;
}
/* Shadow */
.tb-speech-shadow .tb-speech-text {
box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
}
/* Interview section speech balloons (salary page) */
.interview {
display: flex;
flex-direction: column;
align-items: center;
width: 100px;
flex-shrink: 0;
margin-right: 12px;
text-align: center;
}
.interview img { border-radius: 50%; margin-bottom: 5px; }
.interview .age,
.interview .howwork,
.interview .workstylestyle {
font-size: 11px;
color: #999;
display: block;
}
.introduce_comment {
font-size: 13px;
line-height: 1.8;
}

.tb-speech-02 .tb-speech-text {
background: #e3f2fd;
border: 1px dashed #90caf9;
}
.tb-speech-04 .tb-speech-text {
background: #fff3e0;
border: 1px dashed #ffb74d;
}
.tb-speech-vertical {
flex-direction: column;
align-items: flex-start;
}
.tb-speech-vertical .tb-speech-avatar {
margin: 0 0 8px 0;
}
.tb-speech-vertical .tb-speech-text {
width: 100%;
}
.tb-speech-vertical .tb-speech-arrow {
left: 20px;
top: -8px;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid #f7f7f7;
border-top: none;
}

.newsIndexBox {
padding: 10px;
border-bottom: 1px dotted #ddd;
}
.newsList {
margin: 0;
padding: 0;
}
.newsOne {
margin-bottom: 10px;
}
.newsOne article {
padding: 5px 0;
}
.newsOne article time {
display: block;
font-size: 12px;
color: #999;
margin-bottom: 5px;
}
.newsOne article h1 {
font-size: 16px;
margin: 0 0 8px;
}
.newsOne article h1 a {
color: #f5568b;
text-decoration: none;
}
.newsOne article h1 a:hover {
text-decoration: underline;
}
.postDetail {
font-size: 14px;
line-height: 1.7;
}
.postDetail img {
max-width: 100%;
height: auto;
}

.tb-gallery {
display: grid;
gap: 8px;
margin: 15px 0;
}
.tb-gallery-7, .tb-gallery-6, .tb-gallery-5 { grid-template-columns: repeat(3, 1fr); }
.tb-gallery-4 { grid-template-columns: repeat(2, 1fr); }
.tb-gallery-3 { grid-template-columns: repeat(3, 1fr); }
.tb-gallery-2 { grid-template-columns: repeat(2, 1fr); }
.tb-gallery-1 { grid-template-columns: 1fr; }
.tb-gallery-item {
margin: 0;
cursor: pointer;
overflow: hidden;
border-radius: 4px;
transition: transform 0.2s;
}
.tb-gallery-item:hover { transform: scale(1.02); }
.tb-gallery-item img {
width: 100%;
height: 180px;
object-fit: cover;
display: block;
}
.tb-gallery-item figcaption {
font-size: 11px;
color: #999;
text-align: center;
padding: 4px;
background: #f9f9f9;
}
@media (max-width: 768px) {
.tb-gallery-7, .tb-gallery-6, .tb-gallery-5 { grid-template-columns: repeat(2, 1fr); }
.tb-gallery-item img { height: 120px; }
}

/* アバター共通 */
.tb-speech-avatar {
width: 80px;
height: 80px;
border-radius: 50%;
background-size: cover;
background-position: center;
flex-shrink: 0;
position: relative;
}
.tb-speech-avatar::after {
content: attr(data-name);
display: block;
text-align: center;
font-size: 11px;
color: #666;
margin-top: 4px;
position: absolute;
bottom: -18px;
left: 50%;
transform: translateX(-50%);
white-space: nowrap;
}
.tb-speech-balloon {
margin-bottom: 25px;
}

/* 各アバター画像 */
.tb-speech-00 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/img_experience_image_01-1.png");
}
.tb-speech-00 .tb-speech-avatar::after { content: "スタッフ"; }

.tb-speech-01 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/img_experience_image_01-2.png");
}
.tb-speech-01 .tb-speech-avatar::after { content: "女の子"; }

.tb-speech-02 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/img_kakemoti_photo_02-1.jpg");
}
.tb-speech-02 .tb-speech-avatar::after { content: "みゆき"; }

.tb-speech-03 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/interview001.png");
}
.tb-speech-03 .tb-speech-avatar::after { content: "あきな"; }

.tb-speech-04 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/interview002.png");
}
.tb-speech-04 .tb-speech-avatar::after { content: "らん"; }

.tb-speech-05 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/interview003.png");
}
.tb-speech-05 .tb-speech-avatar::after { content: "しぐれ"; }

.tb-speech-06 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/interview004.png");
}
.tb-speech-06 .tb-speech-avatar::after { content: ""; }

.tb-speech-07 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/interview005.png");
}
.tb-speech-07 .tb-speech-avatar::after { content: ""; }

.tb-speech-08 .tb-speech-avatar {
background-image: url("https://tobita-kyujin.com/wp-content/uploads/2019/10/1561005370.jpg");
}

/* 右寄せバルーンのマージン */
.tb-speech-right {
flex-direction: row-reverse;
}
.tb-speech-right .tb-speech-avatar {
margin-right: 0;
margin-left: 15px;
}
/* 左バルーンのマージン */
.tb-speech-balloon:not(.tb-speech-right) .tb-speech-avatar {
margin-right: 15px;
}
/* テキストバルーンの色指定はstyle属性で来るのでborderに変換 */
.tb-speech-text[style*="color:#c1d4c5"],
.tb-speech-text[style*="color:#c0d3c4"] {
color: #333 !important;
background: #e8f5e9;
border: 1px solid #c1d4c5;
}
.tb-speech-text[style*="color:#f78da7"] {
color: #333 !important;
background: #fce4ec;
border: 1px solid #f78da7;
}
.tb-speech-dashed .tb-speech-text {
border-style: dashed !important;
}
.tb-speech-shadow .tb-speech-text {
box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
}
/* 矢印の色を背景に合わせる */
.tb-speech-text[style*="color:#c1d4c5"] .tb-speech-arrow,
.tb-speech-text[style*="color:#c0d3c4"] .tb-speech-arrow {
border-right-color: #e8f5e9;
}
.tb-speech-right .tb-speech-text[style*="color:#f78da7"] .tb-speech-arrow {
border-left-color: #fce4ec;
border-right: none;
}


/* ================================
   サイトマップ
================================ */
.tobita-sitemap h2 {
    font-size: 18px;
    color: #f5568b;
    border-bottom: 2px solid #f5568b;
    padding-bottom: 5px;
    margin: 25px 0 10px;
}
.tobita-sitemap .sitemap-list {
    list-style: none;
    padding: 0;
    margin: 0 0 15px;
}
.tobita-sitemap .sitemap-list li {
    padding: 8px 0 8px 20px;
    border-bottom: 1px dotted #ddd;
    position: relative;
}
.tobita-sitemap .sitemap-list li:before {
    content: '\f054';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 10px;
    color: #f5568b;
    position: absolute;
    left: 0;
    top: 10px;
}
.tobita-sitemap .sitemap-list li a {
    color: #333;
    text-decoration: none;
}
.tobita-sitemap .sitemap-list li a:hover {
    text-decoration: underline;
    color: #f5568b;
}
.tobita-sitemap .sitemap-list ul {
    list-style: none;
    padding: 5px 0 0 15px;
    margin: 0;
}
.tobita-sitemap .sitemap-list ul li {
    border-bottom: none;
    padding: 4px 0 4px 15px;
}
.tobita-sitemap .sitemap-list ul li:before {
    content: '－';
    font-family: inherit;
    color: #ccc;
}
.tobita-sitemap .sitemap-list small {
    color: #999;
    margin-left: 8px;
}