@charset "utf-8";
html {
scroll-behavior: smooth;
}
body {
font-family: YakuHanJP, 'Noto Sans JP', sans-serif;
font-weight: 400;
font-style: normal;
color: #000000;
text-align: center;
background-color: #ffffff;
margin: 0;
padding:0;
line-height: 1.9;
font-size: 16px;
position: relative;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
line-height: 1;
}
a {
text-decoration: none;
color: #000000;
margin: 0;
padding: 0;
}
img{
vertical-align:bottom;
}
ul,li{
margin:0;
padding:0;
list-style:none;
}


header {
width: 100%;
background-color: #f9df33;
margin: 0;
padding: 0;
overflow: hidden;
position: relative;
}
header h1 {
display: table;
width: 320px;
margin: 17px;
text-align: left;
font-size: 20px;
font-weight: 500;
letter-spacing: 5px;
}
header h1 span {
display: table-cell;
font-size: 12px;
letter-spacing: 0;
vertical-align: middle;
}
main{
padding:75px 0;
}

main > div {
position: relative;
display: inline-block;
margin: 0 0 1.5em;
padding: 0 10px;
min-width: 120px;
max-width: 100%;
color: #ffffff;
font-size: 16px;
font-weight:bold;
background: #000000;
}
main > div:before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #000000;
}
main > div p {
margin: 0;
padding: 0;
}
main h1{
margin-bottom:30px;
font-size:26px;
}
main > p {
font-size:14px;
margin-bottom:40px;
}

main > ul{
width:900px;
margin:0 auto;
overflow:hidden;
}
main > ul li{
display:inline-block;
width:195px;
border-radius:10px;
background-color:#f9df33;
margin-right:34px;
}
main > ul li:nth-child(4){
margin-right:0;
}
main > ul li a{
display:block;
font-size:20px;
font-weight:500;
line-height:70px;
}

main article{
width:900px;
margin:100px auto 0;
}
main article h2{
background-color:#f9df33;
font-size:20px;
border-radius: 10px 10px 0 0;
margin-bottom:40px;
padding:10px 0;
}
main article ul{
overflow:hidden;
text-align:left;
}
main article ul li{
display:inline-block;
width:280px;
margin:0 30px 0 0;
}
main article li aside{
display:inline-block;
padding:0 5px;
font-size:10px;
background-color:#808080;
color:#fff;
margin:0;
}
main article li a{
}
main article li p{
margin:0 0 10px;
font-weight:500;
}
main article li img{
width:100%;
}
main article li small{
}

footer {
position: absolute;
border: 0;
left: 0;
width: 100%;
height: 30px;
text-align: center;
background: #f8de33;
color: #000000;
}
footer small {
font-size: 14px;
letter-spacing: 1px;
}


@media screen and (max-width:667px) {

main {
padding:40px 20px;
}
main > ul{
width:auto;
}
main > ul li{
display:block;
float:left;
width:46%;
margin-right:6%;
margin-bottom:10px;
}
main > ul li:nth-child(2n){
margin-right:0
}
main > ul li a{
font-size:14px;
line-height:40px;
}
main article{
width:auto;
margin:50px 0 0;
}
main article h2{
font-size:17px;
margin-bottom:20px;
}
main article ul li{
width:100%;
margin:0 30px 0 0;
}









}