


* {
 margin:0;
 padding:0;
 box-sizing:border-box;
}


body {
 font-family:'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
 line-height:1.6;
 color:white;
 background-color:#0a0a0f;
 margin:0;
 padding:0;
 min-height:100vh;
 overflow-x:hidden;
 font-size:16px;
}


#animation-reducer {
 display:none !important;
}


.container {
 width:100%;
 max-width:100%;
 padding:0 20px;
 margin:0 auto;
}


section {
 padding:80px 0;
 width:100%;
}

.section-title {
 font-size:2.5rem;
 color:white;
 text-align:center;
 margin-bottom:40px;
 font-weight:700;
 font-family:'Noto Sans JP', sans-serif;
}

.section-desc {
 color:rgba(255, 255, 255, 0.9);
 text-align:center;
 font-size:1.3rem;
 margin-bottom:30px;
}


.button {
 display:inline-block;
 background:#DD6500;
 color:white;
 padding:15px 35px;
 border-radius:50px;
 text-decoration:none;
 font-weight:600;
 transition:all 0.3s ease;
 font-family:'Noto Sans JP', sans-serif;
 font-size:1.1rem;
}

.button:hover {
 background:#ff7700;
 transform:translateY(-3px);
}


.card-grid {
 display:grid;
 grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
 gap:30px;
 margin-top:40px;
}

.card {
 background:rgba(20, 20, 30, 0.8);
 border:1px solid rgba(79, 172, 254, 0.3);
 padding:25px;
 border-radius:10px;
 transition:all 0.3s ease;
}

.card:hover {
 transform:translateY(-5px);
 box-shadow:0 10px 25px rgba(79, 172, 254, 0.2);
}


.site-footer {
 background:rgba(10, 10, 15, 0.8);
 border-top:1px solid rgba(79, 172, 254, 0.2);
 padding:30px 0;
 text-align:center;
 width:100%;
 box-sizing:border-box;
}

.footer-content {
 display:flex;
 flex-direction:column;
 align-items:center;
 gap:15px;
}

.footer-logo {
 margin-bottom:15px;
}

.footer-logo img {
 max-width:150px;
 height:auto;
}

.copyright {
 font-size:0.9rem;
 color:rgba(255, 255, 255, 0.7);
 font-weight:400;
}


.content-wrapper {
 padding-top:0 !important;
}


@media (max-width:1024px) {
 .container {
 padding:0 30px;
 }
 
 .card-grid {
 grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
 gap:25px;
 }
 
 .section-title {
 font-size:2.2rem;
 }
}

@media (max-width:768px) {
 .container {
 padding:0 20px;
 }
 
 section {
 padding:60px 0;
 }
 
 .section-title {
 font-size:1.8rem;
 margin-bottom:30px;
 }
 
 .card-grid {
 grid-template-columns:1fr;
 gap:20px;
 }
 
 .card {
 padding:20px;
 }
 
 .button {
 padding:12px 25px;
 font-size:1rem;
 }
}

@media (max-width:480px) {
 .container {
 padding:0 15px;
 }
 
 section {
 padding:40px 0;
 }
 
 .section-title {
 font-size:1.5rem;
 margin-bottom:25px;
 }
 
 .card {
 padding:15px;
 }
 
 .button {
 padding:10px 20px;
 font-size:0.9rem;
 width:100%;
 text-align:center;
 box-sizing:border-box;
 }
}


@media (min-width:1440px) {
 .container {
 padding:0 40px;
 }
 
 .card-grid {
 gap:40px;
 }
}

@media (min-width:1600px) {
 .container {
 padding:0 60px;
 }
}

@media (min-width:1920px) {
 .container {
 padding:0 80px;
 }
 
 .card {
 padding:30px;
 }
}


.text-center {
 text-align:center;
}

.text-left {
 text-align:left;
}

.text-right {
 text-align:right;
}

.mb-20 {
 margin-bottom:20px;
}

.mb-30 {
 margin-bottom:30px;
}

.mb-40 {
 margin-bottom:40px;
}

.mt-20 {
 margin-top:20px;
}

.mt-30 {
 margin-top:30px;
}

.mt-40 {
 margin-top:40px;
}


.flex {
 display:flex;
}

.flex-column {
 flex-direction:column;
}

.flex-wrap {
 flex-wrap:wrap;
}

.justify-center {
 justify-content:center;
}

.justify-between {
 justify-content:space-between;
}

.align-center {
 align-items:center;
}

.gap-10 {
 gap:10px;
}

.gap-20 {
 gap:20px;
}

.gap-30 {
 gap:30px;
}
