/*-------------------------------------------
NEW 除雪機 （2025/07/07）
-------------------------------------------*/


.preban{ position: absolute;margin-top: -90px; left: 10px}
  
  .joban{ max-width: 100%; margin: auto; text-align:left;  padding-left: 50px;border: solid 0px #444;
          background-color: #000; }
  .jobanin { max-width: 400px; margin: auto; text-align: center; padding: 8px 40px; margin: 2px 1px ;
          display: inline-block;background-color:rgba(255, 255, 255, 0.00) ;border: solid 0px #444 }
a .jobanin{ color: #fff}
a :hover{ color: #f2849e}

@media (max-width:503px){
  .newco, .newhs{ font-size: 1.8rem;font-weight: 700}
}

@media (max-width:375px){
  .jobanin{ padding: 8px 20px;}
  .joban{ padding-left: 30px;}
  .newco, .newhs{ font-size: 1.5rem;font-weight: 700}
}


  .syosi{ text-align: left;font-family: 'BIZ UDPGothic';font-weight: 600;font-size: 1.3rem;}
    .newhi{ font-size: 2.8rem;font-weight: 700}
    .newco{ color: #f00}
    .newhs{ color: #0026ff}
    .newma{ margin-top: 80px;margin-bottom: 20px}.newski{ margin-top: 30px}
    .zkomi{ font-size: 0.9rem;}.txri{ text-align: right;padding-right: 15px}
    .clsog{ margin-top: 70px;border: solid 1px #cecece} .sog{ color: #c4a71d}
    .newss{ margin-bottom: 120px}
  .mnbdy{ max-width: 980px; margin: auto; text-align: center; border: solid 0px #444} 
  
  .mnbdLin{  max-width: 920px; margin: auto;  margin-top: 0px;text-align: center;
            border: solid; border-width:0  0 1px 0 ;border-color: rgba(207, 207, 207, 0.30)}

  .mnbdin{  max-width: 920px; margin: auto;  margin-top: 0px;text-align: center;
            border: solid; border-width:1px 0 1px 0 ;border-color:rgba(207, 207, 207, 0.30)}
  
  .infom{ width:100%; margin: auto; position: absolute;left: 3px;font-size: 0.8rem;margin-top:-52px  
          ;border: solid 0px #444}


.undertxt{ max-width: 100%; margin: auto;margin-top: 150px;padding: 10px;border: solid 1px rgba(0, 0, 0, 0.10)}
.derback{ font-size: 1.1rem;font-weight: 500;}






.undsp{ margin-bottom: 30px;padding: 40px}
/*-------------------------------------------
 以下 本体 核Text
-------------------------------------------*/


html {
  font-size: 100%;
}
body {margin:0;padding:0;
  color: #2b2a27;
  font-family: 游ゴシック ,"Arial", "Hiragino Sans", "Meiryo", sans-serif;
}
img {
  max-width: 100%;
}
ul {
  list-style: none;
}
a {
  color: #2b2a27;
}

/*-------------------------------------------
Head Txt
  
        display: block;
        position: fixed;
        top: 5px;
        left: 0;
        line-height: 1.88;
        border: solid 0px #444;
        background-color: rgba(83, 112, 158, 0.29);
        z-index: -2}

-------------------------------------------*/

#head {background: url(img/plate-honda.png) no-repeat fixed ;background-size:cover;
       height:120px; text-align: center;padding-top:100px;  margin-bottom: 1px;color:white;
       font-family:'Meiryo',"Open sans", Helvetica, Arial; font-weight:300; 
}

.pban{ 
 display: block;
 position: fixed;
 top: 2px;left: 3px;
 z-index: 5;       
}

.txtday, .infoshop, .menlin{ border: solid 0px #555}

.headmain{ max-width: 1000%; margin-top: 0px;text-align: center  }



.txtday {
  max-width: 1000px;
  margin: auto; margin-top: -30px;
  padding-left: 8px;
  font-size: 1.5rem;font-family: 'BIZ UDPGothic';
  text-align: left;
  color: #FFF;
  display: block;
  position: relative;
}
.infoshop {
  max-width: 1100px;
  margin: auto;
  font-size: 3.0rem;
  font-weight: 700;
  color: #FFF;
  display: block;
  position: relative;
  top: 20px;
  z-index: 5;  
}
.hodacl{ color: #f00}
@media (max-width:349px){
  .infoshop{ font-size: 2.2rem;}
}

/*
「width: 100%;」と「height: 100vh;」で全画面表示にする。
「object-fit: cover;」でトリミングを行い、「object-position: center top;」で
横は中央、縦をトップに配置する。
*/
.mainplex {
  max-width: 100%;
  margin: auto;
  height: auto;
}

head {
background: url(img/plate-honda.png)  no-repeat fixed ;background-size:cover;}

/*-------------------------------------------
Text
-------------------------------------------*/
.fontin{ font-size:3rem ;color:#FFF;text-align:center}


.centxt{max-width:100%; height:89px ;padding: 23px;margin: auto; text-align: center;
        color: #FFF;background-color: #000 ;border: solid 0px #777}



.text {
  text-align: center;
  margin-bottom: 80px;
}
.text .site-title {
  margin-bottom: 20px;
}
/*
「display: inline-block;」でaタグに幅と高さを持たせる。
paddingでボタンのサイズを調整。
*/
.text .btn {
  display: inline-block;
  border: solid 1px #2b2a27;
  font-size: 1.2rem;
  padding: 18px 60px;
  text-decoration: none;
}

/*-------------------------------------------
Image
-------------------------------------------*/
.flex {border:solid 0px #fff;margin:0;padding:0;
  display: flex;
  margin-bottom: 0px;
}
/*
「calc(100%/3);」で、widthの値が3等分になるよう計算する。
※「calc」は、割り切れない数で均等に配置したい場合などに便利。
*/
.flex li {
  width: calc(100%/3);
  margin:0px;
}
/*
「object-fit: cover;」で、高さを固定したまま
画面幅に合わせて画像を伸縮させることができる。
（※IEでは正しく動作しないため注意が必要）
「vertical-align: bottom;」で画像の下にできる隙間を消す。
*/
.flex li img {
 width: 100%;
  height: 500px;
  object-fit: cover;
  vertical-align: bottom;
}
.imgspers{ border: solid;border-width: 0px ;border-color:#FFF}

@media screen and (max-width: 834px) {
  /*
  「flex-direction: column;」で縦並びにする
  */
  .flex {
    flex-direction: column; 
  }
  .flex li {
    width: 100%;
  }
}


/*-------------------------------------------
Footer
-------------------------------------------*/
/*
#footer {
  font-size: 0.75rem;
  padding: 20px;
  text-align: center;
}

リンクはul、liタグで記述
SNSのリンク集という、一つの意味をもったリスト群になるので、ul、liタグでグルーピング
※リストタグを使用しなくても問題ないが、使用した方が検索エンジンに対して
より適切に意味を伝えることができると考えリストタグを選択しています。

#footer .sns {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}
#footer .sns li {
  margin: 0 10px;
}
 */
/*-------------------------------------------
SP
-------------------------------------------*/