.area-section-title {
text-align: center;
color: #493030;
}
.area-media {
padding: 0 4%;
margin-top: 1rem; display: block;
}
ul.area-media-list {
max-width: 800px;
margin: 0 auto;
display: flex; justify-content: space-between;
align-items: center;
}
.area-media-list li { height: auto;
text-align: center;
margin-bottom: 1rem;
display: inline-block;
text-decoration: none;
border: 2px solid #ccc;
background-color: #fff;
color: #333;
border-radius: 4px;
padding: 10px;
}
.area-media-list li:hover {
border: 3px solid #493030;
color: #3492D1;
text-decoration: underline;
}
.area_image {
max-width: 100%;
vertical-align: bottom;
}
.area-plus {
padding-top: 40px;
padding-bottom: 40px;
}
ul.area-lists {
display: block; justify-content: space-between;
max-width: 1000px; margin: 0 auto; padding: 20px 20px 20px 10%; border: 2px solid #C6C6C6; background: #fff;
text-align: left;
margin-bottom: 1rem;
list-style: none;
}
@media screen and (max-width: 940px) {
ul.area-lists {
display: block; justify-content: space-between;
max-width: 1000px; margin: 10px; padding: 12px 10px 12px 10px; border: 2px solid #C6C6C6; background: #fff;
text-align: left;
margin-bottom: 1rem;
list-style: none;
}
.area-lists li {
display: inline-block;  margin-top: 5px; margin-left: 13px;
text-align: center;
}
}
.area-lists li {
display: inline-block;  margin-top: 5px; margin-left: 20px;
}
.area-lists li a:hover {
border-bottom: 1px solid #6f9b99;
color: #6f9b99;
}
.pref-title {
font-family: Arial, Helvetica, sans-serif;
font-weight: 500;
}  .area-tab-contents {
display: none;
}
.area-tab-contents.show {
display: block;
}
.area-media-list>.area-tab-list.active {
background-color: #E6E6E6;
}
.area-media-text {
padding: 10px 15px;
text-align: center;
}
.area-media-text span {
font-weight: bold;
}
.area_term_list {
display: inline-block;
max-width: 100%;
}
.area_term_list li {
margin-right: 10px; }
.hiragana_headline {
display: block;
width: 60px;
background-color: #493030;
font-weight: 800;
color: #fff;
text-align: center;
margin-top: 20px;
margin: 20px 0 8px; padding: 5px;
border-radius: 10px;
} @media screen and (max-width: 767px) {
.pref-title {
font-size: 12px;
}
} @media screen and (max-width: 940px) {
.hiragana_headline {
margin-left: 10%;
}
}
@media (max-width: 480px) { .area-media-text {
text-align: left;
}
}