/* reset css */
* {
  box-sizing:border-box;
  -moz-box-sizing:border-box;
}
ol, ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
h1, h2, h3, h4, h5, p {
  margin: 0;
}
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary{
  display: block;
}
a:active, a:focus {
    border:none;
    outline:none;
}
/* pc layout (960 grid system) */
@media screen and (min-width: 481px) {
  div.container{
    width: 960px;
    margin: 0 auto;
  }
  div, nav, header, table {
    width: 950px;
    clear: both;
  }
  .grd_col_1{width:30px}
  .grd_col_2{width:70px}
  .grd_col_3{width:110px}
  .grd_col_4{width:150px}
  .grd_col_5{width:190px}
  .grd_col_6{width:230px}
  .grd_col_7{width:270px}
  .grd_col_8{width:310px}
  .grd_col_9{width:350px}
  .grd_col_10{width:390px}
  .grd_col_11{width:430px}
  .grd_col_12{width:470px}
  .grd_col_13{width:510px}
  .grd_col_14{width:550px}
  .grd_col_15{width:590px}
  .grd_col_16{width:630px}
  .grd_col_17{width:670px}
  .grd_col_18{width:710px}
  .grd_col_19{width:750px}
  .grd_col_20{width:790px}
  .grd_col_21{width:830px}
  .grd_col_22{width:870px}
  .grd_col_23{width:910px}
  .grd_col_24{width:950px}

  .grd_margin_1{margin-left:40px}
  .grd_margin_2{margin-left:80px}
  .grd_margin_3{margin-left:120px}
  .grd_margin_4{margin-left:160px}
  .grd_margin_5{margin-left:200px}
  .grd_margin_6{margin-left:240px}
  .grd_margin_7{margin-left:280px}
  .grd_margin_8{margin-left:320px}
  .grd_margin_9{margin-left:360px}
  .grd_margin_10{margin-left:400px}
  .grd_margin_11{margin-left:440px}
  .grd_margin_12{margin-left:480px}
  .grd_margin_13{margin-left:520px}
  .grd_margin_14{margin-left:560px}
  .grd_margin_15{margin-left:600px}
  .grd_margin_16{margin-left:640px}
  .grd_margin_17{margin-left:680px}
  .grd_margin_18{margin-left:720px}
  .grd_margin_19{margin-left:760px}
  .grd_margin_20{margin-left:800px}
  .grd_margin_21{margin-left:840px}
  .grd_margin_22{margin-left:880px}
  .grd_margin_23{margin-left:920px}

  .grd_col_1,
  .grd_col_2,
  .grd_col_3,
  .grd_col_4,
  .grd_col_5,
  .grd_col_6,
  .grd_col_7,
  .grd_col_8,
  .grd_col_9,
  .grd_col_10,
  .grd_col_11,
  .grd_col_12,
  .grd_col_13,
  .grd_col_14,
  .grd_col_15,
  .grd_col_16,
  .grd_col_17,
  .grd_col_18,
  .grd_col_19,
  .grd_col_20,
  .grd_col_21,
  .grd_col_22,
  .grd_col_23{margin-right:10px;display:block;float:left;clear:none;}

  .grd_term{margin-right:0;}
  .grd_term:after{content:"";display:block;clear:both;}
}

@media screen and (max-width: 480px) {
  div.container{
    margin: 0 auto;
  }
  div, nav, header, table {
    width: 100%;
    clear: both;
  }

  .col-1-2{width: 50%}
  .col-1-3{width: 33.33%}
  .col-2-3{width: 66.66%}
  .col-1-4{width: 25%}

  .col-1-2,
  .col-1-3,
  .col-2-3,
  .col-1-4{display:block;float:left;clear:none;}
}