body{
color:#666;
-webkit-text-size-adjust: 100%;
font-family: verdana,sans-serif;
}

a:link{color:#039;}
a:active{color:#800080;}
a:hover{color:#f90;}

img {
max-width: 100%;
height: auto;
}

.att{color:#f60; font-weight:bold;}
.price{color: #c33; font-weight: bold;}

#box {
max-width: 1000px;
height: auto;
margin-left: auto;
margin-right: auto;
}

#header {
height: 2.5em;
background-color:#eecd31;
position: relative;
border-radius:5px;
}

#nav {
margin:0;
padding:0;
position: absolute;
right:10px;
bottom: 0;
background-color: #fff;
border-top-left-radius:5px;
border-top-right-radius:5px;
display: flex;
align-items:center;
list-style: none;
}
#nav li {
margin: 5px 5px 0;
}

#main {
padding: 10px 0;
}
#main p {
line-height: 1.7;
margin-bottom: 2em;
}
#main p div {
margin-bottom: 2em;
}

#menu {
background-color: #f9f9f9;
padding:10px;
border-radius:5px;
}
#copyright {
padding: 20px 0 0;
xtext-align: center;
font-style: normal;
font-size:12px;
}


h1{
background: url(../img/h1mark1.gif) 0% 35% no-repeat;
padding-left:40px;
color:#35a3ff;
font-size: 1.4em;
}
h2{
font-size: 1.2em;
margin-top:40px;
margin-bottom:40px;
padding-left:5px;
border-left:5px solid #eecd31;
border-bottom:1px solid #eecd31;
}
.hd3 {
font-size:1em;
font-weight: bold;
margin-bottom: 5px;
}


.spec {
border-collapse: collapse;
border-top: 1px solid #ccc;
}
.spec caption {
text-align: left;
}
.spec th {
background-color: #f1f1f1;
}
.spec th,.spec td {
border-bottom: 1px solid #ccc;
padding: 1em;
}

.tech {
padding: 1em;
background-color: #f5f5dc;
border: 1px solid #ccc;
word-break: break-all;
border-radius:5px;
}
#main ul {
line-height: 1.6;
margin-bottom: 2em;
}
#menu ul {
list-style: none;
padding-left: 0;
line-height: 1.6;
margin-top: 5px;
margin-bottom: 40px;
}

.rss {
margin-left:5px;
padding-left: 15px;
background: url('../kousin/feed-icon-12x12.gif') center left no-repeat;
}
.visit {
margin-top: 20px;
}
.visit,.special {
font-size: 12px;
}
.special a {
margin-right:20px;
}

#admain {
margin: 40px 0 0;
overflow: hidden;
}



@media screen and (min-width: 768px){

#box {
display: grid;
grid-gap: 10px;
gap:10px;
grid-template-columns:250px 1fr;
grid-template-rows:100px 1fr auto;
display: -ms-grid;
-ms-grid-columns: 250px 10px 1fr;
-ms-grid-rows:100px 10px 1fr 10px auto;
}
#header {
height:100px;
grid-column:1/-1;
grid-row:1;
-ms-grid-column: 1;
-ms-grid-column-span: 3;
-ms-grid-row: 1;
}
#main {
padding:10px 0 10px 10px;
grid-column:2;
grid-row:2;
-ms-grid-column: 3;
-ms-grid-column-span: 1;
-ms-grid-row: 3;
}
#menu {
grid-column:1;
grid-row:2;
-ms-grid-column: 1;
-ms-grid-column-span: 1;
-ms-grid-row: 3;
}
#copyright {
grid-column:1/-1;
grid-row:3;
-ms-grid-column: 1;
-ms-grid-column-span: 3;
-ms-grid-row: 5;
text-align: center;
font-size:1em;
}


}