@charset "UTF-8";
/* ページ下_関連するカテゴリーのバナー及びカテゴリー一覧 */
<style type="text/css">
<!--

/* 関連するカテゴリーのバナー */
div.related-cate{
}
	
div.related-cate h3{
color: #333;
text-align: center;
font-weight: bold;
margin: 3% 0 2%;
padding: 0;
font-size: 140%;
}

div.related-cate-container {
display: flex;
justify-content: flex-start;
gap: 20px;
margin: 0 0 5%;
}

dl.cate-box {
background: #fff; 
color: #555;
margin: 0;
padding: 0;
font-size:100%;
color:#7d7b7b;
width:24%;
}

dl.cate-box div{
margin: 0 0 5%;
padding: 0;  
border-radius: 15px;
box-shadow: 0 0 4px #ddd;
}	

dl.cate-box dt img{
margin: 0;
padding: 0; 
border-radius: 15px 15px 0 0;
}

dl.cate-box dd {
margin: 0;
padding: 6% 0 0;
text-align: center;
font-size: 115%;
min-height: 32px;
}

dl.cate-box dd img{
text-align: center;
}

dl.cate-box dd.with-logo{
text-align: center;
padding: 0!important;
}

dl.cate-box a{
color: #555;
text-decoration:none;
}

dl.cate-box div:hover {
opacity: 0.7; 
transition-property: opacity;
transition-duration: 0.5s;
}

@media screen and (max-width: 480px) {
/* スマホ用 */

div.related-cate h3 {
    margin: 6% 0 3%;
    font-size: 120%;
}
div.related-cate-container {
    width: 96%;
    display: flex;
    justify-content: space-around;
    gap: 10px;
    margin: 0 auto 5%;
    flex-wrap: wrap;
}

dl.cate-box {
    font-size: 84%;
    width: 48%;
}
	
dl.cate-box dd {
    padding: 14px 0 0;
    font-size: 115%;
    min-height: 30px;
}


}

/* カテゴリー一覧 */

div.all-app-cate {
background: #f5f5f5;
margin: 5% 0 2% 0;
padding: 1%;
}

div.all-app-cate h3{
color: #333;
text-align: center;
font-weight: bold;
padding: 1.5% 0; 
}

div.all-app-cate ul{
width: 98%;
margin: 0 1%;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: left;
gap: 1.3%;
}

div.all-app-cate ul li{
background: #fff; 
color: #555;
margin: 0 0 1%;
padding: 0.5% 0;
border-radius: 8px;
width: 24%;
list-style: none;
}

div.all-app-cate ul li a{
width: 100%;
display: block;
margin: 0;
padding: 0;
display: flex;
text-decoration: none;
color: #555;
align-items: center;
gap: 10px;
}

div.all-app-cate ul li a:hover{
opacity: 0.6;
transition-property: opacity;
transition-duration: 0.5s;
}

div.all-app-cate ul li a p {
margin: 0;
padding: 0;
font-size: 96%;
}	

div.all-app-cate ul li a img {
width: 20%;
height: 20%;
margin: 0 0 0 4%;
padding: 0;
}
-->
</style>