@charset "utf-8";
@media only screen and (min-width: 1024px) {
.shadow {
position: relative;
-webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.shadow:before, .shadow:after {
content: "";
position: absolute;
z-index: -1;
-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
-moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
box-shadow: 0 0 20px rgba(0,0,0,0.8);
top: 0;
bottom: 0;
left: 0;
right: 0;
-moz-border-radius: 100px / 10px;
border-radius: 100px / 10px;
}
.shadow:after {
right: 10px;
left: auto;
-webkit-transform: skew(8deg) rotate(3deg);
-moz-transform: skew(8deg) rotate(3deg);
-ms-transform: skew(8deg) rotate(3deg);
-o-transform: skew(8deg) rotate(3deg);
transform: skew(8deg) rotate(3deg);
}
}
@media only screen and (max-width: 640px) {
body {
overflow-x: hidden;
font-size:12pt !important;
}
h1,h2,h3,h4,h5,h6,p,span,strong,dt,p,th,td,input {
font-size:100% !important;
}
#around {
overflow-x: hidden;
position:relative;
top: 50px;
width: 99%;
margin-top: 0;
z-index: 1;
}
#pagebody {
width: 99%;
}
#inq #sideBlk {
display:none;
}
#sitetitle {
clear:both;
float:none;
width:100%;
height:100px;
margin:0;
background-position:0%;
position:relative;
}
#siteinfo {
clear:both;
float:none;
width:380px;
height:110px;
text-align:center;
margin:-25px 0 5px 0;
background-size:95%;
background-position:-40px 0;
position:relative;
left:0px;
}
#description {
display: none;
}
#methodBar {
display: none;
}
#header #homelink {
display:block;
width:145px;
height:18px;
}
#header #inqbtn {
width:145px;
height:20px;
}
#gnavi {
display: none;
}
.impNews {
display: none;
}
.countMessage {
display: none;
}
#slides {
display: none;
}
#contentBlk #mainBlk {
float:none;
width:98%;
margin:auto;
padding:0;
}
#contentBlk #sideBlk {
clear:both;
float:none;
width:98%;
padding:0 !important;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}
#sideBlk h2, #sideBlk h3 {
width:98% !important;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}
#topBlk {
margin-top:0;
}
#topBlk .topicsbox {
width: 98%;
}
#topBlk .voicebox dl {
width: 98%;
margin: 0.5em 0;
}
#topBlk .voicebox dl dt {
float:none;
margin:0;
display:block;
width:100%;
text-align:center;
}
#topBlk .voicebox dl dt .imgtitle{
display:none;
}
#topBlk .voicebox dl dt img {
margin-right:3px auto;
width:80%;
}
#topBlk .voicebox dl dd {
clear:both;
width: 98%;
}
#informationBLK .informationBox {
float:none;
width:98%;
margin:12px auto;
}
#middleBlk dl dt img {
margin: 2px 0;
text-align: center;
}
#newmodel {
display: none;
}
.bnr {
display: none;
}
.bnr.fiximg {
display:block !important;
}
.fiximg img {
width:96%;
margin:0 auto;
}
#bottomBlk {
display: none;
}
.sitenavi {
width: 100%;
margin: -1em 0 1em 0;
}
.sitenavi ul {
display: none;
}
.linkbnr {
display: none;
}
#bottomBlk .newpics, #middleBlk .newpics {
clear:both;
width: 98%;
margin-bottom:1.5em;
}
#bottomBlk .newpics img, #middleBlk .newpics img{
width:80%;
height:auto;
}
#mobile-top {
display:block;
z-index:9999;
}
#mobile-top * {
margin: 0;
padding: 0;
}
#mobile-top *::after, #mobile-top {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#mobile-top.fixed {
font-family: 'Lato', sans-serif;
margin-top: 0;
top: 0;
position: fixed;
padding-top: 10px;
height: 55px;
background: #000;
background: rgba(0,0,0,0.70);
transition: top 0.65s ease-in;
-webkit-transition: top 0.65s ease-in;
-moz-transition: top 0.65s ease-in;
}
#mobile-top.fixed #global-nav ul li a {
color: #fff;
padding: 0 20px;
}
#mobile-top.fixed #global-nav ul li a:link, #mobile-top.fixed #global-nav ul li a:hover, #mobile-top.fixed #global-nav ul li a:visited, #mobile-top.fixed #global-nav ul li a:active {
color:#fff;
}
#mobile-top.fixed #global-nav ul li:after {
bottom: -10px;
}
#nav-toggle {
display: none;
position: absolute;
right: 12px;
top: 14px;
width: 34px;
height: 36px;
cursor: pointer;
z-index: 10100;
}
#nav-toggle div {
position: relative;
}
#nav-toggle span {
display: block;
position: absolute;
height: 4px;
width: 100%;
background: #fff;
left: 0;
-webkit-transition: .35s ease-in-out;
-moz-transition: .35s ease-in-out;
transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {
top: 0;
}
#nav-toggle span:nth-child(2) {
top: 11px;
}
#nav-toggle span:nth-child(3) {
top: 22px;
}
#mobile-top,  #mobile-top > .inner {
width: 100%;
padding: 0;
}
#mobile-top {
top: 0;
position: fixed;
margin-top: 0;
}
#mobile-top.fixed {
padding-top: 0;
background: transparent;
}
#mobile-head {
background: #000;
width: 100%;
height: 56px;
z-index: 9999;
position: relative;
}
#mobile-top.fixed .mobile-home,  #mobile-top .mobile-home {
position: absolute;
left: 13px;
top: 3px;
color: #fff;
font-size: 36px !important;
}
#mobile-top .mobile-home a, #mobile-top .mobile-home a:link, #mobile-top .mobile-home a:hover, #mobile-top .mobile-home a:active, #mobile-top .mobile-home a:visited {
color:#fff;
text-decoration:none;
}
#mobile-top.fixed .nav-title,  #mobile-top .nav-title {
display: block;
width: 100px;
text-align: right;
position: absolute;
right: 50px;
top: 12px;
color: #fff;
font-size: 24px !important;
}
#mobile-top .nav-title a, #mobile-top .nav-title a:link, #mobile-top .nav-title a:hover, #mobile-top .nav-title a:active, #mobile-top .nav-title a:visited {
color:#fff;
text-decoration:none;
}
#global-nav {
position: absolute;
top: -500px;
background: #333;
width: 100%;
text-align: center;
padding: 0;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}
#global-nav ul {
list-style: none;
position: static;
right: 0;
bottom: 0;
font-size: 14px;
}
#global-nav ul li {
float: none;
position: static;
display:block;
height:35px;
line-height:35px;
}
#global-nav ul li:nth-child(even) {
background:#272727;
}
#global-nav ul li:after {
display: none;
}
#global-nav ul li.here {
color:#6E6E6E;
font-family: "Hiragino Kaku Gothic Pro", meiryo, "01FLOPDESIGN", "MS PGothic", Helvetica, Arial, "lucida grande", tahoma, verdana, arial, sans-serif;
font-weight:bold;
font-size:16px;
}
#global-nav ul li:hover {
background:#950202;
}
#mobile-top #global-nav ul li a,  #mobile-top.fixed #global-nav ul li a {
width: 100%;
height:100%;
display: block;
color: #fff;
text-decoration:none;
font-family: "Hiragino Kaku Gothic Pro", meiryo, "01FLOPDESIGN", "MS PGothic", Helvetica, Arial, "lucida grande", tahoma, verdana, arial, sans-serif;
font-weight:bold;
font-size:16px;
}
#nav-toggle {
display: block;
}
.open #nav-toggle span:nth-child(1) {
top: 11px;
-webkit-transform: rotate(315deg);
-moz-transform: rotate(315deg);
transform: rotate(315deg);
}
.open #nav-toggle span:nth-child(2) {
width: 0;
left: 50%;
}
.open #nav-toggle span:nth-child(3) {
top: 11px;
-webkit-transform: rotate(-315deg);
-moz-transform: rotate(-315deg);
transform: rotate(-315deg);
}
.open #global-nav {
-moz-transform: translateY(556px);
-webkit-transform: translateY(556px);
transform: translateY(556px);
}
.no-csstransforms .top {
position: static;
}
.no-csstransforms .drawer nav {
display: none;
}
.no-csstransforms .drawer.active nav {
display: block;
}
#topcontrol {
position:static;
z-index:99999;
}
#miniprof {
display:none;
}
#miniinfo {
clear:both;
float:none;
font-size:100%;
width:98%;
margin:15px auto;
}
#topBlk .story {
width:100% !important;
margin-top:0 !important;
padding-top: 0 !important;
}
.postdate {
display:block;
width:50% !important;
}
#topBlk .topicsbox ul li a {
margin-left:1em;
}
.subnavi {
display:none;
}
.recommend dl {
clear:both;
float:none;
width:100% !important;
}
.recommend dl dt{
width:45% !important;
}
.recommend dl dd{
width:54% !important;
}
.productsbox dl, .relationbox dl {
clear:both;
width:100%;
}
.productsbox dl dt, .relationbox dl dt{
float:none;
width:98%;
text-align:center;
}

.productsbox dl dt a{
display:block;
float:left;
width:48%;
padding:3px;
}
.relationbox dl dt a {
width: 98%;
}
.relationbox dl dt a img {
width:100%;
}

.reccomendPict {
width:100%;
height:auto;
}
.productsbox dl dd, .relationbox dl dd {
float:none;
width:98%;
}
.productsbox dl ul li .typelink, .relationbox dl ul li .typelink {
width:200px !important;
color:#F0DF0F;
}
#detailbox {
clear:both;
width:98%;
}
#topBlk .picsbox {
width:100%;
}
#topBlk .productPics {
clear:both !important;
float:none !important;
display:block;
float:none;
width:95%;
margin:1em auto;
text-align:center;
}
#topBlk .prdPic {
width:292px;
height:223px;
}
#topBlk form {
display:inline;
}
#topBlk .prdtype, #topBlk .prdOption {
clear:both;
text-align:left;
margin:0 !important;
width:100%;
}
#topBlk .datalist {
float:none;
width:90%;
margin:0;
}
#topBlk .spprice {
width:100%;
text-indent:0;
text-align:left;
margin-left:0;
}
.picsbox form .typelink {
width:50%;
text-align:left;
font-size:110%;
}
#topBlk .notes {
text-align:left;
width:95%;
}
.howtobox dl {
width:96%;
}
.howtobox dt img {
width:99% !important;
height:auto;
}
.voicebox dl dt {
clear:both;
float:none;
width:98%;
}
.voicebox dl dd {
clear:both;
float:none;
width:98%;
}
#FormBox {
width:98%;
}
.tbl {
float:none;
width:98% !important;
}
.tblTr {
clear:both;
float:none;
width:100% !important;
display:block;
}
.tblTh {
clear:both;
float:none;
width:100% !important;
display:block;
}
.tblTd {
clear:both;
float:none;
width:100% !important;
display:block;
}
.inpfit {
width:90% !important;
}
#InquiryForm button {
font-size:110%;
width: 95% !important;
float:none !important;
margin:0.5em auto !important;
}
#InquiryMethod button {
font-size:110%;
width: 95% !important;
float:none !important;
margin:0.5em auto!important;
}
.ybmbox {
clear:both;
float:none;
width: 99% !important;
height:420px !important;
min-height:315px;
margin:0 0.5%;
}
.ybcbox {
display:none;
}
.tab-pane h3 span {
background-image:none !important;
padding:0 !important;
}
.tab span {
font-size: 60% !important;
}
.sphide {
display:none;
}
.scrollup {
display:none;
}
.blog_thumb{
width: 180px;
}
}
@media only screen and (max-width: 320px) {
.blog_thumb{
clear:both;
float:none;
text-align:center;
width:300px;
margin-left:auto;
margin-right:auto;
}
}