@charset "UTF-8";

a{
  text-decoration: none;
}

#sp{
width:420px;
  margin: 0;
  padding: 0;
  font: 13px/1.4  "ヒラギノ角ゴ Pro W3" , "ＭＳ Ｐゴシック" , "Hiragino Kaku Gothic Pro" , "MS PGothic" , sans-serif;
  -webkit-text-size-adjust: none;
}

#sp-main{
border:0;
margin-left:0;
margin-right:10px;
}

#sp-header{
background-image:url(bg_1Sa_01.png);
width:max;
height:104px;
float:left;
}

.sp-headerlogo img{
  margin:10px;
  width: 280px;
  height: 86px;
}

.container{
width:420px;
}

.container h1{
margin:0;
width:100%;
height:80px;
  display: grid;  /*この２行で上下左右中央寄せ*/
  place-items: center;
font-size:30px;
font-weight:bold;
text-shadow:2px 2px 3px silver;
-webkit-text-stroke: 1px #FFF;
background-image:linear-gradient(to right,#f83600 0%,#f9d423 100%);
}

/* 
hamburger(ハンバーガーアイコン)
=================================== */
.hamburger {
  position: absolute;
  right: 25px;
  top: 25px;
  width: 44px;
  height: 44px;
  cursor: pointer;
  z-index: 300;
}

.hamburger__line {
  position: absolute;
  width: 40px;
  height: 3px;
  right: 0;
  background-color: #000;
  transition: all 0.5s;
}

.hamburger__line--1 {
  top: 1px;
}

.hamburger__line--2 {
  top: 18px;
}

.hamburger__line--3 {
  top: 36px;
}

/*ハンバーガーがクリックされたら*/
.open .hamburger__line--1 {
  transform: rotate(-45deg);
  top: 11px;
}

.open .hamburger__line--2 {
  opacity: 0;
}

.open .hamburger__line--3 {
  transform: rotate(45deg);
  top: 11px;
}

/* 
sp2-nav(ナビ)
=================================== */
.sp2-nav {
  position: fixed;
  right: -100%; /*ハンバーガーがクリックされる前はWindow右側に隠す*/
  top: 0;
  width: 50%; /*出てくるスライドメニューの幅 */
  height: 100vh;
  background-color: #fff;
  transition: all 0.5s;
  z-index: 200;
font-size:18px;
  overflow-y: auto; /*メニューが多くなったらスクロールできるように*/
}

/*ハンバーガーがクリックされたら右からスライド*/
.open .sp2-nav {
  right: 0;
}


/* 
black-bg(ハンバーガーメニュー解除用bg)
=================================== */
.black-bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 5;
  background-color: #000;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s;
  cursor: pointer;
  z-index: 100;
}

/*ハンバーガーメニューが開いたら表示*/
.open .black-bg {
  opacity: 0.3;
  visibility: visible;
}

/--------------*ハンバーガーここまで*-----------------/

.sp2-nav ul{
font-size:16px;
}

.sp-inner img{
width:100%;
height:100%;
}

.sp-nav{
font-size:16px;
text-align:left;
}

.sp-nav img{
width:300px;
height:160px;
}

.sp-menu{
width:400px;
text-align:left;
margin-top:20px;
margin-left:10px;
margin-bottom:50px;
}

.sp-menutext{
width:350px;
font-size:16px;
text-align:left;
margin-bottom:70px;
text-indent:0;
}

.sp-contentstext{
width:350px;
font-size:16px;
text-align:left;
margin-left:10px;
margin-bottom:70px;
text-indent:0;
}

.sp-contentstext img{
width:105px;
height:25px;

}

.sp-kozotext{
width:350px;
font-size:16px;
text-align:left;
}

.sp-menutext span.white{
color:#FFF;
}

.sp-menutext img{
width:22px;
height:16px;
}


.sp-nav h3{
background-image:url(top_indexBg_1Sa.png);
height:30px;
margin-bottom:10px;
padding-left:20px;
text-align:left;
}

.sp-nav ul{
width:350px;
margin-bottom:6px;
padding:0;
list-style:none;
text-align:left;
}

.sp-c-index h3{
}

.sp-section{
overflow:hidden;
text-align:center;
}

.sp-section img{
width:300px;
height:40px;
}

.sp-hyou{
width:380px;
text-align:left;
margin-left:20px;
}

.sp-hyou img{
width:300px;
height:210px;
}

/*製品ページ*/
.sp-product-banner{
width:420px;
height:125px;
}

.sp-product-banner img{
width:135px;
height:61px;
float:left;
}

.sp-option-banner{
margin-bottom:50px;
}

.sp-option-banner img{
width:135px;
height:61px;
float:left;
}

/*事例ページ*/
.sp-zireitext{
width:350px;
font-size:16px;
text-align:left;
margin-left:30px;
}

.sp-zireitext img{
width:22px;
height:16px;
}

.zirei1{
width:300px;
margin:auto;
}

.zirei1 p{
padding-left:20px;
text-align:left;
margin-bottom:50px;
}

.zirei1 img{
width:200px;
height:200px;
text-align:center;
}

/*技術情報ページ*/
.sp-technicaltext{
width:400px;
font-size:16px;
text-align:left;
margin-left:20px;
margin-bottom:20px;
}

/*問い合わせページ*/
#hpb-main table{
    margin: 0 10px 10px 10px;
    border-collapse: collapse;
    border-width: 1px;
    border-color: #dac996;
    border-style: solid;
}

#hpb-main th{
    font-weight: normal;
    background-color: #fff6db;
    text-align: left;
    padding: 4px 6px;
    border-collapse: collapse;
    border-width: 1px;
    border-color: #dac996;
    border-style: solid;
}

#hpb-main td{
    text-align: left;
    background-color: #fff;
    padding: 4px 6px;
    border-collapse: collapse;
    border-width: 1px;
    border-color: #dac996;
    border-style: solid;
}

/*特定商取引法による記述*/
.lawlist dt{
float: left;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
    text-align: left;
    line-height: 16px;
    min-height: 16px;
    font-weight: bold;
    width: 85px;
    padding-top: 10px;
    padding-right: 0;
    padding-bottom: 10px;
    padding-left: 25px;
    background-image: url(linklogo.png);
    background-position: 1px 10px;
    background-repeat: no-repeat;
    color: #252525;
}

.lawlist dd{
margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
    padding-top: 10px;
    padding-right: 15px;
    padding-bottom: 10px;
    padding-left: 130px;
    text-align: left;
    line-height: 16px;
    min-height: 16px;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #DDDDDD;
}

/*フッターメニュー*/

#sp-footer{
background-image:url(bg_1Sa_01.png);
text-align:center;
margin-bottom:100px;
}

#sp-footer > img {
width:100vw;
height:auto;
float:left;
}

#sp-footernav{
text-align:center;
}

#sp-footernav ul{
list-style:none;
margin-bottom:0;
padding:0;
}

#sp-footernav ul li{
display:inline;
padding-top:10px;
padding-left:3px;
padding-right:3px;
}

#sp-footernav ul li#home a{
  width: 50px;
  background-image: url(button_home_00_15.png);
  background-position: left center;
  background-repeat: no-repeat;
}

#sp-footernav ul li#home a span.ja{
display:none;
}

#sp-footernav ul li a{
    display: inline-block;
    color: #52310b;
    height: 30px;
    text-decoration: none;
    line-height: 30px;
    text-align: left;
    padding-left: 31px;
    text-shadow: 1px 1px 1px #fff;
    margin-bottom: 4px;
    text-transform: uppercase;
}

#sp-footer-ex1{
padding-bottom:4px;
}

#sp-footer-ex1 ul{
list-style: none;
    padding-left: 7px;
    margin-top: 4px;
    margin-bottom: 0px;
}

#sp-footerExtra1{
text-align:left;
}

#sp-footerExtra1 ul li {
    display: inline;
    line-height: 2.2;

}

#sp-footerExtra1 ul li a {
    background-image: url(arrow_00_15.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 11px;
    padding-right: 6px;
    color: #993300;
}