@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELL Child Theme
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* =========================================================
 * Base Style
 * ========================================================= */

/* -------------------------------------
 * 1. Typography: Mincho Font for Section Titles
 * ------------------------------------- */
body .page .post_content h2.is-style-section_ttl,
body .page .post_content h3.is-style-section_ttl {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif !important;
  font-weight: normal !important; 
  font-size: 2.3rem !important; 
  letter-spacing: 0.15em !important; 
}

/* -------------------------------------
 * 2. Microinteraction: Hover Line Animation
 * ------------------------------------- */
/* 1. Target areas (paragraphs, lists, sidebar, footer) */
.post_content p a,
.post_content li a,
#sidebar a,
#footer a {
  position: relative;
  text-decoration: none !important;
  display: inline-block; 
  cursor: pointer !important; 
  z-index: 1; /* 【追加】沈み込んだリンクを最前面に引っ張り出す */
}

/* 【追加】リンクの中にある文字や要素も確実に指マークにする */
.post_content p a *,
.post_content li a *,
#sidebar a *,
#footer a * {
  cursor: pointer !important;
}

/* 2. Initial line state */
.post_content p a::after,
.post_content li a::after,
#sidebar a::after,
#footer a::after {
  content: '';
  position: absolute;
  bottom: -2px; 
  left: 0;
  width: 100%;
  height: 1px; 
  background-color: currentColor; 
  transform: scaleX(0);
  transform-origin: left top;
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); 
  pointer-events: none; 
}

/* 3. Hover action */
.post_content p a:hover::after,
.post_content li a:hover::after,
#sidebar a:hover::after,
#footer a:hover::after {
  transform: scaleX(1);
}

/* 4. Prevent line on image links */
.post_content p a:has(img)::after,
.post_content li a:has(img)::after,
#sidebar a:has(img)::after,
#footer a:has(img)::after {
  display: none !important;
}