/*xxxxxxxxxxxx共通xxxxxxxxxxxxxxx*/
body{margin: 0px;width: 100%;background-color: #eee}
ul,li{list-style:none;margin: 0;padding:0}
.mincho {font-family: "游明朝", "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
.serif {font-family:  "Times New Roman", Times, serif, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝";}
.gothic {font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

    img {max-width: 1000px}


/*xxxxxxxxxxxxヘッドxxxxxxxxxxxxxxx*/
#head {border-top:solid 3px #d13e3c;
    border-bottom:solid 3px #d13e3c;
  /*  background-image: url("./img/bg.jpg");*/
    background-color:#fff;
  text-align:center;
}
#head img{max-height: 100px;height: auto}





/*xxxxxxxxxxxx画像見出しxxxxxxxxxxxxxxx*/
.oneimg {
    background-color:black;
    overflow:hidden;
    width: 100%;
    position: relative;
    text-align:center;
}
.oneimg img{
    width:100%;
    opacity: 0.7;
}
.oneimg .text{
	margin: 0;
	position: absolute;
	left: 50%;
	top: 45%;
    width: 100%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
    color: white;
    font-weight: 700;
    font-size: 3.2vw;
    color: #FFF;
    text-shadow: 
    0px 0px 15px #d13e3c,
    -0px 0px 15px #d13e3c,
    0px -0px 15px #d13e3c,
    -0px -0px 15px #d13e3c;
}


/*xxxxxxxxxxxx文章xxxxxxxxxxxxxxx*/

.headline{width:100%;
    border-bottom:solid 2px #d13e3c;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
}
.textarea{width:86%;
    padding:0.1% 7% 5% 7%;
    background-color:#eee;
    font-size: calc(112.5% + 4 * (100vw - 1200px) / 400);
    margin: 0 auto; 
}



/*xxxxxxxxxxxx画像複数xxxxxxxxxxxxxxx*/
.fourimg{
    background-color:black;
    overflow:hidden;
    position: relative;
    }

.fourimg img{
    width:100%;
    opacity: 0.5;
    margin-top: 0%;
    }

.fourimg ul li{
    overflow:hidden;
    float: left;
    width:33.3%;
    color:aliceblue;
    text-align:center;
    vertical-align: middle;
    font-size:1.4vw;
    padding-bottom: 1%;}

.fourimg img:hover{
    opacity: 1;
    -webkit-transition:0.5s ease;
    -webkit-transition-property:opacity,border,color,background;
    -moz-transition:0.5s ease;
    -moz-transition-property:opacity,border,color,background;
    -o-transition:0.5s ease;
    -o-transition-property:opacity,border,color,background;
    transition:0.5s ease;
    transition-property:opacity,border,color,background;
    transform: scale(1.2);
    -ms-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -moz-transform: scale(1.2);
    transition: all 0.1s ease-in-out 0s;
    -ms-transition: all 0.1s ease-in-out 0s;
    -webkit-transition: all 0.1s ease-in-out 0s;
    -o-transition: all 0.1s ease-in-out 0s;
    -moz-transition: all 0.1s ease-in-out 0s;
}


/*xxxxxxxxxxxxスペックテーブルxxxxxxxxxxxxxxx*/
table {font-size:1.5vw;border: 1px solid #000;width: 100%;}
th { text-align:left; vertical-align:top; background-color:#444; padding:0px 5px; font-weight:500; color:#FFF; }
td { padding-left:5px; }

.btn { text-align:center; margin:20px auto;}
.btn > a span { padding:5px 20px; border:solid 2px #000;; }
.btn a:hover { color:#d13e3c; }
.btn a:hover span { border:solid 2px #d13e3c; }

a { color:#000; }
a:visited { color:#d13e3c; }

/*在庫検索*/
table.zaiko{font-size:1.5vw;border: 0px solid #000;width: 80%; padding-top: 10px; padding-left:20%;}
table.zaiko tr{text-align:center}
table.zaiko img{border: solid 1px #000;max-height:68px; }


/*xxxxxxxxxxxxxxxyoutubxxxxxxxxxxxx*/
.youtubox{
    background-color:black;
    margin-top: 20px;
    width: 100%;
}
.youtubeleft{
    width:33%;
    float:left;

    }
.youtubeleft img{
    Width:100%;
    position: relative;
    margin-top:26%;
    }
.youtuberight{
    width:67%
    }

/*Youtubeレスポンシブ*/
.youtube {
  position: relative;
  padding-bottom: 50%;
  padding-top: 0%;
  height: 0;
  overflow: hidden;
}
.youtube iframe {
  position: absolute;
  top: 0%;
  right: 0%;
  width: 100%;
  height: 100%;
}

.youtube2 {
  position: relative;
  padding-bottom: 55%;
  padding-top: 0%;
  height: 0;
  overflow: hidden;
}
.youtube2 iframe {
  position: absolute;
  top: 0%;
  right: 0%;
  width: 100%;
  height: 100%;
}


/*xxxxxxxxxxxxxxxxサウンド説明xxxxxxxxxxxxxx*/
div.sound{
background-color: #555555;
color:aliceblue;
padding: 10px;
}

div.soundname{font-size:150%; }
div.soundexp{margin-top: 5px;}
div.sound img{width:30%;top:0;}
div.inclimg{width: 70%;float: left;}


/*******アンプ周辺の画像のとか*********/
.ampimg{width:100%;margin-top:30px;background-color: #000000;}
.ampimg div{
    float:left;
    width:21%;
    margin: 2%;
    overflow: hidden;
    background-color: #000000;}
.ampimg img{width: 100%;}
.ampset{font-size:150%;background-color: #555555;
color:aliceblue;
padding: 10px;margin-bottom:30px;}

.effimg{width:100%;background-color: #555555;}
.effimg div{
    float:left;
    width:21%;
    margin: 2%;
    overflow: hidden;
 }
.effimg img{width: 100%;}
.effset{font-size:150%;background-color: #555555;
color:aliceblue;
padding: 10px;margin-bottom:30px;}


/*単に画像*/
div.yimg{width:100%;margin-top: 20px;}
div.yimg img{width:100%;}

/*xxxxxxxxxxxxフッターxxxxxxxxxxxxxxx*/
.footer { width:100%; background-color:#000; color:#FFF; font-size:0.5rem; line-height:2.0em; text-align:center; }


/*インタビュー*/
div.asami{color:#c13a39}
div.jino{color: #090808}
div.asami,div.jino{padding-top:20px }
div.kakoi{padding: 10px;border: solid 1px #000;margin-top: 20px;}
div.kakoi div{width:100%;
    text-align: center;
   font-size: 3.2vw;
}
.kakoi span{border-bottom:solid 2px #d13e3c;}
.kakoi a{text-decoration: none;}
.kakoi a:link,.kakoi a:visited,.kakoi a:active{ color: #000; } 
.kakoi a:hover{ color: #d13e3c; } 


/*youtubeW*/
.double{width:100%}
.double .right,.double .left{width:49.5%;float: left;}
.double .right img,.double .left img{width:100%}
.double .left{padding-right: 1%;padding-bottom:1%}

.double .youtube {
position: relative;
width: 100%;
height: 100%;
}
.double .youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

/*xxxxxxxxxxxxちっちぇー画面xxxxxxxxxxxxxxx*/
@media screen and (max-width: 1000px) {
body::before{
 background: url("../img/DSC_0099.jpg");
 background-position: center center;
 background-repeat: no-repeat;
 background-size: cover;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 /*background-attachment: fixed;*/
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 padding: 10% 0;
 content: "";
 z-index: -1;
}
.back p{height:20px;background-color: rgba(51,51,51,0.5);width: 100%;margin: 0;padding: 10;}
}

/*xxxxxxxxxxxxでかい画面xxxxxxxxxxxxxxx*/

@media screen and (min-width: 1000px) {
.back{
	height:5vw;
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	z-index: 1;
}
.back p{background-color: rgba(51,51,51,0.5);width: 100%;height:100%;margin: 0;padding: 0;}
.bgimg1{background-image: url("../img/DSC_0099.jpg")}
.bgimg2{background-image: url("../img/DSC_0089.jpg")}
.bgimg3{background-image: url("../img/DSC_0094.jpg")}
    
div.kakoi div{font-size: 30px;}
    .textarea{max-width: 860px;font-size: 18px;}
    .headline{font-size: 30px}
    .oneimg .text{font-size: 40px}
    .oneimg{height:400px}
    table {font-size:14px;border: 1px solid #000;width: 100%;}
}