/* GOVT PORTAL THEME */
:root {
–gov-deep-teal: #138275;
–gov-navy: #002c52;
–gov-bg: #f8fafb;
–gov-border: #ccd6dd;
–text-main: #2c3e50;
}
/* SLIDER ADD-ON */
.slider {
position: relative;
overflow: hidden;
border-radius: 6px;
margin-bottom: 15px;
}
.slider-track {
display: flex;
transition: transform 0.4s ease;
}
.slider img {
width: 100%;
height: 560px;
object-fit: cover;
flex-shrink: 0;
}
.slider-btn {
position: absolute;
top: 50%;
transform: translateY(-50%);
background: rgba(0,0,0,0.5);
color: #fff;
border: none;
padding: 6px 10px;
cursor: pointer;
z-index: 2;
}
.slider-btn.prev { left: 5px; }
.slider-btn.next { right: 5px; }
.scheme-content {
background-color: var(–gov-bg);
padding: 40px 0;
}
.bamboo-container {
max-width: 1100px;
margin: auto;
padding: 0 20px;
font-family: ‘Segoe UI’, Tahoma, Geneva, Verdana, sans-serif;
}
/* GRID ALIGNMENT */
.grid {
display: grid;
grid-template-columns: 1fr; /* Single column for the specific section */
gap: 25px;
margin-bottom: 25px;
}
/* CARD STYLE */
.scheme-card {
background: #fff;
border: 1px solid var(–gov-border);
border-top: 4px solid var(–gov-deep-teal);
padding: 30px;
display: flex;
flex-direction: column;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.dept-tag {
font-size: 10px;
font-weight: 800;
color: #7f8c8d;
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 8px;
display: block;
}
.scheme-card h3 {
margin: 0 0 15px 0;
color: var(–gov-navy);
font-size: 1.4rem;
line-height: 1.3;
}
/* CSS IMAGE SLIDER */
.slider-container {
width: 100%;
height: 350px;
overflow: hidden;
position: relative;
margin-bottom: 20px;
border: 1px solid #eee;
}
.slider-wrapper {
display: flex;
width: 200%; /* 3 images x 100% */
height: 100%;
animation: slide 12s infinite ease-in-out;
}
.slider-wrapper img {
width: 100%;
height: 100%;
object-fit: cover;
}
@keyframes slide {
0% { transform: translateX(0); }
30% { transform: translateX(0); }
33% { transform: translateX(-100%); }
63% { transform: translateX(-100%); }
66% { transform: translateX(-200%); }
96% { transform: translateX(-200%); }
100% { transform: translateX(0); }
}
/* TEXT CONTENT */
.info-block {
font-size: 14px;
line-height: 1.6;
color: var(–text-main);
margin-bottom: 15px;
}
.info-label {
font-weight: 700;
color: #444;
text-transform: uppercase;
font-size: 11px;
display: block;
margin-top: 15px;
}
.url-link {
color: var(–gov-deep-teal);
text-decoration: none;
word-break: break-all;
font-size: 13px;
}
/* BUTTON GROUP */
.btn-group {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 15px;
margin-top: 25px;
}
.download-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 12px 15px;
background: var(–gov-deep-teal);
color: #fff;
text-decoration: none;
font-weight: 700;
font-size: 12px;
text-transform: uppercase;
border-radius: 2px;
transition: background 0.2s;
}
.download-btn.secondary {
background: var(–gov-navy);
}
.download-btn:hover {
opacity: 0.9;
}
@media (max-width: 600px) {
.btn-group { grid-template-columns: 1fr; }
.slider-container { height: 200px; }
}
Research Association
Bamboo Innovation Group [Established 2012]
Representative
Kenichi Sato (Professor, Faculty of Engineering, Fukuoka University)
Contact Details
Email: big＠fukuoka-u.ac.jp
Address: 8-19-1 Nanakuma, Jonan-ku, Fukuoka City, 814-0180
Fukuoka University, Faculty of Engineering, Department of Social Design Engineering, Road and Soil Research Laboratory, Person in charge: Chikaji Koga Annex No. 5, 2nd floor
Description
The Bamboo Innovation Group is a research association bringing together industry, academia, government, and the public sector. Its purpose is to advance the development and promotion of bamboo applications through research and development focused on the effective utilization and commercialization of bamboo resources, as well as the establishment of business networks.
Official Website
https://bamboo-big.com/index.html
document.querySelectorAll(“.slider”).forEach(slider => {
const track = slider.querySelector(“.slider-track”);
const slides = track.children;
let index = 0;
slider.querySelector(“.next”).onclick = () => {
index = (index + 1) % slides.length;
track.style.transform = `translateX(-${index * 100}%)`;
};
slider.querySelector(“.prev”).onclick = () => {
index = (index – 1 + slides.length) % slides.length;
track.style.transform = `translateX(-${index * 100}%)`;
};
});
We’re here to help — contact us anytime
