/* ========================================================================== 鬮ｫ・ｴ陞溘ｇ諢幃垈雋ｻ・ｽ・ｽ鬮ｴ螟ｧ・､・ｲ繝ｻ・ｽ繝ｻ・ｹ鬮ｫ・ｹ繝ｻ・ｿ鬯ｮ・ｮ遶擾ｽｫ隶捺ｻ・ｽｨ・ｾ闕ｵ譎｢・ｽ蛹ｻ繝ｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｪ鬮ｯ貅ｷ蠎翫・・ｸ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｼ髯樊ｺ假ｽ代・・ｽ繝ｻ・､郢晢ｽｻ繝ｻ・ｾ - 鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ髯ｷ・ｻ繝ｻ・ｵ郢晢ｽｻ繝ｻ・ｧ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｧ鬮｢・ｾ繝ｻ・･郢晢ｽｻ繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｻ髫ｰ繝ｻ迴ｾ郢晢ｽｻ(鬮ｮ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・｣鬮ｯ貅ｷ蠎翫・・ｸ隶抵ｽｫ郢晢ｽｻ鬮ｴ螟ｧ・｣・ｽ繝ｻ・ｪ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｴ郢晢ｽｻ繝ｻ・ｰ鬮ｫ・ｴ陞｢・ｼ郢晢ｽｻ鬨ｾ蟇よ升隲､・ｦ郢晢ｽｻ繝ｻ・･) 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷ｻ・ｵ陷ｿ蟲ｨ繝ｻ繝ｻ・ｻ髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ髯ｷ・ｩ繝ｻ・ｭogo 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢驛｢譎｢・ｽ・ｻ髯晢ｽｷ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｾ驛｢譎｢・ｽ・ｻ髯ｷ謳ｾ・ｽ・ｧ髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ雜｣・ｽ・｢郢晢ｽｻ繝ｻ・ｼ髯晢ｽｷ郢晢ｽｻ・取ｨ｣蝙馴屆・｣繝ｻ・ｽ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ髯樊ｺ假ｽ・ｬ・・・ｹ譎｢・ｽ・ｻ髯晢ｽｶ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｭ郢晢ｽｻ繝ｻ・｣鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｼ髯橸ｽ｢繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｱ鬮ｴ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｰ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ / 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｮ・ｫ陷会ｽｱ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｧ驛｢譎｢・ｽ・ｻHero 鬮ｯ譎｢・ｽ・ｾ郢晢ｽｻ繝ｻ・ｲ鬮ｫ・ｰ隴会ｽｦ繝ｻ・ｽ繝ｻ・･鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・･鬮ｮ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・｣鬮ｯ貊会ｽｻ・｣郢晢ｽｻLogo 鬮｣蛹・ｽｽ・ｳ髣包ｽｳ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｰ鬲・ｼ夲ｽｽ・ｽ繝ｻ・ｷ鬮ｫ・ｰ繝ｻ・ｰ鬮ｯ諛会ｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｾ髯晢ｽｶ繝ｻ・ｷ髯懆ｶ｣・ｽ・ｪ Hero 鬯ｮ・｢繝ｻ・ｭ髫ｴ・ｴ繝ｻ・ｧ髯ｷ謳ｾ・ｽ・ｹ鬮ｯ諛亥惧繝ｻ・ｽ繝ｻ・ｾ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ ========================================================================== */ /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｰ 鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｾ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・｡鬮ｯ・ｷ繝ｻ・ｿ髯区ｻゑｽｽ・ｬ驛､繝ｻ・ｽ・ｼ (Design Tokens) ---------- */ :root { /* 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢驛｢譎｢・ｽ・ｻ髣費｣ｰ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｻ驛｢譎｢・ｽ・ｻLogo 鬮ｯ讖ｸ・ｽ・ｳ髫ｶ髮｣・ｽ・｣髯具ｽｻ驕伜∞・ｽ・ｩ繝ｻ・･驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｷ #CF0D1C驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ --sg-red-700: #a80a16; --sg-red-600: #cf0d1c; /* 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻLogo 鬯ｯ・ｩ繝ｻ・･驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｷ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ --sg-red-500: #e02533; --sg-red-100: #fdedee; /* 鬮ｮ譛ｱ・ｯ莨夲ｽｽ・ｽ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ雜｣・ｽ・｢郢晢ｽｻ繝ｻ・ｼ鬯ｩ蟶吶・繝ｻ・ｽ繝ｻ・ｾ驛｢譎｢・ｽ・ｻ髯ｷ謳ｾ・ｽ・ｧ鬮ｮ蜿悶＝繝ｻ・ｸ陝ｶ蟷｢・ｽ・ｳ繝ｻ・ｩ髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ --sg-water-700: #397f98; --sg-water-500: #72b7cc; --sg-water-200: #dceff5; --sg-water-100: #eef8fb; /* 鬮ｫ・ｴ遶丞｣ｹ繝ｻ髫ｰ雋ｻ・ｽ・ｽ / 鬯ｮ・ｴ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｹ鬮ｫ・ｴ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ/ 鬯ｮ・｢繝ｻ・ｭ髫ｴ・ｴ繝ｻ・ｧ髯ｷ謳ｾ・ｽ・ｹ */ --sg-text-900: #1d2226; --sg-text-700: #4b555b; --sg-border: #e3e7e9; --sg-background: #ffffff; /* Hero 鬮｣蛹・ｽｽ・ｳ鬯ｪ・ｰ霑｢闍薙・鬮ｫ・ｴ遶丞｣ｹ繝ｻ髫ｰ雋ｻ・ｽ・ｽ驛｢譎｢・ｽ・ｻ髯懈瑳・ｻ繧托ｽｽ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ髴大､ｲ・ｽ・｡鬮ｮ譛ｱ・ｯ莨夲ｽｽ・ｽ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ蟇ゅ・・取ｨ｣蝙馴屆・｣繝ｻ・ｽ繝ｻ・ｯ鬮ｯ諛亥惧繝ｻ・ｽ繝ｻ・ｾ鬮｣蛹・ｽｽ・ｳ髯槭ｅ繝ｻ繝ｻ・ｽ繝ｻ・ｼ髯溷桁・ｽ・｡郢晢ｽｻ繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｿ鬯ｨ・ｾ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｨ鬮ｮ雜｣・ｽ・ｺ郢晢ｽｻ繝ｻ・ｱ鬮ｴ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｰ/鬮ｮ雜｣・ｽ・ｺ郢晢ｽｻ繝ｻ・ｱ鬯ｮ・｣繝ｻ・｢髫ｴ荳ｻ・ｳ・ｨ郢晢ｽｻ鬮｣蜴・ｽｽ・ｫ髫ｴ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・ｯ驕ｶ荵怜款繝ｻ・ｽ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｹ鬮ｮ荳ｻ豐ｺ繝ｻ・ｳ鬲・ｼ夲ｽｽ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｦ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ --sg-hero-title: #1d2d35; --sg-hero-text: #4a5b63; --sg-hero-eyebrow: var(--sg-red-700); /* 鬮ｯ諛ｶ・ｽ・ｨ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｧ驛｢譎｢・ｽ・ｻ*/ --sg-radius-sm: 6px; --sg-radius-md: 10px; --sg-radius-lg: 18px; /* 鬮ｯ譎｢・ｽ・ｶ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ繝ｻ縺､ﾂ€ */ --sg-content-width: 1180px; --sg-space: 8px; /* 鬯ｯ・ｮ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｴ鬮ｯ貅ｷ遘√・・ｽ繝ｻ・ｱ驛｢譎｢・ｽ・ｻ髣費｣ｰ繝ｻ・･驛｢譎｢・ｽ・ｻ鬮ｯ蜈ｷ・ｽ・ｻ郢晢ｽｻ繝ｻ・ｶ鬩搾ｽｵ繝ｻ・ｲ驕ｶ謫ｾ・ｽ・ｽ郢晢ｽｻ繝ｻ・ｽ髣包ｽｳ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｹ鬮ｮ譛ｱ繝｡繝ｻ・ｲ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ --sg-shadow: 0 12px 36px rgba(23, 31, 33, 0.08); --sg-shadow-hover: 0 20px 46px rgba(23, 31, 33, 0.13); /* 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ鬯ｯ・ｯ繝ｻ・ｮ髣費ｽｨ隲幢ｽｶ繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｦ */ --sg-header-h: 80px; /* ---- 鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｼ鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｹ鬮ｯ蜈ｷ・ｽ・ｻ郢晢ｽｻ繝ｻ・ｫ鬮ｯ・ｷ繝ｻ・ｷ髫ｰ・ｳ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ髯懈瑳・ｺ・ｽ繝ｻ・ｫ驍・私・｣・ｰ髫ｨ・ｬ郢晢ｽｻ鬨ｾ・｡鬯倡霜ﾑ€髫ｶ譛ｱ螳ｦ繝ｻ・ｺ郢晢ｽｻ・つ€陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｨ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ---- */ --sg-primary: var(--sg-red-600); /* 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｯ貊捺ｱ壹・・ｽ繝ｻ・ｺ鬯ｮ・ｫ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ= 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢ */ --sg-primary-600: var(--sg-red-600); --sg-primary-dark: var(--sg-red-700); --sg-primary-500: var(--sg-red-500); --sg-primary-900: var(--sg-red-700); --sg-primary-300: var(--sg-water-500); --sg-primary-100: var(--sg-red-100); --sg-accent: var(--sg-water-500); /* 鬯ｮ・ｴ陟托ｽｱ郢晢ｽｻ髯ｷ謳ｾ・ｽ・ｧ = 鬮ｮ譛ｱ・ｯ莨夲ｽｽ・ｽ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢驛｢譎｢・ｽ・ｻ*/ --sg-text: var(--sg-text-900); --sg-text-soft: var(--sg-text-700); --sg-bg: var(--sg-background); --sg-bg-tint: var(--sg-water-100); /* 鬮ｮ雜｣・ｽ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｺ驛｢譎｢・ｽ・ｻ= 鬮ｮ譛ｱ・ｯ莨夲ｽｽ・ｽ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｺ驛｢譎｢・ｽ・ｻ*/ --sg-radius: var(--sg-radius-lg); --sg-radius-sm-old: var(--sg-radius-sm); } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・｡ 鬮ｯ諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｺ鬯ｩ蜍滂｣ｰ髢可€ / 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬯ｯ・ｮ繝ｻ・ｱ郢晢ｽｻ繝ｻ・｢鬯ｯ・ｯ繝ｻ・ｪ郢晢ｽｻ繝ｻ・ｨ鬮ｫ・ｴ繝ｻ・ｫ郢晢ｽｻ繝ｻ・ｶ ---------- */ /* * 鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｾ鬮ｯ讓奇ｽｺ蛟･繝ｻ郢晢ｽｻ繝ｻ・ｼ髣費ｽｨ隲帷ｿｫ繝ｻ鬮ｯ譏ｴ繝ｻ繝ｻ・ｶ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｽ鬯ｪ・ｰ陷茨ｽｷ繝ｻ・ｽ繝ｻ・ｭ髣包ｽｵ雋企ｦｴ・ｴ蟶ｷ・ｹ譎｢・ｽ・ｻ髯懈瑳・ｻ髮｣・ｽ・ｽ驕倅ｼ懈｣ｯ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｼ髴托ｽｹ陞｢・ｹ郢晢ｽｻ 1.8.0驛｢譎｢・ｽ・ｻ鬯ｮ・ｱ繝ｻ・ｴSS 鬮ｯ・ｷ繝ｻ・ｿ髯区ｻゑｽｽ・ｬ驛､繝ｻ・ｽ・ｼ鬮ｯ蜈ｷ・ｽ・ｹ髯ｷ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｼ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ * 鬮｣蛹・ｽｽ・ｳ髫ｶ譛ｱ螳ｦ郢晢ｽｻ鬯ｮ・ｴ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｽ鬮｣豈費ｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｻ鬮｣蜴・ｽｽ・ｴ髯ｷ閧ｴ・ｻ繧托ｽｽ・ｽ繝ｻ・､髯樊ｻ薙・陞滄托ｽｰ蟷・｣ｰ謳ｾ・ｽ・ｺ郢晢ｽｻ繝ｻ・ｽ鬯ｮ・ｮ繝ｻ・｣郢晢ｽｻ繝ｻ・ｼ髣費｣ｰ繝ｻ・･郢晢ｽｻ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｲ鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬯ｯ・ｮ繝ｻ・ｯ郢晢ｽｻ繝ｻ・､鬮ｴ雜｣・ｽ・ｷ郢晢ｽｻ繝ｻ・ｶ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｯ・ｯ陞｢・ｹ郢晢ｽｻGoogle Fonts / Lato / Noto Sans JP驛｢譎｢・ｽ・ｻ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ * 鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｨ鬯ｯ・ｩ陝ｷ・｢繝ｻ・ｽ繝ｻ・ｨ鬮｣蜴・ｽｽ・ｴ郢晢ｽｻ繝ｻ・ｿ鬯ｨ・ｾ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蝣ｺ・ｼ螟ｲ・ｽ・ｽ繝ｻ・ｻ髫ｰ繝ｻ豐ｺ繝ｻ・ｺ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ鬮ｯ譎｢・ｽ・ｶ郢晢ｽｻ繝ｻ・ｦ鬮ｯ譏ｴ繝ｻ繝ｻ・ｶ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｽ鬯ｮ・ｮ繝ｻ・｣郢晢ｽｻ繝ｻ・ｼ鬩募●繝ｻ繝ｻ・ｳ繝ｻ・ｺ鬮ｯ讓奇ｽｺ・ｷ繝ｻ・､隲ｷ螢ｼ・､鬆托ｽｰ蟷・｣ｰ謳ｾ・ｽ・ｺ郢晢ｽｻ繝ｻ・ｽ髫ｶ魃会ｽｽ・｢郢晢ｽｻ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｷ鬮ｮ荳ｻ・ｼ・ｱ繝ｻ繝ｻ・ｾ縺､ﾂ€驛｢・ｧ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｭ髯滓誓・ｽ・ｺ郢晢ｽｻ繝ｻ・ｽ髫ｰ謦ｰ・ｽ・ｺ郢晢ｽｻ繝ｻ・ｰ鬨ｾ雜｣・ｽ・ｯ繝ｻ縺､ﾂ€髯樊ｺｷ・･繝ｻ・ｽ・ｽ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ--sg-font-sans CSS 鬮ｯ・ｷ繝ｻ・ｿ髯区ｻゑｽｽ・ｬ驛､繝ｻ・ｽ・ｼ * 鬮ｫ・ｰ隰費ｽｶ郢晢ｽｻhtml[lang] 鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ髯懈圜・ｽ・ｰ驛｢譎｢・ｽ・ｻ髫ｲ・ｱ繝ｻ・ｵody/鬯ｩ蟶幢ｽｸ蟶吶・郢晢ｽｻ繝ｻ・ｾ髯樊ｻゑｽｽ・ｧ髯ｷ謳ｾ・ｽ・｣/髫ｰ繝ｻ迴ｾ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｶ髫ｰ繝ｻ豐ｺ繝ｻ・ｻ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮ｯ貅ｽ・ｬ・ｬ郢晢ｽｻ鬨ｾ・｡魄・ｽｹ陜呻ｽｪ郢晢ｽｻ繝ｻ・･鬮ｯ・ｷ繝ｻ・ｿ髯区ｻゑｽｽ・ｬ驛､繝ｻ・ｽ・ｼ驛｢譎｢・ｽ・ｻ髫ｴ・ｴ繝ｻ・ｧ髯敖€繝ｻ・ｿ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｿ鬮ｫ・ｰ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｩ鬮ｯ讖ｸ・ｽ・ｻ鬮ｴ蝓滓蛤・つ€驛｢譎｢・ｽ・ｻ * * zh-Hans / zh-CN驛｢譎｢・ｽ・ｻ鬮｢・ｧ繝ｻ・ｲ郢晢ｽｻ繝ｻ・ｮ繝ｻ縺､ﾂ€鬮｣蜴・ｽｽ・ｴ鬮ｫ・ｰ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｼ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髯樊ｻ・ｽ｡蛟･繝ｻ鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｹ PingFang SC(macOS) / 鬮ｯ貅ｷ譯√・・ｽ繝ｻ・ｮ鬯ｮ・ｴ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｯ鬯ｯ・ｮ繝ｻ・ｮ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ * Microsoft YaHei(Windows) / 鬮ｯ・ｷ・つ€郢晢ｽｻ繝ｻ・ｬ鬯ｯ・ｮ繝ｻ・ｱ髯晢ｽｶ隴趣ｽ｢繝ｻ・ｽ繝ｻ・ｻ髯ｷ・ｿ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｽ驛｢譎｢・ｽ・ｻHiragino Sans GB / * 鬮ｫ・ｲ繝ｻ・､髫ｴ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・ｺ髯橸ｽｳ繝ｻ・｣郢晢ｽｻ繝ｻ・ｻ髯ｷ・ｿ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｽ驛｢譎｢・ｽ・ｻNoto Sans CJK SC / Source Han Sans SC鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ * ja / ja-JP驛｢譎｢・ｽ・ｻ髯懈瑳・ｺ・ｷ繝ｻ・ｾ驕擾ｽｩ陜呻ｽｪ郢晢ｽｻ繝ｻ・ｭ驛｢譎｢・ｽ・ｻ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髯ｷ螟ｲ・ｽ・ｳu Gothic / Hiragino / Meiryo驛｢譎｢・ｽ・ｻ髯懈瑳・ｺ・ｷ繝ｻ・ｾ驍・私・ｽ・ｭ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｻ髫ｰ繝ｻ豐ｺ繝ｻ・ｺ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ鬮ｯ譎｢・ｽ・ｶ郢晢ｽｻ繝ｻ・ｦ驛｢譎｢・ｽ・ｻ髯晢ｽｲ繝ｻ・ｨ繝ｻ縺､ﾂ€驛｢譎｢・ｽ・ｻ * 鬯ｲ繝ｻ・ｺ・ｷ・つ€繝ｻ・ｩ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・､ / 鬮ｫ・ｴ陝ｷ・｢繝ｻ・ｽ繝ｻ・ｪ鬯ｮ・ｫ繝ｻ・ｸ驛｢譎｢・ｽ・ｻ髫ｰ雋ｻ・ｽ・ｪ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬮ｫ・ｲ繝ｻ・､郢晢ｽｻ繝ｻ・ｧ鬮ｫ・ｲ繝ｻ・｡髫ｰ譴ｧ豎壹・・ｽ繝ｻ・ｸ驕ｶ謫ｾ・ｽ・ｽ郢晢ｽｻ繝ｻ・ｼ髣費ｽｨ隲帷ｿｫ繝ｻ鬮ｯ諛・ｻｸ繝ｻ・ｨ繝ｻ・｣繝ｻ縺､ﾂ€繝ｻ縺､ﾂ€鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ */ body { font-family: var(--sg-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif) !important; color: var(--sg-text-900); background: var(--sg-background); -webkit-font-smoothing: antialiased; line-height: 1.85; } /* 鬯ｩ髦ｪ笆ｽ・つ€鬮｣蜴・ｽｽ・ｴ鬮ｫ・ｰ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｫ髯ｷ・ｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｼ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ髯滓誓・ｽ・ｺ郢晢ｽｻ繝ｻ・ｽ髴難ｽ｣闔ｨ諛ｶ・ｽ・ｺ陜楢ｶ｣・ｽ・ｩ繝ｻ・･髫ｰ・ｫ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ鬨ｾ雜｣・ｽ・ｯ驕ｶ謫ｾ・ｽ・ｩ鬮ｯ・ｷ鬩帚・・企辧諷穂ｺ九・・ｭ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ髯滓誓・ｽ・ｺ郢晢ｽｻ繝ｻ・ｽ髴難ｽ｣闖ｫ・ｶ・主ｸ晁絡繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｭ鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｸ鬯ｯ繝ｻ蠎翫・・ｻ隶難ｽ｣隨吶ｅ繝ｻ繝ｻ・ｺ鬮ｫ・ｲ繝ｻ・､郢晢ｽｻ繝ｻ・ｪ鬮ｯ貊会ｽｻ・｣繝ｻ莉｣繝ｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ html[lang="zh-Hans"], html[lang="zh-CN"] { --sg-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "鬮ｯ貅ｷ譯√・・ｽ繝ｻ・ｮ鬯ｮ・ｴ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｯ鬯ｯ・ｮ繝ｻ・ｮ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ, "Microsoft YaHei", "Hiragino Sans GB", "Noto Sans CJK SC", "Source Han Sans SC", "Helvetica Neue", Arial, sans-serif; } /* 鬮ｫ・ｴ鬲・ｼ夲ｽｽ・ｽ繝ｻ・･鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬯ｩ蛹・ｽｽ・ｶ髯ｷ・ｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｼ髯橸ｽ｢繝ｻ・ｽ髯滓・莠九・・ｭ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ髯滓誓・ｽ・ｺ郢晢ｽｻ繝ｻ・ｽ髴難ｽ｣闔ｨ諛ｶ・ｽ・ｺ陜楢ｶ｣・ｽ・ｩ繝ｻ・･驛｢譎｢・ｽ・ｻ*/ html[lang="ja"], html[lang="ja-JP"] { --sg-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Meiryo, "Noto Sans CJK JP", Arial, sans-serif; } img { max-width: 100%; height: auto; } html { scroll-behavior: smooth; } /* 鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｨ鬮ｯ讖ｸ・ｽ・ｻ繝ｻ縺､ﾂ€鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｹ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ */ .sg-container { width: min(var(--sg-content-width), calc(100% - 48px)); margin-inline: auto; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・｢ 鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｬ鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｱ鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ ---------- 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ髯具ｽｻ・つ€鬮ｴ螟ｧ・｣・ｽ繝ｻ・ｪ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｢鬮ｯ讖ｸ・ｽ・ｳ髫ｶ謚ｵ・ｽ・ｫ郢晢ｽｻ繝ｻ・ｺ驛｢譎｢・ｽ・ｻ+ 鬯ｨ・ｾ陷茨ｽｷ繝ｻ・ｽ繝ｻ・ｽ鬮ｯ譏ｴ繝ｻ陜ｨ諛翫・繝ｻ・ｼ髯晢ｽｶ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｬ郢晢ｽｻ繝ｻ・｡鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ驛｢譎｢・ｽ・ｻ髯樊ｺ假ｽ・ｬ・・霎ｧ陟托ｽｱ郢晢ｽｻ/ 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢鬮ｫ・ｰ隰疲ｻ謎ｺ懃ｹ晢ｽｻ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｱ鬮ｴ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｰ鬮ｯ譏ｴ繝ｻ郢晢ｽｻ/ 髫ｰ繝ｻ迴ｾ郢晢ｽｻ鬩搾ｽｱ陝ｶ譎・・郢晢ｽｻ繝ｻ・ｹ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ*/ .sg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 0 34px; min-height: 52px; border-radius: var(--sg-radius-md); font-weight: 600; font-size: 15px; letter-spacing: 0.04em; text-decoration: none; transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.25s ease; will-change: transform; } .sg-btn:hover { transform: translateY(-1px); } /* 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ髯具ｽｻ・つ€鬮ｴ螟ｧ・｣・ｽ繝ｻ・ｪ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｢ */ .sg-btn--primary { background: var(--sg-red-600); color: #fff; } .sg-btn--primary:hover { background: var(--sg-red-700); color: #fff; } /* 鬮ｫ・ｹ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｡鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻero 鬮ｮ雜｣・ｽ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｺ鬩包ｽｨ郢ｧ謇假ｽｽ・ｽ繝ｻ・ｸ髯槭ｅ繝ｻ繝ｻ・ｽ繝ｻ・ｼ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髯樊ｺ假ｽ・ｬ・・霎ｧ陟托ｽｱ郢晢ｽｻ/ 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢鬮ｯ譏ｴ繝ｻ郢晢ｽｻ/ 髫ｰ繝ｻ迴ｾ郢晢ｽｻ鬩搾ｽｱ陝ｶ譎・・郢晢ｽｻ繝ｻ・ｹ */ .sg-btn--ghost { background: #fff; color: var(--sg-red-700); border: 1px solid rgba(168, 10, 22, 0.28); } .sg-btn--ghost:hover { background: #fff; color: var(--sg-red-600); border-color: var(--sg-red-600); } /* 鬮ｫ・ｹ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｡鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ驛｢譎｢・ｽ・ｻ髯懈瑳・ｻ繧托ｽｽ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｺ髯ｷ閧ｴ・ｺ・ｽ驕倥・蜉医・・ｮ髫ｴ莨夲ｽｽ・ｦ郢晢ｽｻ繝ｻ・ｼ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髯橸ｽ｢繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ蠑ｱ繝ｻ繝ｻ・ｷ陝ｶ譎・・郢晢ｽｻ繝ｻ・ｹ / 鬮ｮ譛ｱ・ｯ莨夲ｽｽ・ｽ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ蠑ｱ繝ｻ郢晢ｽｻ鬮ｮ雜｣・ｽ・ｺ郢晢ｽｻ繝ｻ・ｱ鬮ｴ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｰ鬮ｯ譏ｴ繝ｻ郢晢ｽｻ*/ .sg-btn--outline { background: transparent; color: var(--sg-water-700); border: 1px solid var(--sg-water-500); } .sg-btn--outline:hover { background: var(--sg-water-100); color: var(--sg-water-700); } /* 鬮ｮ雜｣・ｽ・ｺ郢晢ｽｻ繝ｻ・ｱ髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ鬯ｮ・｢繝ｻ・ｭ髫ｴ・ｴ繝ｻ・ｧ髯ｷ謳ｾ・ｽ・ｹ鬮｣蛹・ｽｽ・ｳ鬯ｯ菫ｶ・ｳ遒・ｽ｣・ｭ鬮ｮ雜｣・ｽ・ｬ驛｢譎｢・ｽ・ｻ髴大､ｲ・ｽ・｡鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ */ .sg-btn--light { background: #fff; color: var(--sg-red-700); border: 1px solid rgba(255, 255, 255, 0.5); } .sg-btn--light:hover { background: var(--sg-red-100); color: var(--sg-red-700); } /* 鬮ｫ・ｴ遶丞｣ｹ繝ｻ髫ｰ雋ｻ・ｽ・ｽ鬯ｯ・ｮ髮具ｽｻ繝ｻ・ｽ繝ｻ・ｾ鬮ｫ・ｰ隴会ｽｦ繝ｻ・ｽ繝ｻ・･驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ髯具ｽｻ・つ€鬮ｴ螟ｧ・｣・ｽ繝ｻ・ｪ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｢ */ .sg-text-link { color: var(--sg-red-600); font-weight: 600; text-decoration: none; letter-spacing: 0.02em; transition: opacity 0.2s ease; } .sg-text-link:hover { opacity: 0.75; text-decoration: underline; text-underline-offset: 4px; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・｣ 鬯ｯ・ｨ繝ｻ・ｾ髯樊ｺ假ｽ蛾頼讓｣蛻ｹ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｵ (section) ---------- */ .sg-section { padding: 88px 0; } .sg-section--white { background: var(--sg-background); } .sg-section--tint { background: var(--sg-water-100); } .sg-section-head { margin-bottom: 44px; } .sg-section-head--split { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; } .sg-section-head__eyebrow { margin: 0 0 10px; display: inline-block; padding: 4px 14px; font-size: 12px; font-weight: 700; letter-spacing: 0.22em; color: var(--sg-red-700); background: var(--sg-red-100); border-radius: var(--sg-radius-sm); } .sg-section-head__title { margin: 0; font-size: 34px; font-weight: 800; letter-spacing: 0.03em; line-height: 1.5; color: var(--sg-text-900); } /* 鬯ｮ・ｯ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・･郢晢ｽｻ繝ｻ・ｰ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ髯具ｽｻ・つ€鬮ｴ螟ｧ・｣・ｽ繝ｻ・ｪ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｢ */ .sg-section-head__hr { width: 56px; height: 3px; margin: 16px 0 0; border: 0; background: var(--sg-red-600); border-radius: 999px; } /* 鬮ｯ・ｷ陞ゅ・・ｽ・｣繝ｻ・ｰ鬮｣蜴・ｽｽ・ｴ驛｢譎｢・ｽ・ｻ/ 鬮ｯ讓奇ｽｺ蛟･繝ｻ郢晢ｽｻ繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｨ */ .sg-note { font-size: 13px; letter-spacing: 0.02em; color: var(--sg-text-700); } /* 鬮ｫ・ｴ鬲・ｼ夲ｽｽ・｣繝ｻ・ｰ鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ鬮ｯ・ｷ陞ゅ・・ｽ・｣繝ｻ・ｰ鬮｣蜴・ｽｽ・ｴ髫ｰ・ｳ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ髯懈瑳・ｻ繧托ｽｽ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ蜿門ｾ励・・ｽ繝ｻ・ｺ髫ｰ遒∝ｮｦ隶難ｽｺ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ鬮ｫ・ｴ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ .sg-placeholder { margin: 26px 0 0; padding: 20px 22px; border: 1px dashed var(--sg-water-500); border-radius: var(--sg-radius-md); background: var(--sg-water-100); font-size: 14px; line-height: 1.8; color: var(--sg-text-700); } .sg-placeholder strong { color: var(--sg-red-700); font-weight: 600; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・､ 鬯ｯ・ｯ繝ｻ・･髯樊ｻ薙・繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｮ・ｫ陷会ｽｱ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｧ驛｢譎｢・ｽ・ｻHero ---------- 鬯ｮ・｢繝ｻ・ｭ髫ｴ・ｴ繝ｻ・ｧ髯ｷ謳ｾ・ｽ・ｹ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｰ鬲・ｼ夲ｽｽ・ｽ繝ｻ・ｷ鬮ｫ・ｰ繝ｻ・ｰ鬮ｯ諛会ｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｾ髯晢ｽｶ繝ｻ・ｷ髯懆ｶ｣・ｽ・ｪ 鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｱ鬯ｮ・｣郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｱ/鬮ｯ譏ｴ繝ｻ邵ｺ竏壹・繝ｻ・｣郢晢ｽｻ繝ｻ・ｫ鬮ｯ讖ｸ・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ/鬮ｯ讖ｸ・ｽ・ｳ髫ｶ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｪ髫ｰ逍ｲ・ｺ・ｷ驕ｶ・ｶ鬯ｨ・ｾ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｿ 鬮ｯ諛亥惧繝ｻ・ｽ繝ｻ・ｾ + 鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｪ鬮ｯ・ｷ繝ｻ・ｷ鬯ｩ・｢隶惹ｼ・｣ｰ繝ｻ・ｱ・ｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ鬮ｮ荵晢ｽ・・・ｻ陷ｷ譎｢・ｽ・ｺ陜楢ｶ｣・ｽ・ｩ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｮ鬯ｩ蜉ｱ・代・・ｽ繝ｻ・ｩ驛｢譎｢・ｽ・ｻ髯懈瑳・ｻ謐ｺ・､・｢鬮ｯ譏ｴ繝ｻ・つ€隲帛､ｷ蟶晏椛繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｦ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｭ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ 鬮ｫ・ｴ繝ｻ・ｯ鬩募●謇ｱ陝ｲ・ｶ background-position center center | 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ center bottom驛｢譎｢・ｽ・ｻ髣費｣ｰ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｿ髫ｴ謇区ｭ馴ｬ夲ｽｨ鬮ｯ譏ｴ繝ｻ邵ｺ竏壹・繝ｻ・｣郢晢ｽｻ繝ｻ・ｫ鬮ｯ讖ｸ・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ/鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｱ鬯ｮ・｣郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｱ驛｢譎｢・ｽ・ｻ髯晢ｽｲ繝ｻ・ｨ繝ｻ縺､ﾂ€驛｢譎｢・ｽ・ｻ*/ .sg-main { min-height: 60vh; } .sg-hero { position: relative; display: flex; align-items: center; overflow: hidden; min-height: 600px; padding: 96px 0 120px; text-align: left; color: var(--sg-text-900); background-color: #eef5f8; /* v2 鬯ｮ・｢繝ｻ・ｭ髫ｴ・ｴ繝ｻ・ｧ髯ｷ謳ｾ・ｽ・ｹ驛｢譎｢・ｽ・ｻ髯懈瑳・ｺ・ｷ繝ｻ・ｳ繝ｻ・ｩ鬮ｯ蜿･・ｸ謇假ｽｽ・ｹ隴会ｽｦ繝ｻ・ｽ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ雜｣・ｽ・｢郢晢ｽｻ繝ｻ・ｼ髯晢ｽｲ繝ｻ・ｨ繝ｻ縺､ﾂ€驛｢・ｧ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｺ髯ｷ閧ｴ・ｺ・ｷ繝ｻ・ｴ雋・ｽｯ陷ｿ闃ｽ譯咏ｹ晢ｽｻ繝ｻ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ 鬮ｯ譎｢・ｽ・ｾ郢晢ｽｻ繝ｻ・ｦ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｫ・ｰ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｾ鬯ｨ・ｾ陷茨ｽｷ繝ｻ・ｽ繝ｻ・ｽ髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ鬯ｯ・ｮ繝ｻ・ｦ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｻ鬯ｯ・ｮ繝ｻ・ｱ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｴ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｿ鬮｣蜴・ｽｽ・ｫ髫ｴ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・ｯ驕ｶ謫ｾ・ｽ・ｵ郢晢ｽｻ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｱ髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ髫ｲ・､隲幢ｽｷ繝ｻ・ｺ郢晢ｽｻ陜呻ｽｪ郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ髫ｰ逍ｲ・ｻ繝ｻ・ｽ・ｫ郢晢ｽｻ隲｢・ｾ郢晢ｽｻ繝ｻ・ｳ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｮ荵晢ｽ・・・ｮ繝ｻ・｣髯懶ｽｴ繝ｻ・ｼ鬮｣豈費ｽｼ螟ｲ・ｽ・ｽ繝ｻ・･鬯ｯ・ｮ繝ｻ・ｴ郢晢ｽｻ繝ｻ・ｲ鬮ｯ・ｷ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｺ鬮ｯ譏ｴ繝ｻ邵ｺ竏壹・繝ｻ・｣郢晢ｽｻ繝ｻ・ｫ鬮ｯ讖ｸ・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ鬮｣蛹・ｽｽ・ｳ髣包ｽｳ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｮ髫ｶ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｪ髫ｰ逍ｲ・ｺ・ｷ驕ｶ・ｶ鬯ｨ・ｾ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｿ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ*/ background-image: linear-gradient( 90deg, rgba(255, 255, 255, 0.90) 0%, rgba(255, 255, 255, 0.74) 34%, rgba(255, 255, 255, 0.22) 66%, rgba(255, 255, 255, 0.04) 100% ), url("../images/hero-background-v2.webp"); background-size: cover; background-position: center center; background-repeat: no-repeat; } .sg-hero::after { content: ""; position: absolute; inset: auto -4% -2% -4%; height: 46px; background: rgba(255, 255, 255, 0.10); border-radius: 50% 50% 0 0 / 100% 100% 0 0; pointer-events: none; transform: translateZ(0); } .sg-hero__inner { position: relative; z-index: 1; width: min(var(--sg-content-width), calc(100% - 48px)); margin-inline: auto; display: flex; flex-direction: column; align-items: flex-start; } /* 鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ髫ｲ・､隲帷ｿｫ繝ｻ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｦ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｹ鬯ｲ繝ｻ・ｽ・ｨ鬮｣髮・€莉ｰﾂ€驕ｶ荵怜款繝ｻ・ｽ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｦ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ髯ｷ隨ｬ・ｫ竏晢ｽｴ霈斐・繝ｻ・ｶ鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｽ鬮ｯ貅ｯ・ｶ・｣繝ｻ・ｽ繝ｻ・ｦ驛｢譎｢・ｽ・ｻ鬩募●豐夜洛諞ｺ霎ｧ陜｣髢可€鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｳ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｯ讖ｸ・ｽ・ｳ髫ｶ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｪ髫ｰ逍ｲ・ｺ・ｷ驕ｶ・ｶ鬯ｨ・ｾ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｿ */ .sg-hero__eyebrow, .sg-hero__title, .sg-hero__lead { max-width: 560px; } .sg-hero__eyebrow { margin: 0 0 22px; font-size: 15px; letter-spacing: 0.3em; font-weight: 600; color: var(--sg-hero-eyebrow); } .sg-hero__title { margin: 0 0 22px; font-size: 46px; line-height: 1.5; font-weight: 800; letter-spacing: 0.02em; color: var(--sg-hero-title); } .sg-hero__lead { margin: 0 0 34px; max-width: 540px; font-size: 17px; line-height: 1.9; color: var(--sg-hero-text); } .sg-hero__actions { display: flex; gap: 16px; flex-wrap: wrap; } .sg-hero__note { margin: 36px 0 0; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・･ 鬮｣雋ｻ・ｽ・ｨ驕ｶ謫ｾ・ｽ・ｽ郢晢ｽｻ繝ｻ・ｸ髯樊ｺ假ｽ峨・莨∬ｾｧ繝ｻ・｢郢晢ｽｻ繝ｻ・ｵ (MESSAGE) ---------- */ .sg-message { max-width: 720px; margin-inline: auto; text-align: left; } .sg-message__text { margin: 0 0 18px; font-size: 20px; line-height: 2; font-weight: 500; color: var(--sg-text-900); } .sg-message__text--small { font-size: 16px; font-weight: 400; color: var(--sg-text-700); margin-bottom: 26px; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｦ 鬮ｫ・ｴ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｸ鬮ｯ貊ゑｽｽ・｢驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｧ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ荵励・繝ｻ・ｻ鬯伜∞・ｽ・ｿ陞｢・ｹ郢晢ｽｻ---------- */ .sg-feature-card { display: flex; align-items: stretch; border-radius: var(--sg-radius-lg); overflow: hidden; background: var(--sg-background); border: 1px solid var(--sg-border); box-shadow: var(--sg-shadow); } .sg-feature-card__body { padding: 44px 48px; flex: 1 1 100%; } .sg-feature-card__title { margin: 0 0 14px; font-size: 28px; font-weight: 800; line-height: 1.5; color: var(--sg-text-900); } .sg-feature-card__lead { margin: 0 0 14px; font-size: 18px; font-weight: 600; color: var(--sg-red-700); } .sg-feature-card__text { margin: 0 0 30px; color: var(--sg-text-700); } .sg-feature-card__actions { display: flex; gap: 14px; flex-wrap: wrap; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｧ 鬮ｴ螟ｧ・､・ｲ繝ｻ・ｽ繝ｻ・ｹ鬮ｴ髮｣・ｽ・､郢晢ｽｻ繝ｻ・ｹ鬮ｯ・ｷ陞ゅ・・ｽ・ｽ繝ｻ・｡鬮ｴ螟ｧ・｣・ｹ郢晢ｽｻ---------- */ .sg-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; } .sg-card { padding: 36px 32px; background: var(--sg-background); border: 1px solid var(--sg-border); border-radius: var(--sg-radius-lg); box-shadow: 0 6px 20px rgba(23, 31, 33, 0.05); transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; } .sg-card:hover { transform: translateY(-6px); box-shadow: var(--sg-shadow-hover); border-color: var(--sg-red-500); } .sg-card__icon { width: 52px; height: 52px; margin-bottom: 18px; display: grid; place-items: center; font-size: 14px; color: #fff; background: linear-gradient(135deg, var(--sg-red-600), var(--sg-red-500)); border-radius: var(--sg-radius-sm); } .sg-card__title { margin: 0 0 10px; font-size: 20px; font-weight: 700; color: var(--sg-text-900); } .sg-card__text { margin: 0; color: var(--sg-text-700); font-size: 15px; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｨ 鬮ｫ・ｴ陝・｢・つ€鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｰ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬮ｫ・ｲ繝ｻ・､驛｢譎｢・ｽ・ｻ---------- */ .sg-news { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--sg-border); } .sg-news__item { border-bottom: 1px solid var(--sg-border); } .sg-news__link { display: flex; align-items: center; gap: 22px; padding: 22px 8px; text-decoration: none; color: var(--sg-text-900); transition: background 0.25s ease, padding-left 0.25s ease; } .sg-news__link:hover { background: var(--sg-water-100); padding-left: 16px; } .sg-news__date { font-size: 14px; color: var(--sg-text-700); flex: 0 0 auto; } .sg-news__cat { flex: 0 0 auto; padding: 2px 12px; font-size: 12px; color: var(--sg-red-700); background: var(--sg-red-100); border-radius: 999px; } .sg-news__title { font-weight: 600; letter-spacing: 0.01em; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｩ 鬯ｮ・｢繝ｻ・ｨ鬨ｾ・ｧ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｯ貅ｷ・､・ｧ關灘ｸ吶・繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｼ CTA ---------- */ .sg-section--cta { background: radial-gradient(50% 90% at 88% 8%, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0) 56%), linear-gradient(135deg, var(--sg-red-700) 0%, var(--sg-red-600) 100%); color: #fff; text-align: center; } .sg-cta__title { margin: 0 0 14px; font-size: 34px; font-weight: 800; letter-spacing: 0.02em; } .sg-cta__lead { margin: 0 auto 36px; max-width: 640px; color: rgba(255, 255, 255, 0.94); font-size: 17px; } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｪ 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ ---------- 鬮ｯ譎｢・ｽ・ｾ郢晢ｽｻ繝ｻ・ｦ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｮ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・｣鬮ｯ貅ｷ蠎翫・・ｹ隴会ｽｦ繝ｻ・ｽ繝ｻ・ｨ郢晢ｽｻ繝ｻ・ｪ鬮ｯ・ｷ繝ｻ・ｷ鬲・・・ｽ・ｹ繝ｻ縺､ﾂ€髣包ｽｵ陷会ｽｱ郢晢ｽｻ Logo驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻebP 鬯ｮ・ｯ繝ｻ・ｬ驕ｶ謫ｾ・ｽ・ｬ郢晢ｽｻ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｹ鬯ｮ・ｴ髢ｧ・ｴ陷会ｽｼ郢晢ｽｻ繝ｻ・ｼ鬮ｫ・ｪ陷ｩ・ｲG 鬮ｯ諛・ｻｸ繝ｻ・ｨ繝ｻ・｣繝ｻ縺､ﾂ€繝ｻ縺､ﾂ€驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ 鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｳ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ驛｢譎｢・ｽ・ｻ髯晢ｽｶ陝ｶ蟶吶・鬮ｴ螟ｧ・｣・ｽ繝ｻ・ｪ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｢鬮ｯ貊会ｽｹ豺橸ｽｧ髴趣ｽｯ隴会ｽｮ繝ｻ・ｬ陋帙・・ｽ・ｽ繝ｻ・ｹ鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ繝ｻ・･驛｢譎｢・ｽ・ｻ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ*/ .site-header { background: #fff; border-bottom: 1px solid var(--sg-border); } /* Logo 鬮｣蜴・ｽｽ・ｫ髫ｴ蠑ｱ繝ｻ闔諞ｺ蛹壹・・ｴ髮九・・ｽ・ｷ郢晢ｽｻ繝ｻ・ｧ髯具ｽｹ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｯ髮朱メ・ｲ・ｻ繝ｻ・ｽ繝ｻ・ｾ髯ｷ闌ｨ・ｽ・ｷ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ.9:1 鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｪ鬮ｯ・ｷ繝ｻ・ｷ髫ｰ繝ｻ竏槭・・ｽ繝ｻ・ｼ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ鬩募・繝ｻ・つ€髣包ｽｵ陷会ｽｱ郢晢ｽｻ鬮ｯ貊会ｽｸ・ｻ隴ｯ竏壹・繝ｻ・ｼ髯溷桁・ｽ・｡郢晢ｽｻ繝ｻ・ｸ鬮｢・ｧ繝ｻ・ｴ鬩堺ｸ橸ｽ､鬘伉€・ｳ郢晢ｽｻ繝ｻ・ｸ鬮｣蛹・ｽｽ・ｳ髯晢｣ｰ髮懶ｽ｣繝ｻ・ｽ繝ｻ・｣驕ｶ荵嶺ｺ｢郢晢ｽｻ驛｢譎｢・ｽ・ｻ髫ｴ・ｴ繝ｻ・ｧ鬮ｯ・ｬ陜楢ｶ｣・ｽ・ｫ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｴ鬮ｯ貅ｷ遘√・・ｽ繝ｻ・ｱ鬮ｫ・ｴ鬲・ｼ夲ｽｽ・｣繝ｻ・ｰ鬮ｯ諛ｶ・ｽ・ｨ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｧ驛｢譎｢・ｽ・ｻ*/ .sg-header-logo__img { display: block; height: 66px; width: auto; max-width: none; } /* 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ驛｢譎｢・ｽ・ｻ*/ .global-nav-list > li > a { color: var(--sg-text-700); } .global-nav-list > li > a .global-nav-name { padding-bottom: 4px; } /* 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ繝ｻ・･驛｢譎｢・ｽ・ｻ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ髯樊ｺ假ｽ代・・ｽ繝ｻ・ｻ髮玖ｴ具ｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｺ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｨ・ｾ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｻ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ 鬮ｴ雜｣・ｽ・ｷ郢晢ｽｻ繝ｻ・ｶ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｯ・ｯ陞｢・ｹ郢晢ｽｻorigin3 鬯ｨ・ｾ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｮ鬯ｮ・｢繝ｻ・ｧ郢晢ｽｻ繝ｻ・､鬯ｨ・ｾ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｨ `li::before` 鬯ｨ・ｾ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｻ鬮｣蛹・ｽｽ・ｳ繝ｻ縺､ﾂ€鬮ｫ・ｴ陞滂ｽｲ繝ｻ・ｽ繝ｻ・｡鬮｣逍ｲ繝ｻ繝ｻ・ｸ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｦ鬮ｮ遏ｩ螳ｦ繝ｻ・､繝ｻ・ｧ驛｢譎｢・ｽ・ｻ(0鬩包ｽｶ驗呻ｽｫ郢晢ｽｻ00%鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｽ)鬯ｨ・ｾ繝ｻ・ｧ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｸ髯ｷ・ｿ繝ｻ・･驛｢譎｢・ｽ・ｻ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ 鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｶ鬯ｯ・ｯ陞｢・ｽ郢ｩ・･髴大､ｲ・ｽ・｡鬯ｲ繝ｻ・ｺ・ｷ・つ€繝ｻ・ｩ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・､鬮ｯ・ｷ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ`--vk-color-primary`驛｢譎｢・ｽ・ｻ鬯ｩ蟶壽が繝ｻ・ｵ繝ｻ・ｱ驛｢譎｢・ｽ・ｻ髯晢ｽｲ繝ｻ・ｨ繝ｻ縺､ﾂ€驛｢・ｧ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｭ郢晢ｽｻ繝ｻ・､鬮ｯ讓奇ｽｺ蛟･繝ｻ髯橸ｽｳ繝ｻ・ｵ鬮ｫ・ｰ陞溘ｑ・ｽ・ｿ繝ｻ・ｫ繝ｻ縺､ﾂ€髯ｷ螂・ｽ｣・ｰ郢晢ｽｻ繝ｻ・ｿ髯ｷ・ｻ陷ｿ髢€・･驤ｴ蜉醍ｹ晢ｽｻ繝ｻ・ｽ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ繝ｻ・･驛｢譎｢・ｽ・ｻ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ鬩搾ｽｵ繝ｻ・ｲ鬮ｫ・ｨ繝ｻ・ｬ鬯ｮ・ｫ繝ｻ・ｼ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｺ 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢驛｢譎｢・ｽ・ｻ髫ｰ逍ｲ・ｻ繧托ｽｽ・ｽ繝ｻ・ｽ髴難ｽ｣陋滂ｽ｡遶丞､撰ｽｬ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ/鬮ｫ・ｰ髮具ｽｻ繝ｻ・ｽ繝ｻ・ｬ鬮ｯ蜿･・ｸ・ｶ郢晢ｽｻ驛｢譎｢・ｽ・ｻ鬮｣雋ｻ・ｽ・ｨ髯橸ｽ｢繝ｻ・ｽ髣皮判・ｨ・｣隨吶ｅ繝ｻ繝ｻ・ｺ鬮ｯ・ｷ繝ｻ・ｷ髯溷桁・ｽ・｡郢晢ｽｻ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮ｫ・ｴ陞滂ｽｲ繝ｻ・ｽ繝ｻ・｡鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・｢髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｨ・ｾ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｻ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ髯晢ｽｶ隰・∞・ｽ・ｽ繝ｻ・ｸ髫ｶ螳茨ｽｿ・ｫ郢晢ｽｻ鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｰ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・｣繝ｻ・ｰ鬯ｯ・ｯ陞｢・ｽ陷大ｾ後・繝ｻ・､髣包ｽｵ雋・ｽｷ鬯滂ｽｭ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・｢髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ box-shadow驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ 鬯ｯ・ｩ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｿ鬮ｯ・ｷ陜捺ｻゑｽｽ・ｦ陞ゅ・・ｽ・ｽ繝ｻ・ｽ髴難ｽ｣陋滂ｽ｡遶丞､撰ｽｬ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ・ｷ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｺ鬯ｩ髦ｪ繝ｻ繝ｻ・ｽ繝ｻ・ｰ鬩包ｽｯ繝ｻ・ｶ髫ｲ蟶吶・繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・｢+鬯ｮ・｣繝ｻ・｢髫ｴ謫ｾ・ｽ・ｶ繝ｻ縺､ﾂ€髫ｴ荵励・繝ｻ・ｽ繝ｻ・ｸ郢晢ｽｻ繝ｻ・､鬮ｫ・ｴ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｹ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ*/ .site-header .global-nav-list > li::before { border-bottom-color: var(--sg-red-600); } .global-nav-list > li > a:hover { color: var(--sg-mod-accent, var(--sg-red-600)); } /* 鬮ｮ遏ｩ螳ｦ繝ｻ・｣繝ｻ・ｼ髯ｷ讎環€・ｩ隲・ｺ髫ｰ繝ｻ繝ｻ繝ｻ・ｽ繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｻ鬮ｯ貅ｷ譯√・・ｽ繝ｻ・ｮ鬯ｯ・ｮ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｴ鬮ｯ貅ｷ遘√・・ｽ繝ｻ・ｱ */ .site-header.sg-header-scrolled { box-shadow: 0 4px 20px rgba(23, 31, 33, 0.08); } .sg-main + .site-body-bottom, body.home .site-body-bottom { margin-top: 0; } .site-footer { border-top: 1px solid var(--sg-border); } /* ========================================================================== 鬮ｯ・ｷ繝ｻ・ｩ髫ｶ荳ｻ・･繝ｻ・ｽ・ｽ繝ｻ・ｺ髮取坩・ｯ莨夲ｽｽ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ(鬮ｫ・ｴ繝ｻ・ｯ鬩募●謇ｱ陝ｲ・ｶ鬮｣雋ｻ・ｽ・ｨ髣費ｽｨ隲帷ｿｫ繝ｻ) ========================================================================== */ @media (max-width: 1100px) { .sg-hero { background-position: 78% center; } } @media (max-width: 991px) { .sg-section { padding: 68px 0; } .sg-hero { min-height: 560px; padding: 84px 0 108px; } .sg-hero__title { font-size: 40px; } .sg-cards { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 767px) { /* ---- 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ驛｢譎｢・ｽ・ｻ鬮｢・ｧ繝ｻ・ｲ郢晢ｽｻ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ---- */ .sg-header-logo__img { height: 48px; } /* ---- Hero驛｢譎｢・ｽ・ｻ鬮｢・ｧ繝ｻ・ｲ郢晢ｽｻ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ--- 鬮｣蜴・ｽｽ・ｫ髫ｴ謇区ｭ馴ｬ夲ｽｨ鬮ｯ譏ｴ繝ｻ邵ｺ竏壹・繝ｻ・｣郢晢ｽｻ繝ｻ・ｫ鬮ｯ讖ｸ・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ鬮｣蛹・ｽｽ・ｳ髫ｴ蟷｢・ｽ・ｱ繝ｻ荳ｻ・､髮・ｽｴ諷包ｽｹ譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｨ郢晢ｽｻ繝ｻ・ｱ鬯ｮ・｣郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｱ驛｢譎｢・ｽ・ｻ髫ｰ逍ｲ・ｻ繧托ｽｽ・ｽ繝ｻ・ｮ髫ｶ髮｣・ｽ・｣郢晢ｽｻ繝ｻ・ｪ髫ｰ逍ｲ・ｺ・ｷ驕ｶ・ｶ鬯ｨ・ｾ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｿ鬮ｯ・ｷ郢晢ｽｻ繝ｻ・ｸ隶厄ｽｸ繝ｻ・ｽ繝ｻ・ｰ髫ｰ繝ｻ竏槭・・ｽ繝ｻ・ｼ髫ｴ・ｴ繝ｻ・ｧ髫ｴ・ｫ陞滄托ｽｰ蟷・ｽ・・・ｲ髯ｷ・ｿ陝ｷ繝ｻ・ｽ・ｱ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ髯ｷ迺ｰﾂ€鬮ｯ・ｷ髮榊・・ｽ・ｼ郢晢ｽｻ・つ€髣包ｽｵ陷会ｽｱ郢晢ｽｻ鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ鬮ｯ讖ｸ・ｽ・ｻ驛｢・ｧ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｿ髫ｴ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・ｯ驕ｶ荵怜煙繝ｻ・ｺ郢晢ｽｻ陜呻ｽｪ郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ background-position 鬮｣蛹・ｽｽ・ｳ髴托ｽ｢隴会ｽｦ繝ｻ・ｽ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｻ鬯ｮ・｢繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｳ鬮ｯ貅ｷ蜿呵攬・ｩ繝ｻ荳ｻ・､繧托ｽｽ・ｸ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ*/ .sg-hero { min-height: 640px; padding: 72px 0 92px; text-align: left; /* v2 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ髴大､ｲ・ｽ・｡鬮ｮ譛ｱ・ｯ莨夲ｽｽ・ｽ繝ｻ・ｴ鬯ｮ・｣繝ｻ・｢髫ｴ蟇ゅ・・取ｨ｣蝙馴屆・｣繝ｻ・ｽ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ鬩募・繝ｻ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｶ鬯ｯ・ｩ陝ｷ・｢繝ｻ・ｽ繝ｻ・ｨ鬯ｮ・ｴ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｻ鬮ｯ貅ｷ譯√・・ｽ繝ｻ・ｮ鬮ｫ・ｰ繝ｻ・ｰ鬮ｯ諛会ｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｮ鬮｣蜴・ｽｽ・ｫ髫ｴ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・ｯ驕ｶ荵怜煙繝ｻ・ｺ郢晢ｽｻ陜呻ｽｪ郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ髫ｰ逍ｲ・ｻ繧托ｽｽ・ｽ繝ｻ・ｮ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｽ髯憺屮・ｽ・ｼ髫ｰ・ｫ陞ｳ螟ｲ・｣・ｰ陷ｿ髢€謫繝ｻ荳ｻ・､髮・ｽｰ繝ｻ・ｭ謇区ｭ馴ｬ夲ｽｨ鬮ｯ譏ｴ繝ｻ邵ｺ竏壹・繝ｻ・｣郢晢ｽｻ繝ｻ・ｫ鬮ｯ讖ｸ・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ陷ｴ繝ｻ・ｽ・ｽ繝ｻ・ｨ郢晢ｽｻ繝ｻ・ｱ鬯ｮ・｣郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｱ */ background-image: linear-gradient( 180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.32) 34%, rgba(255, 255, 255, 0.10) 70%, rgba(255, 255, 255, 0.02) 100% ), url("../images/hero-background-v2.webp"); background-position: center bottom; } .sg-hero__inner { width: min(100% - 40px, var(--sg-content-width)); } .sg-hero__eyebrow { margin: 0 0 14px; font-size: 13px; letter-spacing: 0.24em; } .sg-hero__title { margin: 0 0 16px; font-size: 30px; line-height: 1.5; max-width: 100%; } .sg-hero__lead { margin: 0 0 26px; font-size: 15px; line-height: 1.85; max-width: 100%; } .sg-hero__note { margin: 24px 0 0; font-size: 12px; } .sg-br-md { display: block; } .sg-section__head-title, .sg-section-head__title { font-size: 26px; } .sg-cards { grid-template-columns: 1fr; } .sg-feature-card__body { padding: 30px 24px; } .sg-feature-card__title { font-size: 21px; } .sg-news__link { flex-direction: column; align-items: flex-start; gap: 10px; } .sg-cta__title { font-size: 26px; } } /* ========================================================================== Global typography: headings use Mincho; body copy and interface use Gothic. This is intentionally global so Elementor, Lightning and VK Blocks inherit the same rules without page-by-page font settings. ========================================================================== */ :root { --sg-font-heading: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif; --sg-font-ui: "Yu Gothic", "YuGothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif; } /* Body copy, navigation and every interactive control: Gothic. */ body, body p, body li, body a, body button, body input, body textarea, body select, body nav, body .main-navigation, body .vk-menu-acc, body .entry-content, body .elementor-widget-text-editor, body .elementor-button, body .wp-block-button__link { font-family: var(--sg-font-ui) !important; } /* Page and section headings: Mincho, with a restrained common weight. */ body h1, body h2, body h3, body h4, body h5, body h6, body .hero-title, body .section-title, body .page-title, body .entry-title, body .elementor-heading-title, body .sg-hero-slide__title, body .sg-hero__title, body .sg-section__title, body .vk_posts .vk_post_title { font-family: var(--sg-font-heading) !important; font-weight: 500 !important; } /* Linked headings retain the heading font instead of inheriting link UI type. */ body h1 a, body h2 a, body h3 a, body h4 a, body h5 a, body h6 a, body .elementor-heading-title a, body .entry-title a, body .page-title a { font-family: inherit !important; } @media (max-width: 520px) { .sg-container { width: min(100% - 36px, var(--sg-content-width)); } /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ驛｢譎｢・ｽ・ｻ髯樊ｺ假ｽ代・・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｵ鬮ｯ・ｷ繝ｻ・ｷ鬮ｫ・ｨ繝ｻ・ｬ鬮ｮ逕ｻ繩･陝謌頑€上・・ｱ繝ｻ縺､ﾂ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｫ髣費ｽｨ隲幢ｽｶ繝ｻ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｦ鬯ｯ・ｨ繝ｻ・ｾ驛｢・ｧ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ鬲・ｽｴ陜難ｽｼ隲ｱ・ｪ髫ｴ蠑ｱ繝ｻ陋ｹ・ｱ鬯ｩ閧ｴ蠕励・・ｽ繝ｻ・ｧ鬩搾ｽｵ繝ｻ・ｲ驕ｶ荵嶺ｺ｢郢晢ｽｻ鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｽ */ .sg-hero__actions { flex-direction: column; align-items: stretch; gap: 12px; width: 100%; max-width: 420px; } .sg-btn { width: 100%; min-height: 48px; padding: 0 24px; } } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｫ 鬮ｯ・ｷ闔・･陷夲ｽｱ髯橸ｽｳ陝ｷ繝ｻﾂ€荳翫・繝ｻ・ｨ鬮ｫ・ｰ繝ｻ・ｨ鬮｣魃会ｽｽ・ｨ郢晢ｽｻ繝ｻ・ｼ髯樊ｺｷ・･繝ｻ・ｽ・ｽ繝ｻ・ｿ髯晢ｽｶ陝ｶ蜷ｶ繝ｻ鬯ｮ・ｫ陷会ｽｱ郢晢ｽｻ髯ｷ・ｩ繝ｻ・ｨ鬮ｮ雜｣・ｽ・ｺ郢晢ｽｻ繝ｻ・｡鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・･ (鬯ｯ・ｩ雋企屮・ｽ・ｦ鬯倩ｲｻ・ｽ・ｲ郢晢ｽｻmain.js) ---------- */ .js .sg-reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1); will-change: opacity, transform; } .js .sg-reveal.is-visible { opacity: 1; transform: translateY(0); } /* ---------- 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｬ 鬮ｫ・ｴ鬲・ｼ夲ｽｽ・｣繝ｻ・ｰ鬯ｯ・ｮ繝ｻ・ｫ髫ｲ蟶吶・繝ｻ・ｽ繝ｻ・｢髫ｰ・ｳ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ髯橸ｽ｢繝ｻ・ｼ驛､繝ｻ・ｽ・ｼ鬮ｯ譏ｴ繝ｻ繝ｻ・､繝ｻ・ｧ髯ｷ讎環€・ｩ繝ｻ・ｫ繝ｻ・､驕ｶ荵怜款繝ｻ・ｿ繝ｻ・･鬮ｯ讒ｭ・代・・ｽ繝ｻ・ｽ ---------- */ @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .js .sg-reveal { opacity: 1; transform: none; transition: none; } .sg-btn, .sg-card, .sg-btn:hover, .sg-card:hover { transition: none; transform: none; } } /* Homepage bottom modules: equal desktop columns, one stable responsive grid. */ .sg-elementor-test-home > .elementor { --sg-bottom-grid-width: min(1180px, calc(100% - 48px)); --sg-bottom-grid-column: calc((var(--sg-bottom-grid-width) - 32px) / 2); align-items: stretch; column-gap: 32px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, var(--sg-bottom-grid-column)) minmax(0, var(--sg-bottom-grid-column)) minmax(0, 1fr); row-gap: 0; } .sg-elementor-test-home > .elementor > .e-con.e-parent:nth-child(-n + 3) { grid-column: 1 / -1; } .sg-elementor-test-home > .elementor > .sg-home-news-v2, .sg-elementor-test-home > .elementor > .sg-home-contact-cta { align-self: stretch; border: 1px solid #dfe7ec; border-radius: 16px; height: auto; margin-top: 64px; min-width: 0; overflow: hidden; } .sg-elementor-test-home > .elementor > .sg-home-news-v2 { background: #fff; box-shadow: 0 10px 24px rgba(5, 36, 76, .06); grid-column: 2; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta { grid-column: 3; } @media (max-width: 768px) { .sg-elementor-test-home > .elementor { column-gap: 0; grid-template-columns: minmax(0, 1fr); } .sg-elementor-test-home > .elementor > .e-con.e-parent:nth-child(-n + 3), .sg-elementor-test-home > .elementor > .sg-home-news-v2, .sg-elementor-test-home > .elementor > .sg-home-contact-cta { grid-column: 1; } .sg-elementor-test-home > .elementor > .sg-home-news-v2 { margin-top: 48px; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta { margin-top: 20px; } } /* Homepage bottom cards: supplied customer-service visual and text-only news. */ .sg-elementor-test-home > .elementor > .sg-home-contact-cta { background-color: #fff !important; background-image: linear-gradient(90deg, #a60017 0%, #c9001c 56%, rgba(201, 0, 28, .72) 62%, rgba(201, 0, 28, 0) 76%), url("/wp-content/uploads/2026/08/home-contact-customer-service.png") !important; background-position: center center, right center !important; background-repeat: no-repeat, no-repeat !important; background-size: 100% 100%, auto 100% !important; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta::after { content: none !important; display: none !important; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta > .elementor-element-6ca6e3b { padding-right: 38%; } .sg-elementor-test-home .sg-home-news-v2 .elementor-element-0d648c7 .elementor-heading-title::before, .sg-elementor-test-home .sg-home-news-v2 .elementor-element-0d648c7 .elementor-heading-title::after, .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title::before, .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title::after { content: none !important; display: none !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title { font-size: clamp(24px, 2vw, 30px) !important; line-height: 1.2 !important; max-width: none !important; white-space: nowrap !important; } /* Bottom-card heading decoration reset */ .sg-elementor-test-home .sg-home-news-v2 .elementor-element-0d648c7 .elementor-heading-title, .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title { border-bottom: 0 !important; border-top: 0 !important; } /* Contact card white overlay */ .sg-elementor-test-home .elementor-207 .elementor-element.e-con.e-parent.sg-home-contact-cta, .sg-elementor-test-home .elementor-237 .elementor-element.e-con.e-parent.sg-home-contact-cta { background-color: #fff !important; background-image: linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .96) 52%, rgba(255, 255, 255, .52) 78%, rgba(255, 255, 255, .10) 100%), url("/wp-content/uploads/2026/08/home-contact-customer-service.png") !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-heading-title, .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor, .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor p { color: #05244c !important; text-shadow: none !important; } /* Contact card white overlay */ .sg-elementor-test-home .elementor-207 .elementor-element.e-con.e-parent.sg-home-contact-cta, .sg-elementor-test-home .elementor-237 .elementor-element.e-con.e-parent.sg-home-contact-cta { background-color: #fff !important; background-image: linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .96) 52%, rgba(255, 255, 255, .52) 78%, rgba(255, 255, 255, .10) 100%), url("/wp-content/uploads/2026/08/home-contact-customer-service.png") !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-heading-title, .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor, .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor p { color: #05244c !important; text-shadow: none !important; } @media (max-width: 768px) { .sg-elementor-test-home > .elementor > .sg-home-contact-cta { background-image: linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .96) 52%, rgba(255, 255, 255, .52) 78%, rgba(255, 255, 255, .10) 100%), url("/wp-content/uploads/2026/08/home-contact-customer-service.png") !important; background-size: 100% 100%, auto 100% !important; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta > .elementor-element-6ca6e3b { padding-right: 0; } } /* ========================================================================== 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｭ 鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ髫ｰ繝ｻ豐ｺ繝ｻ・ｻ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮ｫ・ｴ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｷ鬮ｯ貊会ｽｻ・｣郢晢ｽｻ(Company / Product / Research / Features / Contact / News) 鬮｣雋ｻ・ｽ・ｨ驕ｶ謫ｾ・ｽ・ｽ郢晢ｽｻ繝ｻ・ｸ髯樊ｺ假ｽ代・・ｽ繝ｻ・ｫ髯ｷ・ｷ隴擾ｽｴ郢晢ｽｻ鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ驛｢譎｢・ｽ・ｻ鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｽ鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ鬩搾ｽｵ繝ｻ・ｲ驕ｶ謫ｾ・ｽ・ｫ郢晢ｽｻ繝ｻ・ｻ髮玖ｴ具ｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬯ｯ・ｮ繝ｻ・ｱ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｴ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｢髣費ｽｨ隲帙・・ｧ繝ｻ縺励・・ｲ驛｢譎｢・ｽ・ｻ髫ｰ・ｫ郢晢ｽｻ陝ｲ・ｪ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ髣比ｼ夲ｽｽ・｣繝ｻ縺､ﾂ€驕ｶ謫ｾ・ｽ・ｵ鬮ｮ逕ｻ繩･繝ｻ・ｿ陞｢・ｻ繝ｻ・ｺ繝ｻ・･郢晢ｽｻ繝ｻ・ｱ驛｢・ｧ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｧ鬮｣蛹・ｽｽ・ｳ髯橸ｽｳ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｶ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ ========================================================================== */ /* ---------- 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬯ｯ・ｮ繝ｻ・ｱ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｴ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｢髣費ｽｨ隲帙・・ｧ繝ｻ(page-header) ---------- 鬮ｴ雜｣・ｽ・ｷ郢晢ｽｻ繝ｻ・ｶ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｯ・ｯ陞｢・ｼ・つ€繝ｻ・ｩ郢晢ｽｻ繝ｻ・ｾ髴難ｽ｣陋滂ｽ･郢晢ｽｻ .page-header > .page-header-inner.container > h1.page-header-title */ .sg-is-inner .page-header { background: linear-gradient(135deg, #ffffff 0%, var(--sg-water-100) 100%); border-bottom: 1px solid var(--sg-border); padding: 52px 0 44px; text-align: center; } .sg-is-inner .page-header-inner { display: flex; flex-direction: column; align-items: center; gap: 8px; } .sg-is-inner .page-header-title { margin: 0; font-size: 34px; font-weight: 800; letter-spacing: 0.06em; color: var(--sg-text-900); position: relative; } /* 鬮ｫ・ｴ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｢髯区ｺ倥・繝ｻ・ｽ繝ｻ・ｸ髯具ｽｹ繝ｻ・ｺ髯敖€繝ｻ・ｿ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢鬯ｩ蠅灘ｾ励・・ｽ繝ｻ・ｭ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ鬯ｮ・ｯ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・･郢晢ｽｻ繝ｻ・ｰ */ .sg-is-inner .page-header-title::after { content: ""; display: block; width: 44px; height: 3px; border-radius: 2px; background: var(--sg-red-600); margin: 14px auto 0; } /* ---------- 鬯ｯ・ｮ繝ｻ・ｱ郢晢ｽｻ繝ｻ・｢鬮ｯ蜈ｷ・ｽ・ｹ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ驛｢譎｢・ｽ・ｻ(breadcrumb) ---------- */ .sg-is-inner #breadcrumb { background: transparent; padding: 12px 0 0; margin: 0; } .sg-is-inner .breadcrumb-list { font-size: 12.5px; color: var(--sg-text-700); } .sg-is-inner .breadcrumb-list li::before { color: var(--sg-border); } .sg-is-inner .breadcrumb-list a { color: var(--sg-water-700); text-decoration: none; } .sg-is-inner .breadcrumb-list a:hover { text-decoration: underline; text-underline-offset: 3px; } .sg-is-inner .breadcrumb-list li:last-child { color: var(--sg-text-900); font-weight: 600; } /* Keep WordPress's default category in data but out of public news cards. */ .vk_post-col-lg-12.category-uncategorized .vk_post_imgOuter_singleTermLabel { display: none !important; } /* ---------- 鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬯ｯ・ｯ繝ｻ・ｪ郢晢ｽｻ繝ｻ・ｨ鬮ｫ・ｴ繝ｻ・ｫ郢晢ｽｻ繝ｻ・ｶ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ驛｢譎｢・ｽ・ｻ鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｽ鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ ---------- */ .sg-is-inner .site-body { padding-top: 0; } .sg-is-inner .main-section { width: 100%; } .sg-is-inner .main-section > .content { width: min(var(--sg-content-width), calc(100% - 48px)); margin: 0 auto; padding: 24px 0 80px; } /* 鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬮ｮ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・｣鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ */ .sg-is-inner .entry.entry-full { background: transparent; padding: 0; margin: 0; box-shadow: none; width: min(var(--sg-content-width), calc(100% - 48px)); margin-inline: auto; } .sg-inner .entry-body { font-size: 16px; line-height: 1.9; color: var(--sg-text-900); } .sg-inner .entry-body > *:last-child { margin-bottom: 0; } /* ========================================================================== 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｮ 鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ髫ｰ繝ｻ迴ｾ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｶ ========================================================================== */ /* ---------- 鬮ｫ・ｹ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｵ鬯ｮ・｣隲幢ｽｶ繝ｻ・ｽ繝ｻ・ｽ鬯ｮ・ｯ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｨ鬮ｯ・ｷ鬯・ｻ｣繝ｻ髫ｰ・ｰ繝ｻ・ｴ (inner block) ---------- */ .sg-inner-block { margin: 0 0 60px; } .sg-inner-block:last-child { margin-bottom: 0; } .sg-inner-block__head { margin-bottom: 22px; } .sg-inner-block__eyebrow { display: inline-block; margin: 0 0 8px; padding: 3px 12px; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; color: var(--sg-red-700); background: var(--sg-red-100); border-radius: var(--sg-radius-sm); } .sg-inner-block__title { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: 0.02em; color: var(--sg-text-900); display: flex; align-items: center; gap: 14px; } /* 鬮ｫ・ｴ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｢髣費ｽｨ隲幢ｽｶ繝ｻ・ｽ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｦ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷･譁懈じ繝ｻ繝ｻ・｢鬯ｩ蛹・ｽｽ・ｶ髯具ｽｹ遶擾ｽｵ陞ゅ・*/ .sg-inner-block__title::before { content: ""; width: 5px; height: 1.35em; border-radius: 3px; background: var(--sg-red-600); flex: 0 0 auto; } .sg-inner-block__lead { margin: 0 0 16px; font-size: 16.5px; color: var(--sg-text-900); } .sg-inner-block--split { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; } .sg-inner-sub { background: var(--sg-water-100); border: 1px solid var(--sg-water-200); border-radius: var(--sg-radius-md); padding: 26px 28px; } .sg-inner-sub__title { margin: 0 0 14px; font-size: 18px; font-weight: 700; color: var(--sg-water-700); display: flex; align-items: center; gap: 10px; } .sg-inner-sub__title::before { content: ""; width: 4px; height: 1.1em; border-radius: 2px; background: var(--sg-water-500); } /* ---------- 鬮ｯ貅ｯ・ｼ譁舌・郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｮ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・､鬮ｫ・ｰ繝ｻ・ｰ髯ｷ鄙ｫ繝ｻ繝ｻ・ｽ繝ｻ・､郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ驛｢譎｢・ｽ・ｻ(togo / placeholder) ---------- */ .sg-togo { margin-top: 22px; padding: 16px 20px; border: 1px dashed var(--sg-water-500); background: var(--sg-water-100); border-radius: var(--sg-radius-sm); color: var(--sg-text-700); font-size: 14.5px; line-height: 1.8; } .sg-togo::before { content: "鬮ｯ貅ｯ・ｼ譁舌・郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｮ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・､"; display: inline-block; margin-right: 10px; padding: 2px 10px; font-size: 12px; font-weight: 700; color: #fff; background: var(--sg-water-500); border-radius: 999px; vertical-align: middle; } /* ---------- 鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｴ鬮ｫ・ｴ闕ｳ讒ｫ蠕舌・縺､ﾂ€郢晢ｽｻ繝ｻ・ｧ鬮ｯ蜈ｷ・ｽ・ｻ鬮｣蝓ｼ螻ｮ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｨ ---------- */ .sg-check-list { list-style: none; margin: 0; padding: 0; } .sg-check-list li { position: relative; padding: 10px 0 10px 30px; border-bottom: 1px dashed var(--sg-border); font-size: 16px; } .sg-check-list li::before { content: "鬮ｫ・ｨ繝ｻ・ｨ驛｢譎｢・ｽ・ｻ; position: absolute; left: 4px; top: 10px; color: var(--sg-red-600); font-weight: 700; } .sg-list-circle { list-style: none; margin: 0; padding: 0; } .sg-list-circle li { position: relative; padding: 6px 0 6px 20px; } .sg-list-circle li::before { content: ""; position: absolute; left: 2px; top: 0.95em; width: 8px; height: 8px; border-radius: 50%; background: var(--sg-water-500); } /* ---------- 鬮ｯ讖ｸ・ｽ・ｳ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｹ髴大｣ｼ逕溽ｹ晢ｽｻ鬯ｮ・ｯ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｨ驛｢譎｢・ｽ・ｻ髣費｣ｰ繝ｻ・･驛｢譎｢・ｽ・ｻ鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｸ鬮ｫ・ｶ陟托ｽｱ繝ｻ鄙ｫ繝ｻ繝ｻ・ｦ驛｢譎｢・ｽ・ｻ/ 鬯ｮ・｢繝ｻ・ｨ鬨ｾ・ｧ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｹ鬮ｯ貅ｽ・ｬ・ｬ陟募干繝ｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ---------- */ .sg-def-list { border: 1px solid var(--sg-border); border-radius: var(--sg-radius-md); overflow: hidden; } .sg-def-list__item { display: grid; grid-template-columns: 200px 1fr; margin: 0; border-bottom: 1px solid var(--sg-border); } .sg-def-list__item:last-child { border-bottom: none; } .sg-def-list__item dt { background: var(--sg-water-100); font-weight: 700; color: var(--sg-water-700); padding: 16px 22px; font-size: 15px; border-right: 1px solid var(--sg-border); } .sg-def-list__item dd { margin: 0; padding: 16px 22px; font-size: 15.5px; color: var(--sg-text-900); } /* ---------- 鬮ｯ・ｷ陞ゅ・・ｽ・ｽ繝ｻ・｡鬮ｴ螟ｧ・｣・ｹ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｽ鬮ｫ・ｨ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｼ (feature cards) ---------- */ .sg-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 8px; } .sg-feature-card { background: #fff; border: 1px solid var(--sg-border); border-radius: var(--sg-radius-md); padding: 30px 28px; box-shadow: var(--sg-shadow); transition: transform 0.25s ease, box-shadow 0.25s ease; } .sg-feature-card:hover { transform: translateY(-4px); box-shadow: var(--sg-shadow-hover); } .sg-feature-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: var(--sg-radius-sm); background: var(--sg-red-100); color: var(--sg-red-600); font-size: 20px; margin-bottom: 18px; } .sg-feature-card__num { font-size: 26px; font-weight: 800; color: var(--sg-water-200); display: block; margin-bottom: 6px; letter-spacing: 0.06em; } .sg-feature-card__title { margin: 0 0 12px; font-size: 19px; font-weight: 700; color: var(--sg-text-900); } .sg-feature-card__text { margin: 0; font-size: 14.5px; line-height: 1.85; color: var(--sg-text-700); } /* ---------- PDF 鬮｣蛹・ｽｽ・ｳ鬩阪・遘√・・ｽ繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｽ鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ ---------- */ .sg-pdf-list { display: flex; flex-direction: column; gap: 16px; } .sg-pdf-item { display: flex; align-items: center; justify-content: space-between; gap: 24px; background: #fff; border: 1px solid var(--sg-border); border-radius: var(--sg-radius-md); padding: 22px 26px; box-shadow: 0 6px 20px rgba(23, 31, 33, 0.05); } .sg-pdf-item__info { display: flex; flex-direction: column; gap: 6px; } .sg-pdf-item__tag { display: inline-block; width: fit-content; padding: 2px 10px; font-size: 12px; font-weight: 700; color: var(--sg-red-700); background: var(--sg-red-100); border-radius: 999px; } .sg-pdf-item__title { margin: 0; font-size: 17px; font-weight: 700; color: var(--sg-text-900); } .sg-pdf-item__desc { margin: 0; font-size: 14px; color: var(--sg-text-700); } .sg-pdf-item__btn { flex: 0 0 auto; min-height: 44px; padding: 0 22px; font-size: 14px; } /* 鬮ｯ・ｷ陞ゅ・・ｽ・｣繝ｻ・ｰ鬮｣蜴・ｽｽ・ｴ髫ｰ・ｳ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ髣費｣ｰ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｸ鬩阪・遘√・・ｽ繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｽ鬯ｯ・ｮ髮具ｽｻ繝ｻ・ｽ繝ｻ・ｾ鬮ｫ・ｰ隴会ｽｦ繝ｻ・ｽ繝ｻ・･鬮ｫ・ｴ陝ｷ・｢繝ｻ・ｽ繝ｻ・ｪ鬮ｫ・ｰ隴会ｽｦ繝ｻ・ｽ繝ｻ・･鬯ｯ・ｨ繝ｻ・ｾ髯樊ｻゑｽｽ・ｲ郢晢ｽｻ繝ｻ・ｼ鬨ｾ蛹・ｽｽ・ｻ髫ｲ・ｷ繝ｻ・ｮ鬯ｨ・ｾ繝ｻ・ｧ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｦ驕ｶ謫ｾ・ｽ・ｫ鬨ｾ・｡鬯倬ｯ会ｽｽ・ｫ繝ｻ・､驛｢譎｢・ｽ・ｻ*/ .sg-pdf-item__btn[aria-disabled="true"], .sg-pdf-item__btn.is-disabled { opacity: 0.55; cursor: not-allowed; pointer-events: none; } /* ---------- 鬮ｫ蛟ｬ莠らｹ晢ｽｻ髣憺屮・ｽ・ｭ鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ郢晢ｽｻ繝ｻ・ｻ鬯ｮ・｢繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｶ鬮ｯ諞ｺ譁｡陞ｳ・ｦ郢晢ｽｻ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ ---------- */ .sg-doc-nav { display: flex; flex-wrap: wrap; gap: 12px; } .sg-doc-nav__item { padding: 8px 20px; border: 1px solid var(--sg-water-500); border-radius: 999px; color: var(--sg-water-700); font-size: 14px; font-weight: 600; background: #fff; } /* ========================================================================== 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｯ 鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｰ鬯ｯ・ｮ繝ｻ・｣郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ髯懈瑳・ｻ逹｣ﾂ€陷ｻ・ｵ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｰ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬮ｫ・ｲ繝ｻ・､驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ ========================================================================== */ /* 鬮ｯ蜈ｷ・ｽ・ｻ鬮｣蝓ｼ螻ｮ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｨ鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｶ鬯ｯ・ｩ陝ｷ・｢繝ｻ・ｽ繝ｻ・ｨ鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｴ鬮ｫ・ｴ闕ｳ鄙ｫ繝ｻ+ 鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ郢晢ｽｻ繝ｻ・ｻ鬯ｩ蛹・ｽｽ・ｲ髯晢ｽｷ・趣ｽｴ・つ€驛｢譎｢・ｽ・ｻ*/ .sg-news-archive-head { margin-bottom: 12px; } .sg-news-archive-head__lead { margin: 8px 0 20px; font-size: 15px; color: var(--sg-text-700); } .sg-news-cats { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; } .sg-news-cats__item { padding: 7px 18px; border: 1px solid var(--sg-border); border-radius: 999px; font-size: 13.5px; font-weight: 600; color: var(--sg-text-700); text-decoration: none; background: #fff; transition: all 0.2s ease; } .sg-news-cats__item:hover { border-color: var(--sg-red-600); color: var(--sg-red-600); } .sg-news-cats__item--active { background: var(--sg-red-600); border-color: var(--sg-red-600); color: #fff; } /* 鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｰ鬯ｯ・ｮ繝ｻ・｣郢晢ｽｻ繝ｻ・ｻ鬮ｯ蜈ｷ・ｽ・ｻ鬮｣蝓ｼ螻ｮ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｨ鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ鬮｢・ｧ繝ｻ・ｲ髯橸ｽｳ陝ｷ繝ｻ蛻晉ｹ晢ｽｻ繝ｻ・ｻ鬯ｯ・ｯ陞｢・ｹ郢晢ｽｻmedia 鬮ｯ譎｢・ｽ・ｶ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ繝ｻ縺､ﾂ€鬮ｯ貅ｷ譯√・・ｽ繝ｻ・ｮ鬯ｮ・ｫ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ .sg-is-inner .post-list.vk_posts .vk_post-title a { color: var(--sg-text-900); font-weight: 700; text-decoration: none; } .sg-is-inner .post-list.vk_posts .vk_post-title a:hover { color: var(--sg-red-600); } .sg-is-inner .post-list.vk_posts .vk_post_date, .sg-is-inner .post-list.vk_posts .vk_post_header { color: var(--sg-text-700); } .sg-is-inner .post-list.vk_posts .btn.btn-sm { background: var(--sg-red-600); color: #fff; border: none; border-radius: var(--sg-radius-sm); font-size: 13px; padding: 6px 16px; } .sg-is-inner .post-list.vk_posts .btn.btn-sm:hover { background: var(--sg-red-700); } /* ---------- 鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｰ鬯ｯ・ｮ繝ｻ・｣郢晢ｽｻ繝ｻ・ｻ鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｦ鬮ｫ・ｲ繝ｻ・ｰ驛｢譎｢・ｽ・ｻ---------- */ .sg-post-single { width: min(820px, calc(100% - 48px)) !important; } .sg-post-header { padding-bottom: 24px; margin-bottom: 34px; border-bottom: 1px solid var(--sg-border); } .sg-post-header__cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; } .sg-post-cat { padding: 5px 14px; border-radius: 999px; background: var(--sg-red-100); color: var(--sg-red-700); font-size: 12.5px; font-weight: 700; text-decoration: none; } .sg-post-cat:hover { background: var(--sg-red-600); color: #fff; } .sg-post-header__title { margin: 0 0 14px; font-size: 26px; font-weight: 800; line-height: 1.5; color: var(--sg-text-900); letter-spacing: 0.02em; } .sg-post-header__date { font-size: 14px; color: var(--sg-text-700); } .sg-post-body { font-size: 16px; line-height: 2; color: var(--sg-text-900); } .sg-post-body p { margin: 0 0 1.4em; } .sg-post-body h2, .sg-post-body h3, .sg-post-body h4 { color: var(--sg-text-900); font-weight: 700; } .sg-post-body h2 { font-size: 22px; margin: 2em 0 1em; border-left: 5px solid var(--sg-red-600); padding-left: 14px; } .sg-post-body h3 { font-size: 19px; margin: 1.8em 0 0.8em; } /* 鬮｣蛹・ｽｽ・ｳ鬮ｮ讎翫・繝ｻ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬯ｩ蛹・ｽｽ・ｽ驛｢譎｢・ｽ・ｻ鬮｣蛹・ｽｽ・ｳ髯区ｻゑｽｽ・ｶ郢晢ｽｻ繝ｻ・ｸ繝ｻ縺､ﾂ€鬯ｩ蛹・ｽｽ・ｽ驛｢譎｢・ｽ・ｻ*/ .sg-post-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 44px; border-top: 1px solid var(--sg-border); padding-top: 28px; } .sg-post-pager__link { display: flex; flex-direction: column; gap: 4px; padding: 18px 22px; border: 1px solid var(--sg-border); border-radius: var(--sg-radius-md); text-decoration: none; transition: all 0.2s ease; } .sg-post-pager__link:hover { border-color: var(--sg-red-600); background: var(--sg-red-100); } .sg-post-pager__link--next { text-align: right; align-items: flex-end; } .sg-post-pager__dir { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; color: var(--sg-water-700); } .sg-post-pager__title { font-size: 15px; font-weight: 600; color: var(--sg-text-900); } /* ========================================================================== 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｰ 鬯ｮ・｢繝ｻ・ｨ鬨ｾ・ｧ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｮ・ｯ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｨ鬮ｯ・ｷ驗呻ｽｫ郢晢ｽｻ ========================================================================== */ .sg-contact-form { max-width: 720px; display: flex; flex-direction: column; gap: 20px; } .sg-form-field { display: flex; flex-direction: column; gap: 8px; } .sg-form-label { font-size: 15px; font-weight: 700; color: var(--sg-text-900); } .sg-form-required { color: var(--sg-red-600); font-weight: 700; } .sg-form-optional { color: var(--sg-text-700); font-weight: 400; font-size: 13px; } .sg-form-input { width: 100%; padding: 12px 16px; border: 1px solid var(--sg-border); border-radius: var(--sg-radius-sm); font-size: 15px; font-family: inherit; color: var(--sg-text-900); background: #fff; transition: border-color 0.2s ease, box-shadow 0.2s ease; } .sg-form-input:focus { outline: none; border-color: var(--sg-red-600); box-shadow: 0 0 0 3px var(--sg-red-100); } .sg-form-textarea { resize: vertical; min-height: 140px; } .sg-form-select { max-width: 360px; } .sg-form-hint { margin: 4px 0 0; font-size: 12.5px; color: var(--sg-text-700); } .sg-form-consent { flex-direction: row; align-items: center; gap: 12px; } .sg-form-check { display: inline-flex; align-items: center; gap: 10px; font-size: 14.5px; color: var(--sg-text-900); cursor: pointer; } .sg-form-check input { width: 18px; height: 18px; accent-color: var(--sg-red-600); } .sg-form-actions { margin-top: 4px; } .sg-form-status { margin-top: 8px; padding: 14px 18px; border-radius: var(--sg-radius-sm); font-size: 14.5px; line-height: 1.8; } .sg-form-status p { margin: 0; } .sg-form-status--info { background: var(--sg-water-100); border: 1px solid var(--sg-water-500); color: var(--sg-water-700); } /* ========================================================================== 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｱ 鬯ｯ・ｯ繝ｻ・･髯樊ｻ薙・繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬯ｮ・ｴ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｻ鬮ｯ貅ｷ譯√・・ｽ繝ｻ・ｮ鬮ｫ・ｰ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｶ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｾ鬮｣雋ｻ・ｽ・ｨ髣費ｽｨ隲幢ｽｷ陝・・・ｹ譎｢・ｽ・ｻ髣費｣ｰ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｸ鬮｢・ｧ繝ｻ・ｴ鬯ｮ・ｫ繝ｻ・ｼ鬮ｯ・ｷ繝ｻ・ｿ髣厄ｽｫ繝ｻ・ｶ鬩堺ｸ橸ｽｹ繝ｻ蜑ｲ鬯ｪ・ｰ陷茨ｽｷ繝ｻ・ｽ繝ｻ・ｻ髫ｰ謦ｰ・ｽ・ｺ髫ｴ・ｯ繝ｻ・ｷ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ ========================================================================== */ /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ鬯ｮ・ｴ陞滂ｽｧ繝ｻ・ｸ隰・∞・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮ｮ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・･鬮ｯ・ｷ繝ｻ・ｴ髴托ｽ｢隴会ｽｦ繝ｻ・ｽ繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｩ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ驛､繝ｻ・ｽ・ｼ鬮ｯ譏ｴ繝ｻ郢晢ｽｻlogo鬩搾ｽｵ繝ｻ・ｲ驕ｶ荵怜款繝ｻ・ｽ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｹ鬯ｲ繝ｻ・ｽ・ｨ鬮｣髮・€莉ｰﾂ€驕ｶ謫ｾ・ｽ・ｫ鬮ｦ・ｨ鬩､・ｴ・つ€陷茨ｽｷ繝ｻ・ｽ繝ｻ・ｽ */ @media (max-width: 767px) { .sg-header-logo__img { height: 40px; } .site-header-container, .main-section .site-header-container, .page-header .page-header-inner { width: 100%; } /* 鬯ｯ・ｯ繝ｻ・･髯樊ｻ薙・繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ Hero 鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・｡髣費｣ｰ繝ｻ・･鬩阪・繝ｻ陷ｿ闃ｽ・ｬ繝ｻ・ｹ譁滓ｨ｣蝙馴屆・｣繝ｻ・ｽ繝ｻ・ｯ鬮ｯ譎｢・ｽ・ｷ郢晢ｽｻ繝ｻ・ｳ鬯ｮ・ｯ繝ｻ・ｦ郢晢ｽｻ繝ｻ・｡驛｢譎｢・ｽ・ｻ髯樊ｺ假ｽ代・・ｽ繝ｻ・ｪ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｱ髣包ｽｳ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｸ髯具ｽｹ繝ｻ・ｺ髯懆ｶ｣・ｽ・ｺ鬯ｩ蛹・ｽｽ・ｯ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ鬯ｮ・ｴ髮懶ｽ｣繝ｻ・ｽ繝ｻ・ｹ鬯ｮ・ｴ髢ｧ・ｴ闔・｢繝ｻ縺､ﾂ€驕ｶ荵怜煙郢晢ｽｻ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｧ鬮｣蛹・ｽｽ・ｳ鬮ｮ讎翫・繝ｻ・ｽ繝ｻ・ｸ髴托ｽ｢髣埼ｦｴ・｢・ｨ鬯ｨ・ｾ陷茨ｽｷ繝ｻ・ｽ繝ｻ・ｽ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｩ鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ髫ｲ・､隲幢ｽｶ繝ｻ・ｽ繝ｻ・ｱ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬮ｯ蜿･・ｸ謇假ｽｽ・ｸ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｸ驛｢譎｢・ｽ・ｻ*/ .sg-hero { background-position: 72% center; } .sg-hero__inner { padding-top: 8px; } /* 鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬮ｫ・ｴ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｢髣費ｽｨ隲帙・・ｧ繝ｻ・ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ鬮ｯ・ｷ繝ｻ・ｴ髴托ｽ｢隴会ｽｦ繝ｻ・ｽ繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｩ */ .sg-is-inner .page-header { padding: 36px 0 30px; } .sg-is-inner .page-header-title { font-size: 26px; } /* 鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬮ｯ・ｷ陞ゅ・・ｽ・ｽ繝ｻ・｡鬮ｴ螟ｧ・｣・ｹ郢晢ｽｻ/ 鬮ｯ讖ｸ・ｽ・ｳ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｹ髴大｣ｼ逕溽ｹ晢ｽｻ鬯ｮ・ｯ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｨ / 鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｰ髣包ｽｳ隶難ｽ｣繝ｻ・ｻ陞ｳ螢ｼ・ｴ諷包ｽｹ譎｢・ｽ・ｻ*/ .sg-card-grid { grid-template-columns: 1fr; } .sg-inner-block--split { grid-template-columns: 1fr; } .sg-def-list__item { grid-template-columns: 1fr; } .sg-def-list__item dt { border-right: none; border-bottom: 1px solid var(--sg-border); padding: 12px 18px; } .sg-def-list__item dd { padding: 14px 18px; } .sg-inner-block__title { font-size: 22px; } .sg-post-pager { grid-template-columns: 1fr; } .sg-pdf-item { flex-direction: column; align-items: flex-start; } } /* ========================================================================== 鬩包ｽｶ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｱ Gutenberg 鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ鬩阪・・ｽ・ｲ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｷ鬮ｯ貅ｽ・ｬ・ｬ陟募干繝ｻ繝ｻ・ｼ鬮｢・ｧ繝ｻ・ｲ髮取腸・ｽ・ｿ鬮ｯ貅ｷ蠎翫・・ｸ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｸ髣包ｽｳ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｹ鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ 鬯ｮ・｢繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｪ鬯ｮ・ｫ繝ｻ・ｨ郢晢ｽｻ繝ｻ・ｬ鬮ｯ・ｷ髣鯉ｽｨ繝ｻ・ｽ繝ｻ・ｭ鬯ｯ・ｮ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｶ鬮ｫ・ｹ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｵ鬮ｫ菫ｶ隱薙・・ｽ繝ｻ・ｷ驛｢譎｢・ｽ・ｻ髫ｰ逍ｲ・ｺ蛟･繝ｻ鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｮ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・｣鬮ｫ・ｴ遶丞｣ｹ繝ｻ髫ｰ・ｫ郢ｧ蛹ｺ繝ｻ郢晢ｽｻ繝ｻ・ｪ鬮ｯ・ｷ繝ｻ・ｷ髣包ｽｳ繝ｻ・ｻ髯溷ｼｱ繝ｻthe_content()鬩搾ｽｵ繝ｻ・ｲ驛｢・ｧ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｻ郢晢ｽｻ繝ｻ・･鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ繝ｻ・･郢晢ｽｻ繝ｻ・ｰ驛｢譎｢・ｽ・ｻGutenberg 鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ鬩阪・・ｽ・ｲ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｷ鬮ｯ貊会ｽｻ・｣郢晢ｽｻ 驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻis-style-sg-*驛｢譎｢・ｽ・ｻ鬨ｾ蛹・ｽｽ・ｻ髣包ｽｳ陷奇｣ｰ雎鯉ｽ｣驛｢譎｢・ｽ・ｻ鬮｣繝ｻ・ｽ・ｦ鬮ｫ・ｴ鬲・ｼ夲ｽｽ・ｽ繝ｻ・｢鬮ｫ・ｴ陝ｶ・ｷ陋ｻ・､髫ｰ・ｰ郢晢ｽｻ繝ｻ・ｭ陝ｷ・｢繝ｻ・ｽ繝ｻ・ｬ髫ｰ繝ｻ迴ｾ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｶ鬯ｮ・ｫ陷会ｽｱ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｧ鬮｣繝ｻ・ｽ・ｽ郢晢ｽｻ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€驛｢譎｢・ｽ・ｻ髫ｰ逍ｲ・ｻ繧托ｽｽ・ｽ繝ｻ・ｮ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｰ鬲・ｼ夲ｽｽ・ｽ繝ｻ・ｷ鬮ｯ諛ｶ・ｽ・ｨ郢晢ｽｻ繝ｻ・ｨ鬮ｯ・ｷ繝ｻ・ｷ髣包ｽｳ繝ｻ・ｻ髯滓・・ｼ繝ｻﾂ€陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｨ鬮ｯ・ｷ繝ｻ・ｴ髮九・・ｽ・ｽ髯ｷ繝ｻ・ｽ・ｽ鬮ｫ・ｴ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｸ鬮ｯ貊ゑｽｽ・｢驛｢譎｢・ｽ・ｻ鬩阪・繝ｻ隰ｾ・ｬ驛｢譎｢・ｽ・ｻ 鬮ｯ讒ｭ・峨・・､繝ｻ・ｼ鬨ｾ・｡魄・ｽｹ隲ｱ繝ｻ諠ｺ繝ｻ・ｩ郢晢ｽｻ繝ｻ・ｺ髯晢ｽｶ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｷ鬮ｯ貅ｷ蠎翫・・ｸ隶抵ｽｫ陋ｻ譎槫建繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｯ鬮ｯ貅ｷ・｢逹｣ﾂ€隲帙・・ｯ蟶晁絡繝ｻ・ｳ繝ｻ縺､ﾂ€鬯ｮ・｢繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｴ鬯ｨ・ｾ繝ｻ・ｧ驛｢譎｢・ｽ・ｻ髯具ｽｻ・つ€鬮ｴ螟ｧ・｣・ｽ繝ｻ・ｪ陷ｿ蜴・ｽｽ・ｲ繝ｻ・ｿ鬮ｯ貅ｽ・ｬ・ｬ陟募干繝ｻ繝ｻ・ｼ髫ｴ・ｴ繝ｻ・ｧ鬮ｯ・ｬ陜楢ｶ｣・ｽ・ｫ繝ｻ・ｴ繝ｻ縺､ﾂ€鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬯ｯ・ｮ繝ｻ・ｱ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｴ繝ｻ・ｫ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ ========================================================================== */ /* ---------- sg-section驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｿ郢晢ｽｻ繝ｻ・｡鬮ｫ・ｲ繝ｻ・ｱ郢晢ｽｻ繝ｻ・ｯ鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ髫ｲ・､隲幢ｽｶ繝ｻ・ｽ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ ---------- */ .sg-inner .entry-body .is-style-sg-section { margin-bottom: 60px; } .sg-inner .entry-body .is-style-sg-section:last-child { margin-bottom: 0; } .entry-body > .wp-block-group.is-style-sg-section { padding: 0; } /* 鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ鬩阪・・ｽ・ｲ郢晢ｽｻ繝ｻ・ｰ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｢髯句ｸ吶・繝ｻ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ2驛｢譎｢・ｽ・ｻ鬮｢・ｾ繝ｻ・･郢晢ｽｻ繝ｻ・ｻ髮玖ｴ具ｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｺ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣陷ｻ・ｵ陝・・繝ｻ繝ｻ・｡鬮ｫ・ｲ繝ｻ・ｱ郢晢ｽｻ繝ｻ・ｯ鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ鬩阪・・ｽ・ｲ郢晢ｽｻ繝ｻ・ｰ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｢髣厄ｽｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｷ鬮ｯ貊会ｽｻ・｣郢晢ｽｻ*/ .entry-body .is-style-sg-section > .wp-block-heading { margin: 0 0 22px; padding-top: 0; display: flex; align-items: center; gap: 14px; max-width: none; } .entry-body .is-style-sg-section > .wp-block-heading::before { content: ""; width: 5px; height: 1.35em; border-radius: 3px; background: var(--sg-red-600); flex: 0 0 auto; } .entry-body .is-style-sg-section > .wp-block-heading { font-size: 26px; font-weight: 800; letter-spacing: 0.02em; color: var(--sg-text-900); margin-inline: 0; } /* ---------- 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬯ｯ・ｮ繝ｻ・ｱ郢晢ｽｻ繝ｻ・｢鬮ｯ貅ｷ・､・ｧ關灘ｸ吶・繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｼ鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ (鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・｡鬮ｫ・ｴ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｿ鬮ｫ・ｴ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ髫ｶ蠕後・sg-section--intro) ---------- */ .sg-section--intro { margin-bottom: 40px; } .sg-section__lead { margin: 0 0 6px; font-size: 16.5px; font-weight: 600; color: var(--sg-text-900); } /* ---------- sg-togo驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｾ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｮ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・､鬮ｫ・ｰ繝ｻ・ｰ髯ｷ鄙ｫ繝ｻ繝ｻ・ｽ繝ｻ・､郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ驛｢譎｢・ｽ・ｻ---------- */ .entry-body .is-style-sg-togo { margin-top: 22px; padding: 16px 20px; border: 1px dashed var(--sg-water-500); background: var(--sg-water-100); border-radius: var(--sg-radius-sm); color: var(--sg-text-700); font-size: 14.5px; line-height: 1.8; } .entry-body .is-style-sg-togo > .wp-block-paragraph { margin: 0; } .entry-body .is-style-sg-togo::before { content: "鬮ｯ貅ｯ・ｼ譁舌・郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｮ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・､"; display: inline-block; margin-right: 10px; padding: 2px 10px; font-size: 12px; font-weight: 700; color: #fff; background: var(--sg-water-500); border-radius: 999px; vertical-align: middle; margin-bottom: 6px; } /* ---------- sg-lead驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｼ髯ｷ閧ｴ・ｻ繧托ｽｽ・ｽ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｼ鬮ｫ・ｹ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｵ鬯ｮ・｣隲幢ｽｶ繝ｻ・ｽ繝ｻ・ｽ ---------- */ .entry-body .wp-block-paragraph.sg-lead { margin: 0 0 26px; font-size: 16.5px; font-weight: 600; color: var(--sg-text-900); } /* ---------- sg-def-list驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｮ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｹ髴大｣ｼ逕溽ｹ晢ｽｻ鬯ｮ・ｯ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｨ驛｢譎｢・ｽ・ｻ鬨ｾ雜｣・ｽ・ｯ鬯ｩ・｢髣咲§・ｱ闊後・繝ｻ・ｼ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ---------- */ .entry-body .is-style-sg-def-list { border: 1px solid var(--sg-border); border-radius: var(--sg-radius-md); overflow: hidden; padding: 0; list-style: none; margin: 8px 0; } .entry-body .is-style-sg-def-list > .wp-block-list-item, .entry-body .is-style-sg-def-list > li { display: grid; grid-template-columns: 200px 1fr; line-height: 1.8; padding: 0; border-bottom: 1px solid var(--sg-border); margin: 0; } .entry-body .is-style-sg-def-list > li:last-child { border-bottom: none; } .entry-body .is-style-sg-def-list > li > strong { background: var(--sg-water-100); font-weight: 700; color: var(--sg-water-700); padding: 16px 22px; font-size: 15px; display: block; border-right: 1px solid var(--sg-border); } .entry-body .is-style-sg-def-list > li { padding-left: 0; } .entry-body .is-style-sg-def-list > li::before { content: none; } /* ---------- sg-list-circle驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ髫ｲ・､隰悟･・ｽｽ・ｽ繝ｻ・､郢晢ｽｻ繝ｻ・ｹ鬮ｯ蜈ｷ・ｽ・ｻ鬮｣蝓ｼ螻ｮ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｨ ---------- */ .entry-body .is-style-sg-list-circle { margin: 8px 0; } .entry-body .is-style-sg-list-circle > li { position: relative; padding-left: 22px; margin: 0 0 8px; } .entry-body .is-style-sg-list-circle > li::before { content: ""; position: absolute; left: 0; top: 0.72em; width: 8px; height: 8px; border-radius: 50%; background: var(--sg-red-500); } .entry-body .is-style-sg-list-circle > li:last-child { margin-bottom: 0; } /* ---------- sg-check-list驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｹ鬮ｯ・ｷ隰ｳ・ｾ繝ｻ・ｽ繝ｻ・ｾ鬮ｮ荵晢ｽ・ｹ晢ｽｻ鬲・ｺ倥・---------- */ .entry-body .is-style-sg-check-list { margin: 8px 0; list-style: none; padding-left: 0; } .entry-body .is-style-sg-check-list > li { position: relative; padding-left: 30px; margin: 0 0 10px; line-height: 1.8; } .entry-body .is-style-sg-check-list > li::before { content: "鬮ｫ・ｨ繝ｻ・ｨ驛｢譎｢・ｽ・ｻ; position: absolute; left: 0; top: 0; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #fff; background: var(--sg-red-600); border-radius: 50%; margin-top: 3px; } /* ---------- sg-card-grid驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｧ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ鬯ｮ・ｻ繝ｻ・ｳ鬮ｴ髮｣・ｽ・､郢晢ｽｻ繝ｻ・ｹ鬮ｯ・ｷ陞ゅ・・ｽ・ｽ繝ｻ・｡鬮ｴ螟ｧ・｣・ｹ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｽ鬮ｫ・ｨ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｼ ---------- */ .entry-body .is-style-sg-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 8px 0 0; } .entry-body .is-style-sg-card-grid > .wp-block-column { background: #fff; border: 1px solid var(--sg-border); border-radius: var(--sg-radius-md); padding: 30px 28px; box-shadow: var(--sg-shadow); transition: transform 0.25s ease, box-shadow 0.25s ease; margin-left: 0; } .entry-body .is-style-sg-card-grid > .wp-block-column:hover { transform: translateY(-4px); box-shadow: var(--sg-shadow-hover); } .entry-body .is-style-sg-card-grid > .wp-block-column > .wp-block-heading { margin: 0 0 12px; font-size: 19px; font-weight: 700; color: var(--sg-text-900); } .entry-body .is-style-sg-card-grid > .wp-block-column > .wp-block-paragraph { margin: 0; font-size: 14.5px; line-height: 1.85; color: var(--sg-text-700); } /* 鬮ｯ・ｷ陞ゅ・・ｽ・ｽ繝ｻ・｡鬮ｴ螟ｧ・｣・ｹ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｼ鬯ｮ・｢・つ€髫ｰ謦ｰ・ｽ・ｷ */ .entry-body .is-style-sg-card-grid .wp-block-paragraph.sg-card-num { font-size: 26px; font-weight: 800; color: var(--sg-water-200); letter-spacing: 0.06em; margin: 0 0 6px; } /* ---------- 鬮ｯ・ｷ繝ｻ・ｩ髫ｶ荳ｻ・･繝ｻ・ｽ・ｽ繝ｻ・ｺ髮取坩・ｯ莨夲ｽｽ・ｽ繝ｻ・ｼ髫ｰ・ｫ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ髯橸ｽ｢繝ｻ・ｼ髣碑崟・｡蛛・ｽｽ・ｿ陞｢・ｹ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｽ鬮ｫ・ｨ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｼ & 鬮ｯ讖ｸ・ｽ・ｳ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｹ髴大｣ｼ逕溽ｹ晢ｽｻ鬯ｮ・ｯ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｨ ---------- */ @media (max-width: 1080px) { .entry-body .is-style-sg-card-grid { grid-template-columns: 1fr; } } @media (max-width: 960px) { .entry-body .is-style-sg-def-list > .wp-block-list-item, .entry-body .is-style-sg-def-list > li { grid-template-columns: 1fr; } .entry-body .is-style-sg-def-list > li > strong { border-right: none; border-bottom: 1px solid var(--sg-border); padding: 12px 18px; } .entry-body .is-style-sg-section > .wp-block-heading { font-size: 22px; } } /* ========================================================================== 鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ + 鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ髯懈圜・ｽ・ｰ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ驛｢譎｢・ｽ・ｻ髣費｣ｰ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬮ｫ・ｴ鬲・ｼ夲ｽｽ・ｽ繝ｻ・･鬮ｯ・ｷ繝ｻ・ｿ髴托ｽｹ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｭ鬯ｩ蛹・ｽｽ・ｶ髯ｷ・ｻ繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ ========================================================================== */ .site-header-container { display: flex; align-items: center; justify-content: space-between; gap: 24px; position: relative; } .site-header-logo { flex-shrink: 0; margin: 0; } .sg-header-logo__img { height: 56px; width: auto; } .sg-global-nav { flex: 1; min-width: 0; display: flex !important; justify-content: flex-end; } .sg-global-nav ul, .sg-global-nav ul.sg-nav-fallback { display: flex !important; flex-direction: row !important; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 2px 6px; margin: 0 !important; padding: 0 !important; list-style: none !important; } .sg-global-nav li { display: inline-block !important; margin: 0 !important; float: none !important; width: auto !important; } .sg-global-nav a { display: inline-flex; align-items: center; padding: 8px 10px; color: #1f2529; font-size: 13.5px; font-weight: 700; text-decoration: none; white-space: nowrap; border-bottom: 3px solid transparent; transition: color .2s, border-color .2s; } .sg-global-nav a:hover { color: #c9001c; border-bottom-color: #c9001c; } /* 鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ髯懈圜・ｽ・ｰ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ */ .sg-lang-switch { position: relative; flex-shrink: 0; } .sg-lang-switch__trigger { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; cursor: pointer; font-weight: 700; font-size: 14px; padding: 8px 10px; color: #1f2529; } .sg-lang-switch__menu { position: absolute; top: calc(100% + 4px); right: 0; min-width: 120px; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid #e2e7ea; border-radius: 6px; box-shadow: 0 8px 24px rgba(17,44,67,.12); display: none; z-index: 50; } .sg-lang-switch.is-open .sg-lang-switch__menu { display: block; } .sg-lang-switch__link { display: block; padding: 8px 12px; color: #1f2529; font-size: 14px; text-decoration: none; border-radius: 4px; } .sg-lang-switch__link:hover { background: #fbeaec; color: #a60017; } .sg-lang-switch__link.is-current { background: #fbeaec; color: #a60017; font-weight: 700; } /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｪ鬮ｫ・ｰ隲､諛会ｽｺ蟲ｨ繝ｻ繝ｻ・ｻ髯橸ｽ｢繝ｻ・ｼ髯ｷ讎環€・･郢晢ｽｻ髣費｣ｰ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｸ髯憺屮・ｽ・ｼ髯懶ｽｴ繝ｻ・ｼ鬯ｮ・ｦ繝ｻ・ｯ髫ｰ・ｫ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髴托ｽｹ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｯ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ髯懈圜・ｽ・ｰ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ鬮｣蜴・ｽｽ・ｫ髫ｴ謇区ｭ馴ｬ夲ｽｨ */ @media (max-width: 991px) { .site-header-container { flex-wrap: wrap; } .sg-global-nav { order: 3; width: 100%; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; } .sg-global-nav ul { gap: 2px; flex-wrap: nowrap; } .sg-global-nav a { padding: 8px 10px; font-size: 13px; white-space: nowrap; } } /* ===== 鬯ｮ・ｫ髴域鱒繝ｻ髯昴・・｣・ｰ鬮ｴ雜｣・ｽ・ｷ郢晢ｽｻ繝ｻ・ｶ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｯ・ｯ陞｢・ｹ郢晢ｽｻ991px 鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｭ鬮ｴ髮｣・ｽ・､郢晢ｽｻ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ髯懈ｺ俶ｿ€ader 鬮｣蜴・ｽｽ・ｫ髫ｴ蠑ｱ繝ｻ闔繝ｻflex 鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｪ鬮ｯ・ｷ繝ｻ・ｷ驛｢譎｢・ｽ・ｻ===== */ .site-header-container, .main-section .site-header-container { display: flex !important; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; } @media (max-width: 991.98px) { .site-header-container, .main-section .site-header-container { display: flex !important; } .sg-global-nav { order: 3; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 6px; } .sg-global-nav ul, .sg-global-nav ul.sg-nav-fallback { flex-wrap: nowrap; justify-content: flex-start; } .sg-lang-switch { order: 2; margin-left: auto; } } /* ========================================================================== 鬯ｯ・ｯ繝ｻ・･髯樊ｻ薙・繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ Gutenberg 鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・｡鬮ｯ諛ｶ・ｽ・ｮ髫ｴ莨夲ｽｽ・ｦ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻg-home-*驛｢譎｢・ｽ・ｻ髣厄ｽｫ郢晢ｽｻ・つ€驛｢譎｢・ｽ・ｻ鬮ｫ・ｰ闕ｵ貅ｽ讚ｨ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・｢鬮ｫ・ｰ鬲・ｼ夲ｽｽ・ｽ繝ｻ・ｷ鬯ｩ蠅捺ｱ壹・・ｽ繝ｻ・ｮ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・､髫ｰ繝ｻ豐ｺ霑ｹ・ｳ髫ｴ・ｯ繝ｻ・ｷ ========================================================================== */ /* 髫ｰ繝ｻ豐ｺ繝ｻ・ｻ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｾ鬯ｮ・ｫ繝ｻ・ｶ郢晢ｽｻ繝ｻ・｡鬮ｯ・ｷ繝ｻ・ｿ髯区ｻゑｽｽ・ｬ驛､繝ｻ・ｽ・ｼ */ :root { --sg-red-700: #a60017; --sg-red-600: #c9001c; --sg-red-500: #df1028; --sg-red-100: #fbeaec; --sg-navy-900: #05244c; --sg-navy-800: #0a3768; --sg-blue-050: #f7fbfd; --sg-blue-100: #eef8fb; --sg-blue-200: #dceff5; --sg-text-900: #1f272c; --sg-text-700: #536069; --sg-text-500: #7a858c; --sg-border: #e1e7ea; --sg-white: #ffffff; --sg-container: 1180px; --sg-section-space: 80px; --sg-radius-sm: 5px; --sg-radius-md: 10px; } /* 髫ｰ繝ｻ豐ｺ繝ｻ・ｻ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｹ鬮ｯ諛・ｽｶ・｣繝ｻ・ｽ繝ｻ・ｨ */ .sg-home-main .sg-container { width: min(calc(100% - 40px), 1180px); margin-inline: auto; } /* --- Hero --- */ .sg-home-hero { min-height: 560px; position: relative; overflow: hidden; background-color: #eef8fb; background-image: linear-gradient(90deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,.45) 55%, rgba(255,255,255,.05) 100%), url("../images/hero-background-v2.webp"); background-size: cover; background-position: center center; } .sg-home-hero__inner { min-height: 560px; display: grid; grid-template-columns: 46% 54%; align-items: center; } .sg-home-hero__content { padding-left: clamp(10px, 3vw, 44px); position: relative; z-index: 2; } .sg-home-hero__title { font-size: clamp(2.4rem, 4.5vw, 3.8rem); line-height: 1.45; font-weight: 800; color: var(--sg-navy-900); margin: 0 0 24px; } .sg-home-hero__lead { font-size: 1.02rem; line-height: 1.9; color: var(--sg-text-700); max-width: 520px; margin: 0 0 32px; } .sg-home-hero__actions .wp-block-button__link { padding: 14px 26px; font-size: 15px; border-radius: var(--sg-radius-sm); } .sg-home-hero__media { display: flex; align-items: center; justify-content: center; } .sg-home-hero__logo img { width: min(100%, 420px); height: auto; } /* --- 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬮ｯ・ｷ霑壼遜・ｽ・ｸ隰・∞・ｽ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｧ鬮ｯ・ｷ繝ｻ・ｩ驛｢譎｢・ｽ・ｻ--- */ .sg-home-product { background: linear-gradient(110deg, #ffffff 0%, #ffffff 43%, #eef8fb 100%); padding-block: var(--sg-mod-gap, var(--sg-section-space)); } .sg-home-product__grid { display: grid; grid-template-columns: 42% 58%; align-items: center; min-height: 560px; } .sg-home-product__content { padding-right: 30px; } .sg-home-product__label { color: var(--shc-m-product-label-color, var(--sg-mod-accent, var(--sg-red-600))); font-size: var(--shc-m-product-label-size, .78rem); font-weight: 800; letter-spacing: .14em; margin: 0 0 16px; } .sg-home-product__name { font-size: var(--shc-m-product-title-size, 4rem); line-height: 1.15; font-weight: 800; color: var(--shc-m-product-title-color, var(--sg-mod-heading-color, var(--sg-navy-900))); text-align: var(--shc-m-product-title-align, left); margin: 0 0 18px; } .sg-home-product__lead { color: var(--shc-m-product-text-color, var(--sg-navy-900)); font-size: var(--shc-m-product-text-size, 1.15rem); font-weight: 700; margin: 0 0 18px; } .sg-home-product__desc { font-size: var(--shc-m-product-text-size, 1rem); line-height: 1.9; color: var(--shc-m-product-text-color, var(--sg-text-700)); margin: 0 0 22px; } .sg-home-product__badge { display: inline-block; border: 1px solid #aeb9c1; padding: 7px 13px; margin: 0 0 26px; font-size: var(--shc-m-product-badge-size, .84rem); background: rgba(255,255,255,.75); color: var(--shc-m-product-badge-color, var(--sg-text-700)); border-radius: var(--sg-radius-sm); } .sg-home-product__actions { display: flex; flex-wrap: wrap; gap: 12px; } .sg-home-product__actions .wp-block-button__link { padding: 14px 26px; border-radius: var(--sg-radius-sm); } .sg-home-product__media { display: flex; align-items: center; justify-content: center; } /* --- 鬮ｯ諛按€諛ｶ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｹ鬮ｴ螟ｧ・､・ｲ繝ｻ・ｽ繝ｻ・ｹ鬮ｴ髮｣・ｽ・､郢晢ｽｻ繝ｻ・ｹ --- */ .sg-home-strengths { background: var(--shc-m-strengths-bg, #ffffff); padding-block: var(--sg-mod-gap, var(--sg-section-space)); } .sg-home-strengths__title { text-align: var(--shc-m-strengths-title-align, center); font-size: var(--shc-m-strengths-title-size, 2rem); font-weight: 800; color: var(--shc-m-strengths-title-color, var(--sg-mod-heading-color, var(--sg-text-900))); margin: 0 0 52px; } .sg-home-strengths__grid { display: grid; grid-template-columns: repeat(var(--shc-m-strengths-cols, 4), 1fr); border: 1px solid var(--sg-border); border-radius: 8px; overflow: hidden; } .sg-home-strength { min-height: 260px; padding: 38px 24px; text-align: center; border-right: 1px solid var(--sg-border); background: var(--sg-white); } .sg-home-strength:last-child { border-right: 0; } .sg-home-strength__title { font-size: var(--shc-m-strengths-card-title-size, 1.15rem); font-weight: 700; color: var(--shc-m-strengths-card-title-color, var(--sg-text-900)); margin: 0 0 14px; } .sg-home-strength__text { font-size: var(--shc-m-strengths-text-size, .89rem); line-height: 1.8; color: var(--shc-m-strengths-text-color, var(--sg-text-700)); margin: 0; } /* --- 鬯ｩ蜍滄ｴｻ陜ｮ・ｩ郢晢ｽｻ繝ｻ・ｩ郢晢ｽｻ繝ｻ・ｶ + 鬮｣雋ｻ・ｽ・ｨ驕ｶ謫ｾ・ｽ・ｽ郢晢ｽｻ繝ｻ・ｸ驛｢譎｢・ｽ・ｻ鬮ｯ・ｷ繝ｻ・ｿ髫ｴ・ｴ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｰ驛｢譎｢・ｽ・ｻ--- */ .sg-home-dual { background: var(--shc-m-dual-bg, var(--sg-blue-050)); padding-block: 38px 60px; } .sg-home-dual-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; } .sg-home-research, .sg-home-company { background: #fff; border-radius: 8px; padding: 44px 40px; box-shadow: 0 12px 32px rgba(17,44,67,.07); min-height: 300px; } .sg-eyebrow { color: var(--sg-mod-accent, var(--sg-red-600)); font-size: .76rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 14px; } .sg-home-research .sg-eyebrow { color: var(--shc-m-research-label-color, var(--sg-mod-accent, var(--sg-red-600))); font-size: var(--shc-m-research-label-size, .76rem); } .sg-home-company .sg-eyebrow { color: var(--shc-m-company-label-color, var(--sg-mod-accent, var(--sg-red-600))); font-size: var(--shc-m-company-label-size, .76rem); } .sg-home-research__title { font-size: var(--shc-m-research-title-size, 1.6rem); font-weight: 800; color: var(--shc-m-research-title-color, var(--sg-text-900)); text-align: var(--shc-m-research-title-align, left); margin: 0 0 20px; } .sg-home-company__title { font-size: var(--shc-m-company-title-size, 1.6rem); font-weight: 800; color: var(--shc-m-company-title-color, var(--sg-text-900)); text-align: var(--shc-m-company-title-align, left); margin: 0 0 20px; } .sg-home-research__text { font-size: var(--shc-m-research-text-size, .95rem); line-height: 1.9; color: var(--shc-m-research-text-color, var(--sg-text-700)); margin: 0 0 28px; } .sg-home-research__img, .sg-home-company__img { width: var(--shc-m-research-img-w, 100%); max-width: 100%; height: auto; display: block; border-radius: 6px; margin: 0 0 20px; } .sg-home-company .sg-home-company__img { width: var(--shc-m-company-img-w, 100%); } .sg-home-company__text { font-size: var(--shc-m-company-text-size, .95rem); line-height: 1.9; color: var(--shc-m-company-text-color, var(--sg-text-700)); margin: 0 0 28px; } /* --- 鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｰ鬯ｯ・ｮ繝ｻ・｣郢晢ｽｻ繝ｻ・ｻ + 鬯ｮ・｢繝ｻ・ｨ鬨ｾ・ｧ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｳ郢晢ｽｻ繝ｻ・ｻ --- */ .sg-home-info { background: #fff; padding-block: var(--sg-mod-gap, var(--sg-section-space)); } .sg-home-info-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; } .sg-home-news { background: var(--sg-blue-050); border-radius: 8px; padding: 34px 38px; } .sg-home-news__title { font-size: var(--shc-m-news-title-size, 1.5rem); font-weight: 800; color: var(--shc-m-news-title-color, var(--sg-mod-heading-color, var(--sg-text-900))); text-align: var(--shc-m-news-title-align, left); margin: 0 0 20px; } .sg-home-news__item { display: flex; align-items: baseline; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--sg-border); } .sg-home-news__date { color: var(--sg-text-500); font-size: 14px; flex-shrink: 0; } .sg-home-news__link { font-size: 16px; font-weight: 600; margin: 0; } .sg-home-news__link a { color: var(--sg-text-900); text-decoration: none; } .sg-home-news__link a:hover { color: var(--sg-mod-accent, var(--sg-red-600)); } .sg-home-contact { background: #fff; border: 1px solid var(--sg-border); border-radius: 8px; padding: 34px 38px; position: relative; overflow: hidden; min-height: 260px; } .sg-home-contact__title { font-size: var(--shc-m-contact-title-size, 1.5rem); font-weight: 800; color: var(--shc-m-contact-title-color, var(--sg-mod-heading-color, var(--sg-text-900))); text-align: var(--shc-m-contact-title-align, left); margin: 0 0 16px; } .sg-home-contact__text { font-size: var(--shc-m-contact-text-size, .92rem); line-height: 1.9; color: var(--shc-m-contact-text-color, var(--sg-text-700)); margin: 0 0 26px; } /* --- 鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣郢晢ｽｻCTA --- */ .sg-home-brand-cta { background: linear-gradient(100deg, var(--sg-red-700), var(--sg-red-500)); color: white; min-height: 220px; display: flex; align-items: center; padding-block: 60px; } .sg-home-brand-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; width: 100%; } .sg-home-brand-cta__title { font-size: var(--shc-m-brand_cta-title-size, 2.2rem); font-weight: 800; color: var(--shc-m-brand_cta-title-color, #fff); text-align: var(--shc-m-brand_cta-title-align, left); margin: 0 0 12px; } .sg-home-brand-cta__text { margin: 0; color: var(--shc-m-brand_cta-text-color, rgba(255,255,255,.95)); font-size: var(--shc-m-brand_cta-text-size, 1rem); line-height: 1.9; } /* --- 鬮ｯ・ｷ陞ゅ・・ｽ・｣繝ｻ・ｰ鬮｣蜴・ｽｽ・ｴ髯ｷ・･繝ｻ・ｲ郢晢ｽｻ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｦ --- */ .sg-media-placeholder { min-height: 320px; border: 1px dashed #9fc1d3; background: linear-gradient(135deg, #f8fcfe, #e9f5fa); display: flex; flex-direction: column; align-items: center; justify-content: center; color: #4d819c; text-align: center; padding: 24px; border-radius: var(--sg-radius-md); } .sg-media-placeholder__label { font-size: 12px; font-weight: 800; letter-spacing: .14em; } .sg-media-placeholder__note { margin-top: 8px; font-size: 13px; } .sg-media-placeholder__admin { margin-top: 10px; font-size: 11px; opacity: .7; } .sg-icon-placeholder { width: 68px; height: 68px; margin: 0 auto 22px; border: 1px dashed #dc8c97; border-radius: 50%; display: grid; place-items: center; color: var(--sg-red-600); background: #fffafa; font-size: 10px; font-weight: 800; letter-spacing: .1em; } .sg-contact-placeholder { position: absolute; right: 28px; bottom: 24px; width: 120px; height: 120px; border: 1px dashed #dc8c97; border-radius: 50%; display: grid; place-items: center; color: var(--sg-red-600); font-size: 11px; font-weight: 800; letter-spacing: .1em; opacity: .6; } .sg-cta-media-placeholder { width: min(36vw, 390px); height: 150px; border: 1px dashed rgba(255,255,255,.65); display: grid; place-items: center; color: rgba(255,255,255,.85); font-size: 11px; font-weight: 800; letter-spacing: .1em; } /* --- 鬮ｯ・ｷ繝ｻ・ｩ髫ｶ荳ｻ・･繝ｻ・ｽ・ｽ繝ｻ・ｺ髮取坩・ｯ莨夲ｽｽ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ--- */ @media (max-width: 991px) { .sg-home-strengths__grid { grid-template-columns: repeat(2, 1fr); } .sg-home-strength:nth-child(2) { border-right: 0; } .sg-home-strength:nth-child(-n+2) { border-bottom: 1px solid var(--sg-border); } .sg-home-dual-grid { grid-template-columns: 1fr; } .sg-home-info-grid { grid-template-columns: 1fr; } .sg-home-brand-cta__inner { flex-direction: column; text-align: center; } .sg-cta-media-placeholder { width: 100%; max-width: 390px; } } @media (max-width: 767px) { .sg-home-hero__inner { display: block; min-height: 660px; padding-top: 58px; padding-bottom: 48px; } .sg-home-hero__media { margin-top: 32px; } .sg-home-product__grid { grid-template-columns: 1fr; min-height: 0; padding-top: 40px; } .sg-home-product__media { margin-top: 32px; } .sg-home-product__media .sg-media-placeholder { min-height: 260px; } .sg-home-strengths__grid { grid-template-columns: 1fr; } .sg-home-strength { border-right: 0; border-bottom: 1px solid var(--sg-border); } .sg-home-strength:last-child { border-bottom: 0; } .sg-home-product, .sg-home-strengths, .sg-home-dual, .sg-home-info, .sg-home-brand-cta { padding-block: 52px; } .sg-media-placeholder { width: 100%; } .sg-home-product__actions { flex-direction: column; align-items: stretch; } .sg-home-product__actions .wp-block-button { width: 100%; } .sg-home-product__actions .wp-block-button__link { width: 100%; justify-content: center; } } @media (max-width: 390px) { .sg-home-main .sg-container { width: calc(100% - 30px); } .sg-home-product, .sg-home-strengths, .sg-home-dual, .sg-home-info { padding-block: 48px; } .sg-home-research, .sg-home-company { padding: 28px 24px; } .sg-home-news, .sg-home-contact { padding: 26px 24px; } .sg-home-strength { padding: 30px 24px; } } /* ========================================================================== Header驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｼ鬲・ｺｷ・ｸ譎剰ｷ晞辧蛹・ｽｽ・｡郢晢ｽｻ繝ｻ・ｼ驕ｶ謫ｾ・ｽ・ｽ郢晢ｽｻ繝ｻ・ｸ髯橸ｽ｢繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｮ髯区ｻゑｽｽ・｡郢晢ｽｻ繝ｻ・ｽ驛｢譎｢・ｽ・ｻHeader驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻg-site-header驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ ========================================================================== */ .sg-site-header { height: 88px; background: #ffffff; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e7ecef; } .sg-site-header__inner { width: min(calc(100% - 48px), 1440px); height: 100%; margin-inline: auto; display: flex; align-items: center; gap: 24px; } /* Logo */ .sg-site-header__brand { flex: 0 0 340px; width: 340px; height: 100%; display: flex; align-items: center; margin: 0; padding: 0; font-size: 16px; line-height: 1.2; } /* 鬯ｯ・ｯ繝ｻ・･髯樊ｻ薙・繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬯ｨ・ｾ陋ｹ繝ｻ・ｽ・ｽ繝ｻ・ｨ h1 鬮ｫ・ｴ繝ｻ・ｬ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｭ郢晢ｽｻ繝ｻ・ｾ鬮ｫ・ｴ鬲・ｼ夲ｽｽ・ｽ繝ｻ・ｶ鬮ｮ荵晢ｽ・ｹ晢ｽｻ髯ｷ蝮よ升繝ｻ・ｾ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｶ鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・ｻ鬯ｯ・ｯ陞｢・ｼ・つ€繝ｻ・｡髯懆ｶ｣・ｽ・ｪ h1 鬯ｲ繝ｻ・ｺ・ｷ・つ€繝ｻ・ｩ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・､鬮ｫ・ｴ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｷ鬮ｯ貅ｽ・ｬ・ｬ陟募干繝ｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻargin/line-height驛｢譎｢・ｽ・ｻ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髯溷桁・ｽ・｡郢晢ｽｻ繝ｻ・ｿ髫ｴ蠑ｱ繝ｻ繝ｻ・ｽ繝ｻ・ｯ驕ｶ荵怜・繝ｻ・｡陷･遽ﾂ€繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｴ鬮ｯ讖ｸ・ｽ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ */ .sg-site-header__brand h1.sg-site-header__brand, h1.sg-site-header__brand { margin-top: 0; margin-bottom: 0; font-size: 16px; line-height: 1.2; } .sg-header-brand { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; outline-offset: 4px; } .sg-header-brand__mark { display: block; width: 72px; height: 60px; flex-shrink: 0; background-color: var(--sg-brand-red, #d5001c); -webkit-mask-image: url("../images/sugimoto-fks-mark-trim.png"); mask-image: url("../images/sugimoto-fks-mark-trim.png"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; } .sg-header-brand__text { display: inline-flex; flex-direction: column; justify-content: center; min-width: 0; } .sg-header-brand__jp { font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "MS PMincho", serif; font-size: 17px; font-weight: 700; line-height: 1.25; color: #16191c; white-space: nowrap; } .sg-header-brand__en { font-size: 10px; line-height: 1.3; letter-spacing: .04em; color: #536069; margin-top: 4px; white-space: nowrap; } /* 鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ驛｢譎｢・ｽ・ｻ髯樊ｺｷ繝ｻ雋会ｽｯ鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｳ */ .sg-site-header__nav { margin-left: auto; height: 100%; display: flex; align-items: center; } .sg-site-header__nav > ul { margin: 0; padding: 0; list-style: none; display: flex; align-items: center; gap: 0; height: 100%; } .sg-site-header__nav li { display: flex; align-items: center; margin: 0; height: 100%; } .sg-site-header__nav a { position: relative; height: 100%; min-height: 0; padding-inline: 16px; display: flex; align-items: center; justify-content: center; color: #111820; font-size: 14px; font-weight: 700; line-height: 1; white-space: nowrap; text-decoration: none; transition: color .2s; } /* 鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ鬯ｩ・､繝ｻ・ｴ郢晢ｽｻ繝ｻ・｢髫ｲ蟶吶・隶難ｽｪ髫ｰ繝ｻ豐ｺ繝ｻ・ｻ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€鬮｣蜴・ｽｽ・ｫ髫ｴ蠑ｱ繝ｻ闔諞ｺ蟇ｰ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｱ髮趣ｽｼ繝ｻ・ｶ郢晢ｽｻ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻover/focus/鬮ｯ貊会ｽｹ豺橸ｽｧ髴趣ｽｯ隴会ｽｮ繝ｻ・ｬ陋帙・・ｽ・ｽ繝ｻ・ｵ鬮ｯ諛ｶ・ｽ・ｮ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｸ髫ｶ譛ｱ螳ｦ繝ｻ・ｺ陜捺万謔ｶ繝ｻ繝ｻ・｢驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ .sg-site-header__nav a, .sg-site-header__nav a:visited, .sg-site-header__nav a:hover, .sg-site-header__nav a:focus, .sg-site-header__nav .current-menu-item > a, .sg-site-header__nav .current_page_item > a { color: #111820; } /* 鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ繝ｻ・･驛｢譎｢・ｽ・ｻ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻover/focus/鬮ｯ貊会ｽｹ豺橸ｽｧ髴趣ｽｯ隴会ｽｮ繝ｻ・ｬ陋帙・・ｽ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髯橸ｽ｢繝ｻ・ｽ髫ｴ・ｫ陞滄托ｽｰ蟷・｣ｰ謳ｾ・ｽ・ｺ郢晢ｽｻ繝ｻ・ｸ髯具ｽｹ繝ｻ・ｺ髯敖€繝ｻ・ｿ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｦ 12-15px驛｢譎｢・ｽ・ｻ髫ｰ逍ｲ・ｻ繧托ｽｽ・ｽ繝ｻ・ｱ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬮ｯ讖ｸ・ｽ・ｻ髯ｷ閧ｴ・ｻ繧托ｽｽ・ｽ繝ｻ・ｼ繝ｻ縺､ﾂ€ */ .sg-site-header__nav a::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: 17px; height: 2px; background: #c9001c; transform: scaleX(0); transform-origin: center; opacity: 0; transition: transform .2s ease, opacity .2s ease; } .sg-site-header__nav a:hover::after, .sg-site-header__nav a:focus-visible::after, .sg-site-header__nav .current-menu-item > a::after, .sg-site-header__nav .current_page_item > a::after { transform: scaleX(1); opacity: 1; } /* 鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ髯懈圜・ｽ・ｰ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｽ髫ｲ・､陷ｻ・ｵ隲｢・ｾ郢晢ｽｻ繝ｻ・ｳ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｴ謇假ｽｽ・｢郢晢ｽｻ繝ｻ・ｬ鬯ｩ蛹・ｽｽ・ｶ髯ｷ・ｿ繝ｻ・･鬩阪・繝ｻ隰ｳ蜀暦ｽｹ譎｢・ｽ・ｻ*/ .sg-site-header__language { flex: 0 0 auto; height: 100%; display: flex; align-items: center; margin-left: 8px; } .sg-site-header__language .sg-lang-switch { position: relative; } .sg-site-header__language .sg-lang-switch__trigger { height: 44px; padding-inline: 10px; border: 0; background: transparent; display: inline-flex; align-items: center; gap: 7px; color: #16191c; font-size: 14px; font-weight: 700; white-space: nowrap; cursor: pointer; } .sg-site-header__language .sg-lang-switch__current { font-weight: 700; } .sg-site-header__language .sg-lang-switch__caret { color: #7a858c; } .sg-site-header__language .sg-lang-switch__menu { position: absolute; top: calc(100% + 6px); right: 0; min-width: 130px; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid #e1e7ea; border-radius: 6px; box-shadow: 0 10px 30px rgba(17,44,67,.12); display: none; z-index: 60; } .sg-site-header__language .sg-lang-switch.is-open .sg-lang-switch__menu { display: block; } .sg-site-header__language .sg-lang-switch__link { display: block; padding: 10px 14px; color: #16191c; font-size: 14px; font-weight: 600; text-decoration: none; border-radius: 4px; } .sg-site-header__language .sg-lang-switch__link:hover { background: #fbeaec; color: #a60017; } .sg-site-header__language .sg-lang-switch__link.is-current { background: #fbeaec; color: #a60017; font-weight: 700; } /* 1280px 鬮｣豈費ｽｼ螟ｲ・ｽ・ｽ繝ｻ・･鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ繝ｻ・･鬮ｫ蜍滂ｽ､諛翫・郢晢ｽｻ繝ｻ・ｩ */ @media (max-width: 1280px) { .sg-site-header__brand { flex-basis: 300px; width: 300px; } .sg-header-brand__mark { width: 64px; height: 54px; } .sg-header-brand__jp { font-size: 15px; } .sg-site-header__nav a { padding-inline: 11px; font-size: 13px; } .sg-site-header__language .sg-lang-switch__trigger { font-size: 13px; padding-inline: 6px; } } /* 鬮ｮ荳ｻ・ｮ閧ｲ讚ｨ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・｡鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｽ郢晢ｽｻ繝ｻ・｡鬩募●謇ｱ陝ｲ・ｶ鬯ｯ・ｮ繝ｻ・ｫ髯ｷ螂・ｽ｣・ｰ鬯ｩ貊ゑｽｽ・ｪ驛｢譎｢・ｽ・ｻ髫ｶ蜻ｵ・ｶ・｣繝ｻ・ｽ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ鬮ｫ・ｴ隰ｫ・ｾ繝ｻ・ｽ繝ｻ・ｾ鬯ｩ遨ゑｽｼ螟ｲ・ｽ・ｽ繝ｻ・ｺ */ .sg-site-header__burger { display: none; } /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｮ・｣陋ｹ竏壹・鬲・ｺｷ繝ｻ郢晢ｽｻ髯樊ｻ楢・繝ｻ・ｽ繝ｻ・ｻ髯区ｻゑｽｽ・ｩ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・､鬯ｯ・ｮ繝ｻ・ｫ髯ｷ螂・ｽ｣・ｰ鬯ｩ貊ゑｽｽ・ｪ驛｢譎｢・ｽ・ｻ髯懈瑳・ｻ繧托ｽｽ・ｽ繝ｻ・｡鬩募●謇ｱ陝ｲ・ｶ鬮｣蛹・ｽｽ・ｳ鬮｢・ｧ繝ｻ・ｴ髣皮判・ｨ・｣隨吶ｅ繝ｻ繝ｻ・ｺ驛｢譎｢・ｽ・ｻ髣費ｽｨ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｼ髯溷桁・ｽ・｡郢晢ｽｻ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｧ郢晢ｽｻ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ鬮ｮ荳ｻ・ｮ閧ｲ讚ｨ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・｡鬮ｯ讖ｸ・ｽ・ｻ髯ｷ閧ｴ・ｻ繧托ｽｽ・ｽ繝ｻ・ｼ繝ｻ縺､ﾂ€ */ .sg-site-header__mobile-menu { display: none; } /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｽ郢晢ｽｻ繝ｻ・ｱ髴大｣ｼ驕懊・・｣繝ｻ・ｰ郢晢ｽｻ繝ｻ・｡鬯ｮ・｣陋ｹ竏壹・鬲・ｺｷ繝ｻ郢晢ｽｻ驛｢譎｢・ｽ・ｻ68 鬮｣豈費ｽｼ螟ｲ・ｽ・ｽ繝ｻ・･鬮｣蛹・ｽｽ・ｳ髯ｷ闌ｨ・ｽ・ｷ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ @media (max-width: 767.98px) { .sg-site-header { height: 68px; } .sg-site-header__inner { width: calc(100% - 32px); gap: 12px; } .sg-site-header__brand { flex-basis: auto; width: auto; } .sg-header-brand__mark { width: 52px; height: 44px; } .sg-header-brand__jp { font-size: 13px; } .sg-header-brand__en { font-size: 8px; } /* 鬮ｫ・ｴ繝ｻ・ｯ鬩募●謇ｱ陝ｲ・ｶ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｼ鬯ｮ・｣陞ゅ・・ｽ・ｽ繝ｻ・ｪ鬯ｯ・ｮ繝ｻ・ｫ髯ｷ螂・ｽ｣・ｰ鬯ｩ貊ゑｽｽ・ｪ驛｢譎｢・ｽ・ｻ髫ｴ・ｴ繝ｻ・ｧ髣皮判・ｨ・｣隨吶ｅ繝ｻ繝ｻ・ｺ鬮ｮ荳ｻ・ｮ閧ｲ讚ｨ郢晢ｽｻ繝ｻ・ｰ郢晢ｽｻ繝ｻ・｡鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ */ .sg-site-header__nav { display: none; } .sg-site-header__language { display: none; } .sg-site-header__burger { flex: 0 0 auto; width: 44px; height: 44px; border: 0; background: transparent; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; cursor: pointer; } .sg-site-header__burger span { display: block; width: 22px; height: 2px; background: #16191c; border-radius: 2px; transition: transform .25s, opacity .25s; } /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｮ・｣陋ｹ竏壹・鬲・ｺ倥・*/ .sg-site-header__mobile-menu { display: none; position: fixed; top: 68px; left: 0; right: 0; bottom: 0; background: #fff; z-index: 90; overflow-y: auto; padding: 20px 20px 40px; } .sg-site-header__mobile-menu.is-open { display: block; } .sg-site-header__mobile-menu ul { margin: 0; padding: 0; list-style: none; } .sg-site-header__mobile-menu li { border-bottom: 1px solid #eef1f3; } .sg-site-header__mobile-menu a { display: flex; align-items: center; min-height: 52px; color: #16191c; font-size: 15px; font-weight: 600; text-decoration: none; } .sg-site-header__mobile-menu .current-menu-item > a { color: #c9001c; } /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ鬯ｮ・ｫ繝ｻ・ｸ郢晢ｽｻ繝ｻ・ｭ鬯ｮ・ｫ繝ｻ・ｪ繝ｻ縺､ﾂ€鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ髯懈圜・ｽ・ｰ驛｢譎｢・ｽ・ｻ髯樊ｺ假ｽ・・・ｳ繝ｻ・｡鬯ｩ蛹・ｽｽ・ｶ髯区ｻゑｽｽ・ｶ郢晢ｽｻ繝ｻ・ｸ繝ｻ縺､ﾂ€鬯ｮ・ｯ繝ｻ・ｦ驛｢譎｢・ｽ・ｻ*/ .sg-site-header__mobile-lang { margin-top: 20px; padding-top: 20px; border-top: 1px solid #eef1f3; display: flex; gap: 12px; } .sg-site-header__mobile-lang a { flex: 1; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; border: 1px solid #e1e7ea; border-radius: 6px; color: #16191c; font-size: 14px; font-weight: 700; text-decoration: none; } .sg-site-header__mobile-lang a.is-current { background: #fbeaec; color: #a60017; border-color: #f0cdd3; } } /* ========================================================================== /* ========================================================================== /* ========================================================================== Hero 鬯ｮ・ｴ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｮ鬮ｫ・ｰ繝ｻ・ｦ郢晢ｽｻ繝ｻ・ｭ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻg-hero-slider驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ ========================================================================== */ :root { --sg-brand-red: #d5001c; } .sg-hero-slider { position: relative; width: 100%; height: clamp(460px, 38vw, 560px); overflow: hidden; background: #eef8fb; } .sg-hero-slider__viewport { position: absolute; inset: 0; } .sg-hero-slider__track { position: relative; width: 100%; height: 100%; } /* Slide */ .sg-hero-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .65s ease, visibility .65s ease; } .sg-hero-slide.is-active { opacity: 1; visibility: visible; z-index: 2; } .sg-hero-slide__background { position: absolute; inset: 0; z-index: 0; background-position: center center; background-repeat: no-repeat; background-size: cover; } .sg-hero-slide::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.55) 38%, rgba(255,255,255,.08) 68%, rgba(255,255,255,0) 100%); pointer-events: none; } .sg-hero-slide__inner { position: relative; z-index: 2; width: 1180px; max-width: calc(100% - 80px); height: 100%; margin-inline: auto; } /* 鬮ｯ譎｢・ｽ・ｾ郢晢ｽｻ繝ｻ・ｦ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｹ */ .sg-hero-slide__content { position: absolute; top: var(--sg-hero-content-top, 76px); left: var(--sg-hero-content-left, 0px); width: var(--sg-hero-content-w, 500px); margin: 0; padding: 0; z-index: 3; opacity: 0; transform: translateX(-18px); transition: opacity .6s ease .12s, transform .6s ease .12s; } .sg-hero-slide.is-active .sg-hero-slide__content { opacity: 1; transform: translateX(0); } .sg-hero-slide__title { margin: 0; color: var(--sg-hero-title-color, #102743); font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "MS PMincho", serif; font-size: var(--sg-hero-title-size, 42px); font-weight: 600; line-height: var(--sg-hero-title-lh, 1.43); letter-spacing: .02em; white-space: nowrap; } .sg-hero-slide__accent, .shc-accent { color: var(--sg-hero-accent, #c9001c); } html[lang^="zh"] .sg-hero-slide__title { font-size: var(--sg-hero-title-zh-size, 40px); } .sg-hero-slide__description { max-width: 480px; margin: var(--sg-hero-desc-gap, 18px) 0 0; color: var(--sg-hero-desc-color, #4f5963); font-size: var(--sg-hero-desc-size, 12px); font-weight: 400; line-height: 1.9; letter-spacing: .01em; } /* Japanese desktop hero copy needs a readable presentation scale. */ @media (min-width: 768px) { html[lang^="ja"] .sg-hero-slide__description { font-size: 18px !important; line-height: 1.85; } } /* Chinese desktop hero needs a matching presentation scale. */ @media (min-width: 901px) { html[lang^="zh"] .sg-hero-slide__title { font-size: 46px !important; } html[lang^="zh"] .sg-hero-slide__description { font-size: 16px !important; line-height: 1.85; } } /* 鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ */ .sg-hero-slide__actions { margin-top: var(--sg-hero-btn-gap, 22px); display: flex; justify-content: var(--sg-hero-btn-align, flex-start); } .sg-hero-slide__button--primary { width: var(--sg-hero-btn-w, 156px); height: var(--sg-hero-btn-h, 40px); padding: 0 17px; border: 0; border-radius: var(--sg-hero-btn-radius, 2px); background: var(--sg-hero-btn-bg, #c9001c); color: var(--sg-hero-btn-text, #fff); display: inline-flex; align-items: center; justify-content: space-between; font-size: var(--sg-hero-btn-font, 12px); font-weight: 600; line-height: 1; text-decoration: none; transition: background-color .18s ease, opacity .18s ease; } .sg-hero-slide__button--primary:hover { background: #a60017; color: #fff; } .sg-hero-slide__button--primary:focus-visible { outline: 2px solid #102743; outline-offset: 2px; } .sg-hero-slide__button--primary { border: 1px solid #c9001c; background: var(--sg-hero-btn-bg, #c9001c); color: var(--sg-hero-btn-text, #fff); } .sg-hero-slide__button--primary:hover { background: var(--sg-hero-btn-bg-hover, #a60017); } .sg-hero-slide__button--secondary { min-width: 132px; border: 1px solid #202830; background: rgba(255,255,255,.78); color: #202830; } .sg-hero-slide__button--secondary:hover { background: rgba(255,255,255,.95); } /* 鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｳ鬮｣諞ｺ螻ｮ繝ｻ・ｽ繝ｻ・ｧ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ謫ｾ・ｽ・ｫ髴趣ｽ｣郢晢ｽｻ/ 鬮ｯ譏懶ｽｻ蜷晢ｽｮ・ｴ郢晢ｽｻ繝ｻ・ｽ驛｢譎｢・ｽ・ｻ*/ .sg-hero-slide__brand { position: absolute; top: 0; bottom: 0; left: calc(48% + var(--shc-bx, 0px)); width: calc(52% - 24px); padding-left: 24px; display: flex; align-items: center; justify-content: center; opacity: 0; transform: translateX(18px); transition: opacity .6s ease .18s, transform .6s ease .18s; } .sg-hero-slide.is-active .sg-hero-slide__brand { opacity: 1; transform: translateX(0); } .sg-hero-slide__brand-mark { width: var(--shc-bw, clamp(260px, 25vw, 340px)); transform: translateY(var(--shc-by, 0px)); aspect-ratio: 587 / 378; background-color: var(--sg-brand-red); -webkit-mask-image: url("../images/sugimoto-fks-mark-trim.png"); mask-image: url("../images/sugimoto-fks-mark-trim.png"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; } .sg-hero-slide__media { position: absolute; top: calc(82px + var(--shc-by, 0px)); right: calc(92px + var(--shc-bx, 0px)); width: var(--shc-bw, 360px); display: flex; align-items: center; justify-content: center; opacity: 0; transform: translateX(18px); transition: opacity .6s ease .18s, transform .6s ease .18s; } .sg-hero-slide.is-active .sg-hero-slide__media { opacity: 1; transform: translateX(0); } .sg-hero-slide__media-img { width: 100%; transform: translateY(var(--shc-by, 0px)); height: auto; object-fit: contain; border-radius: 8px; } /* 鬮ｯ蜈ｷ・ｽ・ｻ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬮ｯ諛ｶ・ｽ・ｨ驛｢譎｢・ｽ・ｻ驍ｵ・ｺ郢晢ｽｻ*/ .sg-hero-slider__dots { position: absolute; z-index: 5; left: 50%; bottom: 18px; display: flex; gap: 9px; transform: translateX(-50%); } .sg-hero-slider__dot { position: relative; width: 32px; height: 32px; padding: 0; border: 0; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; } .sg-hero-slider__dot::after { content: ""; width: 7px; height: 7px; border-radius: 50%; background: rgba(82,96,105,.35); transition: background .2s; } .sg-hero-slider__dot.is-active::after { background: #df1028; } /* 鬮ｯ譎｢・ｽ・ｾ郢晢ｽｻ繝ｻ・ｦ鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｳ鬯ｩ髦ｪ・代・・ｽ繝ｻ・ｭ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｴ */ .sg-hero-slider__prev, .sg-hero-slider__next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 6; width: 40px; height: var(--sg-hero-btn-h, 40px); border: 1px solid rgba(5,36,76,.18); border-radius: 50%; background: rgba(255,255,255,.55); color: #05244c; font-size: 18px; line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; opacity: .65; transition: opacity .2s, background .2s; } .sg-hero-slider__prev:hover, .sg-hero-slider__next:hover { opacity: 1; background: rgba(255,255,255,.9); } .sg-hero-slider__prev { left: 20px; } .sg-hero-slider__next { right: 20px; } /* 鬯ｩ蜍溪・繝ｻ・ｽ繝ｻ・ｻ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｨ鬯ｩ蛹・ｽｽ・ｶ郢晢ｽｻ繝ｻ・ｯ */ @media (max-width: 767px) { .sg-hero-slider { height: 620px; } .sg-hero-slide__inner { width: min(calc(100% - 40px), 540px); grid-template-columns: 1fr; align-content: center; padding-top: 20px; padding-bottom: 48px; } .sg-hero-slide__content { position: relative; z-index: 3; } .sg-hero-slide__title { font-size: 34px; line-height: 1.35; } .sg-hero-slide__description { margin-top: 18px; font-size: 14px; line-height: 1.8; } .sg-hero-slide__brand { position: absolute; right: 16px; bottom: 46px; opacity: .18; pointer-events: none; transform: none; } .sg-hero-slide.is-active .sg-hero-slide__brand { opacity: .18; transform: none; } .sg-hero-slide__brand-mark { width: 210px; } .sg-hero-slide__media { position: absolute; right: 16px; bottom: 40px; opacity: .5; } .sg-hero-slide.is-active .sg-hero-slide__media { opacity: .5; } .sg-hero-slide__media-img { width: 150px; } .sg-hero-slide__actions { margin-top: 24px; } .sg-hero-slider__prev { left: 8px; } .sg-hero-slider__next { right: 8px; } } /* 鬯ｯ・ｯ繝ｻ・･髯樊ｻ薙・繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・｡鬮ｯ諛ｶ・ｽ・ｮ鬩阪・・ｽ・ｲ髮句ｮ茨ｽｧ蛛・ｽｽ・ｫ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｮ髫ｰ繝ｻ豐ｺ繝ｻ・ｻ闔ｨ螟ｲ・ｽ・ｽ繝ｻ・ｸ繝ｻ縺､ﾂ€驛｢譎｢・ｽ・ｻ髣費｣ｰ繝ｻ・･鬯ｪ・ｭ陋滂ｽｩ隲｢・ｾ郢晢ｽｻ繝ｻ・ｰ鬯ｮ・｢繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｪ鬮ｯ讖ｸ・ｽ・ｳ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｹ髴大｣ｼ髮€繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｬ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ .sg-home-main .wp-block-button.is-style-fill .wp-block-button__link { background: var(--sg-mod-btn-bg, #c9001c) !important; color: var(--sg-mod-btn-text, #fff) !important; border-radius: var(--sg-mod-btn-radius, 4px) !important; /* 鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・｡鬮ｯ諛ｶ・ｽ・ｮ鬩阪・・ｽ・ｲ髮句ｮ茨ｽｧ蛛・ｽｽ・ｫ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｮ鬮ｯ譏ｴ繝ｻ・つ€隲帑ｺ･・ｷ・ｮ/鬮ｫ・ｴ遶丞｣ｹ繝ｻ郢晢ｽｻ繝ｻ・ｭ鬮｣蝓ｼ雎ｪ隶難ｽｪ驛｢譎｢・ｽ・ｻ髣費｣ｰ繝ｻ・･鬯ｪ・ｭ陋滂ｽｩ隲｢・ｾ郢晢ｽｻ繝ｻ・ｰ鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｯ鬯ｮ・ｫ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ .sg-home-product .wp-block-button.is-style-fill .wp-block-button__link { font-size: var(--shc-m-product-btn-size, 14px); color: var(--shc-m-product-btn-color, var(--sg-mod-btn-text, #fff)) !important; background: var(--shc-m-product-btn-bg, var(--sg-mod-btn-bg, #c9001c)) !important; border-radius: var(--shc-m-product-btn-radius, 4px) !important; } .sg-home-research .wp-block-button.is-style-fill .wp-block-button__link { font-size: var(--shc-m-research-btn-size, 14px); color: var(--shc-m-research-btn-color, var(--sg-mod-btn-text, #fff)) !important; background: var(--shc-m-research-btn-bg, var(--sg-mod-btn-bg, #c9001c)) !important; border-radius: var(--shc-m-research-btn-radius, 4px) !important; } .sg-home-company .wp-block-button.is-style-fill .wp-block-button__link { font-size: var(--shc-m-company-btn-size, 14px); color: var(--shc-m-company-btn-color, var(--sg-mod-btn-text, #fff)) !important; background: var(--shc-m-company-btn-bg, var(--sg-mod-btn-bg, #c9001c)) !important; border-radius: var(--shc-m-company-btn-radius, 4px) !important; } .sg-home-contact .wp-block-button.is-style-fill .wp-block-button__link { font-size: var(--shc-m-contact-btn-size, 14px); color: var(--shc-m-contact-btn-color, var(--sg-mod-btn-text, #fff)) !important; background: var(--shc-m-contact-btn-bg, var(--sg-mod-btn-bg, #c9001c)) !important; border-radius: var(--shc-m-contact-btn-radius, 4px) !important; } } .sg-home-main .wp-block-button.is-style-outline .wp-block-button__link { color: var(--sg-mod-btn-bg, #c9001c) !important; } /* 鬮ｯ・ｷ郢晢ｽｻ繝ｻ・ｸ隶厄ｽｸ繝ｻ・ｽ繝ｻ・ｰ髯樊ｻゑｽｽ・ｧ髯ｷ讎環€・ｩ繝ｻ・ｫ繝ｻ・､驕ｶ謫ｾ・ｽ・ｵ鬮ｫ・ｴ隲帙・・ｽ・ｭ繝ｻ・ｫ驛｢譎｢・ｽ・ｻ*/ @media (prefers-reduced-motion: reduce) { .sg-hero-slide, .sg-hero-slide__content, .sg-hero-slide__brand, .sg-hero-slide__media { transition: none; transform: none; } } /* 鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・｡鬮ｯ諛ｶ・ｽ・ｮ髫ｲ・､隲幢ｽｷ繝ｻ・ｴ雋・ｽｯ繝ｻ・ｿ陞｢・ｹ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｮ郢晢ｽｻ繝ｻ・ｽ鬮ｯ貅ｯ・ｶ・｣繝ｻ・ｽ繝ｻ・ｦ驛｢譎｢・ｽ・ｻ髣費｣ｰ繝ｻ・･鬯ｪ・ｭ陋滂ｽｩ隲｢・ｾ郢晢ｽｻ繝ｻ・ｰ鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｯ鬯ｮ・ｫ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ .sg-home-product__img { width: var(--shc-m-product-img-w, 100%); height: auto; } .sg-home-strength__icon { width: 72px; height: 72px; margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 50%; background: #f6f7f7; } .sg-home-strength__icon img { width: 100%; height: 100%; object-fit: cover; } .sg-home-brand-cta__img { width: var(--shc-m-brand_cta-img-w, 100%); height: auto; } /* 鬮ｫ・ｰ陷€・ｶ陝貊・惧繝ｻ・ｴ鬮ｯ譏ｴ繝ｻ繝ｻ・ｽ繝ｻ・ｹ鬯ｲ繝ｻ・ｽ・ｨ髫ｰ・ｦ繝ｻ・ｰ郢晢ｽｻ繝ｻ・ｼ髣費｣ｰ繝ｻ・･鬯ｪ・ｭ陋滂ｽｩ隲｢・ｾ郢晢ｽｻ繝ｻ・ｰ鬮ｯ・ｷ繝ｻ・ｿ郢晢ｽｻ繝ｻ・ｯ鬯ｮ・ｫ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ郢晢ｽｻ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ*/ .sg-home-product__actions { justify-content: var(--shc-m-product-btn-align, flex-start); } .sg-home-research__actions, .sg-home-company__actions, .sg-home-contact__actions { justify-content: var(--shc-m-research-btn-align, flex-start); } .sg-hero-slide__brand-img { width: var(--shc-bw, auto); max-width: 100%; height: auto; display: block; transform: translateY(var(--shc-by, 0px)); } /* ========== 鬮｣雋ｻ・｣・ｰ郢晢ｽｻ繝ｻ・ｧ鬮ｯ・ｷ繝ｻ・ｩ驕ｶ荵嶺ｺ｢郢晢ｽｻ鬮ｯ讖ｸ・ｽ・ｳ郢晢ｽｻ繝ｻ・ｹ鬮ｯ・ｷ陋ｹ・ｻ郢晢ｽｻ郢晢ｽｻ繝ｻ・ｴ郢晢ｽｻ繝ｻ・ｰ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻepeatable content_items驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ========= */ .sg-pi { margin: 0; } .sg-pi--eyebrow { font-size: var(--sg-pi-fz-d, 16px); letter-spacing: .08em; } .sg-pi--heading { font-size: var(--sg-pi-fz-d, 64px); line-height: 1.15; font-weight: 800; } .sg-pi--lead { font-size: var(--sg-pi-fz-d, 18px); font-weight: 500; } .sg-pi--text { font-size: var(--sg-pi-fz-d, 16px); line-height: 1.9; } .sg-pi--highlight { font-size: var(--sg-pi-fz-d, 18px); font-weight: 600; color: #c9001c; } .sg-pi--badge { display: inline-block; font-size: var(--sg-pi-fz-d, 13px); } .sg-pi--button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 14px 26px; border: 0; text-decoration: none; transition: background-color .18s ease, color .18s ease; } .sg-pi-button--hover:hover { background: var(--sg-pi-hbg, #a30016) !important; color: var(--sg-pi-hc, #ffffff) !important; } .sg-pi--divider { border: none; border-top: 1px solid #dcdcde; } .sg-pi--spacer { height: var(--sg-pi-sh-t, 0px); } .sg-pi--image { display: block; max-width: 100%; height: auto; } .sg-pi--icon { display: inline-block; } .sg-pi--richtext { font-size: var(--sg-pi-fz-d, 16px); line-height: 1.9; } .sg-pi--richtext p { margin: 0 0 1em; } .sg-pi--richtext p:last-child { margin-bottom: 0; } /* 鬮ｯ・ｷ繝ｻ・ｩ髫ｶ荳ｻ・･繝ｻ・ｽ・ｽ繝ｻ・ｺ髮取坩・ｯ莨夲ｽｽ・ｽ繝ｻ・ｼ髣包ｽｳ隶厄ｽｸ繝ｻ・ｽ繝ｻ・ｭ髫ｲ・､隲帑ｺ･・ｷ・ｮ驛｢譎｢・ｽ・ｻ髣費｣ｰ繝ｻ・･郢晢ｽｻ繝ｻ・ｹ郢晢ｽｻ繝ｻ・ｳ鬮ｫ・ｴ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｿ/鬮ｫ・ｰ郢晢ｽｻ驍・・・ｫ・ｰ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ @media (max-width: 1024px) { .sg-pi { font-size: var(--sg-pi-fz-t, var(--sg-pi-fz-d, 16px)); } .sg-pi--spacer { height: var(--sg-pi-sh-t, 0px); } } @media (max-width: 600px) { .sg-pi { font-size: var(--sg-pi-fz-m, var(--sg-pi-fz-t, var(--sg-pi-fz-d, 16px))); } .sg-pi--spacer { height: var(--sg-pi-sh-m, var(--sg-pi-sh-t, 0px)); } } /* 鬮ｯ・ｷ繝ｻ・ｩ髫ｶ荳ｻ・･繝ｻ・ｽ・ｽ繝ｻ・ｺ髮取坩・ｯ莨夲ｽｽ・ｽ繝ｻ・ｼ髣包ｽｵ陟搾ｽｺ繝ｻ・ｻ隶難ｽ｣隨吶ｅ繝ｻ繝ｻ・ｺ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻC/鬮ｯ譎｢・ｽ・ｷ郢晢ｽｻ繝ｻ・ｳ鬮ｫ・ｴ陞滂ｽｲ繝ｻ・ｽ繝ｻ・ｿ/鬮ｫ・ｰ郢晢ｽｻ驍・・・ｫ・ｰ繝ｻ・ｻ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ .sg-pi-hide-pc { display: none !important; } @media (min-width: 601px) and (max-width: 1024px) { .sg-pi-hide-tablet { display: none !important; } } @media (min-width: 1025px) { .sg-pi-hide-tablet { display: block !important; } } @media (max-width: 600px) { .sg-pi-hide-mobile { display: none !important; } } .sg-pi-button__arrow { display: inline-block; } /* ============================================================ * 鬯ｯ・ｯ繝ｻ・･髯樊ｻ薙・繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｵ鬮ｯ蜈ｷ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｺ鬮ｯ諛ｶ・ｽ・ｮ驛｢譎｢・ｽ・ｻ 鬮ｫ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｰ髫ｰ繝ｻ豐ｺ霑ｹ・ｳ髫ｴ・ｯ繝ｻ・ｷ驛｢譎｢・ｽ・ｻ髯橸ｽ｢繝ｻ・ｻ郢晢ｽｻ繝ｻ・ｸ鬯ｮ・ｮ遶擾ｽｵ繝ｻ・ｿ繝ｻ・ｰ 鬮ｯ譎｢・ｽ・ｾ郢晢ｽｻ繝ｻ・ｦ鬮ｫ・ｴ遶丞｣ｹ繝ｻ髫ｰ繝ｻ・ｽ・ｿ鬮ｯ諛亥惧繝ｻ・ｽ繝ｻ・ｾ + 鬮｣蛹・ｽｽ・ｳ髯ｷ・ｿ繝ｻ・･髮趣ｽｼ繝ｻ・ｰ 鬮ｯ諛按€諛ｶ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｹ鬮｣雋ｻ・ｽ・ｨ髣費ｽｨ隲幄肩・ｽ・ｼ繝ｻ・｢鬮ｯ・ｷ陞ゅ・・ｽ・ｽ繝ｻ・｡鬮ｴ螟ｧ・｣・ｹ郢晢ｽｻ * ============================================================ */ .sg-home-product { position: relative; /* overflow 陷ｿ・ｯ髫励・・ｼ螢ｼ繝ｻ髫ｶ・ｸ陜暦ｽｾ隴ｬ繝ｻ・､・ｧ陜暦ｽｾ雋・ｽ｢陷・ｽｺ鬮費ｽｺ雋奇ｽ｡陞ｻ荳橸ｽｹ蛹・ｽｼ閧ｲ蜊€陟主｢捺€呵主供・ｱ繧・€竏晏ｴ溯ｭｬ繝ｻ諤咎ｬ假ｽｶ陞ｻ繧托ｽｼ繝ｻ*/ overflow: visible; background: #f7fbfd; min-height: 900px; height: auto; padding-block: 0; } .sg-home-product__background { position: absolute; inset: 0; z-index: 0; pointer-events: none; /* 鬯ｩ閧ｴ蠕励・・｣繝ｻ・ｰ鬮ｫ・ｴ陞｢・ｼ鬲假ｽｻ郢晢ｽｻ繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｺ鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｱ鬮ｯ・ｷ陞ゅ・・ｽ・｣繝ｻ・ｰ鬮｣蜴・ｽｽ・ｴ髫ｰ・ｳ繝ｻ・ｾ郢晢ｽｻ繝ｻ・ｼ髯ｷ・･繝ｻ・ｾSS 鬮ｮ荵晢ｽ・・・ｻ陷ｷ譎｢・ｽ・ｺ陷托ｽｰ繝ｻ・ｮ鬮ｮ・｣繝ｻ・ｽ繝ｻ・｡鬮ｫ・ｲ繝ｻ・｡髮倶ｼ∝ｱｮ繝ｻ・ｽ繝ｻ・ｵ驛｢譎｢・ｽ・ｻ鬩搾ｽｨ繝ｻ・ｱ鬮ｯ・ｷ髢ｧ・ｲ陋ｻ・､髫ｴ・ｯ隴擾ｽｴ郢晢ｽｻ驛｢譎｢・ｽ・ｻustomizer 鬮｣蛹・ｽｽ・ｳ鬮ｮ讎翫・繝ｻ・ｽ繝ｻ・ｼ郢晢ｽｻ繝ｻ・ｰ鬯ｮ・｢繝ｻ・ｭ髫ｴ・ｴ繝ｻ・ｧ髯ｷ謳ｾ・ｽ・ｹ鬮ｯ諛亥惧繝ｻ・ｽ繝ｻ・ｾ鬮ｯ・ｷ繝ｻ・ｷ髯橸ｽｳ髢ｧ・ｲ繝ｻ・ｽ繝ｻ・ｰ鬮ｯ・ｷ・つ€驛｢譎｢・ｽ・ｻ郢晢ｽｻ郢晢ｽｻ鬯ｩ蛯ｵﾂ€郢晢ｽｻ繝ｻ・ｻ鬯ｮ・ｫ髴域鱒繝ｻ髯昴・・｣・ｰ驛｢譎｢・ｽ・ｻ驛｢譎｢・ｽ・ｻ*/ background: radial-gradient(circle at 88% 10%, rgba(64,150,255,.20), transparent 40%), radial-gradient(circle at 62% 4%, rgba(64,150,255,.12), transparent 34%), radial-gradient(circle at 8% 30%, rgba(120,190,255,.10), transparent 30%), linear-gradient(180deg, #ffffff 0%, #eef7fc 55%, #f7fbfd 100%); background-repeat: no-repeat; background-position: center top; background-size: cover; } .sg-home-product__container { position: relative; /* z-index auto・壻ｸ榊・蟒ｺ stacking context・悟崟譬・z-index 100 謠仙合蛻ｰ鬘ｵ髱｢譛€鬘ｶ螻・*/ width: min(calc(100% - 80px), 1420px); margin-inline: auto; padding-top: 72px; padding-bottom: 52px; } .sg-home-product__main { display: grid; grid-template-columns: minmax(0, 42%) minmax(0, 58%); align-items: center; min-height: 610px; gap: 28px; } .sg-home-product__content { align-self: center; max-width: 560px; padding-left: 20px; padding-bottom: 40px; } .sg-home-product__visual { position: relative; align-self: stretch; display: flex; align-items: flex-start; justify-content: flex-end; min-width: 0; padding-top: 10px; } .sg-home-product__packshot { display: block; width: min(100%, 910px); height: auto; max-height: 610px; object-fit: contain; object-position: right top; } .sg-home-product__visual-placeholder { width: min(100%, 910px); min-height: 420px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 1px dashed #b8c9d6; border-radius: 12px; background: rgba(255,255,255,.6); color: #6b7a87; font-size: 14px; text-align: center; } .sg-placeholder__label { font-weight: 700; color: #4a5a68; } .sg-placeholder__admin { font-size: 12px; color: #8b9aa7; } /* ---------- 鬮｣蛹・ｽｽ・ｳ髯具ｽｹ繝ｻ・ｺ髯敖€繝ｻ・ｿ鬮ｯ諛按€諛ｶ・ｽ・ｹ郢晢ｽｻ繝ｻ・ｽ繝ｻ・｡郢晢ｽｻ繝ｻ・ｹ鬮｣雋ｻ・ｽ・ｨ髣費ｽｨ隲幄肩・ｽ・ｼ繝ｻ・｢鬮ｯ讓奇ｽｻ繧托ｽｽ・ｽ繝ｻ・ｧ鬮ｯ・ｷ陞ゅ・・ｽ・ｽ繝ｻ・｡鬮ｴ螟ｧ・｣・ｹ郢晢ｽｻ---------- */ /* ========== 三独立层：白底 box（最底）→ 文本框层 → 图标层（最顶）========== *//* 1) 白底（纯背景，不含内容；位置/大小用滑块独立控制） */.sg-home-product__features-box { position: relative; width: calc(100% - var(--sg-feat-ml, 20px)); margin: 6px 0 0 var(--sg-feat-ml, 20px); min-height: var(--sg-feat-min-h, 280px); border: 1px solid var(--sg-feat-border, #dfe7ec); border-radius: var(--sg-feat-radius, 14px); background: var(--sg-feat-bg, rgba(255,255,255,.96)); box-shadow: 0 4px 18px rgba(5,36,76,.035);}/* 2) 文本框层（独立 absolute，可任意移动，不影响白底/图标） */.sg-home-product__features-texts { position: absolute; inset: 0; z-index: 1; pointer-events: none; transform: translate(var(--sg-feat-texts-x, 0px), var(--sg-feat-texts-y, 0px));}.sg-product-feature-text { position: absolute; top: 50%; transform: translate(-50%, -50%); max-width: 280px; text-align: var(--sg-feat-align, center);}.sg-product-feature-text + .sg-product-feature-text::before { content: ''; position: absolute; left: -14px; top: 18px; bottom: 12px; width: 1px; background: var(--sg-feat-divider, #dce3e8); pointer-events: none;}/* 图标独立层：覆盖白底卡片区域，z-index 9999 页面最顶层；位置可用滑块任意移动（彻底脱离卡片） */ .sg-home-product__features-icons { position: absolute; inset: 0; z-index: 9999; pointer-events: none; transform: translate(var(--sg-feat-icons-x, 0px), var(--sg-feat-icons-y, 0px)); } .sg-product-feature__icon { /* 绝对定位：以图标层中心为基准向四周扩展（变大不滑走、可铺满屏幕）、最顶层、透明底 */ position: absolute; top: 50%; transform: translate(-50%, -50%); width: var(--sg-feat-icon-v, var(--sg-feat-icon-size, 350px)); height: var(--sg-feat-icon-v, var(--sg-feat-icon-size, 350px)); object-fit: contain; z-index: 9999; } .sg-product-feature__icon-placeholder { display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; transform: translate(-50%, -50%); width: var(--sg-feat-icon-v, var(--sg-feat-icon-size, 350px)); height: var(--sg-feat-icon-v, var(--sg-feat-icon-size, 350px)); z-index: 9999; border: 1px dashed #c3d2dd; border-radius: 50%; background: rgba(245,250,253,.8); color: #8b9aa7; font-size: 12px; } .sg-product-feature__title { margin: 0; color: var(--sg-feat-title-color, #05244c); font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "MS PMincho", serif; font-size: var(--sg-feat-title-size, 22px); font-weight: var(--sg-feat-title-weight, 600); line-height: 1.45; letter-spacing: .01em; /* 陋ｻ・ｰ鬮ｯ・､陷ｿ・ｯ髢ｭ・ｽ騾ｧ繝ｻ・ｰ繝ｻ・｢蛟・ｽｸ蛹ｺ・ｨ・ｪ驛､・ｿ */ border-bottom: none; text-decoration: none; } .sg-product-feature__title::after { display: none !important; content: none !important; } .sg-product-feature__text { margin: 14px 0 0; color: var(--sg-feat-text-color, #1f272c); font-size: var(--sg-feat-text-size, 14px); font-weight: 400; line-height: var(--sg-feat-text-lh, 1.85); letter-spacing: 0; max-width: var(--sg-feat-text-maxw, 250px); } /* ---------- 鬮ｯ・ｷ繝ｻ・ｩ髫ｶ荳ｻ・･繝ｻ・ｽ・ｽ繝ｻ・ｺ髮取坩・ｯ莨夲ｽｽ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ1024px ---------- */ @media (max-width: 1024px) { .sg-home-product__container { width: min(calc(100% - 48px), 960px); padding-top: 56px; } .sg-home-product__main { grid-template-columns: 44% 56%; min-height: 520px; } .sg-home-product__packshot { max-height: 500px; } .sg-home-product__features-box { width: min(calc(100% - 48px), 960px); } /* 鬮｣蛹・ｽｽ・ｳ郢晢ｽｻ繝ｻ・､鬮ｯ蜈ｷ・ｽ・ｻ髫ｴ莨夲ｽｽ・ｦ郢晢ｽｻ繝ｻ・ｼ髯樊ｺ假ｽ代・・ｽ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｬ3鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｹ驛｢譎｢・ｽ・ｻ髯懈瑳・ｺ・ｽ隰泌ｹ・ｽｫ・ｯ繝ｻ・ｦ鬩募・繝ｻ繝ｻ・ｽ繝ｻ・ｦ髯ｷ・ｴ郢晢ｽｻ繝ｻ・ｽ繝ｻ・ｼ髴大｣ｼ邯懊・陋ｾ・ｩ蛹・ｽｽ・ｶ髣包ｽｵ雋翫ｑ・ｽ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｿ驛｢譎｢・ｽ・ｻ髯晢ｽｶ繝ｻ・ｷ郢晢ｽｻ繝ｻ・ｬ郢晢ｽｻ繝ｻ・ｬ2/4鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｹ鬮｣蜴・ｽｽ・ｫ髫ｴ謇区ｭ馴ｬ夲ｽｨ鬯ｩ蛹・ｽｽ・ｶ髣包ｽｵ雋翫ｑ・ｽ・ｽ繝ｻ・ｺ郢晢ｽｻ繝ｻ・ｿ */ .sg-product-feature-text + .sg-product-feature-text::before { top: 10px; bottom: 8px; } .sg-product-feature-text:nth-child(3)::before { display: none; } /* 鬯ｮ・ｫ繝ｻ・ｨ郢晢ｽｻ繝ｻ・ｬ3鬩搾ｽｵ繝ｻ・ｲ驛｢譎｢・ｽ・ｻ鬯ｯ・ｯ陋帙・・ｽ・ｽ繝ｻ・ｹ鬮｣蛹・ｽｽ・ｳ鬯ｯ繝ｻ・､・ｧ繝ｻ・ｩ繝ｻ・ｿ鬮ｯ・ｷ闔ｨ螟ｲ・ｽ・｣繝ｻ・ｰ鬮ｮ雜｣・ｽ・ｬ驛｢譎｢・ｽ・ｻ髴大､ｲ・ｽ・｡鬮ｫ・ｶ鬮ｮ・｣繝ｻ・ｽ繝ｻ・ｪ鬯ｩ蟷｢・ｽ・､郢晢ｽｻ繝ｻ・ｿ */ .sg-product-feature:nth-child(n+3) { padding-top: 24px; } .sg-product-feature:nth-child(n+3)::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: var(--sg-feat-divider, #dce3e8); } } /* ---------- 鬮ｯ・ｷ繝ｻ・ｩ髫ｶ荳ｻ・･繝ｻ・ｽ・ｽ繝ｻ・ｺ髮取坩・ｯ莨夲ｽｽ・ｽ繝ｻ・ｼ驛｢譎｢・ｽ・ｻ767px ---------- */ @media (max-width: 767px) { .sg-home-product { min-height: 0; } .sg-home-product__container { width: min(calc(100% - 32px), 560px); padding-top: 42px; padding-bottom: 40px; } .sg-home-product__main { display: flex; flex-direction: column; min-height: 0; gap: 22px; } .sg-home-product__content { order: 1; width: 100%; max-width: none; padding: 0; } .sg-home-product__visual { order: 2; width: 100%; padding: 0; } .sg-home-product__packshot { width: 100%; max-height: none; } .sg-home-product__features-box { width: 100%; margin: 18px auto 0; min-height: 200px; } /* 文本框层：单列竖排 4 项 */ .sg-product-feature-text { left: 50% !important; top: auto; transform: translateX(-50%); } .sg-product-feature-text:nth-child(1) { top: 8%; } .sg-product-feature-text:nth-child(2) { top: 33%; } .sg-product-feature-text:nth-child(3) { top: 58%; } .sg-product-feature-text:nth-child(4) { top: 83%; } .sg-product-feature-text + .sg-product-feature-text::before { left: 50%; top: -14px; right: auto; bottom: auto; width: 60%; height: 1px; transform: translateX(-50%); } .sg-product-feature__icon, .sg-product-feature__icon-placeholder { left: 50% !important; /* 单列：图标水平居中（覆盖内联列位置） */ width: 72px; height: 72px; } /* 单列 4 行：图标分别对齐各行中心 */ .sg-product-feature__icon:nth-child(1), .sg-product-feature__icon-placeholder:nth-child(1) { top: 12.5%; } .sg-product-feature__icon:nth-child(2), .sg-product-feature__icon-placeholder:nth-child(2) { top: 37.5%; } .sg-product-feature__icon:nth-child(3), .sg-product-feature__icon-placeholder:nth-child(3) { top: 62.5%; } .sg-product-feature__icon:nth-child(4), .sg-product-feature__icon-placeholder:nth-child(4) { top: 87.5%; } .sg-product-feature__title { font-size: var(--sg-feat-title-size-m, 20px); } .sg-product-feature__text { font-size: 14px; } } /* Elementor Japanese test home: reference-product visual DNA. */ .sg-elementor-test-home .sg-product-reference { --sg-product-red: #c9001c; --sg-product-navy: #05244c; } .sg-elementor-test-home .sg-product-copy { max-width: 430px; padding-top: 8px; } .sg-elementor-test-home .sg-product-copy .elementor-widget { margin-bottom: 0; } .sg-elementor-test-home .sg-product-eyebrow { margin-bottom: 10px; } .sg-elementor-test-home .sg-product-eyebrow .elementor-heading-title { color: var(--sg-product-red); font-size: 13px; font-weight: 700; letter-spacing: .04em; line-height: 1.35; } .sg-elementor-test-home .sg-product-eyebrow::after { content: ''; display: block; width: 42px; height: 2px; margin-top: 7px; background: var(--sg-product-red); } .sg-elementor-test-home .sg-product-copy .elementor-heading-title { color: var(--sg-product-navy); font-family: var(--sg-home-display-font); } .sg-elementor-test-home .sg-product-title { margin-bottom: 14px; } .sg-elementor-test-home .sg-product-title .elementor-heading-title { font-size: 34px; font-weight: 600; letter-spacing: .04em; line-height: 1.2; } .sg-elementor-test-home .sg-product-catch { margin-bottom: 9px; } .sg-elementor-test-home .sg-product-catch p { margin: 0; font-size: 15px; line-height: 1.6; color: #1f272c; } .sg-elementor-test-home .sg-product-lead { max-width: 335px; margin-bottom: 12px; } .sg-elementor-test-home .sg-product-lead p { margin: 0; font-size: 13px; line-height: 1.75; color: #1f272c; } .sg-elementor-test-home .sg-product-badge { display: inline-block; margin-bottom: 16px; } .sg-elementor-test-home .sg-product-badge .elementor-heading-title { display: inline-block; padding: 5px 10px; border: 1px solid #536069; font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif; font-size: 12px; font-weight: 400; line-height: 1.25; letter-spacing: .01em; } .sg-elementor-test-home .sg-product-button .elementor-button { min-width: 150px; min-height: 44px; padding: 0 20px; border: 0; border-radius: 2px; background: #c9001c !important; color: #ffffff !important; font-size: 14px; font-weight: 700; line-height: 44px; box-shadow: none; } .sg-elementor-test-home .sg-product-button .elementor-button:hover, .sg-elementor-test-home .sg-product-button .elementor-button:focus { background: #a60017 !important; color: #ffffff !important; } .sg-elementor-test-home .sg-product-visual img { display: block; width: 100%; max-width: 640px; margin: 0 auto; } @media (max-width: 1024px) { .sg-elementor-test-home .sg-product-copy { max-width: 390px; } .sg-elementor-test-home .sg-product-title .elementor-heading-title { font-size: 31px; } } @media (max-width: 767px) { .sg-elementor-test-home .sg-product-copy { max-width: none; padding-top: 0; } .sg-elementor-test-home .sg-product-title .elementor-heading-title { font-size: 28px; } .sg-elementor-test-home .sg-product-lead { max-width: none; } .sg-elementor-test-home .sg-product-visual { margin-top: 22px; } } /* Elementor emits stable element IDs for these Free widgets; scope them to the test page. */ .sg-elementor-test-home .sg-product-copy .elementor-element-fb7abf2 { margin-bottom: 10px; } .sg-elementor-test-home .sg-product-copy .elementor-element-fb7abf2 .elementor-heading-title { color: #c9001c; font-size: 13px; font-weight: 700; letter-spacing: .04em; line-height: 1.35; } .sg-elementor-test-home .sg-product-copy .elementor-element-fb7abf2::after { content: ''; display: block; width: 42px; height: 2px; margin-top: 7px; background: #c9001c; } .sg-elementor-test-home .sg-product-copy .elementor-element-86568bb { margin-bottom: 14px; } .sg-elementor-test-home .sg-product-copy .elementor-element-86568bb .elementor-heading-title { color: #05244c; font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 34px; font-weight: 600; letter-spacing: .04em; line-height: 1.2; padding: 0; border-top: 0; border-bottom: 0; } .sg-elementor-test-home .sg-product-copy .elementor-element-86568bb .elementor-heading-title::after { content: none; display: none; } .sg-elementor-test-home .sg-product-copy .elementor-element-7a54f86 { margin-bottom: 9px; } .sg-elementor-test-home .sg-product-copy .elementor-element-7a54f86 p { margin: 0; font-size: 15px; line-height: 1.6; color: #1f272c; } .sg-elementor-test-home .sg-product-copy .elementor-element-a28782f { max-width: 335px; margin-bottom: 12px; } .sg-elementor-test-home .sg-product-copy .elementor-element-a28782f p { margin: 0; font-size: 13px; line-height: 1.75; color: #1f272c; } .sg-elementor-test-home .sg-product-copy .elementor-element-3113233 { display: inline-block; margin-bottom: 16px; } .sg-elementor-test-home .sg-product-copy .elementor-element-3113233 .elementor-heading-title { display: inline-block; padding: 5px 10px; border: 1px solid #536069; font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif; font-size: 12px; font-weight: 400; line-height: 1.25; letter-spacing: .01em; } .sg-elementor-test-home .sg-product-copy .elementor-element-93c8f28 .elementor-button { min-width: 150px; min-height: 44px; padding: 0 20px; border: 0; border-radius: 2px; background: #c9001c !important; color: #ffffff !important; font-size: 14px; font-weight: 700; line-height: 44px; box-shadow: none; } .sg-elementor-test-home .sg-product-copy .elementor-element-93c8f28 .elementor-button:hover, .sg-elementor-test-home .sg-product-copy .elementor-element-93c8f28 .elementor-button:focus { background: #a60017 !important; color: #ffffff !important; } /* Keep the two four-card panels compact without altering product copy or imagery. */ .sg-elementor-test-home .sg-product-highlights, .sg-elementor-test-home .sg-factory-features { box-sizing: border-box; width: calc(100% - 48px); max-width: 1180px; margin-right: auto; margin-left: auto; } .sg-elementor-test-home .sg-factory-stage { display: grid !important; grid-template-columns: minmax(0, 1fr); width: min(1536px, 100%) !important; max-width: none !important; min-height: 0 !important; margin: clamp(40px, 4vw, 64px) auto 0 !important; padding: 0 !important; background: #eef8fb !important; } .sg-elementor-test-home .sg-product-highlights > .e-con-inner, .sg-elementor-test-home .sg-factory-features > .e-con-inner { gap: 0; } .sg-elementor-test-home .sg-product-highlights > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con, .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { box-sizing: border-box; flex: 0 0 25%; max-width: 25%; } /* Keep the four product cards inside one continuous white panel. */ .sg-elementor-test-home .sg-product-highlights { overflow: hidden; } .sg-elementor-test-home .sg-product-highlights > .e-con-inner { box-sizing: border-box; max-width: none; padding-inline: 0; width: 100%; } .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con { flex: 0 0 25%; max-width: 25%; } .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con:last-child { border-right: 0 !important; } /* Shared four-card spacing: icon 8px title 5px divider 5px body. */ .sg-elementor-test-home .sg-product-highlights > .e-con, .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { height: auto !important; min-height: 0 !important; padding: 14px 12px 12px !important; gap: 0 !important; justify-content: flex-start !important; align-content: flex-start !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-image img { width: 72px !important; } .sg-elementor-test-home .sg-factory-features .elementor-widget-image img { width: 76px !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-image, .sg-elementor-test-home .sg-factory-features .elementor-widget-image { margin: 0 0 8px !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading .elementor-heading-title, .sg-elementor-test-home .sg-factory-features .elementor-widget-heading .elementor-heading-title { margin: 0 !important; padding-bottom: 5px !important; line-height: 1.2 !important; } .sg-elementor-test-home .sg-product-highlights > .e-con > .elementor-element, .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con > .elementor-element { position: relative; top: 0; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading, .sg-elementor-test-home .sg-factory-features .elementor-widget-heading { position: relative; margin: 0 0 5px !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-text-editor, .sg-elementor-test-home .sg-factory-features .elementor-widget-text-editor { margin: 0 !important; line-height: 1.5 !important; } .sg-elementor-test-home .sg-factory-features { height: auto !important; min-height: 0 !important; overflow: visible; } /* Desktop/tablet typography stays consistent while the cards size naturally. */ @media (min-width: 768px) { .sg-elementor-test-home .sg-product-highlights > .e-con, .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { height: auto !important; min-height: 0 !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading .elementor-heading-title { font-size: 18px !important; } .sg-elementor-test-home .sg-factory-features .elementor-widget-heading .elementor-heading-title { font-size: 18px !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-text-editor { font-size: 15px !important; } .sg-elementor-test-home .sg-factory-features .elementor-widget-text-editor { font-size: 15px !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading, .sg-elementor-test-home .sg-factory-features .elementor-widget-heading { transform: none !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading::before, .sg-elementor-test-home .sg-factory-features .elementor-widget-heading::before { content: none !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading::after, .sg-elementor-test-home .sg-factory-features .elementor-widget-heading::after { content: none !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading .elementor-heading-title, .sg-elementor-test-home .sg-factory-features .elementor-widget-heading .elementor-heading-title { border-bottom: 1px solid rgba(0, 0, 0, .2) !important; transform: none !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-heading .elementor-heading-title::after, .sg-elementor-test-home .sg-factory-features .elementor-widget-heading .elementor-heading-title::after { bottom: -1px; content: "."; } } /* Chinese site typography: Source Han Sans / Noto Sans SC only. * This deliberately changes the typeface only. Existing colours, sizes, * spacing and page-specific visual treatments remain untouched. */ html[lang^="zh"] body, html[lang^="zh"] body :is(h1, h2, h3, h4, h5, h6, p, li, a, button, input, textarea, select, label, blockquote, figcaption, caption, th, td, .elementor-heading-title, .elementor-button-text) { font-family: "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif !important; } /* Chinese site typography: Source Han Sans / Noto Sans SC only. * Font-family is the sole property here; existing colours, sizes and spacing * remain controlled by each page's established styles. */ html[lang^="zh"] body, html[lang^="zh"] body :is(h1, h2, h3, h4, h5, h6, p, li, a, button, input, textarea, select, label, blockquote, figcaption, caption, th, td, .elementor-heading-title, .elementor-button-text) { font-family: "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif !important; } /* Factory image and feature panel share one responsive document-flow composition. */ .sg-elementor-test-home .sg-factory-stage > .elementor-widget-image, .sg-elementor-test-home .sg-factory-stage > .sg-factory-copy-layer { grid-column: 1; grid-row: 1; } .sg-elementor-test-home .sg-factory-stage > .elementor-widget-image { width: 100% !important; margin: 0 !important; } .sg-elementor-test-home .sg-factory-stage > .elementor-widget-image img { display: block; width: 100% !important; height: clamp(480px, 52vw, 800px); object-fit: cover; object-position: center top; } .sg-elementor-test-home .sg-factory-stage > .sg-factory-copy-layer { box-sizing: border-box; align-self: start; justify-self: center; width: min(1180px, calc(100% - 48px)); max-width: none !important; margin: 0 auto !important; padding: clamp(56px, 7vw, 112px) 0 0 !important; z-index: 1; } .sg-elementor-test-home .sg-factory-features { box-sizing: border-box; width: min(1180px, calc(100% - 48px)); max-width: none !important; margin: 24px auto 0 !important; z-index: auto !important; } @media (max-width: 1024px) { .sg-elementor-test-home .sg-factory-stage > .elementor-widget-image img { height: clamp(440px, 60vw, 600px); } .sg-elementor-test-home .sg-factory-stage > .sg-factory-copy-layer { padding-top: clamp(48px, 7vw, 72px) !important; } .sg-elementor-test-home .sg-factory-features { margin-top: clamp(-72px, -7vw, -48px) !important; } } @media (max-width: 767px) { .sg-elementor-test-home .sg-factory-stage > .elementor-widget-image img { height: clamp(320px, 92vw, 460px); object-position: 60% top; } .sg-elementor-test-home .sg-factory-stage > .sg-factory-copy-layer { width: calc(100% - 32px); padding-top: 40px !important; } .sg-elementor-test-home .sg-factory-features { width: calc(100% - 32px); margin-top: 16px !important; } } /* Mobile feature cards: natural-height stacked layout. Elementor retains * desktop min-height and fixed widget widths unless they are reset here. */ @media (max-width: 767px) { .sg-elementor-test-home .sg-product-highlights > .e-con > .e-con, .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; min-height: 0 !important; height: auto !important; padding: 24px 20px !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget, .sg-elementor-test-home .sg-factory-features .elementor-widget { width: 100% !important; max-width: none !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-image, .sg-elementor-test-home .sg-factory-features .elementor-widget-image { width: auto !important; max-width: 100% !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-image img, .sg-elementor-test-home .sg-factory-features .elementor-widget-image img { width: 72px !important; } } /* Mobile header, language and hero corrections. */ @media (max-width: 767.98px) { /* Keep the menu control pinned to the right edge of the header. */ .sg-site-header__burger { margin-left: auto; } /* Present the two languages as simple, stable menu choices on mobile. */ .sg-site-header__mobile-lang { width: 100%; } .sg-site-header__mobile-lang .sg-lang-switch { width: 100%; } .sg-site-header__mobile-lang .sg-lang-switch__trigger { display: none; } .sg-site-header__mobile-lang .sg-lang-switch__menu { position: static; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; } .sg-site-header__mobile-lang .sg-lang-switch__link { display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 12px; border: 1px solid #e1e7ea; border-radius: 6px; } /* Japanese factory copy only: give it a deliberate safe margin. */ .sg-elementor-test-home .elementor-207 .sg-factory-stage > .sg-factory-copy-layer, .sg-elementor-test-home .elementor-207 .sg-factory-stage > .e-con-inner > .sg-factory-copy-layer { width: calc(100% - 48px) !important; max-width: calc(100% - 48px) !important; margin-inline: auto !important; padding-inline: 0 !important; } /* The Chinese hero title must wrap instead of retaining desktop sizing. */ html[lang^="zh"] .sg-hero-slide__inner { width: calc(100% - 40px); min-width: 0; } html[lang^="zh"] .sg-hero-slide__content { width: 100%; min-width: 0; overflow: visible; } html[lang^="zh"] .sg-hero-slide__title { display: block; width: 100%; max-width: 100%; overflow: visible; overflow-wrap: anywhere; white-space: normal !important; word-break: break-all !important; font-size: clamp(28px, 7.5vw, 32px); line-height: 1.28; letter-spacing: 0; } html[lang^="zh"] .sg-hero-slide__description { max-width: 100%; } } /* Elementor Japanese test home: independent news, CTA and child-theme footer. */ :root { /* Shared display face for homepage primary headings; secondary copy stays sans-serif. */ --sg-home-display-font: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Songti SC", STSong, SimSun, serif; } /* Limit the Mincho display treatment to the homepage's primary module titles. */ .sg-elementor-test-home .elementor-element-86568bb .elementor-heading-title, .sg-elementor-test-home .elementor-element-b3cd7fa .elementor-heading-title, .sg-elementor-test-home .elementor-element-0d648c7 .elementor-heading-title, .sg-elementor-test-home .elementor-element-e6c35bc .elementor-heading-title { font-family: var(--sg-home-display-font); font-weight: 600; } .sg-elementor-test-home .elementor-element-0d648c7 .elementor-heading-title { font-weight: 700; } .sg-elementor-test-home .elementor-element-e6c35bc .elementor-heading-title { font-weight: 700; } /* Factory title is intentionally unruled; product and news headings retain their own treatments. */ .sg-elementor-test-home .sg-factory-stage .elementor-element-b3cd7fa, .sg-elementor-test-home .sg-factory-stage .elementor-element-b3cd7fa .elementor-heading-title { border: 0 !important; box-shadow: none !important; } .sg-elementor-test-home .sg-factory-stage .elementor-element-b3cd7fa::before, .sg-elementor-test-home .sg-factory-stage .elementor-element-b3cd7fa::after, .sg-elementor-test-home .sg-factory-stage .elementor-element-b3cd7fa .elementor-heading-title::before, .sg-elementor-test-home .sg-factory-stage .elementor-element-b3cd7fa .elementor-heading-title::after { content: none !important; display: none !important; } .sg-elementor-test-home .sg-home-news-v2 { background: #fff; } .sg-elementor-test-home .sg-home-news-v2 .elementor-element { box-sizing: border-box; } .sg-elementor-test-home .sg-home-news-v2__header { justify-content: space-between; width: 100%; } .sg-elementor-test-home .sg-home-news-v2 .elementor-element-0d648c7 .elementor-heading-title { color: #05244c; font-family: var(--sg-home-display-font); font-weight: 700; } .sg-elementor-test-home .sg-home-news-v2 .elementor-element-f9553ad .elementor-button { background: transparent; border: 0; border-radius: 0; color: #c9001c; font-size: 13px; font-weight: 700; padding: 8px 0; } .sg-elementor-test-home .sg-home-news-v2 .elementor-element-f9553ad .elementor-button { color: #c9001c !important; } .sg-elementor-test-home .sg-home-news-v2 .elementor-element-f9553ad .elementor-button::after { content: "›"; margin-left: 12px; font-size: 20px; line-height: 0; vertical-align: -2px; } .sg-elementor-test-home .sg-home-news-v2 .sg-home-news__list { border-top: 1px solid #dfe7ec; margin: 16px 0 0; padding: 0; } .sg-elementor-test-home .sg-home-news-v2 .sg-home-news__item { align-items: center; border-bottom: 1px solid #dfe7ec; display: grid; gap: 16px; grid-template-columns: 88px minmax(0, 1fr) 18px; min-height: 50px; padding: 10px 0; } .sg-elementor-test-home .sg-home-news-v2 .sg-home-news__date { color: #536069; font-size: 13px; } .sg-elementor-test-home .sg-home-news-v2 .sg-home-news__link { color: #1f272c; font-size: 14px; font-weight: 500; text-decoration: none; } .sg-elementor-test-home .sg-home-news-v2 .sg-home-news__arrow { color: #c9001c; font-size: 20px; line-height: 1; text-align: right; } .sg-elementor-test-home .sg-home-news-v2 .sg-home-news__empty { border-block: 1px solid #dfe7ec; color: #536069; font-size: 14px; margin: 16px 0 0; padding: 18px 0; } .sg-elementor-test-home .sg-home-contact-cta, .sg-elementor-test-home .elementor-207 .elementor-element.e-con.e-parent.sg-home-contact-cta { background-color: #a60017 !important; background-image: url("/wp-content/uploads/2026/08/home-contact-cta-lab-red-scaled.png") !important; background-position: center center !important; background-repeat: no-repeat !important; background-size: cover !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-heading-title { line-height: 1.45; text-shadow: 0 1px 8px rgba(74, 0, 8, .18); } .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor, .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor p { margin-bottom: 0; } .sg-elementor-test-home .sg-home-contact-cta .elementor-button { background: #c9001c !important; border-color: #c9001c !important; color: #fff !important; box-shadow: 0 8px 18px rgba(78, 0, 12, .14); min-width: 190px; } .sg-elementor-test-home .sg-home-contact-cta > .elementor-element-6ca6e3b { box-sizing: border-box; margin-inline: auto; max-width: 1180px; width: calc(100% - 48px); } .sg-test-home-footer { background: #05244c; color: #fff; } .sg-test-home-footer__inner { align-items: center; display: flex; gap: 32px; justify-content: space-between; margin: 0 auto; max-width: 1180px; padding: 0 24px; } .sg-test-home-footer__main { border-top: 1px solid rgba(255,255,255,.16); padding: 28px 0 24px; } .sg-test-home-footer__brand { align-items: center; display: flex; flex: 1 1 40%; gap: 12px; } .sg-test-home-footer__logo-link { display: block; flex: 0 0 auto; } .sg-test-home-footer__logo { display: block; height: 44px; object-fit: contain; width: auto; } .sg-test-home-footer__mark { align-items: center; background: #c9001c; clip-path: polygon(25% 0, 75% 0, 100% 25%, 100% 75%, 75% 100%, 25% 100%, 0 75%, 0 25%); color: #fff; display: inline-flex; font-weight: 800; height: 44px; justify-content: center; text-decoration: none; width: 44px; } .sg-test-home-footer__company, .sg-test-home-footer__english { margin: 0; } .sg-test-home-footer__company { font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 15px; font-weight: 700; } .sg-test-home-footer__english { color: rgba(255,255,255,.72); font-size: 9px; letter-spacing: .04em; margin-top: 4px; } .sg-test-home-footer__nav { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 22px; justify-content: flex-end; } .sg-test-home-footer__nav a { color: rgba(255,255,255,.9); font-size: 12px; text-decoration: none; } .sg-test-home-footer__nav a:hover, .sg-test-home-footer__nav a:focus { color: #fff; text-decoration: underline; } .sg-test-home-footer__top { align-items: center; border: 1px solid rgba(255,255,255,.78); border-radius: 50%; color: #fff; display: inline-flex; font-size: 18px; height: 36px; justify-content: center; text-decoration: none; width: 36px; } .sg-test-home-footer__copyright { background: #031a39; color: rgba(255,255,255,.68); font-size: 10px; padding: 12px 0; } @media (max-width: 767px) { .sg-elementor-test-home .sg-home-news-v2 .sg-home-news__item { gap: 8px; grid-template-columns: 76px minmax(0, 1fr) 14px; } .sg-elementor-test-home .sg-home-contact-cta { background-position: 65% center !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-button { min-width: 0; width: 100%; } .sg-elementor-test-home .sg-home-contact-cta > .elementor-element-6ca6e3b { width: calc(100% - 32px); } .sg-test-home-footer__inner { align-items: flex-start; flex-direction: column; gap: 20px; padding: 0 16px; } .sg-test-home-footer__brand, .sg-test-home-footer__nav { justify-content: flex-start; } .sg-test-home-footer__nav { gap: 14px 18px; } .sg-test-home-footer__top { position: absolute; right: 16px; } .sg-test-home-footer__main { position: relative; } } @media (max-width: 1024px) { .sg-elementor-test-home .sg-product-copy .elementor-element-86568bb .elementor-heading-title { font-size: 31px; } } @media (max-width: 767px) { .sg-elementor-test-home .sg-product-copy .elementor-element-86568bb .elementor-heading-title { font-size: 28px; } .sg-elementor-test-home .sg-product-copy .elementor-element-a28782f { max-width: none; } .sg-elementor-test-home .sg-product-highlights, .sg-elementor-test-home .sg-factory-features { width: calc(100% - 32px); } .sg-elementor-test-home .sg-product-highlights > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con, .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { flex-basis: 100%; max-width: 100%; } } /* Customer-approved homepage bottom modules: news-led ratio and contact-image placeholder. */ .sg-elementor-test-home > .elementor { --sg-bottom-grid-news-column: calc((var(--sg-bottom-grid-width) - 32px) * 2 / 3); --sg-bottom-grid-contact-column: calc((var(--sg-bottom-grid-width) - 32px) / 3); grid-template-columns: minmax(0, 1fr) minmax(0, var(--sg-bottom-grid-news-column)) minmax(0, var(--sg-bottom-grid-contact-column)) minmax(0, 1fr); } .sg-elementor-test-home > .elementor > .sg-home-news-v2 .sg-home-news__list { border-top: 0 !important; margin-top: 0; } .sg-elementor-test-home > .elementor > .sg-home-news-v2 .sg-home-news__empty { border-bottom: 0 !important; border-top: 0 !important; margin-top: 0; } .sg-elementor-test-home > .elementor > .sg-home-news-v2 .elementor-element-f9553ad .elementor-button { align-items: center; display: inline-flex; line-height: 1; } .sg-elementor-test-home > .elementor > .sg-home-news-v2 .elementor-element-f9553ad .elementor-button::after { display: inline-block; line-height: 1; margin-left: 8px; transform: none; vertical-align: middle; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta { isolation: isolate; position: relative; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta::after { align-items: center; background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.20) 28%, rgba(255,255,255,.64)); color: rgba(255,255,255,.92); content: "客服图片待替换"; display: flex; font-family: var(--sg-font-ui); font-size: 12px; justify-content: center; letter-spacing: .04em; pointer-events: none; position: absolute; right: 0; top: 0; width: 34%; height: 100%; z-index: 1; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta > .elementor-element-6ca6e3b { align-items: flex-start; flex-direction: column; gap: 12px; justify-content: center; padding-right: 36%; position: relative; z-index: 2; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta .elementor-element-d19b759, .sg-elementor-test-home > .elementor > .sg-home-contact-cta .elementor-element-c4c34ef { flex: 0 0 auto; width: auto; } @media (max-width: 768px) { /* Bottom modules mobile override */ .sg-elementor-test-home > .elementor { column-gap: 0; grid-template-columns: minmax(0, 1fr); } .sg-elementor-test-home > .elementor > .e-con.e-parent:nth-child(-n + 3), .sg-elementor-test-home > .elementor > .sg-home-news-v2, .sg-elementor-test-home > .elementor > .sg-home-contact-cta { grid-column: 1; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta::after { display: none; } .sg-elementor-test-home > .elementor > .sg-home-contact-cta > .elementor-element-6ca6e3b { padding-right: 0; } } /* Final homepage bottom-card overrides: placed after the legacy CTA rules. */ .sg-test-home-brand-banner { background-color: #a60017; background-image: linear-gradient(90deg, rgba(150, 0, 20, .92), rgba(201, 0, 28, .78) 52%, rgba(201, 0, 28, .34)), url("/wp-content/uploads/2026/08/home-contact-cta-lab-red-scaled.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; color: #fff; padding: clamp(34px, 4vw, 54px) 24px; } .sg-test-home-brand-banner__inner { margin: 0 auto; max-width: 1180px; } .sg-test-home-brand-banner__title, .sg-test-home-brand-banner__text { margin: 0; } .sg-test-home-brand-banner__title { font-family: var(--sg-home-display-font); font-size: clamp(24px, 2.2vw, 34px); font-weight: 500; line-height: 1.4; } .sg-test-home-brand-banner__text { font-family: var(--sg-font-ui); font-size: 14px; line-height: 1.8; margin-top: 8px; } @media (max-width: 768px) { .sg-test-home-brand-banner { padding: 32px 16px; } .sg-test-home-brand-banner__title { font-size: 24px; } } /* Homepage brand promise banner */ .sg-test-home-brand-banner { margin-top: 32px; } .sg-test-home-brand-banner__title, .sg-test-home-brand-banner__text { font-family: var(--sg-home-display-font); font-weight: 500; } .sg-test-home-brand-banner__title { font-size: clamp(30px, 2.5vw, 38px); } .sg-test-home-brand-banner__text { font-size: clamp(18px, 1.5vw, 22px); line-height: 1.55; margin-top: 10px; } @media (max-width: 768px) { .sg-test-home-brand-banner { margin-top: 20px; } .sg-test-home-brand-banner__title { font-size: 28px; } .sg-test-home-brand-banner__text { font-size: 18px; } } /* Homepage brand banner spacing and display type */ .sg-test-home-brand-banner__title, .sg-test-home-brand-banner__text { font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif !important; } /* Homepage brand banner Mincho override */ .sg-test-home-brand-banner { padding: 18px 24px; } .sg-test-home-brand-banner__title, .sg-test-home-brand-banner__text { font-size: clamp(25px, 2vw, 30px); line-height: 1.35; } .sg-test-home-brand-banner__text { margin-top: 6px; } @media (max-width: 768px) { .sg-test-home-brand-banner { padding: 16px; } .sg-test-home-brand-banner__title, .sg-test-home-brand-banner__text { font-size: 23px; } } /* Homepage brand banner compact type scale */ .sg-elementor-test-home .elementor-207 .elementor-element.e-con.e-parent.sg-home-contact-cta, .sg-elementor-test-home .elementor-237 .elementor-element.e-con.e-parent.sg-home-contact-cta { background-color: #fff !important; background-image: linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .96) 52%, rgba(255, 255, 255, .52) 78%, rgba(255, 255, 255, .10) 100%), url("/wp-content/uploads/2026/08/home-contact-customer-service.png") !important; background-position: center center, right center !important; background-repeat: no-repeat, no-repeat !important; background-size: 100% 100%, auto 100% !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-heading-title, .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor, .sg-elementor-test-home .sg-home-contact-cta .elementor-widget-text-editor p { color: #05244c !important; text-shadow: none !important; } .sg-elementor-test-home .sg-home-contact-cta::after { content: none !important; display: none !important; } .sg-elementor-test-home .sg-home-news-v2 .elementor-element-0d648c7 .elementor-heading-title::before, .sg-elementor-test-home .sg-home-news-v2 .elementor-element-0d648c7 .elementor-heading-title::after, .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title::before, .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title::after { content: none !important; display: none !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title { font-size: clamp(24px, 2vw, 30px) !important; line-height: 1.2 !important; max-width: none !important; white-space: nowrap !important; } @media (max-width: 768px) { .sg-elementor-test-home .elementor-207 .elementor-element.e-con.e-parent.sg-home-contact-cta, .sg-elementor-test-home .elementor-237 .elementor-element.e-con.e-parent.sg-home-contact-cta { background-image: linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .96) 52%, rgba(255, 255, 255, .52) 78%, rgba(255, 255, 255, .10) 100%), url("/wp-content/uploads/2026/08/home-contact-customer-service.png") !important; background-size: 100% 100%, auto 100% !important; } } /* Bottom-card heading decoration reset */ .sg-elementor-test-home .sg-home-news-v2 .elementor-element-0d648c7 .elementor-heading-title, .sg-elementor-test-home .sg-home-contact-cta .elementor-element-e6c35bc .elementor-heading-title { border-bottom: 0 !important; border-top: 0 !important; } /* ============================================================ * Elementor editor fix (minimal): restore root .elementor to * block layout ONLY inside the Elementor editor canvas. * Front-end home page is NOT affected (no elementor-editor-active). * ============================================================ */ body.elementor-editor-active .sg-elementor-test-home > .elementor { display: block; grid-template-columns: none; grid-template-rows: none; column-gap: 0; row-gap: 0; } /* Factory visual: full-bleed pale-blue sky with the factory anchored at the bottom. */ .sg-elementor-test-home .elementor-element-8e37d5b { width: 100% !important; max-width: none !important; background-color: #eef8fb !important; } .sg-elementor-test-home .sg-factory-stage { width: 100% !important; max-width: none !important; min-height: clamp(400px, 32vw, 520px) !important; background-color: #eef8fb !important; background-image: linear-gradient(90deg, rgba(238, 248, 251, 0.92) 0%, rgba(238, 248, 251, 0.54) 43%, rgba(238, 248, 251, 0) 70%), url('/wp-content/uploads/2026/09/factory-production-line.png') !important; background-position: center, center !important; background-size: cover, cover !important; background-repeat: no-repeat, no-repeat !important; } .sg-elementor-test-home .sg-factory-stage > .e-con-inner { padding: 56px 0 0 !important; } /* Factory-card body copy is deliberately two lines with no paragraph gap. */ @media (min-width: 768px) { .sg-elementor-test-home .sg-factory-features .elementor-widget-text-editor, .sg-elementor-test-home .sg-factory-features .elementor-widget-text-editor p { font-size: 13px !important; line-height: 1.55 !important; letter-spacing: 0 !important; margin: 0 !important; white-space: nowrap; } } /* The mobile card is an explicit alternate structure, never a desktop * layout rendered underneath the desktop canvas. */ .sg-hero-slider .sg-mobile-layout { display: none; } /* Homepage mobile card repair: Elementor keeps desktop-sized CSS variables on * its nested card containers. Reset both the variables and the flex stretch so * product and factory cards end immediately after their live copy. */ @media (max-width: 767.98px) { .sg-elementor-test-home .sg-factory-stage > .e-con-inner { padding: 32px 0 0 !important; } .sg-elementor-test-home .sg-product-highlights > .e-con-inner, .sg-elementor-test-home .sg-factory-features > .e-con-inner { align-items: flex-start !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; } .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { --min-height: 0px !important; --height: auto !important; align-self: auto !important; box-sizing: border-box; flex: 0 0 auto !important; height: auto !important; min-height: 0 !important; } /* The stage's direct child is the factory copy layer in the published * Elementor markup. Give it symmetric breathing room on every phone width. */ .sg-elementor-test-home .sg-factory-stage > .e-con-inner > .e-con { box-sizing: border-box; margin-inline: auto !important; max-width: calc(100% - 48px) !important; padding-inline: 0 !important; width: calc(100% - 48px) !important; } /* Both language versions use the same production-line image treatment. */ .sg-elementor-test-home .sg-factory-stage { min-height: clamp(360px, 105vw, 480px) !important; } html[lang^="zh"] .sg-elementor-test-home .elementor-237 .sg-factory-stage > .sg-factory-copy-layer { box-sizing: border-box; margin-inline: auto !important; max-width: calc(100% - 48px) !important; padding: 0 !important; position: relative; width: calc(100% - 48px) !important; z-index: 1; } } /* Mobile and compact-viewport resilience. This is deliberately based on * usable dimensions, not device orientation: phone landscape and casting can * be wide but short, and must not reactivate desktop coordinate layouts. */ @media (max-width: 900px), (max-width: 1366px) and (max-height: 600px) { /* Lightning emits a second fixed menu control at the lower left. This * site uses the child-theme header control on the right instead. */ #vk-mobile-nav-menu-btn, #vk-mobile-nav { display: none !important; } html, body { overflow-x: clip; } .sg-elementor-test-home, .sg-elementor-test-home .elementor, .sg-elementor-test-home .e-con, .sg-elementor-test-home .e-con-inner, .sg-elementor-test-home .elementor-widget { min-width: 0; } .sg-elementor-test-home img { max-width: 100% !important; height: auto !important; } /* Hero: text returns to normal flow; background marks remain decorative. */ .sg-hero-slider { height: auto; min-height: clamp(500px, 132vw, 660px); } .sg-hero-slider__viewport, .sg-hero-slider__track, .sg-hero-slide { min-height: inherit; } .sg-hero-slider__viewport { position: relative; } .sg-hero-slide.is-active { position: relative; } .sg-hero-slide__inner { width: min(calc(100% - 32px), 680px); height: auto; min-height: inherit; display: flex; align-items: flex-start; padding: clamp(40px, 8vw, 64px) 0 clamp(154px, 38vw, 300px); } .sg-hero-slide__content { position: relative; top: auto; left: auto; width: min(100%, 560px); transform: none; } .sg-hero-slide.is-active .sg-hero-slide__content { transform: none; } .sg-hero-slide__title { font-size: clamp(28px, 7.6vw, 42px) !important; line-height: 1.34; white-space: normal; overflow-wrap: anywhere; } .sg-hero-slide__description { max-width: 100%; font-size: clamp(14px, 3.7vw, 17px) !important; } .sg-hero-slide__actions { flex-wrap: wrap; gap: 12px; } .sg-hero-slide__button--primary { width: auto; min-width: 156px; max-width: 100%; } .sg-hero-slide__brand, .sg-hero-slide__media { pointer-events: none; max-width: min(46vw, 280px); right: 16px; left: auto; bottom: 24px; top: auto; transform: none; } .sg-hero-slide__brand { opacity: .14; } .sg-hero-slide__media { opacity: .45; } .sg-hero-slide.is-active .sg-hero-slide__brand, .sg-hero-slide.is-active .sg-hero-slide__media { transform: none; } .sg-hero-slider__prev, .sg-hero-slider__next { display: none; } /* Cards must be content-led at every compact width, including landscape. */ .sg-elementor-test-home .sg-product-highlights, .sg-elementor-test-home .sg-factory-features { width: min(calc(100% - 32px), 680px) !important; max-width: none !important; margin: 20px auto 0 !important; } .sg-elementor-test-home .sg-product-highlights > .e-con, .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 0 !important; height: auto !important; padding: 24px 20px !important; } .sg-elementor-test-home .sg-product-highlights .elementor-widget, .sg-elementor-test-home .sg-factory-features .elementor-widget { width: 100% !important; max-width: 100% !important; min-width: 0; } .sg-elementor-test-home .sg-product-highlights .elementor-widget-image img, .sg-elementor-test-home .sg-factory-features .elementor-widget-image img { width: min(72px, 24vw) !important; height: auto !important; object-fit: contain; } .sg-elementor-test-home .sg-factory-features .elementor-widget-text-editor, .sg-elementor-test-home .sg-factory-features .elementor-widget-text-editor p { white-space: normal !important; overflow-wrap: anywhere; } /* Keep the production-line background large enough for readable copy while * the feature cards remain in normal document flow below it. */ .sg-elementor-test-home .sg-factory-stage { min-height: clamp(360px, 105vw, 480px) !important; padding-bottom: 0 !important; background-size: cover, cover !important; background-position: center, center !important; } .sg-elementor-test-home .sg-factory-stage > .elementor-widget-image img { height: auto !important; aspect-ratio: 16 / 9; object-fit: cover; } .sg-elementor-test-home .sg-factory-stage > .sg-factory-copy-layer { width: min(calc(100% - 32px), 680px); padding-top: 40px !important; } .sg-elementor-test-home .sg-factory-features { margin-top: 20px !important; } /* Bottom modules: do not keep desktop image/text split on compact screens. */ .sg-elementor-test-home > .elementor { grid-template-columns: minmax(0, 1fr); column-gap: 0; } .sg-elementor-test-home > .elementor > .sg-home-news-v2, .sg-elementor-test-home > .elementor > .sg-home-contact-cta { grid-column: 1; } .sg-elementor-test-home .sg-home-contact-cta { background-position: center center !important; background-size: cover !important; } .sg-elementor-test-home .sg-home-contact-cta > .elementor-element-6ca6e3b { width: min(calc(100% - 32px), 680px) !important; max-width: none !important; padding-right: 0 !important; } .sg-elementor-test-home .sg-home-contact-cta .elementor-heading-title { max-width: 100% !important; white-space: normal !important; overflow-wrap: anywhere; } /* Dedicated mobile Hero: this is not the desktop slide scaled down. */ .sg-hero-slider .sg-desktop-layout { display: none; } .sg-hero-slider .sg-mobile-layout { display: block; } .sg-hero-slider { background: #edf7fb; min-height: 0; } .sg-hero-slider__viewport, .sg-hero-slider__track, .sg-hero-slide, .sg-hero-slide.is-active { min-height: 0; } .sg-hero-mobile-card { box-sizing: border-box; min-height: clamp(500px, 132vw, 660px); padding: clamp(44px, 10vw, 64px) 16px 28px; position: relative; z-index: 3; } .sg-hero-mobile-card__copy { background: transparent; border: 0; border-radius: 0; box-shadow: none; margin: 0 auto; max-width: 680px; padding: 26px 22px; } .sg-hero-mobile-card__copy h1 { color: var(--sg-hero-title-color, #102743); font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "MS PMincho", serif; font-size: clamp(29px, 8vw, 44px); font-weight: 600; line-height: 1.36; margin: 0; overflow-wrap: anywhere; } html[lang^="zh"] .sg-hero-mobile-card__copy h1 { font-family: "Noto Serif SC", "Songti SC", serif; } .sg-hero-mobile-card__copy p { color: var(--sg-hero-desc-color, #4f5963); font-size: clamp(15px, 4vw, 18px); line-height: 1.85; margin: 16px 0 0; } .sg-hero-mobile-card__button { align-items: center; background: var(--sg-hero-btn-bg, #c9001c); border-radius: 8px; color: var(--sg-hero-btn-text, #fff); display: inline-flex; font-size: 15px; font-weight: 700; gap: 26px; justify-content: space-between; margin-top: 24px; max-width: 100%; min-height: 48px; padding: 0 20px; text-decoration: none; } .sg-hero-mobile-card__media { display: flex; justify-content: center; margin: 22px auto 0; max-width: min(78vw, 360px); } .sg-hero-mobile-card__media img { display: block; height: auto; max-width: 100%; } .sg-hero-mobile-card__media--brand { opacity: .8; } } /* Final mobile homepage layout guard: keep these after all legacy Elementor * overrides so the cards are always content-height and factory copy is inset. */ @media (max-width: 767.98px) { .sg-elementor-test-home .sg-product-highlights > .e-con-inner, .sg-elementor-test-home .sg-factory-features > .e-con-inner { align-items: flex-start !important; display: grid !important; grid-template-columns: minmax(0, 1fr) !important; } .sg-elementor-test-home .sg-product-highlights > .e-con-inner > .e-con, .sg-elementor-test-home .sg-factory-features > .e-con-inner > .e-con { --min-height: 0px !important; --height: auto !important; align-self: auto !important; box-sizing: border-box; flex: 0 0 auto !important; height: auto !important; min-height: 0 !important; } .sg-elementor-test-home .sg-factory-stage > .e-con-inner > .e-con { box-sizing: border-box; margin-inline: auto !important; max-width: calc(100% - 48px) !important; padding-inline: 0 !important; width: calc(100% - 48px) !important; } }