@media only screen and (min-width: 381px) {
  main {
    padding:10px;
  }
}


.post table tr td {
  box-sizing:border-box;
  padding:5px 0;
}

.post-list.related_article{
    margin:1em 0;
}
.post-list.related_article .ttl{
    margin: 0 0 0.5em;
    font-size:1em!important;
    font-weight: bold;
}
.post-list.related_article .ttl span.linkcat {
    font-size:0.5em;
    font-weight:bold;
    color:#fff;
    background:#fa8072;
    display:inline-block;
    padding:0.1em 0.5em;
    position:relative;
    top:-2px;
    text-align:center;
    margin-right:0.5em;
    border-radius:0.5em;
    line-height: 2em;
}
.post-list.related_article .date{
    font-size:0.8em!important;
    display: block;
    text-align: right;
}
.post-list.related_article .eyecatch{
    width: 22%;
    float:left;
    margin:0;
    margin-right:3%;
}
.post-list.related_article a{
    color:#333;
    background:#f7f7f7;
    display:block;
    padding:1em;
}
.post-list.related_article a:after{
  content: ".";
  display: block;
  height: 0;
  font-size:0;
  clear: both;
  visibility:hidden;
}

.post-list.related_article a:hover{
    color:#666;
}
select {
    max-width:100%;
}


.three {
  width: 100%;
  max-width: 1080px;
  margin: auto;
  zoom: 1;
  clear: both;
}
.three:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
  clear: both;
}
.three article {
  float: left;
  margin-right: 2.4%;
  width: 31.73333%;
  clear: none;
}
.three article:last-child {
  margin-right: 0;
}
.three article img {
  margin: 0;
  margin-bottom: 10px;
}
.three article p {
  margin: 0;
}
.three article:nth-child(3n) {
  margin-right: 0;
}
.three.nm article {
  float: left;
  margin-right: 0% !important;
  width: 33.33333%;
  clear: none;
}
.three.nm article:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 819px) {
  .three.sp > article {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    margin-bottom: 1em;
  }
  .three.sp > article:last-child {
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 819px) {
  .three.sp2 > article {
    float: left;
    margin-right: 2.4%;
    width: 48.8%;
    clear: none;
    margin-bottom: 1em;
  }
  .three.sp2 > article:last-child {
    margin-right: 0;
  }
  .three.sp2 > article:nth-child(2n) {
    margin-right: 0;
  }
  .three.sp2 > article:last-child {
    margin-bottom: 0;
  }
}

div.rank-c-review {
  margin: 20px auto;
}
div.rank-c-review div.review-wrap {
  position: relative;
  margin-bottom: 20px;
  padding: 25px 10px 10px;
  border-radius: 5px;
}
div.rank-c-review div.review-wrap.m {
  background: rgba(100, 181, 246, 0.1);
}
div.rank-c-review div.review-wrap.f {
  background: rgba(248, 187, 208, 0.1);
}
div.rank-c-review div.review-wrap p.review_content {
    background-color: #fff;
    border-radius: 5px;
    padding:5px;
    position: relative;
    margin-bottom:15px;
}
div.rank-c-review div.review-wrap p.review_content:after {
border:10px solid transparent;
border-top-color:#fff;
border-bottom-width:0;
bottom:-10px;
content:"";
display:block;
left:20px;
position:absolute;
width:0;
}
div.rank-c-review div.review-wrap p.review_content span.review_date {
    position: absolute;
    top:100%;
    right:5px;
    line-height: 12px;
    font-size:0.5em;
    font-weight: bold;
    letter-spacing: 0.1em;
}
div.rank-c-review div.review-wrap:last-child {
  margin-bottom: 0;
}
div.rank-c-review div.review-wrap div.review-text > img {
  position: absolute;
  width: 50px;
  height: 50px;
  top: 5px;
  left: 5px;
}
@media only screen and (max-width: 819px) {
  div.rank-c-review div.review-wrap div.review-text > img {
    width: 50px;
    height: 50px;
  }
}
div.rank-c-review div.review-wrap div.review-text {
    position: relative;
  padding-left: 65px;
  min-height: 60px;
}
@media only screen and (max-width: 819px) {
  div.rank-c-review div.review-wrap div.review-text {
    padding-left: 65px;
  }
}
div.rank-c-review div.review-wrap div.review-text b {
  margin-bottom: 10px;
}
div.rank-c-review div.review-wrap div.review-text b:after {
  font-family: FONTAWESOME;
  display: block;
  letter-spacing: 0.5em;
  font-size: 0.8em;
  color: #f06292;
  margin: 10px auto 5px;
  line-height: 1em;
}
div.rank-c-review div.review-wrap div.review-text b.s1:after {
  content: "\f005 \f006 \f006 \f006 \f006";
}
div.rank-c-review div.review-wrap div.review-text b.s2:after {
  content: "\f005 \f005 \f006 \f006 \f006";
}
div.rank-c-review div.review-wrap div.review-text b.s3:after {
  content: "\f005 \f005 \f005 \f006 \f006";
}
div.rank-c-review div.review-wrap div.review-text b.s4:after {
  content: "\f005 \f005 \f005 \f005 \f006";
}
div.rank-c-review div.review-wrap div.review-text b.s5:after {
  content: "\f005 \f005 \f005 \f005 \f005";
}
div.rank-c-review div.review-wrap div.review-text p {
  font-size: 0.9em;
  line-height: 1.4em;
}
div.rank-c-review div.review-wrap.m div.review-text b:after {
  color: #64b5f6;
}
div.rank-c-review div.review-wrap.f div.review-text b:after {
  color: #f29c9f;
}
.sep6 {
  width: 100%;
  max-width: 1080px;
  margin: auto;
  zoom: 1;
  clear: both;
}
.sep6:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
  clear: both;
}
.sep6 > article:first-child {
  float: left;
  margin-right: 2.4%;
  width: 48.8%;
  clear: none;
}
.sep6 > article:first-child:last-child {
  margin-right: 0;
}
.sep6 > article:last-child {
  float: left;
  margin-right: 2.4%;
  width: 48.8%;
  clear: none;
}
.sep6 > article:last-child:last-child {
  margin-right: 0;
}
.sep6 p {
  margin-bottom: 0;
}
@media only screen and (max-width: 787px) {
  .sep6.sp > article {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    margin-bottom: 1.5em;
  }
  .sep6.sp > article:last-child {
    margin-bottom: 0;
  }
}
.sep6 p {
  margin-top: 0;
}
.sep6 p:last-child {
  margin-bottom: 0;
}

.rsep6 {
  width: 100%;
  max-width: 1080px;
  margin: auto;
  zoom: 1;
  clear: both;
}
.rsep6:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
  clear: both;
}
.rsep6 > article:first-child {
  float: right;
  margin-left: 2.4%;
  width: 48.8%;
  clear: none;
}
.rsep6 > article:first-child:last-child {
  margin-left: 0;
}
.rsep6 > article:last-child {
  float: right;
  margin-left: 2.4%;
  width: 48.8%;
  clear: none;
}
.rsep6 > article:last-child:last-child {
  margin-left: 0;
}
.rsep6 p {
  margin-bottom: 0;
}
@media only screen and (max-width: 787px) {
  .rsep6.sp > article {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    margin-bottom: 10px;
  }
  .rsep6.sp > article:last-child {
    margin-bottom: 0;
  }
}
.rsep6 p {
  margin-top: 0;
}
.rsep6 p:last-child {
  margin-bottom: 0;
}

.ssep6 {
  width: 100%;
  max-width: 1080px;
  margin: auto;
  zoom: 1;
  clear: both;
}
.ssep6:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
  clear: both;
}
.ssep6 > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 50%;
  clear: none;
}
.ssep6 > article:first-child:first-child {
  margin-right: 0 !important;
}
.ssep6 > article:last-child {
  float: left;
  margin-right: 0% !important;
  width: 50%;
  clear: none;
}
.ssep6 > article:last-child:first-child {
  margin-right: 0 !important;
}
.ssep6 p {
  margin-bottom: 0;
}
@media only screen and (max-width: 787px) {
  .ssep6.sp > article {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    margin-bottom: 1.5em;
  }
  .ssep6.sp > article:last-child {
    margin-bottom: 0;
  }
}
.ssep6 p {
  margin-top: 0;
}
.ssep6 p:last-child {
  margin-bottom: 0;
}


.sep5 {
  width: 100%;
  max-width: 1080px;
  margin: auto;
  zoom: 1;
  clear: both;
}
.sep5:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
  clear: both;
}
.sep5 > article:first-child {
  float: left;
  margin-right: 2.4%;
  width: 40.26667%;
  clear: none;
}
.sep5 > article:first-child:last-child {
  margin-right: 0;
}
.sep5 > article:last-child {
  float: left;
  margin-right: 2.4%;
  width: 57.33333%;
  clear: none;
}
.sep5 > article:last-child:last-child {
  margin-right: 0;
}
.sep5 p {
  margin-bottom: 0;
}
@media only screen and (max-width: 787px) {
  .sep5.sp > article {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    margin-bottom: 1.5em;
  }
  .sep5.sp > article:last-child {
    margin-bottom: 0;
  }
}
.sep5 p {
  margin-top: 0;
}
.sep5 p:last-child {
  margin-bottom: 0;
}

.rsep5 {
  width: 100%;
  max-width: 1080px;
  margin: auto;
  zoom: 1;
  clear: both;
}
.rsep5:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
  clear: both;
}
.rsep5 > article:first-child {
  float: right;
  margin-left: 2.4%;
  width: 40.26667%;
  clear: none;
}
.rsep5 > article:first-child:last-child {
  margin-left: 0;
}
.rsep5 > article:last-child {
  float: right;
  margin-left: 2.4%;
  width: 57.33333%;
  clear: none;
}
.rsep5 > article:last-child:last-child {
  margin-left: 0;
}
.rsep5 p {
  margin-bottom: 0;
}
@media only screen and (max-width: 787px) {
  .rsep5.sp > article {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    margin-bottom: 10px;
  }
  .rsep5.sp > article:last-child {
    margin-bottom: 0;
  }
}
.rsep5 p {
  margin-top: 0;
}
.rsep5 p:last-child {
  margin-bottom: 0;
}

.ssep5 {
  width: 100%;
  max-width: 1080px;
  margin: auto;
  zoom: 1;
  clear: both;
}
.ssep5:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
  clear: both;
}
.ssep5 > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 41.66667%;
  clear: none;
}
.ssep5 > article:first-child:first-child {
  margin-right: 0 !important;
}
.ssep5 > article:last-child {
  float: left;
  margin-right: 0% !important;
  width: 58.33333%;
  clear: none;
}
.ssep5 > article:last-child:first-child {
  margin-right: 0 !important;
}
.ssep5 p {
  margin-bottom: 0;
}
@media only screen and (max-width: 787px) {
  .ssep5.sp > article {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    margin-bottom: 1.5em;
  }
  .ssep5.sp > article:last-child {
    margin-bottom: 0;
  }
}
.ssep5 p {
  margin-top: 0;
}
.ssep5 p:last-child {
  margin-bottom: 0;
}

.table {
  display: table;
  width: 100%;
}
@media only screen and (max-width: 787px) {
  .table {
    display: block;
  }
}
.table div.row {
  display: table-row;
}
@media only screen and (max-width: 787px) {
  .table div.row {
    display: block;
    margin: 0 !important;
  }
  .table div.row:last-child {
    border-bottom: 1px solid #ddd;
  }
}
.table div.row.headrow article {
  text-align: center;
  background-color: #f06292;
  color: #fff;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .table div.row.headrow {
    display: none;
  }
}
.table div.row > article {
  display: table-cell;
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd;
  padding: 5px;
}
.table div.row > article:last-child {
  border-right: 1px solid #ddd;
}
@media only screen and (max-width: 787px) {
  .table div.row > article {
    display: block;
    width: 100%;
    border-right: 1px solid #ddd;
  }
}
.table div.row:last-child article {
  border-bottom: 1px solid #ddd;
}
@media only screen and (max-width: 787px) {
  .table div.row:last-child article {
    border-bottom: none;
  }
}
.table.head div.row article:first-child {
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
@media only screen and (max-width: 787px) {
  .table.head div.row article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head1 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 8.33333%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head1 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head1 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head2 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 16.66667%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head2 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head2 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head3 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 25%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head3 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head3 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head4 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 33.33333%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head4 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head4 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head5 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 41.66667%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head5 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head5 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head6 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 50%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head6 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head6 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head7 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 58.33333%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head7 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head7 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head8 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 66.66667%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head8 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head8 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head9 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 75%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head9 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head9 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head10 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 83.33333%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head10 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head10 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head11 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 91.66667%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head11 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head11 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.table.head12 div.row > article:first-child {
  float: left;
  margin-right: 0% !important;
  width: 100%;
  clear: none;
  float: none;
  background-color: #f06292;
  text-align: center;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}
.table.head12 div.row > article:first-child:first-child {
  margin-right: 0 !important;
}
@media only screen and (max-width: 787px) {
  .table.head12 div.row > article:first-child {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    float: none;
    padding: 2px 5px;
    text-align: left;
    font-size: 0.8em;
  }
}
.copy_btn {
  padding: 10px 0;
  border-radius: 5px;
  text-align: center;
  border: 1px solid #ddd;
  background: #efefef;
  cursor: pointer;
  margin: 40px auto;
  width: 95%;
  font-weight: bold;
  box-shadow: 0 5px 0 #ddd;
  -moz-transition: all 0.2s ease-in-out 0.1s;
  -o-transition: all 0.2s ease-in-out 0.1s;
  -webkit-transition: all 0.2s ease-in-out;
  -webkit-transition-delay: 0.1s;
  transition: all 0.2s ease-in-out 0.1s;
  position: relative;
  top: 0;
}
.copy_btn:hover {
  top: 4px;
  box-shadow: 0 1px 0 #ddd;
}
div#side div#mybox label.screen-reader-text {
  display: none;
}
select#cat {
  margin:10px;
  width:90%;
}