/*
Theme Name: Rsupport WD Theme
Theme URI: https://www.rsupport.com
Author: DX Team
Author URI: https://www.rsupport.com
Description: Rsupport Theme
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: RsupportRoot
*/

/* Noto Sans JP */
@font-face {
    font-family:'Noto Sans JP';
    font-style:normal;
    font-weight:300;
    src: url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Light.otf) format('opentype');
    font-display: swap;
}
@font-face {
    font-family:'Noto Sans JP';
    font-style:normal;
    font-weight:400;
    src:url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Regular.woff2) format('woff2'),
        url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Regular.woff) format('woff'),
        url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Regular.otf) format('opentype');
    font-display: swap;
}
@font-face {
    font-family:'Noto Sans JP';
    font-style:normal;
    font-weight:500;
    src: url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Medium.otf) format('opentype');
    font-display: swap;
}
@font-face {
    font-family:'Noto Sans JP';
    font-style:normal;
    font-weight:700;
    src:url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Bold.woff2) format('woff2'),
        url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Bold.woff) format('woff'),
        url(/wp-content/themes/rsupport-wd/assets/fonts/NotoSansJP-Bold.otf) format('opentype');
    font-display: swap;
}

body{font-weight:400; font-family: "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;}


 html { scroll-behavior: smooth; }
.nf-form-fields-required, .nf-error.field-wrap .nf-field-element:after{display:none;}
#contact .nf-form-content label{margin-bottom: 0.5rem;color:rgb(51 65 85);font-size: 0.875rem;line-height: 1.25rem;font-weight: 700;}
#contact .nf-form-content .list-select-wrap>div select{border:0;background-color: rgb(248 250 252);color:rgb(51 65 85);font-size: 0.875rem;line-height: 1.25rem;appearance:auto}
#contact .nf-form-content input:not([type=button]), #contact .nf-form-content textarea{border:0;background-color: rgb(248 250 252);color:rgb(51 65 85);font-size: 0.875rem;line-height: 1.25rem;outline:none;}
#contact .nf-form-content input:not([type=button]):focus, #contact .nf-form-content textarea:focus{outline:1px solid #56ACFF;}
#contact .checkbox-container.label-right label{font-weight: 400;}
#contact .checkbox-container a{position: relative; z-index: 1;}
#contact .nf-form-content input[type=submit] {width:100%; background-color: rgb(15 23 42);color:#fff; font-weight:700;cursor:pointer; }
#contact .nf-after-form-content{text-align:center;}


/* ===== NAV BAR ===== */
#gnbWrap { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(12px); border-bottom: 1px solid #f1f1f1; box-shadow: 0 1px 2px rgba(0,0,0,0.04); transition: all 0.3s ease;}
#menu-gnb { display: flex; align-items: center; gap: 1.5rem; height: 80px;  margin: 0 auto; padding: 0 ; list-style: none;}
#menu-gnb > li > a { font-size: 0.875rem; /* text-sm */ font-weight: 700; letter-spacing: 0.05em; color: #4b5563;     /* text-gray-600 */ text-decoration: none; white-space: nowrap; transition: color 0.2s ease;}
#menu-gnb > li > a:hover {color: #2563eb; /* wsc-blue */}
#menu-gnb > li.current-menu-item > a,
#menu-gnb > li.current-menu-ancestor > a,
#menu-gnb > li.current-page-ancestor > a,
#menu-gnb > li.current-menu-parent > a {
    color: #2563eb;
}

/* ===== SUB MENU ===== */
#menu-gnb li {position: relative;}
#menu-gnb .sub-menu { position: absolute; top: calc(100% + 12px); left: 0; min-width: 240px; background: #ffffff; border: 1px solid #e5e7eb; border-radius: 12px; box-shadow: 0 10px 25px rgba(0,0,0,0.08); padding: 0.5rem 0; list-style: none; opacity: 0; visibility: hidden; transform: translateY(10px); transition: all 0.25s ease; z-index: 100;}
#menu-gnb li:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0);}
#menu-gnb .sub-menu li a { display: block; padding: 0.75rem 1rem; font-size: 0.9rem; font-weight: 600; color: #4b5563; text-decoration: none; border-radius: 8px; transition: all 0.2s ease;}
#menu-gnb .sub-menu li a:hover,
#menu-gnb .sub-menu li.current-menu-item a { color: #2563eb; background-color: #eff6ff; /* blue-50 */}

@media (max-width: 1023px) {
  #menu-gnb { flex-direction: column; align-items: flex-start; height: auto; padding: 1rem;}
  #menu-gnb > li { width: 100%;}
  #menu-gnb > li > a { padding: 0.75rem 1rem; width: 100%;}

  /* 모바일에선 hover dropdown 제거 */
  #menu-gnb .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; padding-left: 1rem;}
}

/* ===== MOBILE GNB ===== */
#mobileGnb { position: absolute; /* sticky nav 기준 */ top: 100%; /* nav 바로 아래 */ left: 0; width: 100%;background: #ffffff; border-top: 1px solid #e5e7eb; box-shadow: 0 12px 30px rgba(0,0,0,0.12); z-index: 40;             /* nav 내부라 40이면 충분 */}
.mobile-gnb {list-style: none;margin: 0;padding: 1rem;}
.mobile-cta {position: sticky;bottom: 0;}
.mobile-gnb > li {border-bottom: 1px solid #e5e7eb;}
.mobile-gnb > li > a { display: flex; justify-content: space-between; align-items: center; padding: 0.9rem 0.5rem; font-size: 1rem; font-weight: 700; color: #374151; text-decoration: none;}
.mobile-gnb > li.current-menu-item > a,
.mobile-gnb > li.current-menu-ancestor > a,
.mobile-gnb > li.current-page-ancestor > a {
    color: #2563eb;
}
.mobile-gnb li.menu-item-has-children > a::after { content: "＋"; font-size: 1.2rem; transition: transform 0.2s ease;}
.mobile-gnb li.open > a::after { content: "－";}
.mobile-gnb .sub-menu { display: none; list-style: none; padding: 0 0 0.75rem 0.75rem;}
.mobile-gnb .sub-menu a { display: block; padding: 0.6rem 0; font-size: 0.95rem; font-weight: 600; color: #4b5563; text-decoration: none;}
.mobile-gnb .sub-menu li.current-menu-item a { color: #2563eb; }
/* 활성화 */
.mobile-gnb li.open > .sub-menu {display: block;}

/* ===== MOBILE CTA ===== */
.mobile-cta { padding: 1rem; display: flex; flex-direction: column; gap: 0.75rem; background: #ffffff;}

/* =========================================
   Note-style Blog CSS
   Target: Blog posts only (Page Builder wrapped)
   ========================================= */

/* Step 1: Restore post title when using SiteOrigin */
.single-post .entry-title {
  display: block;
}

/* Step 2: Align title container with note-article width */
.single-post .entry-header {
  max-width: 720px;
  margin: 64px auto 40px;
  padding: 0 24px;
}

/* Step 3: Post title typography */
.single-post .entry-title {
  font-size: 32px;
  line-height: 1.35;
  font-weight: 700;
  color: #111;
}

/* Step 4: Mobile adjustments */
@media (max-width: 768px) {
  .single-post .entry-header {
    margin: 40px auto 24px;
    padding: 0 16px;
  }

  .single-post .entry-title {
    font-size: 26px;
  }
}

/* 글 영역 래퍼 (Page Builder Row에 note-article 클래스 적용) */
.note-article {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 24px;
}


/* =========================
   タイトル
   ========================= */
.note-article h1 {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.35;
  margin-top: 48px;      /* ← 제목 상단 여백 */
  margin-bottom: 32px;
}

/* =========================
   中間タイトル
   ========================= */
.note-article h2 {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  margin-top: 56px;
  margin-bottom: 20px;
}

.note-article h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.5;
  margin-top: 20px;
  margin-bottom: 10px;
}

/* =========================
   本文
   ========================= */
.note-article p {
  font-size: 17px;
  line-height: 2;
  margin-bottom: 1.6em;
}

/* 첫 문단 살짝 강조 (note 느낌) */
.note-article p:first-of-type {
  font-size: 17.5px;
}

/* =========================
   リスト（불릿 복구）
   ========================= */
.note-article ul {
  list-style: disc;
  padding-left: 1.6em;
  margin: 24px 0;
}

.note-article ol {
  list-style: decimal;
  padding-left: 1.6em;
  margin: 24px 0;
}

.note-article li {
  margin-bottom: 0.6em;
  line-height: 1.9;
}

/* =========================
   区切り線
   ========================= */
.note-article hr {
  border: none;
  border-top: 1px solid #e5e7eb;
  margin: 48px 0;
}

/* =========================
   画像
   ========================= */
.note-article img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 40px auto;
}

/* =========================
   モバイル調整
   ========================= */
@media (max-width: 768px) {
  .note-article {
    padding: 0 16px;
  }

  .note-article h1 {
    font-size: 26px;
    margin-top: 32px;
  }

  .note-article h2 {
    font-size: 20px;
    margin-top: 40px;
  }

  .note-article p {
    font-size: 16px;
    line-height: 1.9;
  }
}

/* 블로그 목록(아카이브)에서는 Page Builder 제목 숨김 */
.blog .post-title-row,
.archive .post-title-row {
  display: none;
}

.note-article a { color: #0a55a5; font-weight: 700; text-decoration: underline; text-underline-offset: 2px;}


/* ===== 블로그 ===== */
.category.column {color:#d62021;} /* 기술 칼럼 */
.category.guide {color:#f9991f;} /* 기업 보안 가이드 */
.category.tip {color:#6c46ea;} /* 화이트디펜더 활용 팁 */
.category.news {color:#119284;} /* 일본 랜섬웨어 뉴스 */
.category.update {color:#28a1ef;} /* 업데이트 소식 */

.category.ransomware-basics {color:#119284;}
.category.initial-response {color:#d62021;}
.category.trends {color:#6c46ea;}
.category.incidents {color:#f9991f;}
.category.tech {color:#28a1ef;}
.category.risk {color:#ea580c;}


/* 블로그 검색창 추가 */
.search_inner {display: flex; justify-content: flex-end;}
.search_inner .search_wrap {flex:1;max-width:320px;}
.search_inner .search_wrap form{display:flex;align-items:center; justify-content:space-between; height:46px; padding:0px 16px;border-radius: 4px; border: 1px solid #819CBB; background:  #F6F7F9;}
.search_inner .search_wrap input[type="search"], .search_wrap input[type="search"]:active {flex:1;height:46px;background:none;border:0;font-size: 16px;font-weight: 500;line-height:1.5; letter-spacing: -0.048px;vertical-align: top;}
.search_inner .search_wrap input[type="search"]:focus-visible {outline:none;}
.search_inner .search_wrap button{border:0;width:20px; height:20px; background: url(/wp-content/uploads/image/common/ico_search.webp) no-repeat center / 20px 20px }
.blind { width: 0; height: 0; text-indent: -10000px; font-size: 0; line-height: 0; position: absolute; left: -99999px}

/* 블로그 sub-blog */
.sub-blog .select_tab_wrap button { flex: auto;}
.sub-blog .select_tab_wrap button {padding: 5px 15px 7px;color: #959595;border-bottom: 2px solid transparent;}
.sub-blog .select_tab_wrap button.active[data-filter=".all"] { border-color: #2b6aef; color: #2b6aef;}
.sub-blog .select_tab_wrap button.active[data-filter=".ransomware-basics"] { border-color: #119284; color:#119284;}
.sub-blog .select_tab_wrap button.active[data-filter=".initial-response"] { border-color: #d62021; color:#d62021;}
.sub-blog .select_tab_wrap button.active[data-filter=".trends"] { border-color: #6c46ea; color:#6c46ea;}
.sub-blog .select_tab_wrap button.active[data-filter=".incidents"] { border-color: #f9991f; color:#f9991f;}
.sub-blog .select_tab_wrap button.active[data-filter=".tech"] { border-color: #28a1ef; color:#28a1ef;}
.sub-blog .select_tab_wrap button.active[data-filter=".risk"] { border-color: #ea580c; color: #ea580c;}

/* .blog_list h3 { font-size: 15px; font-weight: 600; color: #000;}
.blog_list p { font-size: 13px; line-height: 23px; padding: 16px 0 0; color: #000;} */
.nav-links {text-align: center; margin-top: 30px;}
.nav-links > a {font-size: 18px; padding: 0 8px;}
.nav-links > span {font-size: 18px;  padding: 0 8px;}
.nav-links .pg_arrow { display: inline-block; width: 20px; height: 20px; background: #ddd; padding: 0 8px; border-radius: 50px; vertical-align: middle;}

/* 블로그 탭 수정? */
.sub-blog .select_tab_wrap a { flex: auto; text-align: center; padding: 5px 15px 7px;color: #959595;border-bottom: 2px solid transparent;}
.sub-blog .select_tab_wrap a.active {font-weight: 500;}
.sub-blog .select_tab_wrap a:nth-child(1).active { border-color: #2b6aef; color: #2b6aef;}
.sub-blog .select_tab_wrap a:nth-child(2).active { border-color: #119284; color:#119284;}
.sub-blog .select_tab_wrap a:nth-child(3).active { border-color: #d62021; color:#d62021;}
.sub-blog .select_tab_wrap a:nth-child(4).active { border-color: #6c46ea; color:#6c46ea;}
.sub-blog .select_tab_wrap a:nth-child(5).active { border-color: #f9991f; color:#f9991f;}
.sub-blog .select_tab_wrap a:nth-child(6).active { border-color: #28a1ef; color:#28a1ef;}
.sub-blog .select_tab_wrap a:nth-child(7).active { border-color: #ea580c; color: #ea580c;}

/* 블로그 컨텐츠 */
.blog_header { padding: 60px 0 0 0;}
.blog_header .inner { margin: 0 auto; max-width: 720px; padding: 0 20px; text-align: center}
.blog_header .inner .category {display: inline-block; font-size: 16px; font-weight: 700; padding: 8px 25px; border-radius: 22px; background-color: #707070; color: #fff;}
.blog_header .inner .category.ransomware-basics {background-color:#119284;}
.blog_header .inner .category.initial-response {background-color:#d62021;}
.blog_header .inner .category.trends {background-color:#6c46ea;}
.blog_header .inner .category.incidents {background-color:#f9991f;}
.blog_header .inner .category.tech {background-color:#28a1ef;}
.blog_header .inner .category.risk {background-color:#ea580c;}
.blog_header .inner .title { font-size: 43px; font-weight: 700; margin-top: 20px; margin: 20px 0 30px;}
.post_notice { padding-top:30px;}
.post_notice .inner figure img {margin: 0 auto;}


/* 도입 사례  sub-use-case */
.sub-use-case .select_tab_wrap button { flex: 1 16%; max-width: 25%; padding: 5px 15px 7px;color: #959595; border-bottom: 4px solid transparent;}
.sub-use-case .select_tab_wrap button.active {color:#101828;}
.sub-use-case .select_tab_wrap button.active[data-filter="*"] { border-color: #2563eb;}
.sub-use-case .select_tab_wrap button.active[data-filter=".commerce"] { border-color: #119284;}
.sub-use-case .select_tab_wrap button.active[data-filter=".logistic"] { border-color: #d62021;}
.sub-use-case .select_tab_wrap button.active[data-filter=".public"] { border-color: #6c46ea;}
.sub-use-case .select_tab_wrap button.active[data-filter=".chemical"] { border-color: #f9991f;}
.sub-use-case .select_tab_wrap button.active[data-filter=".entertainment"] { border-color: #28a1ef;}


.sub-use-case .item_istp {padding: 0 10px; margin-bottom: 20px;}
.sub-use-case .item_istp h3 { font-size: 15px; font-weight: 600; color: #000;}
.sub-use-case .item_istp p { font-size: 13px; line-height: 23px; padding: 16px 0 0; color: #000;}


@media (min-width: 769px) {
  .select_tab_wrap { display: flex; justify-content: flex-start;}
}
@media (max-width: 767px) {
    .select_tab_wrap { overflow: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; width: 100%; white-space: nowrap; margin-top: 10px; padding-bottom: 4px}
    .select_tab_wrap::-webkit-scrollbar { -webkit-appearance: none}
    .select_tab_wrap::-webkit-scrollbar:vertical {  width: 4px}
    .select_tab_wrap::-webkit-scrollbar:horizontal {  height: 4px}
    .select_tab_wrap::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.2); border-radius: 3px}
    .select_tab_wrap::-webkit-scrollbar-track { border-radius: 3px;  background-color: rgba(255,255,255,.5)}
    .select_tab_wrap button { padding-left: 7px;  padding-right: 7px}
  }


/* 랜섬웨어 정보 */
.note-article.video_content {max-width: 920px;}
.note-article.video_content .v_list2 ul {list-style: none; padding-left: 0;} 
.video_content table { width: 100%; border-top: 1px solid #444444; border-collapse: collapse;}
.video_content table th, .video_content table td { border-bottom: 1px solid #444444; border-left: 1px solid #444444; padding: 10px}
.video_content table th:first-child, .video_content table td:first-child { border-left: none; }
.board_view_02 .b_content strong {display: inline;}
.b_content p br {line-height:35px;}




/* cta 효과 공통 */
a.btn-sweep-x {position: relative; overflow: hidden; z-index: 0;}
a.btn-sweep-x::before { content: ""; position: absolute; inset: -1px; background: #094b7b; z-index: -1; transform-origin: right center; transform: scaleX(0); transition: transform .25s ease-in-out;}
a.btn-sweep-x:hover::before{ transform-origin: left center; transform: scaleX(1);}

/* ninja file upload */
.upload .nf-field-element {
    position: relative
}

.upload .nf-field-element::after {
    content: "ファイルを追加またはここにファイルをドロップ";
    color: #9ea3ae;
    font-size: 13px;
    line-height: 1.3;
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translate(-50%,0);
    text-align: center
}

.upload .nf-field-element .btn-success {
    width: 100%; height: 100%;
    position: absolute;
    text-indent: -99999px;
    background-color: transparent;
    z-index: 1;
}

.upload .nf-field-element .btn-success:hover {
    opacity: .6
}

.upload .nf-fu-progress {
    height: 130px;
    background-color: #fff;
    border-radius: 4px;
    border: 1px solid #ccc;
    margin-bottom: 0
}

.upload .nf-field-description {
    order: 16
}

.upload .nf-fu-button-cancel {
    position: absolute;
    top: 0;
    right: 0;
    float: none;
    border-radius: 3px;
    padding: 2px 5px
}
.files_uploaded {
    position: relative;
    padding: 8px 0
}

.files_uploaded::after {
    display: block;
    color: #a6aabb;
    font-size: 14px;
    line-height: 1.3;
    white-space: pre-wrap
}



.files_uploaded p {
    padding: 0 0 8px
}

.files_uploaded p a {
    display: inline-block;
    border-radius: 3px;
    padding: 2px 5px;
    background: #000;
    color: #fff
}