/* ------ ～ 767px ------ */
@media screen and (max-width: 767px) {
  html {*overflow-x: hidden;}
  #wrapper {min-width: 0; overflow: hidden;}
  #header-inner {width: 100%;}
  #ptitle {position: static; margin-top: 10px; text-align: center; z-index: 10}
  #h-banner{display: none;}
  #s-button {position: static; margin-top : 5px;text-align: center;}
  #gnav-btn {position: absolute; top: 12px; right: 10px; display: block; padding: 5px 0 4px; z-index: 10000}
  #gnav-btn a {display: block; width: 40px; height: 40px; line-height: 40px; font-size: 24px; color: #346AA8; text-align: center; vertical-align: top; text-decoration: none; -webkit-border-radius: 5px;  border-radius: 5px; border: 1px solid #CCC;}
  #gnav {position: absolute; top: 70px; left: 0; font-size: 100%; z-index: 999; display: none; border-top: 1px solid #CCC;}
  #gnav nav { width: 100%;  margin: 0; padding: 0; position: static; z-index: 9999;}
  #gnav nav > ul {list-style-type: none; height: auto;}
  #gnav nav > ul > li {position: static; float: none; width: 100%; margin: 0 ; text-align: left; border-left: none;}
  #gnav nav > ul > li:first-child {border-left: none;}
  #gnav nav > ul > li a {display: block; padding-left: 1.0em; color: #333; font-weight: normal; line-height: 3em; text-align: left; text-decoration: none; background-color: #FFF; border-bottom: 1px solid #CCC;}
  #gnav nav > ul > li > ul {position: static; width: 100%; list-style: none; margin: 0;}
  #gnav nav > ul > li:last-child > ul {width: 100%;}
  #gnav nav > ul > li  ul li{margin: 0; overflow: hidden; width: 100%; height: 0; -moz-transition: none; -webkit-transition: none; -o-transition: none; -ms-transition: none; transition: none;}
  #gnav nav > ul > li  ul li a{padding-left: 2em; height: auto; line-height: 3em; text-align: left; font-size: 100%; font-weight: normal ; color: #333; background-color: #EFEFEF; border-top: none;}
  #gnav nav > ul > li:hover > a{color: #333; background-color: #FFF; opacity: 1.0; filter: alpha(opacity=100);}
  #gnav nav > ul > li  ul li:hover > a{color: #333; background-color: #FFF;}
  #gnav nav > ul > li:hover ul li{overflow: visible; height: 3em;}
  #gnav nav .current-menu-parent a, #gnav nav .current-menu-item a{color: #333; }
  #containar{width : 90%; position: relative; text-align: center;}
  #contents {float: none; width: 100%; margin: 0 auto; padding: 0;}
  #plist {padding: 10px 0;}
  #post-list article{width: 48%; margin: 0 0.5%;}
  #sidebar {float: none;	width: 100%;	margin: 15px auto; overflow: hidden;}
  .sidebar-wrapper {display: inline-block; vertical-align: top; width: 47%; margin: 0 1.0% 10px;}
  .parts ul {padding: 0;}
  .doc {padding: 0;}
  article p {padding: 0;}
  #social{margin: 20px 0;}
  #related-posts {margin: 10px 2%; padding: 0 5px;}
  footer {min-width: 0; overflow: hidden;}
  #footer-inner {width: 90%}
  #footer-inner .f-left {width: 48%;}
  #footer-inner .f-center {width: 48%;}
  #footer-inner .f-right {width: 48%;}
  /* ------ ランキング------ */
  .sidebar-wrapper .rank {width: 32%; margin: 15px 0 15px 1% ; float: left;}
}

/* ------ ～479px ------ */
@media screen and (max-width: 479px) {
  .alignleft, .alignright{float: none; margin: 5px auto; text-align: center; display: block;}
  #ptitle {position: absolute; top: 10px; left: 10px; margin: 0; padding: 0;}
  #post-list  article img, #post-list-cat  article img {width: 100%; max-width: 100%; margin: 0 auto;}
  #post-list article{display: block; width: 100%; margin: 0; padding: 15px 0 0;}
  .main-title {font-size: 147%;}
  .post-title{font-size: 120%;}
  .parts-title{font-size: 107%;}
  #related-posts {margin: 0; padding: 10px 0;}
  #related-posts .k-post {margin: 5px 0.5%; width: 47%;}
  #footer-inner {width: 100% ;margin: 0 ;padding: 0;}
  .sidebar-wrapper {display: block; width: 100%; margin: 0 0 10px;}
  .footer-wrapper h4{-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
  .footer-wrapper nav{width: 100% ; margin: 0; padding: 0;}
  .footer-wrapper ul {margin: 0; list-style: none;}
  .footer-wrapper ul li {width: 100%; text-align: left; display: block; border-bottom:1px solid #CCC;}
  .footer-wrapper ul li:last-child {border-bottom: none;}
  .footer-wrapper ul li a{display: block; padding: 10px 20px 10px 10px; line-height: 1.5em; font-size: 100%; text-decoration: none;}
  .footer-wrapper ul li a:hover{text-decoration: none; filter: alpha(opacity=80); -moz-opacity:0.80; -ms-filter: "alpha( opacity=80 )"; opacity:0.80;}
  #footer-inner .f-left { margin: 0; width: 100%; float: none;}
  #footer-inner .f-center {margin: 0; width: 100%; float: none;}
  #footer-inner .f-right {margin: 0; width: 100%; float: none;}
  .ads_left {float: none; display: none;}
  .ads_rigjt{float: none; margin: 0 auto; display: block;}
  .lenth{width: 100%;}
  /* ------ ランキング------ */
  .rank {float: none; margin: 15px auto; padding: 0; width: 100%;}
  .sidebar-wrapper .rank  {float: none; margin: 15px auto; padding: 0; width: 100%;}
  .rank .rankinner .b_link img {max-width: 100%; margin: 0 auto; display: block;}
}