﻿/* 要素リセット */
* {
	margin: 0px;
	padding: 0px;
}

body{
margin:0;
padding:0;
font-family:  'ヒラギノ角ゴ Pro W3' , 'Hiragino Kaku Gothic Pro' , 'メイリオ' ,Meiryo, 'ＭＳ Ｐゴシック' , 'Osaka' ,sans-serif;
color: #333333; /* 標準文字色 */
font-size: 95%;
letter-spacing:0.06em;
line-height:1.7;
background-image:url('./bg/bg.png');
}

img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　/*IE8のみ適用*/
}

ul{
list-style: none;
padding:0px;
}

a:link{
text-decoration:none;
}

h1{
margin: 20px auto;
font-size: 1.2rem
}

.wrap{
width:90%;
max-width:1200px;
margin:0px auto; /* 要素の左側へ余白 */
}

.container{
margin:20px auto;
width:90%;
background:#fafafa;
}

.contents{
width:90%;
}

.main{
grid-area: main;
align-self: start;
border:double 8px #ccc;
padding:10px;
}

.category{
display:flex;
flex-flow: row wrap;
grid-gap:10px;
}

.link{
display: grid;
width:95%;
margin:25px auto ;
grid-template-columns: repeat(auto-fill, 48%);
justify-content: space-between;
flex-flow: row wrap;
grid-gap:10px;
}

.site{
border:1px solid #ccc;
width:95%;
margin:5px auto;
}

.site a{
text-decoration:none;
color:#a569f0;
}

.site a:hover{
text-decoration:underline;
}

.site a:visited{

}

.link_title{
margin:5px;
padding:2px 2px 2px 6px;
border-bottom:solid 1px #ccc;
flex:1;
}

.link_messe{
font-size:0.9rem;
margin:7px 10px;
}

.paging{
margin:50px auto;
font-size:0.8rem;
text-align:center;
}

.paging span{
padding:1px 7px 0px 7px;
border:solid 1px #ccc;
border-radius:3px;
margin:0px;
color:#5b5b5b;
}

.paging_under{
background:#f5f5f5;
}

.footer{
text-align:center;
margin:30px auto;
}

.footer_flex{
display: flex;
align-items: center; /* 上下中央に */
justify-content: center;
flex-flow: row wrap;
grid-gap:20px;
border:1px solid #ddd;
}


/*--レスポンシブ-----------------------------------------------*/
@media screen and ( max-width:780px) {

.contents{
width:90%;
}

.link{
display:block;
width:100%;
}

.site{
width:90%;
margin:15px auto;
}


}
