/* Tailwind ユーティリティ代替（.webdesign-page スコープ） */
/* page-webdesign.php / page-graphicdesign.php 共通 */
.webdesign-page .relative { position: relative; }
.webdesign-page .absolute { position: absolute; }
.webdesign-page .inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.webdesign-page .z-10 { z-index: 10; }
.webdesign-page .flex { display: flex; }
.webdesign-page .grid { display: grid; }
.webdesign-page .flex-col { flex-direction: column; }
.webdesign-page .items-center { align-items: center; }
.webdesign-page .items-start { align-items: flex-start; }
.webdesign-page .justify-center { justify-content: center; }
.webdesign-page .mx-auto { margin-left: auto; margin-right: auto; }
.webdesign-page .overflow-hidden { overflow: hidden; }
.webdesign-page .px-6 { padding-left: 24px; padding-right: 24px; }
.webdesign-page .py-20 { padding-top: 80px; padding-bottom: 80px; }
.webdesign-page .py-3 { padding-top: 12px; padding-bottom: 12px; }
.webdesign-page .p-8 { padding: 32px; }
.webdesign-page .p-4 { padding: 16px; }
.webdesign-page .px-2 { padding-left: 8px; padding-right: 8px; }
.webdesign-page .pt-0 { padding-top: 0; }
.webdesign-page .pb-0 { padding-bottom: 0; }
.webdesign-page .mt-1 { margin-top: 4px; }
.webdesign-page .mt-4 { margin-top: 16px; }
.webdesign-page .mt-6 { margin-top: 24px; }
.webdesign-page .mb-4 { margin-bottom: 16px; }
.webdesign-page .mb-6 { margin-bottom: 24px; }
.webdesign-page .gap-4 { gap: 16px; }
.webdesign-page .gap-6 { gap: 24px; }
.webdesign-page .gap-8 { gap: 32px; }
.webdesign-page .gap-10 { gap: 40px; }
.webdesign-page .gap-16 { gap: 64px; }
.webdesign-page .space-y-8 > * + * { margin-top: 32px; }
.webdesign-page .space-y-2 > * + * { margin-top: 8px; }
.webdesign-page .w-full { width: 100%; }
.webdesign-page .h-full { height: 100%; }
.webdesign-page .w-16 { width: 64px; }
.webdesign-page .h-16 { height: 64px; }
.webdesign-page .w-24 { width: 96px; }
.webdesign-page .h-auto { height: auto; }
.webdesign-page .min-w-0 { min-width: 0; }
.webdesign-page .min-h-\[80vh\] { min-height: 80vh; }
.webdesign-page .max-w-3xl { max-width: 768px; }
.webdesign-page .aspect-\[4\/3\] { aspect-ratio: 4/3; }
.webdesign-page .bg-white { background-color: #fff; }
.webdesign-page .bg-gray-100 { background-color: #f3f4f6; }
.webdesign-page .bg-gray-200 { background-color: #e5e7eb; }
.webdesign-page .bg-gray-800 { background-color: #1f2937; }
.webdesign-page .bg-giv-bg_gray { background-color: #f3f4f6; }
.webdesign-page .bg-giv-main\/40 { background-color: rgba(17, 17, 17, 0.4); }
.webdesign-page .text-white { color: #fff; }
.webdesign-page .text-giv-sub { color: #6b7280; }
.webdesign-page .text-giv-main { color: #111; }
.webdesign-page .text-giv-gold { color: #C5A059; }
.webdesign-page .text-giv-sub_light { color: #9ca3af; }
.webdesign-page .text-gray-400 { color: #9ca3af; }
.webdesign-page .text-gray-200 { color: #e5e7eb; }
.webdesign-page .border { border: 1px solid; }
.webdesign-page .border-white { border-color: #fff; }
.webdesign-page .border-gray-200 { border-color: #e5e7eb; }
.webdesign-page .border-gray-300 { border-color: #d1d5db; }
.webdesign-page .rounded-sm { border-radius: 2px; }
.webdesign-page .rounded { border-radius: 4px; }
.webdesign-page .text-\[10px\] { font-size: 10px; }
.webdesign-page .font-bold { font-weight: 700; }
.webdesign-page .font-light { font-weight: 300; }
.webdesign-page .font-serif { font-family: var(--giv-font-sans); }
.webdesign-page .leading-relaxed { line-height: 1.625; }
.webdesign-page .tracking-widest { letter-spacing: 0.1em; }
.webdesign-page .tracking-wider { letter-spacing: 0.05em; }
.webdesign-page .uppercase { text-transform: uppercase; }
.webdesign-page .text-center { text-align: center; }
.webdesign-page .text-left { text-align: left; }
.webdesign-page .shadow-sm { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }
.webdesign-page .opacity-0 { opacity: 0; }
.webdesign-page .transition { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
.webdesign-page .duration-500 { transition-duration: 500ms; }
.webdesign-page .object-cover { object-fit: cover; }
.webdesign-page .object-center { object-position: center; }
.webdesign-page .grayscale-\[50\%\] { filter: grayscale(50%) contrast(1.25); }
.webdesign-page .contrast-125 { /* combined with grayscale above */ }
@media (min-width: 768px) {
  .webdesign-page .md\:flex-row { flex-direction: row; }
  .webdesign-page .md\:w-1\/2 { width: 50%; }
  .webdesign-page .md\:justify-end { justify-content: flex-end; }
  .webdesign-page .md\:grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .webdesign-page .lg\:grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
}
.webdesign-page .group:hover .group-hover\:opacity-100 { opacity: 1; }