﻿@charset "utf-8";
/* root */
:root{
  --regular:400;
  --bold:600;
  --xbold:700;
  --xsmall:10px;
  --small:12px;
  --medium:15px;
  --large:18px;
  --xlarge:24px;
  --border:#ddd;
  --gray:#888;
  --black:#222;
  --white:#fff;
  --opacity:0.75;
}
/* body */
body{margin:0;padding:0;background:var(--white);box-sizing:border-box;font-size:var(--medium);color:var(--black);font-weight:var(--regular);font-family:"Noto Sans JP", sans-serif;letter-spacing:0.05em;overflow-x:hidden;}
/* default */
header,nav,footer,main,section,aside,article,hgroup,div,span,em,i,b,strong,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,th,td,form,input,select,textarea,hr,button,a,figure,picture{margin:0;padding:0;box-sizing:border-box;}
figure,picture{display:block;}
th,b,strong,h1,h2,h3,h4,h5,h6{font-weight:var(--bold);}
input,select,textarea,button{font-weight:var(--regular);}
input,select,textarea,button{display:block;-webkit-appearance:none;}
ul,ol{list-style:none;}
i,em{font-style:normal;}
svg, img, video{display:block;border:0;outline:0;width:100%;}
a{color:var(--black);}
a:hover{text-decoration:none;}
a img:hover{opacity:var(--opacity);}
sup{position:relative;top:-0.1em;vertical-align:top;}
p{font-size:var(--medium);line-height:2em;}
p small{display:block;font-size:var(--xsmall);line-height:1.5em;color:var(--gray)}
p + p{margin-top:1em;}
hr{margin:20px 0;padding:0;border:0;height:0;}
table{margin:0 auto;border-collapse:collapse;border-spacing:0;width:auto;}
table tr > *{padding:5px 0;border:0;}
table th{padding-right:15px;text-align:left;}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"]{;}
input[type="radio"], input[type="checkbox"]{}
select{}
textarea{}
input[type="submit"]{}
input[type="submit"]:disabled{}
button{border:0;}
/* header */
header{padding:30px;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
}
/* main */
main{padding:30px;}
main ul{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;}
main ul li a{position:relative;display:block;border:1px solid var(--border);width:180px;height:180px;}
main ul li img{position:absolute;top:50%;left:50%;width:150px;transform:translate(-50%,-50%);}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
}
/* footer */
footer{padding:30px;}
footer p{font-size:var(--medium);font-family:Oswald;text-align:center;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
}
