/* CSS Document */
#header_page { height: 450px; position: relative; top: 0; background-image: url("../../common/img/bg_header3.jpg"); background-repeat: no-repeat; background-size: cover; width: 100%; }

@media screen and (max-width: 450px) { #header_page { height: 200px; } }
.section850 { margin-bottom: 4em; }

.bxslider_thumbnail { display: grid; grid-template-columns: repeat(6, 1fr); grid-gap: 5px; list-style: none; }
@media only screen and (max-width: 768px) { .bxslider_thumbnail { grid-template-columns: repeat(5, 1fr); } }
.bxslider_thumbnail > li { border: 2px solid #fff; }
.bxslider_thumbnail > li:has(.active) { border-color: #C7D882; }
.bxslider_thumbnail > li > a { display: block; position: relative; padding-top: 75%; }
.bxslider_thumbnail > li > a img { position: absolute; top: 0px; left: 50%; transform: translateX(-50%); max-width: 100%; max-height: 100%; height: 150px; object-fit: cover; }

.bx-controls-direction { display: flex; justify-content: center; }
.bx-controls-direction a { background: #C7D882; display: inline-block; padding: 0.5em 2em; border-radius: 0.25em; margin: 1em 0.5em; color: #162A41; font-weight: 700; }

#madori { display: flex; margin-bottom: 4em; }
@media only screen and (max-width: 768px) { #madori { display: inherit; } }
#madori figure { margin-top: 2em; }
#madori figure img { max-width: 100%; }
#madori figure figcaption { text-align: center; font-size: 1.2em; }
