/*
@import url('https://fonts.googleapis.com/css?family=Eczar');
*{font-family: 'Eczar', sans-serif;}
*/
@import url('https://fonts.googleapis.com/css?family=Alegreya');

*{font-family:'Alegreya','Sawarabi Mincho',sans-serif;}
html,body{width:100%;height:100%;}
.clearfix:after{content:".";display:block;clear:both;height:0;visibility:hidden;}
html{}
body{font-size:14px;line-height:1.8em;font-weight:lighter;transition:all 800ms cubic-bezier(1,0,0,1);position:relative;}
ul{list-style:none;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
a{color:#aaa;}
table{border-collapse:separate;border-spacing:4px}
table th{padding:4px;vertical-align:top;}
table td{padding:4px;}

.success{color:#3ae;font-size:12px;}
.error{color:#d22;font-size:12px;}
.msg{border-radius:8px;padding:10px;margin:20px;}
.msg.success{border:1px solid #3ae;}
.msg.error{border:1px solid #d22;}

#wrap{width:94%;margin:auto;position:relative;user-select:none;}

#title{width:70%;max-width:300px;height:0px;margin:auto;padding-top:100%;
	background:url('../img/logo.png') no-repeat center center;
	background-size:contain;
}

#body{margin:50px auto;}
h3{font-size:36px;text-align:center;}
#body > div{margin:20px auto;}
article{margin:20px auto;}
article h4{font-size:18px;}
article time{font-size:12px;text-align:right;display:block;border-top:1px dashed #ccc;}
article p{text-indent:1em;margin-bottom:1em;}

#copyright{font-size:10px;text-align:center;}

dl#mainNavi{width:100%;padding-top:30px;text-align:center;}
dl#mainNavi > dt{font-size:72px;line-height:80px;}
dl#mainNavi > dd{font-size:24px;width:24%;line-height:30px;display:inline-block;position:relative;margin:0px;padding:0px;}
dl#mainNavi > dd > a{text-decoration:none;display:block;border-left:1px solid #ccc;transition:all 500ms cubic-bezier(1,0,0,1);}
dl#mainNavi > dd > a:hover{color:#fa0;}
dl#mainNavi > dd:nth-child(2) > a{border-left:none;}
dl#mainNavi:after{content:"";display:block;clear:both;height:0px;visibility:hidden;overflow:hidden;}

form{text-align:center;}
form table{width:96%;margin:auto;}
form table th{text-align:right;}
form table td{text-align:left;}
form table input,form table textarea{width:90%;border:1px solid #ccc;border-radius:2px;padding:8px;line-height:20px;}
form table textarea{text-align:left;resize:vertical;}
form input[type="submit"],form input[type="reset"]{display:inline-block;color:#fff;width:26%;margin:10px;text-align:center;border:none;line-height:30px;border-radius:2px;}
form input.submit{background:#fa0;}
form input.reset{background:#d22;}
form input.undo{background:#3ae;}

@media screen and (min-width:1000px){
#wrap{width:900px;}
}
@media screen and (min-width:700px){
#body article{width:600px;margin:20px auto;}
#body > div{width:600px;margin:20px auto;}
}
@media screen and (max-width:700px){
}
@media screen and (max-width:600px){
}
@media screen and (max-width:500px){
}
@media screen and (max-width:400px){
dl#mainNavi > dd{font-size:20px;}
}
@media screen and (max-width:320px){
dl#mainNavi > dd{width:23%;font-size:14px;}
}