/** Shopify CDN: Minification failed

Line 225:40 Expected ":"
Line 943:0 Unexpected "{"
Line 1562:70 Expected ":"
Line 1914:37 Unexpected "-->"
Line 2019:24 Expected ":"
Line 2019:26 Expected identifier but found "20px"
Line 2024:22 "text-algin" is not a known CSS property
Line 2282:22 "fong-weight" is not a known CSS property
Line 2814:25 Expected ":"
Line 2814:27 Expected identifier but found "1em"
... and 3 more hidden warnings

**/
@charset "UTF-8";

/* @import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap); */
/* CSS Document */

/* 共通 */

.content-inner{
    max-width: 1090px;
    margin: 0 auto;
    padding: 0 20px;
  }

.section-lp-txtarea{
  padding: 80px 0;
  padding: 0 100px;
  }



.youtube-size {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
}

.youtube-size iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}



.leaf {margin-top: -150px;
	width: 15%;
	float: right;
}


.clear_float {
    clear:  both;
}

.haikei-all {background-color: #fff;
}

.haikei-blk {background-color: #000;
}


.cb {clear: both;}

/* 共通スマホ 750px以下(小画面）*/
@media (max-width: 750px) {
.section-lp-txtarea{
  padding: 80px 10px;
  }

.content-inner{
    padding: 0 10px;
  }
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}

/* 1PC */

.pc1-maker {margin: 100px 0 10px 0;
           }
/*4つ並びボタンCSSコード*/
.pc1-top-btn{
	display: flex;
	flex-wrap:wrap;
}
.pc1-top-btn li {
	width: calc(100%/4);/*3つ並べる場合*/
	padding:3px 2px;/*左右に余白を入れる場合*/
	box-sizing:border-box;
}
.pc1-top-btn li img {
	max-width:100%; /*はみだしを防ぐ*/
	height: auto; /*縦横比を維持 */
}

.pc1-top-banner{
    display: flex;
    flex-wrap:wrap;
}
.pc1-top-banner li {
    width: calc(100%/4);/*←画像を横に4つ並べる場合*/
    padding:0 5px;/*←画像の左右に5pxの余白を入れる場合*/
    box-sizing:border-box;
}
.pc1-top-banner li img {
    max-width:100%; /*画像のはみだしを防ぐ*/
    height: auto; /*画像の縦横比を維持 */
}

/* 会員登録について */
.member-pc {
      float: left;
      width: 55%;
      background: #FFF;/*背景色*/
      margin-left: 20px;
}

.member-sp {
      float: right;
      width: 39%;
      background: #FFF;/*背景色*/
      
}

.member-title-orn {
        background: #D03521;/*背景色*/
        padding: 0.3em;/*文字まわり（上下左右）の余白*/
        color: #fff;
        font-size: 30px;
        font-weight: 800;
       
        margin-top: 3em;
        text-shadow: 1px 2px 3px #D03521;
}

.member-title-orntxt {
        color: #D03521;
        font-size: 20px;
        font-weight: 800;
        margin-bottom: 100px;
}

.member-tokuten-setsumei2 {font-size: 20px;
             font-weight: 400;
             text-align: left;
             border-top: solid 4px #D03521;  /*下線の大きさと色*/
             margin-bottom: 70px;
　　　　　　　padding-top: 30px;
} 

.member-tokuten-r {float: right;
            width: 85%;
            font-weight: 800;
            font-size: 30px;
            text-align: left;
            padding: 10px 0 10px 0 ;/*文字まわり（上下左右）の余白*/
                   
}

.member-tokuten-set {width:80%;
             margin: 0 auto 200px auto;           
}


.member-title4 {font-size: 20px;
         text-align: left;
         color: #D03521;
         font-weight: 900; 
                margin-left: 20px;
}

.member-tejun-txt {float: right;
            width: 40%;
            font-size: 18px;
            text-align: left;
            color: #545454;
            font-weight: 500;           
}

.member-tejun-txt2 {
            margin:20px 20px;
            font-size: 18px;
            text-align: left;
            color: #545454;
            font-weight: 500;           
}

.member-title-houhou {
        background: #545454;/*背景色*/
        padding: 0.5em;/*文字まわり（上下左右）の余白*/
        color: #fff;
        font-size: 23px;
        font-weight: 800;
        }

.member-tejun-img {width: 60%;
                   margin: 0 auto;
}

.member-tejunleft-img {float:left;
                       width: 55%;
                       margin-left: 20px;
}

.member-suuji {background: #D03521;/*背景色*/
        padding: 0.5em 1em;/*文字まわり（上下左右）の余白*/
        color: #fff;
        font-size: 20px;
        font-weight: 900;
        margin-right: 1em;  　　　　
}

.member-suuji-maru {
            color: #D03521;
            font-weight: 900;
            font-size: 18px;           
}





/* 750px以下(スマホ）*/
@media (max-width: 750px) {
.member-pc {
      float: none;
      width: 90%;
      margin: 10px 20px 50px 20px;
      clear: both;
      }

.member-sp {
      float: none;
      width: 90%;
      margin: 10px 20px;
      }
  
.member-title-orntxt {
        font-size: 15px;
        font-weight: 800;
        margin-top: 5px;
}

.member-title-orn {
        margin-top: 0px;
}

.member-tokuten-setsumei2 {font-size: 15px; 
                         padding-top: 10px;
} 

.member-tokuten-r {float: none;
            width: 100%;
            font-size: 20px;
            text-align: center;
            padding: 10px 0 5px 0 ;/*文字まわり（上下左右）の余白*/
}

.member-tokuten-set {width:95%;
             margin: 0 auto 100px auto;
}

  .member-title4 {font-size: 20px;
                  margin: 0 20px;
        }

  
.member-tejun-txt {float: none;
            width: 90%;
            margin: 0 auto;
            font-size: 18px;
            }

  .member-tejun-img {float: none;
            width: 80%;
            margin: 0 auto;
            margin-bottom: 10px;
}

  .member-tejunleft-img {float: none;
            width: 90%;
            margin: 0 auto;
            margin-bottom: 10px;
}

  .member-suuji {font-size: 20px;       
}

.member-line {border-bottom: 3px dotted #2b2b2b;
              margin: 40px 20px 40px 20px;
            
             }




}

/* ウッド調 */
.nenrin-gara {background-image: url("http://hotfield.sakura.ne.jp/shopify/wood/wa-shiro.png");
padding-top: -100px;
padding-bottom: 5px;}


.haikei-ki {background-image:url("http://hotfield.sakura.ne.jp/shopify/wood/w-haikei.jpg");
}

.img-size {
width: 100%;
height: auto;
margin-bottom: -200px;
}

.top-txt {font-family: 'Noto Sans JP', sans-serif;
　　　　　　font-size: 20px;
         color: #724C00;
	text-shadow    : 
       5px  5px 6px #ffffff,
      -5px  5px 6px #ffffff,
       5px -5px 6px #ffffff,
      -5px -5px 6px #ffffff,
       5px  0px 6px #ffffff,
       0px  5px 6px #ffffff,
      -5px  0px 6px #ffffff,
       0px -5px 6px #ffffff;        /* 文字の影 */
          background-image: url("http://hotfield.sakura.ne.jp/shopify/wood/wa-shiro.png");
padding: 200px 30px 80px 30px;
	margin:-260px 0 50px 0;
	line-height: 2;
	font-weight: 500;
}



.mat-colorbox {float: left;
	width: 39%;
}

.mat-color-title img {
            width: 95%;
	
           }

.mat-color-txt {font-size: 14px;
	font-family: 'Noto Sans JP', sans-serif;
	color: #FFF;
	text-align: left;
	margin: 20px -20px 20px 0;
	padding: 30px 25px;
	font-weight: 500;
	line-height: 1.8;
	background-image: url("http://hotfield.sakura.ne.jp/shopify/wood/w_dw.png");
		}

.mat-color-txtnw {font-size: 14px;
	font-family: 'Noto Sans JP', sans-serif;
	color: #FFF;
	text-align: left;
	margin: 20px -20px 20px 0;
	padding: 30px 25px;
	font-weight: 500;
	line-height: 1.8;
	background-image: url("http://hotfield.sakura.ne.jp/shopify/wood/w_nw.png");
		}

.mat-color-txtww {font-size: 14px;
	font-family: 'Noto Sans JP', sans-serif;
	color: #000;
	text-align: left;
	margin: 20px -20px 20px 0;
	padding: 30px 25px;
	font-weight: 500;
	line-height: 1.8;
	background-image: url("http://hotfield.sakura.ne.jp/shopify/wood/w_ww.png");
		}


.mat-color img {float: right;
                width: 60%;
}

.boxchui {
    width: 90%;
	margin: 2em 0;
    background: #3C4100;
	text-align: center;
	margin: 0 auto;
}
.boxchui .box-title {
    font-size: 20px;
    background: #1F2100;
    padding: 4px;
    text-align: center;
    color: #FCED34;
    font-weight: 600;
    letter-spacing: 0.05em;
}
.boxchui p {
    padding: 15px 40px;
	font-size: 14px;
    margin: 0;
	color: #FCED34;
	font-weight: 400;
}

.boxline {
    border-bottom: solid;
    border-width: 1px;
    border-color: #FCED34
}

.ao {color: blue;
	font-size: 100px;
}
.box29 {
    border: solid 2px #3c4100;
    background: #fff;
}
.box29 .box-title {
    font-size: 2em;
    background: #3c4100;
    padding: 4px;
    text-align: center;
    color: #fced34;
    font-weight: 900;
    letter-spacing: 0.05em;
}
.box29 p {
    padding: 5px 20px;
    margin: 0;
　　font-size: 2em;
   font-weight: bold;
   color: #3c4100;
}

/* 900px以下*/
@media (max-width: 900px) {
.mat-color-txt  {font-size:11px;
	 padding: 20px 30px;
	 line-height: 1.7;
	 margin-top: -2px;
 }
	
.mat-color-txtnw  {font-size:11px;
	 padding: 20px 30px;
	 line-height: 1.7;
 }
	
.mat-color-txtww  {font-size:11px;
	 padding: 20px 30px;
	 line-height: 1.7;
 }	
	
.kenpin-img img {float:none;
	width: 100%;
}
	
	.kenpin-txt {float:none;
	 width: 100%;
	 margin-bottom: -50px;
	}
}

/* 677px以下(スマホ）*/
@media (max-width: 677px) {
.section-lp-txtarea{
  padding: 30px 40px;
  }
  
  .section-lp-txtarea2{
  padding: 5px 0px;
  }
	
.top-txt {font-size: 11px;
		margin: 30px 0 10px 0;
        line-height: 18px;
	}
	
.nenrin-gara {padding-top: -10px;
padding-bottom: -11px;}
  
 .leaf {margin-top: -150px;
	width: 30%;
	float: right;
}
	
.mat-colorbox{float: none;
	width: 100%;
	}
	
.mat-color-txt  {font-size:12px;
	 padding: 20px 30px;
	 line-height: 1.7;
	 margin-top: -2px;
     width: 100%;
     font-weight: 600;
 }
	
.mat-color-txtnw  {font-size:12px;
	 padding: 20px 30px;
    margin-top: -5px;
	 line-height: 1.7;
     width: 100%;
    font-weight: 600;
 }
	
.mat-color-txtww  {font-size:12px;
	 padding: 20px 30px;
    margin-top: -5px;
	 line-height: 1.7;
     width: 100%;
    font-weight: 600;
 }	
	
.mat-color {clear: none;
	
	width: 100%;
}
	
.mat-color-title img {
            text-align: left;
	width: 70%;
	
           }
	
.boxchui {font-size: 10px;
}

.boxchui .box-title {font-size: 15px;
	}
  
.boxchui p {
    padding: 15px 20px;
	font-size: 10px;
}
  
  .hinshitsu-top  {
  font-size: 20px;
 padding-bottom: -300px;
}
	
.hinshitsu-design {
  font-size: 20px;
  border-bottom: 3px dotted #724C00;
  text-shadow: 2px 2px #fff, 5px 5px #D6D1C8;
  font-weight: 700;
  padding-top: -30px;
}
	
.setsumei-sozai {font-size: 15px;
	            font-weight: 500;
	            margin-bottom: 10px;
	            margin-top: -20px;
}
	
.setsumei-sozaitxt {font-size: 10px;
}
	
.setsumei-sozaiimg  img{margin-top: -10px;
   
}
	
.setsumei-ura {float: none;
               width: 100%;
}

.setsumei-uraimg img {float: none;
                      width: 100%;
                      margin-top: 5px;
	                 }
	
.line {
	padding: 10px 0;
}
	
.setsumei-uratitle {font-size: 15px;
                color: #3C4100;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 500;
	            margin-top: -70px;
                text-align: left;
	}
	
.hinshitsu-mishin {
  font-size: 20px;
  margin-top:-20px;
}
	
.setsumei-mishin {font-size: 15px;
	            font-weight: 500;
	            margin-bottom: 10px;
               margin-top: -20px;
	}
	
.setsumei-mishintxt {font-size: 12px;
                
	            font-weight: 300;}
  
 .setsumei-mishinimg {
	margin-top: -80px;
    margin-bottom: -30px;
}
	
.syasyubetsu-title {
  font-size: 19px;
  border-bottom: 3px dotted #724C00;
  text-shadow: 2px 2px #fff, 5px 5px #D6D1C8;
  font-weight: 800;
  padding-top: 30px;
  padding-bottom: 15px;
  margin-bottom: -30px;
 text-align: center;	
}

.syasyubetsu-txt {font-size: 12px;
	            font-weight: 500;
}
	
.syasyubetsu {font-size: 14px;
}
	
.haikei-grn {background-color: #3C4100;
	        
}
	
.nouhau-img img {Width: 100%; 
                 margin-bottom: -400px;
}
	
.nouhau-title {
  font-size: 18px;
  font-weight: 700;
  padding-bottom:-100px;
}
	
.nouhau-txt {font-size: 13px;
	             margin-bottom: -200px;
		        padding-bottom: -200px;
}
	
.syasyubetsu-box {padding-bottom: 50px;
                           margin-bottom: -70px;
                           
                           
}
	
.haikeimoji-1 {background-size: 80%;
	          background-position: 10% 10%;}

.haikeimoji-2 {background-size: 80%;
	          background-position: 10% 5%;

}

.haikeimoji-3 {background-size: 100%;
	          background-position: 5% 0%;
              
}

	
.kenpin-txt {font-size: 12px;
                float:none;
                width: 100%;
	padding-top: 20px;
}
	
.kenpin-img img {float:none;
	width: 90%;
	margin: 10px 0 -60px 0;	
}
	
.kenpin-title {
  font-size: 20px;
  padding-top: 20px;
 text-align: left;	
}
  
.haikeimoji-4 {background-size:100%;
                    background-position:30px;
}
	
.oisogi-txt {font-size: 10px;
	margin-top: -20px;   
    text-align: left;
}
	
.tel-img img{margin-top: -10px;
	width: 100%;
    text-align: center;    
}  
  
.a[href^="tel:"]{
    pointer-events: none;
  }
}	

  
.a123　{
    font-family: 'Noto Sans JP', sans-serif;
}
 
 /* @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap'); */

  /* @import url(‘https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap’);  */




/* GENERAL */
.gene-color-txt {margin: 6rem 0 100px 0;}

.gene-color-img {margin: -100px 0 -50px 0;        
}

.gene-img-right {margin: 80px 0 -180px 0;
}

.gene-color-txtwave {margin: 100px 0 100px 0;
               }

.gene-point2 {width: 13%;
         float: left;
 }

.gene-point-box {margin: 1rem 0;
                }

.gene-voice-txt2 { font-size: 22px;
         color: #f48600;
         align: left;
         float: left;
         margin-top: 1%;
         margin-bottom: 10%;
}

.gene-voice {float: right;
        width: 78%;
        clear: both;
        margin-top: -1%;
        margin-bottom: 3%;      
}
.gene-voice2 {float: right;
        width: 78%;
        clear: both;
        margin-top: -7%;
        margin-bottom: 3%;
}
.gene-voice3 {margin: 3rem 0;
              clear: both;
}

.gene-voice-txt { font-size: 22px;
         color: #f48600;
         float: left;
         align: left;
         }



/* 吹き出し本体1 */
.gene-balloon1{
  position: relative;
  padding: 20px;
  border-radius: 10px;
  color: #CC6600;
  background-color: #FFEBCD;
  margin-left: 110px; 
  clear: both;          /* 左に余白を設ける */
}
/* 画像 - 絶対配置で左上に配置 */
.gene-balloon1 .gene-icon{
  position: absolute;
  left: -80px;
  top: 10px;
  width: 50%;
}
/* 三角アイコン */
.gene-balloon1::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -14px;
  top: 20px;
  border-right: 15px solid #FFEBCD;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

/* 吹き出し本体2 */
.gene-balloon2{
  position: relative;
  padding: 20px;
  border-radius: 10px;
  color: #CC6600;
  background-color: #FFEBCD;
  margin-right: 110px;          /* 右に余白を設ける */
}
/* 画像 - 絶対配置で右上に配置 */
.gene-balloon2 .gene-icon{
  margin: 0 0 0 auto;
  position: relative;
  top: 10;
  width: 50%;
}
/* 三角アイコン */
.gene-balloon2::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  right: -14px;
  top: 20px;
  border-left: 15px solid #FFEBCD;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

.gene-nouhau-txt2 { float: left;
               width: 40%;
               color: black;
               margin-bottom:20%;
              
}

.gene-nouhau-img2 {width: 58%;
              float: right;
}

.gene-moji1 {
  color: #f48600;/*文字色*/
  /*線の種類（点線）2px 線色*/
  border-bottom: dashed 1px #000; 
  width: 78%;
  float: right;
  margin-top: 2%;
  text-align: left;
}

.gene-moji2 {
  color: #000;/*文字色*/
  width: 78%;
  float: right;
  margin-top: 2%;
  text-align: left;
  margin-bottom: 4%;
}

.gene-moji3{
  color: #f48600;/*文字色*/  
  /*線の種類（点線）2px 線色*/
  border-bottom: dashed 1px #000;
  margin-bottom: 2%;
  width: 85%;
  float: right;
  font-size: 22px;
}

.gene-moji4 {
  color: #000;/*文字色*/ 
  width: 85%;
  float: right;
  font-weight: 300;
}

.gene-point {width: 15%;
        float: left;
        margin-top: 10px;
}

.gene-amikata1-txt {
     width: 78%;
     float: right;
     text-align: left;
     color: #000;
     margin-bottom: 2%;
}

.gene-tough {font-size: 20px;
            margin-bottom: 0.5em;
        float: right; 
        width: 78%;
        color: #000;
}

.gene-sbs {font-size: 20px;
           margin-bottom: 0.5em;
        float: none; 
        width: 100%;
        clear: both;
        color: #000;
}

.gene-grade-gold {
  position: relative;
  padding: 0.1em 0.5em;
  background: -webkit-linear-gradient(to right, rgb(221, 172, 17), transparent);
  background: linear-gradient(to right, rgb(221, 172, 17), transparent);
  color: #545454;
}

.gene-grade-gold2 {
  background: -moz-linear-gradient(left, #fff, #ddac11 30%, #805a17 60%, #e6b411 80% ,#fff);
  background: -webkit-linear-gradient(left, #fff, #ddac11 30%, #805a17 60%, #e6b411 80% ,#fff);
  background: linear-gradient(to right, #fff, #ddac11 30%, #F805a17 60%, #e6b411 80% ,#fff);
padding: 0.5em;
color: white;
font-size: 30px;
}

.gene-grade-gold3 {
  background: -moz-linear-gradient(left, #fff, #ddac11 30%, #805a17 60%, #e6b411 80% ,#fff);
  background: -webkit-linear-gradient(left, #fff, #ddac11 30%, #805a17 60%, #e6b411 80% ,#fff);
  background: linear-gradient(to right, #fff, #ddac11 30%, #F805a17 60%, #e6b411 80% ,#fff);
margin-bottom: 5%;
color: white;
font-size: 25px;
}




/* GENERAL 1000px以下(小画面）*/
@media (max-width: 1000px) {

{
}
}

/* GENERAL 780px以下(スマホ）*/
@media (max-width: 780px) {
.gene-color-txt{margin-top: 10em;
                   font-size: 15px;
}

.gene-color-txtwave {margin-top: 8em;
                   font-size: 15px;
}

  .gene-color-img {margin-bottom: -15%;         
}

  .gene-balloon1{ font-size: 15px;
}

.gene-balloon2{ font-size: 12px;
}

.gene-nouhau-txt2 {width: 100%;
              clear: both;
              float:none;
}

.gene-nouhau-img2 {width: 100%;
             higher: auto;
             margin-bottom: 5%; 
             clear: both;
}
.gene-voice {margin-top:10%;
        width: 100%;
        float: none;
        clear: both;
}

.gene-voice-txt2 {font-size: 15px; 
            margin-top: 1%;
}

.gene-voice2 {width: 100%;
         float: none;
         margin-bottom: 10%;
         clear: both;
}
  
.gene-voice3 {margin-top: -20%;
}

.gene-voice-txt {font-size: 18px; 
}

.gene-moji1 {
  width: 78%;
  float: right;
  font-size: 20px;
  font-weight: bold;
}

.gene-moji2 {
  width: 78%;
  float: right;
  font-size: 13px;  
}

.gene-moji3 {
  font-size: 15px;
  width: 83%;
  float: right;
 }

.gene-moji4 {
  font-size: 12px;
  width: 81%;
  float: right;
  text-align: left;
}

.gene-amikata1-txt {width: 100%;
               float: none;
               font-size: 12px;               
}

.gene-tough {font-size: 20px;
        float: none; 
        width: 100%;
        color: #000;
        clear: both;
}

.gene-grade-gold2 {margin-bottom: 5%;
              font-size: 20px;
}

.gene-grade-gold3 {margin-bottom: 8%;
             padding: 0.5em;
              font-size: 18px;
                  }
}

/* こだわりの品質 */

.moji {background-image:url("http://hotfield.sakura.ne.jp/shopify/wood/w-highquality.png")}

.hinshitsu-top  {
  font-size: 25px;
  font-weight: 700;
  color: #FFF;
  text-align: center;
  padding: 1rem 1rem;
  background-image:
    url("http://hotfield.sakura.ne.jp/shopify/wood/w_dw.png"); 
}

.hinshitsu-design {
  font-size: 30px;
  border-bottom: 3px dotted #724C00;
  color: #724C00;
  text-shadow: 2px 2px #fff, 5px 5px #D6D1C8;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  margin-top: 30px;
 text-align: center;	
}

.hinshitsu-mishin {
  font-size: 30px;
  border-bottom: 3px dotted #FFF;
  color: #FFF;
  text-shadow: 2px 2px #3C4100, 5px 5px #152400;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  margin-top: 30px;
 text-align: center;	
}

.setsumei-sozai {font-size: 22px;
                color: #3C4100;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 500;
	            margin-bottom: 10px;
                text-align: left;
}
  
.syasyubetsu {font-size: 22px;
                color: #3C4100;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 500;
	            margin-bottom: 10px;
}

.setsumei-sozaitxt {font-size: 18px;
                color: #724C00;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 400;
                text-align: left;
                }

.haikeimoji-1 {background-image:url(http://hotfield.sakura.ne.jp/shopify/wood/w-highquality.png);
background-repeat: no-repeat;}

.haikeimoji-2 {background-image:url(http://hotfield.sakura.ne.jp/shopify/wood/w-sewing.png);
background-repeat: no-repeat;

}

.haikeimoji-3 {background-image:url(http://hotfield.sakura.ne.jp/shopify/wood/w-onlyone.png);
background-repeat: no-repeat;
background-size: 90%;
background-position:10px;}

.haikeimoji-4 {background-image:url(http://hotfield.sakura.ne.jp/shopify/wood/w-packing.png);
background-repeat: no-repeat;
background-position:30px;}

.syasyubetsu-txt {font-size: 18px;
                color: #724C00;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 400;}

.setsumei-line {background: linear-gradient(transparent 70%, #FCED7E 70%);}

.setsumei-sozaiimg  img{margin-top: -40px;
	width: 100%;
}

.line {
	padding: 10px 0;
	border-width: 3px 0 0 0;
	border-style: dotted;
	border-color: #724C00;
}

.setsumei-uratitle {font-size: 22px;
                color: #3C4100;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 500;
	            margin-bottom: 10px;
                text-align: left;
}

.setsumei-ura {float: left;
               width: 41%;
}

.setsumei-uraimg img {float: right;
                      width: 58%;
}

.setsumei-urabox {background-image: url("http://hotfield.sakura.ne.jp/shopify/wood/w-mokume.png")
}

.haikei-grn {background-color: #3C4100;
	        padding: 20px 0;
}

.setsumei-mishinimg img {
	width:100%;
    margin-bottom: 20px;
}

.setsumei-mishintxt {font-size: 18px;
                color: #FFF;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 400;
                margin-bottom: 30px;
}

.setsumei-mishin {font-size: 22px;
                color: #FFF;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 500;
	            margin-bottom: 10px;
}

.syasyubetsu-box {background-image: url("http://hotfield.sakura.ne.jp/shopify/wood/wa-shiro.png");
padding-bottom: 60px;}

.syasyubetsu-title {
  font-size: 30px;
  border-bottom: 4px dotted #724C00;
  color: #724C00;
  text-shadow: 2px 2px #fff, 5px 5px #D6D1C8;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  padding-top: 50px;
 text-align: center;	
}

.nouhau-title {
  font-size: 25px;
  color: #724C00;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  padding-top: 50px;
  margin-top: -10px;
 text-align: center;	
}

.nouhau-img img {Width: 100%; 
                 margin-bottom: -500px;
                 margin-top: -10px;
}

.nouhau-box {padding: 10px;
}

.nouhau-txt {font-size: 18px;
                color: #724C00;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 400;
               padding-bottom: 300px;             
}

/* こだわりの品質 780px以下(スマホ）*/

.kodawari-title {
  width: 110%;
}

/* CSR活動*/
.csr-title {text-align: left;
            }

.csr-goal {margin: 100px 0 ; 
}

.csr-fullwidth-bggrn {
  width: 100%;
  background-color: #f7ffef ; /* ← お好きな色に変更OK */
  padding: 100px 0;
}

.csr-fullwidth-bgbrn {
  width: 100%;
  background-color:  #efe8dd ; /* ← お好きな色に変更OK */
  padding: 100px 0;
}
.csr-sdgsbox {
  display: flex;
  align-items: center;
  gap: 1em;
  flex-wrap: nowrap; /* 折り返しを防ぐ（※必要に応じて） */
}

.csr-sdgsbox-icon {
  flex: 0 0 20%; /* 幅20%で固定 */
  max-width: 20%;
}

.csr-sdgsbox-icon img {
  width: 100%;
  height: auto;
  display: block;
}

.csr-sdgsbox-txt {
  flex: 1; /* 残りを全部使う */
  min-width: 0; /* 長すぎる単語で折り返さないように */
  font-size: 2em;
  line-height: 1.6;
  font-family: 'Noto Serif JP', serif;
}

.csr-jusyo {text-align: center;
  font-size: 15px;
  line-height: 1.6;
  color: #80752a;
  
  margin: 1em 0;
           }

.csr-present-txt2 {text-align: center;
  font-size: 20px;
  line-height: 1.6;
  color: #333333;
  font-family: 'Noto Serif JP', serif;
  margin: 2em 0;
           }

.csr-torikumi-title {margin-top: 50px;
                    }

.csr-torikumi-txt {
width: 100%;
font-size:18px;
font-family: 'Noto Serif JP', serif;
margin-bottom: 50px;
}

.csr-stripe-bgorn {
  padding: 100px 0;
  background-image: repeating-linear-gradient(
    45deg,
    #fff9f3,         /* 薄いオレンジ（かなり白寄り） */
    #fff9f3 10px,
    #ffffff 10px,
    #ffffff 20px
  );
}

.csr-txt-wakuchin3 {
  background-color: #f37300;
  color: #ffffff;
  padding: 1em 1.5em;
  border-radius: 5px;
  font-size: 1em;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  line-height: 1.8;
  margin: -1em 0 1.5em 0;
}


.csr-rinksize{
width: 50%;
margin-left: auto;
margin-right: auto;
}

.csr-txt-wakuchin2{
    width: 100%;
    text-align: left;
    color: #f37300;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 20px;
   }

.csr-presenttree-section {
  padding: 2em 1em;
}

.csr-presenttree-title {
  background-color: #ced5bd;
  font-size: 1.5em;
  font-weight: bold;
  font-family: 'Noto Serif JP', serif;
  padding: 0.6em 1em;
  margin-bottom: 1em;
  line-height: 1.3;  /* 行間を狭く */
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.25em;
}

.csr-presenttree-main {
  white-space: nowrap;
}

.csr-presenttree-sub {
  white-space: nowrap;
}


.csr-presenttree-image {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 1.5em;
}

.csr-presenttree-image img {
  max-width: 100%;
  height: auto;
  border: 1px solid #ccc;
}

.csr-presenttree-text {
  text-align: left;
  line-height: 1.8;
  font-size: 1em;
  font-family: 'Noto Serif JP', serif;
}

.csr-presenttree-text p {
  margin-bottom: 1em;
}

.csr-present-txt {font-size: 1.5em;
  line-height: 1.8;
  color: #333;
  
  text-align: left;
  margin: 1.5em 0;
  box-sizing: border-box;
                  
                 }

/* 目的・場所・樹種の囲み装飾 */
.csr-presenttree-outlinebox {
  background-color: #f9f9f9;
  border: 1px solid #ddd;
  padding: 1em;
  margin-bottom: 1.5em;
  font-family: 'Noto Serif JP', serif;
  font-size: 1em;
  line-height: 1.6;
}

/* CSR活動 780px以下(スマホ）*/
@media (max-width: 780px) {
.csr-goal {
    margin: 50px 0;

  }

.csr-title {font-size: 16px;
            margin-bottom: 30px;
            }

.csr-fullwidth-bggrn {
  padding: 30px 0;
}
  
.csr-sdgsbox {width: 100%;        
             }

.csr-sdgsbox-icon {width: 30%;
                  }

.csr-sdgsbox-txt {font-size: 18px;
}

.csr-torikumi-title {margin-top: 10px;
                    }
  
.csr-torikumi-txt {
width: 100%;
font-size:14px;
font-family: 'Noto Serif JP', serif;
}

.csr-present-txt2 {font-size: 15px;
           }


.csr-rinksize{
width: 80%;
}

.csr-txt-wakuchin2{
    padding-top: 0px;
    font-size: 15px;
   }

.csr-txt-wakuchin3 {
  margin: -4em 0 1.5em 0;
}


.csr-jusyo {font-size:10px;}

.csr-presenttree-title {
   padding-left: 0.5em;
    padding-right: 0.5em;
    font-size: 1.4em;
}

.csr-presenttree-sub {
    display: block;   /* スマホでは改行して下に */
    margin-top: 0.2em;
  }

  
}
                
/* 発送について */

.hassou-img img{margin-top: 30px;
	width: 100%;                
}

.kenpin-title {
  font-size: 30px;
  border-bottom: 3px dotted #724C00;
  color: #724C00;
  text-shadow: 2px 2px #fff, 5px 5px #D6D1C8;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  padding-top: 50px;
 text-align: left;	
}

.kenpin-box {background-color:#D9C8B6;
	overflow:auto;
	padding-bottom: 30px;
    padding-left: 10px;
    padding-right: 10px;
  
}

.kenpin-txt {font-size: 18px;
                color: #724C00;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 400;
                float:left;
                width: 50%;
	padding-top: 20px;
	

}

.kenpin-img img {float:right;
	width: 50%;
	margin-top: -30px;
}

.oisogi-title {
  font-size: 30px;
  border-bottom: 3px dotted #724C00;
  color: #724C00;
  text-shadow: 2px 2px #fff, 5px 5px #D6D1C8;
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  padding-top: 50px;
 text-align: left;	
	background: #c2edff;/*背景色*/
  padding: 0.5em;/*文字まわり（上下左右）の余白*/
}

.oisogi-txt {font-size: 15px;
                color: #724C00;
                font-family: 'Noto Sans JP', sans-serif;
	            font-weight: 400;
	            text-align: center;            
}

.tel-imgcenter {text-align: center;
}

.tel-img img{margin-top: 30px;
	width: 80%;
    text-align: center;
}

/* エアーフレッシュナー*/
.air-title1 {font-size: 40px;
                font-weight: 900;
                padding: 100px 0 50px 0;
}

.air-title2 {font-size: 20px;
                   font-weight: 400;
                   padding:0 10px 50px 10px;
}

.air-haikei {background-image: url(/cdn/shop/files/millefior-back.jpg?v=1619479428);
                   background-size: contain;
}

.air-naname {background-image: url(/cdn/shop/files/millefiori-naname.png?v=1619428732);
}

.air-cube {float: right;
                 width: 60%;　　　　　　　　　　　　　　
}

.kakomi-triple1 {
 position: relative;
 border: 2px solid #2D2D2D; /*左枠線*/
 width: 70%;
 margin: 2em auto;
 padding: 20px 15px 15px 20px;
 float: right;
 font-size: 20px;
 font-weight: 500;
 z-index: 0;
}
.kakomi-triple1::before,
.kakomi-triple1::after {
 position: absolute;
 content: '';
 width: 100%;
 height: 100%;
}
.kakomi-triple1::before {
 border: 1px solid #2D2D2D; /*中枠線*/
 bottom: -4px;
 right: -4px;
 z-index: 1;
}

.air-naname {/*親div*/
  position: relative;/*相対配置*/
  }

.air-naname p {
  position: absolute;/*絶対配置*/
  color: #2D2D2D;/*文字色*/
  top: 20%;
  left: 10%;
  font-size: 22px;
  line-height: 2em;
  font-weight: 400;
  width: 50%;
  text-decoration: underline solid 3px #B7D162;
  }

.air-naname img {
  width: 100%;
  background-color: #fff;
  }

.air-title {padding-top: 50px;
}


.air-kaori {background-color: #DCDCDC;
                  text-align: center;
                  font-size: 50px;
                  font-weight:600;
                  padding: 15px 0 10px 0;
}

.air-kaori p {font-size: 18px;
}

.air-kaorititle {float: left;
                        padding-top: 500px;
}

.air-kaorisetsumei {text-align: left;
                                 font-size: 20px;
                                 font-weight: 800;
                                 padding: 15px 0;
}

.air-kaoriimg {float:left;
                        width: 40%;
}

.air-kaorisankaku {float: right;
                                         width: 58%;
                               padding-bottom: 150px;
}

.air-sizetxt {float: left;
                     font-size: 25px;
                     width: 30%;
                     font-weight: 600;
                     font-color: #545454;
                     text-align: left;
}

.air-sizeimg {float: right;
                      width: 70%;
}

.air-kaorishime {background-color: #DCDCDC;
                  padding: 10px 0 10px 0;
                  margin-bottom: 200px;
}

.air-packtxtl {float: left;
                     width: 30%;                  
}

.air-packtxt {       font-size: 25px;                    
                     font-weight: 600;
                     font-color: #545454;
                     text-align: left;
}

.air-packimg {float: right;
                      width: 70%;
                      margin-top: -30px;
}

.air-box3 {
    padding: 10px 20px;
    color: #545454;
    background: #E4E336;/*背景色*/
    font-size: 18px;
    text-align: left;
    font-weight: 600;
}


.air-toritsuketitle {font-size: 25px;
                        font-weight: 600;
                     font-color: #545454;
                     text-align: left;                    
}

.air-toritsukeimg { 
                   margin: 0 30px;
}

.air-toritsuke {font-size: 20px;
                          text-align: left;
}

.air-chuibox { background-color: #545454;
                       padding: 100px 0px;
                       
}

.air-chuititle {font-size: 35px;
                 color: #fff;
                 font-weight: 600;
                 text-align: center;
                 padding-bottom: 50px;
}

.air-chuitxt {font-size: 20px;
                     color: #fff;
                     text-align: left;
}

.air2-title1 {font-size: 30px;
                font-weight: 700;
                padding: 50px 0 30px 0;
}

.air2-title2 {font-size: 13px;
                   font-weight: 400;                
}

.air2-kaori {background-color: #DCDCDC;
                  text-align: center;
                  font-size: 35px;
                  font-weight:600;
                  padding: 15px 0 10px 0;
}

.air2-kaori p {font-size: 18px;
               margin-top: -10px;
}

.air2-sizetxt {      font-size: 25px;
                     width: 30%;
                     font-weight: 600;
                     font-color: #545454;
                     text-align: left;
}

.air2-sizeimg {       width: 90%;
}

.air2-kaorishime {background-color: #DCDCDC;
                  padding: 10px 0 10px 0;
                 
                  margin-bottom: 20px;
}

.air2-title {padding-top: 40px;
             width: 60%;
}

.air2-packtxtl {        
}

.air2-packtxt {       font-size: 25px;                    
                     font-weight: 600;
                     font-color: #545454;
                     text-align: left;
}

.air2-packimg {
                      width: 90%;
                      margin-top: -30px;
}

.air2-box3 {
    padding: 10px 20px;
    color: #545454;
    background: #E4E336;/*背景色*/
    font-size: 18px;
    text-align: left;
    font-weight: 600;
}

.air2-toritsuke {font-size: 15px;
                 text-align: left;
}

.air2-chuibox { background-color: #545454;
                       padding: 50px 30px;
                       
}

.air2-chuititle {font-size: 30px;
                 color: #fff;
                 font-weight: 600;
                 text-align: center;
                 padding-bottom: 50px;
}

.air2-chuitxt {font-size: 15px;
                     color: #fff;
                     text-align: left;
}





/* 750px以下(スマホ）*/
@media (max-width: 750px) {

 
.air-title1 {font-size: 20px;
                font-weight: 900;
                padding: 50px 0 30px 0;
}

.air-title2 {font-size: 15px;
                   font-weight: 400;                
}
 
.air-kaori { font-size: 20px;
                  font-weight:600;
                  padding: 15px 0 10px 0;
}

.air-kaori p {font-size: 16px;
}
  
.air-kaorisetsumei {font-size: 18px;
                                padding-top: 10px;
    
                                 
}
  
.air-kaorisetsumei{padding-top: 30px;
}
  
.air-kaoriimg {float:none;
                        width: 100%;
                        margin: 0 auto;
}

.air-kaorisankaku {float: none;
                                         width: 100%;
                               padding-bottom: 30px;

}
  
.air-sizetxt {float: none;
                     width: 90%;
                     font-size: 25px;
                     margin: -100px 0  0 20px;
                     padding-bottom: 30px;
                   }


.air-sizeimg {float: none;
                      width: 100%;
}
  
.air-packtxtl {float:none;
                     width: 100%;
               
                    }

.air-packtxt {font-size: 25px;
                margin-left: 20px;
                     }

.air-packimg {float: none;
                      width: 110%;
                      margin-top: -30px;
}

.air-chuibox {padding: 30px 20px;                       
}

.air-chuititle {font-size: 25px;
                 text-align: center;
                 padding-bottom: 10px;
}

.air-chuitxt {font-size: 15px;
                     color: #fff;
                     text-align: left;
}
.air-toritsuketitle {margin-left: 20px;
} 
.air-toritsuke {padding: 10px 10px;
                font-size: 15px;
} 

.air-kaorishime {margin-bottom: 100px;
}

  .air-box3 {
    text-align: center;
}
}
  
/*　カジュアル　*/
  


.section-lp-txtarea-cas{
  padding: 80px 100px;
  }
  
@media (max-width: 750px) {
  
  .section-lp-txtarea-cas{
  padding: 30px 10px;
  }
  
}

/*　Profound　*/<!--  add-nakaoka  -->
.section-lp-txtarea-pro{
  padding: 80px 100px;
  text-align: center;
  }

.content-inner-pro{
    max-width: 1050px;
    margin: 0 auto;
  }

.pro-gara {background-image: url("/cdn/shop/files/profound-bg.png?v=1648297224");
padding-top: -100px;
padding-bottom: 5px;}

.pro-shima {background-image: url("/cdn/shop/files/profound-bg-shima.png?v=1648297224");
                 padding-left: 30px;

}

.pro-title-txt1 {color: #FFF;
                     font-size: 30px;
                     font-weight: 900;
                     padding-top: 100px;
                     text-align: center;
}

.pro-title-txt2 {color: #FFF;
                     font-size: 18px;
                     padding-bottom: 100px;
}

.pro-color {padding-top: 50px;
}

.pro-hikaku {margin-top: -20px;
}

.pro-hikaku-img {float: left;
                    width: 40%;
}

.pro-hikaku-txt {float: right;
                     width: 58%;
                     color: #fff;
                     font-size: 18px;
                     font-weight: 500;
                     padding-top: 25px;
}

.pro-hikaku-atsumi {margin-top: -300px;                            
}

.pro-chui {font-size: 15px;
               padding: 20px 0 20px 0;
               background-color: #808080;
               color: #fff;
               font-weight: 500;
               text-align: center;
              
}

.pro-grade {background: -moz-linear-gradient(left, #8D5429, #B1954F 30%, #EADCBA 60%, #B1954F 80% ,#8D5429);
  background: -webkit-linear-gradient(left, #8D5429, #B1954F 30%, #EADCBA 60%, #B1954F 80% ,#8D5429);
  background: linear-gradient(to right, #8D5429, #B1954F 30%, #FEADCBA 60%, #B1954F 80% ,#8D5429);
margin-bottom: 5%;
color: white;
font-size: 30px;
  padding: 0.1em 0;
  text-align: center;
}

.section-lp-txtarea-pro .pro-point-img {width: 18%;
                      float: left;
}

.section-lp-txtarea-pro .pro-point-txt {width: 78%;
                                                       float: right;
                                                       margin-top: -5px;
}

.pro-point-txt1 {color: #FFFF00;/*文字色*/
  font-size: 22px;
  /*線の種類（点線）2px 線色*/
  border-bottom: dotted 2px #fff; 
  
  margin-top: 2%;
  padding-bottom: 10px;
}

.pro-point-txt2 {color: #fff;/*文字色*/
  font-size: 15px;
  
  margin-top: 2%;
  text-align: left;
  margin-bottom: 4%;
}

.pro-point-b {font-size: 20px;
        float: right; 
        width: 78%;
        color: #fff;
}

.pro-taikyu {
                 padding; 20px 30px;
}

.pro-taikyu-txt {font-size: 20px;
                      color: #FFFF00;
                      text-algin: left;
}

.pro-voice {clear: both;
                margin-top: 50px;   
}

.pro-voice-txt  { font-size: 22px;
         font-weight: bold;
         color: #C9A88A;
         float: left;
         align: left;
}

.pro-voice-txt2  { font-size: 22px;
         color: #808080;
         font-weight: 100;
  　　font-style: italic;
}

/* 吹き出し本体1 */
.pro-balloon1{
  position: relative;
  padding: 20px;
  border-radius: 10px;
  color: #9E6326;
  background-color: #ECECEC;
  margin-left: 110px;
  clear: both;          /* 左に余白を設ける */
}
/* 画像 - 絶対配置で左上に配置 */
.pro-balloon1 .icon{
  position: absolute;
  left: -80px;
  top: 10px;
  size: 50%;
}
/* 三角アイコン */
.pro-balloon1::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: -14px;
  top: 20px;
  border-right: 15px solid #ECECEC;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

/* 吹き出し本体2 */
.pro-balloon2{
  position: relative;
  padding: 20px;
  border-radius: 10px;
  color: #9E6326;
  background-color: #ECECEC;
  margin-right: 110px;          /* 右に余白を設ける */
}
/* 画像 - 絶対配置で右上に配置 */
.pro-balloon2 .icon{
  position: absolute;
  right: -80px;
  top: 10;
  size: 50%;
op: 0;
}
/* 三角アイコン */
.pro-balloon2::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  right: -14px;
  top: 20px;
  border-left: 15px solid #ECECEC;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}

.pro-mishin {margin-top: -40px;
                  width: 50%;
                  margin-left: auto;
                  margin-bottom: -300px;

}

.pro-point-4flag {float: left;
                         width: 15%;
                         margin-bottom: 20px;
}

.pro-point-4txt {float: left;
                           width: 50%;
}

.pro-point-4img {float: right;
                         width: 34%;
}

.pro-moji3{
  color: #FFFF00;/*文字色*/
  font-size: 22px;
  /*線の種類（点線）2px 線色*/
  border-bottom: dashed 1px #fff;
  margin-bottom: 2%; 
  font-weight: 700;
}

.pro-moji4 {
  color: #fff;/*文字色*/
  font-size: 16px;
}

.pro-moji5{
  color: #FFFF00;/*文字色*/
  font-size: 22px;
  /*線の種類（点線）2px 線色*/
  border-bottom: dashed 1px #fff;
  margin-top: 20px; 
  font-weight: 700;
}

.pro-moji6 {
  color: #fff;/*文字色*/
  font-size: 16px;
  margin-top: 20px;
}

hr.pro-style6 {border-top: 2px dotted #fff;
              
}



.pro-point-txt3 {float: right;
                           width: 85%;
                     text-align: center;
                     margin-top: 20px;
}



.pro-nouhau-img  {width: 58%;
              float: right;
}

.pro-nouhau-txt {width: 40%;
               color: white;
               margin-bottom:20%;
               
}

.pro-konpou-txt {float: left;
                         width: 60%;
                          font-weight: 400;
                         font-size: 15px;
                         text-align: left;
}

.pro-konpou-img {float: right;
                          width: 38%;
                         margin-top: -100px;
}

.pro-konpou-title {text-align: left;
                           color: #000;/*文字色*/
                          font-weight: 900;
  font-size: 25px;
  /*線の種類（点線）2px 線色*/
  border-bottom: dotted 3px #000;
  margin-bottom: 2%;
                          
}

/* 750px以下(スマホ）*/
@media (max-width: 750px) {
  
  .pro-title-txt1 {color: #FFF;
                     font-size: 18px;
                     font-weight: 800;
                     margin-top: -100px;
}
 
.section-lp-txtarea-pro{
  padding: 60px 0;
  }
  
.content-inner-pro{
    max-width: 100%;
    margin: 0 auto;
  }
  
.pro-title-txt2 {font-size: 13px;
                     padding-bottom: 1px;
}
  
.pro-hikaku {margin-top: -20px;
}

.pro-hikaku-img {margin-top: 40px;
}

.pro-hikaku-txt {font-size: 12px;
                     font-weight: 400;
                     padding-top: 30px;
                     padding-right: 10px;
                     margin-bottom: 30px;
                     text-align: left;
}
  
.pro-hikaku-atsumi {margin-top: 20px;                            
}
  
.pro-chui {font-size: 11px;
               padding: 20px 0 20px 0;
               background-color: #808080;
               color: #fff;
               font-weight: 500;
               text-align: center;
              
}
  
.pro-grade {margin-bottom: 5%;
font-size: 18px;
  padding: 0.1em 0;
  text-align: center;
}
  
.pro-point-txt1 { font-size: 19px;
  /*線の種類（点線）2px 線色*/
  border-bottom: dotted 2px #fff; 
  margin-top: 2%;
  padding-bottom: 10px;
  font-weight: 600;
}

.pro-point-txt2 {color: #fff;/*文字色*/
  font-size: 15px;
  margin-top: 2%;
  text-align: left;
  margin-bottom: 4%;
  width: 100%;
  
}
  
  .pro-point-b {font-size: 16px;
        float: none; 
        width: 100%;
    clear: both;
    font-weight: 800;
    padding: 0 10px;
    text-align: left;
}
  
.pro-taikyu-txt {font-size: 18px;
                      fong-weight: 800;
}
  

  
.pro-voice { margin-top: 50px;   
}
  
.pro-mishin {margin-bottom: -10px;
}


.pro-point-4txt {float: none;
                           width: 100%;
                       padding-left: 5px;
}

.pro-point-4img {
  width: 100%;

}  
  
.pro-moji3{
  font-size: 18px;
  font-weight: 700;
  float: right;
  width: 85%;
}

.pro- {
  font-size: 16px;
  float: right;
  width: 85%;
  text-align: left;
}
  

.pro-moji5{
  font-size: 18px;
  /*線の種類（点線）2px 線色*/
  margin-top: -5px; 
  font-weight: 700;
  float: right;
  width: 85%;
}

.pro-moji6 {
  font-size: 16px;
  margin-top: 5px;
  float: right;
  width: 85%;
}
  
.pro-nouhau-img  {width: 100%;
              float: none;
}

.pro-nouhau-txt {width: 100%;
               
               margin-bottom:0px;
               text-align: left;
               
}
  
.pro-point-txt3 {float: none;
                           width: 100%;
                       padding-left: 5px;
}
  
.pro-konpou-txt {float: none;
                         width: 100%;
                         font-size: 15px;
                         text-align: left;
}

.pro-konpou-img {float: none;
                          width: 100%;
                         margin-top: -40px;
}

.pro-konpou-title {text-align: left;
                          
  font-size: 25px;
  /*線の種類（点線）2px 線色*/
  border-bottom: dotted 3px #000;
  margin-bottom: 2%;
                          
}
  
}


 /*　領収書について　*/

.ryo-chui {background-color:  #C1272D;
              padding: 10px 30px;
              color: #FFF;
              font-size: 16px;
              font-weight: 500;
              text-align: center;
              margin: 0 auto;
  　　　　line-height: 5px;
              margin-top: 100px;
              width: 90%;
}

.ryo-title {font-size: 30px;
        font-weight: 800;
        text-align: left;
        text-shadow: 2px 2px 1px #BFBFBF;
        margin: 50px 0 20px 0;
}


.ryo-box {background: #F7931E;/*背景色*/
        padding: 3px 10px ;/*文字まわり（上下左右）の余白*/
        color: #fff;
        font-size: 22px;
        font-weight: 800;
        margin-bottom: 10px;
}

.ryo-setsumei {text-align: left;
                    font-size: 18px;
                    margin:50px 0 10px 0;
                    font-weight: 400;
}

.ryo-setsumei-img {width: 80%;
                            margin: 0 auto;
}



.ryo-yajirushi {width: 0;
height: 0;
border-style: solid;
border-width: 33px 50px 0 50px;
border-color: #545454 transparent transparent transparent;
margin: 0 auto;
}

.ryo-chuibox {font-size: 16px;
                    font-weight: 500;
                    background-color: #F2F2F2;
                    padding: 10px 30px;
                    margin-top: 80px;
                    text-align: left;
}

@media (max-width: 750px) {
  
.ryo-setsumei-img {width: 100%;
                            margin: 0 auto;
}
  
.ryo-box {font-size: 20px;
        font-weight: 800;
}
  
.ryo-chui {font-size: 12px;
              padding: 10px 10px;
              margin-top:  30px;
}   
  
.ryo-title {font-size: 25px;
        margin: 30px 0 20px 0;
}
  
.ryo-chuibox {font-size: 13px;
}

}

/* ふるさと納税*/

.f-section-lp-txtarea{
  padding: 80px 0;
  padding: 0 100px;
  }

.f-chui { font-size:  15px;
              font-weight: 500;
             padding: 15px 20px 30px 20px;
              color: #FFDE00;
              text-align: center;
              background-color: #3F4E4F;
             }

.f-2 { font-size:  16px;
              font-weight: 500;
             padding: 15px 20px 15px 20px;
              color: #FFDE00;
              text-align: center;
              background-color: #3F4E4F;
             margin-bottom: 30px;
             }

.f-chui-l {font-size: 25px;
               font-weight: 800;           }

.f-title {
  font-size: 18px;
  padding: 80px 0;
  font-weight: 700;
  text-align: center;
}

.f-title2 {font-size: 20px;
                font-weight: 800;
                 padding: 10px 0;
           margin: 10px 0 50px 0;
           color: #FFF;
            text-align: center;
                 background-color: #2C3639;
                 }

.f-title2-sub {font-size: 18px;
                font-weight: 500;
           margin: -30px 0 0 0;
           color: #3F4E4F;
               text-align: center;

                 }

.f-beg-bg {
  background-color: #ECEAE3;
  padding: 30px 0;
  margin: 50px 0 80px 0;
          }

.f-btn {margin: 30px 0;           
           }

.img_wrap{

  overflow: hidden;
}
.img_wrap img{
  width: 100%;
  cursor: pointer;
  transition-duration: 0.3s;
}
.img_wrap:hover img{
  opacity: 0.6;
  transition-duration: 0.3s;
}

.f-banner{
	display: flex;
	flex-wrap:wrap;
    margin-bottom: 100px;
  list-style: none;
}
.f-banner li {
	width: calc(100%/4);
	padding:0 5px;
	box-sizing:border-box;
}
.f-banner li img {
	max-width:100%; 
	height: auto; 
	border:solid 1px #ccc; 
}

.f-banner-top{
	display: flex;
	flex-wrap:wrap;
    margin-bottom: 20px;    
}
.f-banner-top li {
	width: calc(100%/4);
	padding:0 5px;
	box-sizing:border-box;
  list-style: none;
}
.f-banner-top li img {
	max-width:100%; 
	height: auto; 
	border:solid 1px #ccc; 
}
.f-txt-wht {
  font-size: 18px;
  color:  #fff;
  margin-top: -20px;
}

.f-hover10 {
	border-radius: 50%;
	transition: all 0.6s ease 0s;
}
.f-hover10:hover {
	cursor: pointer;
	transform: scale(1.1, 1.1);
}

.f-hover1 {
	display: inline-block;
	
	margin: 0 0 1em;

	color: #fff;
	cursor: pointer;
	transition: all 0.3s ease 0s;
}
.f-hover1:hover {
	opacity: 0.6;
}


 @media (max-width: 767px) {
   .f-title{
  font-size: 15px;
  padding: 10px 0;
   }

   .f-chui { font-size:  13px;
              font-weight: 500;

              
             
}

   .f-chui-l {font-size: 20px;
               font-weight: 800;
          }

   .f-2 { font-size:  15px;
             }
   
   .f-title2 {font-size: 18px;
                font-weight: 700;
                 padding: 10px;
           margin: 10px 0;
                 }
   
   .f-title2-sub {font-size: 15px;
               margin: 0 0 -10px 0;
                 }
   .f-btn {margin: 30px 0;  
            width: 100%;
            padding: 0;
           }

   .f-section-lp-txtarea{
  padding: 30px 10px;
  }

   .f-banner{
	display: flex;
	flex-wrap:wrap;
}
   .f-banner li {
	width: calc(100%/2);
	padding:5 10px;
	box-sizing:border-box;
}
  .f-banner li img {
	max-width:100%;
	height: auto; 
	border:solid 1px #ccc; 
}
   .f-banner-top{
	display: flex;
	flex-wrap:wrap;
}
   .f-banner-top li {
	width: calc(100%/2);
	padding:5 10px;
	box-sizing:border-box;
}
  .f-banner-top li img {
	max-width:100%;
	height: auto; 
	border:solid 1px #ccc; 
}

.f-txt-wht {
  font-size: 13px;

}
 }

   /*　レビュー投稿について　*/
.review-titlered {
  font-size: 30px;
  font-weight: 500;
  color: #FF0000;
  border-bottom:2px solid;
  text-align: left;
}

.review-titlemoji {
  font-size: 20px;
  font-weight: 400;
  color: #000;
  text-align: left;
  padding: 10px 0;
}

.review-title1 {font-family: 'Roboto','Noto Sans JP', "游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif!important;
         font-size: 30px;
         font-weight: 600;
         color: red; 
         text-align: left;
         border-bottom: solid 3px red;
               }

.review-title2 {font-family: 'Roboto','Noto Sans JP', "游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif!important;
         font-size: 20px;
         font-weight: 500;
         color: #222222; 
         text-align: left;
               }

.review-top {margin-left: -2%;
            }

.review-title3 {color: #DD0000;/*文字色*/
  padding: 0.5em 0;/*上下の余白*/
  border-top: solid 5px #DD0000;/*上線*/
  border-bottom: solid 5px #DD0000;/*下線*/
  font-size: 25px;
  font-weight: 700;
}

.review-title4 {
  font-size: 20px;
  font-weight: 500;
}

.review-title5 {
  font-size: 25px;
  font-weight: 500;
  color: #DD0000;
  text-align: left;
 margin-left: 2em;
  padding-left: 1em;
  margin-top: 0.5em;
  }

.review-title6 {
  font-size: 20px;
  font-weight: 500;
  color: #DD0000;
  }

.review-number {background: #DD0000;/*背景色*/
  padding: 0.2em 0.5em ;/*文字まわり（上下左右）の余白*/
  font-family: 'Roboto','Noto Sans JP', "游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif!important;
  font-size: 30px;
  color: white;
  font-weight: 700;
  align: left;
  float: left;
  clear: both;
}

.review-setsumei-txt2 {float:left;
                width: 48%;
              }
                
.review-setsumei-txt {font-family: 'Roboto','Noto Sans JP', "游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif!important;
           font-size: 15px;
           color: #222222;
           font-weight: 700;
           text-align: left;
           
          }

.review-setsumei-img {float: right;
           width:50%;
           margin-bottom: 5%; 
           box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
}

.review-setsumei-img2 {
                box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
}

.review-setsumei-img3 {float: right;
           width:50%;
          margin-bottom:10%;
                      }

.review-setsumei-img4 {box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
}

.review-triangle {
  width: 0;
  height: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-top: 30px solid #DD0000;
  clear: both;
  margin-left: auto;
  margin-right: auto;
  margin-top: 28%;
  margin-bottom: 8%;
  }

@media (max-width: 768px) {
.review-titlered {font-size: 20px;
                 }

.review-titlemoji {font-size: 15px;
                 }
  
.review-title1 {font-size: 23px;
}

.review-title2 {font-size: 13px;
}

.review-top {margin-bottom: -20%;
}

.review-title5 {
  font-size: 20px;
  float: none;
  margin: 0 0 0 2em;
 }

.review-title6 {
  font-size: 15px;
  margin-top: -40%;
}

.review-setsumei-txt {
           float: none;
           width: 100%;
           font-size: 15px;
           padding-bottom; 1em;
           margin-top: -5%;
                     }

.review-number {font-size:20px;
}

.review-setsumei-img { float:none;
                width: auto;
                margin-top: 5%;
                margin-bottom: -10%;
}

.review-setsumei-img3 { float:none;
                width: auto;
                margin-top: 5%;
                margin-bottom: -20%;
}
  
.review-triangle {
  margin-top:25%;
  margin-bottom: 8%;
  }
  
.review-setsumei-txt2 {float:none;
                width: 100%;
                margin-top:10%;
              }
}

 /*　バイク用マット　*/
.bike-gara {background-image: url("/cdn/shop/files/bikemat-bg-5.png?v=1669277980");
padding-top: -100px;
padding-bottom: 5px;

           }

.bike-bg {background-color: #2B2B2B;
}

.bike-bg2 {background-color: #3B3B3B;
}

.bike-title-l {font-size: 40px;
               color: #FFF;
                 font-weight: 900;
              }


.bike-title-m {font-size: 25px;
                 color: #FFF;
                 font-weight: 400;
                padding: 30px 0;
              }

.bike-title {padding: 100px 0;
             max-width: 1050px;
    margin: 0 auto;
            }

.bike-japan {padding: 100px 0;            
            }

.bike-color {padding: 100px 0;            
            }

.bike-chui-title {padding: 5px 0; 
                background-color: #FFF;
                font-size: 25px;
                font-weight: 700;
                color: #2B2B2B;
            }

.bike-chui-txt {margin: 20px 0; 
                font-size: 18px;
                font-weight: 500;
                color: #B3B3B3;
                text-align: left;
            }

@media (max-width: 768px) {
 .bike-title-l {font-size: 25px;
              }

.bike-title-m {font-size: 18px;
                  }

.bike-japan {padding: 50px 0;  
                
            }
  .bike-color {padding: 50px 0;            
            }

.bike-chui-title {padding: 3px 0; 
                margin-top: 30px;
                font-size: 20px;
            }

.bike-chui-txt {font-size: 16px;
            }

}

 /*シートカバー　*/
.seat-gara {background-image: url("/cdn/shop/files/23633350.png?v=1693553430");
opacity: 0.5;
           }

 /*フロアマット用お手入れブラシ　*/
.bru-bg {background-color: #E95710;
               padding: 100px 0;
}

.bru-bggry {background-color: #3E3A39;
}

.bru-triangle{
  max-width: 200px;
  margin: 0 auto;
  border-top: 70px solid #E95710;
  border-right: 300px solid transparent;
  border-left: 300px solid transparent;
}

.bru-teire {
  padding:100px 0;
}

.bru-size {
  padding: 5px 30px;
  background: #f4f4f4;
  font-size: 20px;
  font-weight: 500;
  margin-top: 100px;
  
}

.bru-size-setsumei {
  font-size: 20px;
  font-weight: 400;
  color: #F7F8F8;
  
}

.bru-ttl_background3 {
  font-weight: 800;
  font-size: 25px;
  padding: 0.5em 1em;
  background-color: #FFF;
  color: #E05D34;
  overflow: hidden;
  position: relative;
  margin: 100px 0 10px 0;
}

.bru-ttl_background3::after {
  content: '';
  background-color: #E05D34;
  opacity: 0.3;
  transform: rotate(-65deg);
  position: absolute;
  bottom: -250px;
  right: -250px;
  width: 300px;
  height: 500px;
}

.bru-box{
  width:100%;
  height:200px;
}

.bru-bg_skew_dot{
  background-image:
    radial-gradient(#444242 20%, transparent 30%),
    radial-gradient(#444242 20%, transparent 30%);
  background-size: 40px 40px;
  background-position: 0 0, 20px 20px;
  padding: 100px 0;
}

.bru-chui-ttl {
 font-size: 20px;
  font-weight: 900;
  color: #FFF; 
}

.bru-chui-txt {
  font-size: 16px;
  font-weight: 500;
  color: #FFF;
  padding-bottom: 100px;
}

@media (max-width: 768px) {
  .bru-bg {background-color: #E95710;
               padding: 20px 0 0 0;
}

.bru-triangle{
  max-width: 200px;
  margin: 0 auto;
  border-top: 50px solid #E95710;
  border-right: 100px solid transparent;
  border-left: 100px solid transparent;
}

.bru-teire {
  padding:30px 0;
}

.bru-3way {
padding-bottom: 50px;
}

.bru-bg_skew_dot{
  background-image:
    radial-gradient(#444242 20%, transparent 30%),
    radial-gradient(#444242 20%, transparent 30%);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
  padding: 30px 0;
}

.bru-size {
  margin-top: 50px;
}

.bru-ttl_background3 {
  padding: 0.2em 1em;

}



  
}

  
  /*　車載収納ネット　*/

.net-gara {background-image: url("/cdn/shop/files/lp-net-gara.png?v=1638249794");
padding-top: -100px;
padding-bottom: 5px;}

.net-cam {padding:50px 0;
}

.net-top {margin-top: 100px;
}

.net-title1 {font-size: 30px;
                font-weight: 700;
               text-align: center;
}
.net-title2 {font-size: 40px;
                   font-weight: 900;                  
  　　　　　text-align: center;
}

.net-how {padding-top: 100px;
              padding-bottom: 10px;
}

.net-bg {background-color: #EFEFEF;
}

@media (max-width: 750px) {
  
  .net-title1 {font-size: 20px;
                  padding: 20px 0 0px 0;
}
  
  .net-title2 {font-size: 25px;
                  padding:0 0px 20px 0px;
}
  
.net-bg {background-color: #EFEFEF;

}
  
.net-how {padding-top: 20px;
              padding-bottom: 10px;
  　　　　

}
  
}



.section-net-introduction{
   max-width: 1050px;
   margin: 100px auto 10px auto;
  display: flex;
  flex-wrap: wrap;

  @media (max-width: 767px) {
    margin: -7.5px;
    margin-bottom: 30px;
  }
}

   .net-item{
    width: 33.333333%;
    padding: 1.5%;
    @media (max-width: 767px) {
      width: 50%;
      padding: 7.5px;
    }
   }

    .net-img-area{
      margin-bottom: 15px;
      position: relative;
      img{
        width: 100%;
        height: auto;
        display: block;
      }
    }
      .net-label{
        position: absolute;
        left: 0;
        bottom: 10px;
        background: #424242;
        color: #FFF;
        font-size: 20px;
        font-weight: 700;
        padding: 6px 30px;
        @media (max-width: 767px) {
          font-size: 10px;
          padding: 2px 15px;
          bottom: 5px;
        }
      }
    }
     .net-tit{
        font-size: 52px;
        font-family: $font-serif;
        font-weight: 700;
        line-height: 1.3;
        @media (max-width: 767px) {
          font-size: 18px;
        }
      }
      .net-sub-txt{
        color: $accent-color;
        font-size: 14px;
        margin-bottom: 10px;
        @media (max-width: 767px) {
          font-size: 12px;
          margin-bottom: 5px;
        }
      }
      .net-txt{
        p{
          font-size: 14px;
          @media (max-width: 767px) {
            font-size: 12px;
          }
        }
      }
}
}

 /*　ブログ記事　*/
 .blog-article{
      --accent: #0f766e;        /* アクセント色：変更可 */
      --text: #1f2937;          /* 本文色 */
      --subtext:#6b7280;        /* 説明色 */
      --bg: #ffffff;            /* 背景 */
      --muted:#f3f4f6;          /* ボックス背景 */
      --border:#e5e7eb;         /* 枠線色 */
      --maxw: 940px;            /* 本文の最大幅 */
      --radius: 14px;           /* 角丸 */
      --shadow: 0 6px 24px rgba(0,0,0,.06);
      color: var(--text);
      background: var(--bg);
      font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
      line-height: 1.8;
    }
    .blog-article * { box-sizing: border-box; }
    .blog-article .container{
      max-width: var(--maxw);
      margin: 0 auto;
      padding: clamp(16px, 3vw, 28px);
    }
    /* ヘッダー */
    .blog-article .hero{
      position: relative;
      border-radius: var(--radius);
      overflow: hidden;
      box-shadow: var(--shadow);
      background: #000;
      margin-bottom: clamp(20px,4vw,36px);
      aspect-ratio: 16/9;
    }
    .blog-article .hero img{
      width: 100%; height: 100%; object-fit: cover; display: block; opacity: .9;
    }
    .blog-article .hero .hero-content{
      position: absolute; inset: 0; display: grid; place-items: end start;
      padding: clamp(16px, 4vw, 36px);
      background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 100%);
      color: #fff;
    }
    .blog-article .eyebrow{
      display:inline-block; font-size: .85rem; letter-spacing: .08em;
      background: rgba(255,255,255,.18); padding: .35rem .6rem; border-radius: 999px; margin-bottom: .6rem;
    }
    .blog-article h1{
      font-size: clamp(1.6rem, 3.2vw, 2.4rem);
      line-height: 1.25; margin: 0 0 .2rem;
      text-shadow: 0 2px 14px rgba(0,0,0,.35);
    }
    .blog-article .meta{ font-size:.95rem; opacity:.9 }

    /* 本文レイアウト */
    .blog-article .content{ display: grid; gap: clamp(18px,2.4vw,26px); }
    .blog-article h2{
      font-size: clamp(1.25rem, 2.4vw, 1.6rem);
      border-left: 6px solid var(--accent);
      padding-left: .6rem; margin: 1.6rem 0 .2rem;
    }
    .blog-article h3{
      font-size: clamp(1.1rem, 1.8vw, 1.25rem);
      margin: 1.2rem 0 .2rem; color: #111827;
    }
    .blog-article p{ margin: .4rem 0 .6rem; }
    .blog-article a{ color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

    /* 写真（単体 / 図表） */
    .blog-article figure{
      margin: .6rem 0; border-radius: var(--radius); overflow: hidden; background: var(--muted);
      border: 1px solid var(--border);
    }
    .blog-article figure img{ width: 100%; height: auto; display: block; }
    .blog-article figcaption{
      font-size: .9rem; color: var(--subtext); padding: .6rem .8rem; background: #fff;
    }

    /* 2列レイアウト（テキスト＋写真） */
    .blog-article .two-col{
      display: grid; gap: 16px;
      grid-template-columns: 1fr;
      align-items: start;
    }
    @media (min-width: 820px){
      .blog-article .two-col{ grid-template-columns: 1.05fr .95fr; }
    }

    /* ギャラリー（可変カラム） */
    .blog-article .gallery{
      display: grid; gap: 8px;
      grid-template-columns: repeat(2, 1fr);
    }
    @media (min-width: 640px){
      .blog-article .gallery{ grid-template-columns: repeat(3, 1fr); }
    }
    .blog-article .gallery img{
      width: 100%; height: 100%; object-fit: cover; display:block; aspect-ratio: 4/3; border-radius: 10px;
    }

    /* 引用・強調ボックス */
    .blog-article .pullquote{
      border-left: 4px solid var(--accent);
      padding: .6rem .9rem; background: #f9fafb; color:#111827; font-size: 1.05rem; border-radius: 8px;
    }
    .blog-article .note,
    .blog-article .warning{
      border: 1px solid var(--border); background: var(--muted);
      border-left: 6px solid var(--accent);
      padding: .8rem .9rem; border-radius: 10px;
    }
    .blog-article .warning{ border-left-color: #b45309; }

    /* タグ・ボタン */
    .blog-article .tags{ display:flex; flex-wrap: wrap; gap: 8px; }
    .blog-article .tag{
      font-size:.85rem; padding:.3rem .6rem; border-radius:999px; background:#eef2f7; border:1px solid var(--border);
    }
    .blog-article .btn{
      display:inline-block; padding:.75rem 1rem; background: var(--accent); color:#fff; border-radius: 10px;
      text-decoration: none; font-weight: 600; box-shadow: var(--shadow);
      transition: transform .15s ease;
    }
    .blog-article .btn:hover{ transform: translateY(-1px); }

    /* 表・リスト・時間割 */
    .blog-article table{
      width:100%; border-collapse: collapse; font-size:.95rem; background:#fff; border:1px solid var(--border); border-radius: 8px; overflow:hidden;
    }
    .blog-article th, .blog-article td{
      padding:.65rem .7rem; border-bottom:1px solid var(--border);
    }
    .blog-article th{ background:#f8fafc; text-align:left; }
    .blog-article ul.check{
      list-style:none; padding-left:0; margin:.2rem 0;
    }
    .blog-article ul.check li{
      padding-left:1.6em; position:relative; margin:.2rem 0;
    }
    .blog-article ul.check li::before{
      content:"✔"; position:absolute; left:.2em; color: var(--accent); font-weight:700;
    }

    /* YouTube 埋め込み（レスポンシブ） */
    .blog-article .video{
      position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border-radius: var(--radius); box-shadow: var(--shadow);
    }
    .blog-article .video iframe{
      position:absolute; inset:0; width:100%; height:100%; border:0;
    }

    /* FAQ（JS不要：details/summary） */
    .blog-article details{
      background:#fff; border:1px solid var(--border); border-radius: 10px; padding:.6rem .8rem; margin:.4rem 0;
    }
    .blog-article summary{ cursor:pointer; font-weight:600; color:#111827; }
    .blog-article details[open]{ box-shadow: var(--shadow); }

    /* フッター小要素 */
    .blog-article .footer{
      margin-top: 1.4rem; font-size:.9rem; color: var(--subtext);
      display:flex; justify-content: space-between; gap:12px; flex-wrap:wrap;
      border-top:1px dashed var(--border); padding-top:.8rem;
    }

    /* A) ラベル＋区切り線 */
.blog-subhead-label {
  display:flex;align-items:center;gap:.6rem;
  font-weight:700;letter-spacing:.04em;
  margin:1.4rem 0 .6rem;
}
.blog-subhead-label .label {
  display:inline-block;font-size:.85rem;padding:.28rem .6rem;
  background:#e6fffb;color:#065f54;
  border:1px solid #bff0ea;border-radius:999px;
}
.blog-subhead-label .rule {
  flex:1;height:1px;
  background:linear-gradient(90deg,var(--border),rgba(0,0,0,0));
}

/* B) サイドバーライン */
.blog-subhead-side {
  position: relative;
  padding: .6rem .8rem .6rem 1rem;
  margin: 1.6rem 0 .8rem;
  font-weight: 700;
  font-size: 1.1rem;
  background: #f9f9f9;              /* 無彩色の薄いグレー */
  border-left: 6px solid #d03521;   /* ご指定の赤ライン */
  border-radius: 0;                 /* ← 角丸をなくす */
  box-shadow: 0 2px 6px rgba(0,0,0,.04);
}

.blog-subhead-side small {
  color: #6b7280;
  font-weight: 600;
  margin-left: .5rem;
  font-size: .9rem;
}


/* C) 下線＋アイコン */
.blog-subhead-underline {
  display:flex;align-items:center;gap:.4rem;
  font-weight:800;letter-spacing:.02em;
  margin:1.4rem 0 .4rem;
  border-bottom:2px solid var(--border);padding-bottom:.2rem;
}
.blog-subhead-underline .dot {
  width:.65rem;height:.65rem;border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 3px rgba(15,118,110,.15);
}

/* フロアマットの洗い方 */
  :root{
    --wash-brand:#d03521;   /* HOTFIELDレッド */
    --wash-accent:#AB9862;  /* 補助のゴールド */
    --wash-ink:#222;
    --wash-ink-weak:#666;
    --wash-bg:#f7f7f7;
    --wash-panel:#ffffff;
    --wash-line:#e5e5e5;
    --wash-radius:14px;
    --wash-shadow:0 6px 20px rgba(0,0,0,.06);
  }
  .page-wash, /* ← conceptpageじゃない専用ラッパがあるならそのclass名を指定 */
.wash-scope {
  background: var(--wash-bg);color:var(--wash-ink);font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI",Roboto,Arial,"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.75;}
  
  .wash-container{/*max-width:980px;*/
    margin-inline:auto;
    padding:0px 0px 64px;
  }

  header.wash-hero{background:linear-gradient(180deg,#fff, #fafafa);
    border:1px solid var(--wash-line);
    box-shadow:var(--wash-shadow);
    border-radius:var(--wash-radius);
    padding:28px 22px;
    margin:18px 0 24px;
  }
  header.wash-hero h1{margin:0 0 8px;font-size:clamp(22px,3.6vw,30px);font-weight:800;letter-spacing:.02em;}
 header.wash-hero p {
  margin: 0;
  color: var(--wash-ink);
  font-size: 1.25rem;     /* 大きめに変更 */
  font-weight: 700;       /* 太字 */
  line-height: 1.9;       /* ゆとりある行間 */
}



.wash-tit {background:rgba(247, 247, 246, 0.87);/*背景色*/
  padding: 1em;/*文字まわり（上下左右）の余白*/
  font-weight: 700;
  font-size: 25px;
}

.wash-tit2 {font-weight: 500;
  font-size: 20px;
  padding: 1em 0.5em;/*文字まわり（上下左右）の余白*/
}
  /* ================================
   フロアマットの洗い方：スマホTOC（M3）
   ================================ */

/* アコーディオンTOCブロック（旧 .wash-toc とは別名で衝突回避） */
.wash-toc--accordion { margin: 16px 0 100px 0; }

/* まとめラッパー */
.wash-accordion { display: flex; flex-direction: column; gap: 12px; }

/* 見出しのバレット位置とリンク本文の左位置を完全一致させるためのローカル変数 */
.wash-accordion {
  --wash-bullet-w: 12px;          /* ● の直径 */
  --wash-bullet-gap: 12px;         /* ● とタイトルの間隔 */
  --wash-summary-pad-x: 16px;      /* summary 左右の内側余白 */
  --wash-summary-pad-y: 18px;      /* summary 上下の内側余白（広め） */
  --wash-links-left: calc(var(--wash-summary-pad-x) + var(--wash-bullet-w) + var(--wash-bullet-gap));
}

/* 丸を使わないので、リンク左の起点をタイトルと揃える */
.wash-accordion {
  --wash-summary-pad-x: 16px;
  --wash-summary-pad-y: 18px;
  --wash-links-left: var(--wash-summary-pad-x);  /* ← ●なしなのでタイトルの左に合わせる */
}

/* タイトル行（セクション一覧）：下にアンダーライン */
.wash-accordion summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 12px; /* 文字前の余白確保（●なしでも見やすく） */
  padding: var(--wash-summary-pad-y) var(--wash-summary-pad-x);
  font-weight: 800;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  border-bottom: 1px solid var(--wash-line);     /* ← アンダーライン追加 */
}
.wash-accordion summary::-webkit-details-marker { display: none; }

/* セクション一覧タイトル（サイズ少し強め） */
.wash-accordion .wash-accordion-title {
  font-size: 1.08rem;
  letter-spacing: 0.01em;
  padding-left: 1em;
}

/* 本文リンク群の左右位置 */
.wash-accordion .wash-links {
  padding: 10px 0 12px var(--wash-links-left);
  counter-reset: wash-idx; /* ← ここでカウンタ初期化 */
}

/* 各目次リンク：先頭に 01 — のラベルを自動付与 */
.wash-accordion .wash-links a {
  display: block;
  padding: 12px 16px;
  border-top: 1px solid var(--wash-line);
  text-decoration: none;
  color: var(--wash-ink);
  font-weight: 700;
  position: relative;
}
.wash-accordion .wash-links a:first-child { border-top: none; }

.wash-accordion .wash-links a::before {
  counter-increment: wash-idx;
  /* 01 — の体裁（先頭ゼロ + ダッシュ） */
  content: counter(wash-idx, decimal-leading-zero) " — ";
  /* 文字とラベルの間隔を少し広めに */
  margin-right: 6px;
  opacity: .9;
  font-variant-numeric: tabular-nums; /* 数字幅を揃える */
  color: var(--wash-brand);
}

/* details コンテナ */
.wash-accordion details {
  border: 1px solid var(--wash-line);
  border-radius: var(--wash-radius);
  background: #fff;
  box-shadow: var(--wash-shadow);
  overflow: hidden;
}

/* タイトル行（summary） */
.wash-accordion summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: var(--wash-bullet-gap);
  padding: var(--wash-summary-pad-y) var(--wash-summary-pad-x);
  font-weight: 800;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.wash-accordion summary::-webkit-details-marker { display: none; }

/* ● バレット（「セクション一覧」の左側） */
.wash-accordion .wash-bullet {
  width: var(--wash-bullet-w);
  height: var(--wash-bullet-w);
  border-radius: 50%;
  background: var(--wash-brand);
  flex: 0 0 auto;
}


/* 展開エリア（リンク群） */
.wash-accordion .wash-links {
  padding: 8px 0 10px var(--wash-links-left); /* ← バレット＋余白と同じ起点に揃える */
}

/* セクションリンク */
.wash-accordion .wash-links a {
  display: block;
  padding: 12px 16px;
  border-top: 1px solid var(--wash-line);
  text-decoration: none;
  color: var(--wash-ink);
  font-weight: 700;
}
.wash-accordion .wash-links a:first-child { border-top: none; }

/* ホバー/フォーカス */
.wash-accordion .wash-links a:hover,
.wash-accordion .wash-links a:focus {
  background: #fafafa;
  outline: none;
}

/* 2列化しないための明示（PCでもシングルカラム） */
@media (min-width: 960px) {
  .wash-toc--accordion { max-width: 780px; }
}

  h2.wash-section{
    position:relative;
    padding:15px 5px 15px 14px;
    margin:36px 0 14px;
    font-size:clamp(18px,3vw,24px);
    background-color:#F8F8F8;
  }
  h2.wash-section::before{
    content:"";
    position:absolute;
    left:0;
    top:0em;
    bottom:0em;
    width:6px;
    background:var(--wash-brand);border-radius:0px;
  }

  .wash-flow {
  /* セクション全体の上下の余白（大きくしたい時はここを増やす） */
  margin-block: 15px 1px;
}

.wash-flow-block {
  /* 各ブロック間の余白（STEPごとの距離感） */
  margin: 16px 0;
  /* 枠は一切使わないので border / background は付けない */
}

.wash-flow-head {
  /* 見出しの強さ：数字を上げるとより目立つ */
  font-weight: 800;
  font-size: 1.05rem;
  line-height: 1.8;
  padding: 10px 20px;
  letter-spacing: 0.01em;
  background-color:rgb(247, 231, 219)
}

.wash-flow-desc {
  /* 説明文の余白（見出しとの距離） */
  margin: 6px 0 0;
  color: var(--wash-ink);
}

/* ==== マーカー風アンダーライン用アニメーション ==== */
.wash-flow-divider {
  position: relative;           /* <- 線を重ねるため */
  display: inline-block;        /* <- 幅をテキスト幅に合わせる */
  padding-bottom: 4px;          /* <- 下に少し余白を作る */
  /* 既存の色・余白などはそのまま残す場合： */
  margin: 14px 0 8px;
  font-weight: 700;
  line-height: 1.8;
  color: var(--wash-ink-weak);
}

/* アンダーライン部分（マーカー風） */
.wash-flow-divider::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  height: 4px;                   /* <- 線の太さ */
  width: 0;                      /* <- アニメーション開始は0 */
  background: rgba(208,53,33,0.2); /* <- 蛍光レッド風（ブランドレッドの20%透明） */
  border-radius: 2px;
  transition: width 0.8s ease-out;
}

/* ページ読み込みまたは表示時に線を伸ばす効果 */
.wash-flow-divider.animate-marker::after {
  width: 100%;                   /* <- 最後に文字幅いっぱいに伸びる */
  background: rgba(208,53,33,0.3); /* <- 完了時 少し濃くしてアクセント */
}

/* ▼ 区切り（次の段階への誘導）。文言はHTML側で書き換え可 */
.wash-flow-divider {
  margin: 14px 0 8px;
  font-weight: 700;
  line-height: 1.8;
  /* 色を弱めにしてうるさくしない。もっと強くしたければ var(--wash-ink) に */
  color: var(--wash-ink);
}

/* リストの体裁（必要な場合だけ使用） */
.wash-flow-list {
  margin: 8px 0 0;
  padding-left: 1.2em;
}
.wash-flow-list li {
  margin: .35em 0;
}

  .wash-card{background:var(--wash-panel);border:1px solid var(--wash-line);border-radius:var(--wash-radius);box-shadow:var(--wash-shadow);padding:18px;margin:12px 0;}
  .wash-note{border-left:6px solid var(--wash-accent);background:linear-gradient(180deg,#fff,#f9f8f6);}

  .wash-tips{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
  .wash-tip{border:1px dashed var(--wash-line);border-radius:12px;padding:14px;background:#fff;}

  .wash-steps{counter-reset:wash-step;
    display:grid;
    gap:10px;
  }
  .wash-step{display:grid;
    grid-template-columns:46px 1fr;
    gap:10px;
    align-items:start;
    background:#fff;
    /*border:1px solid var(--wash-line);*/
    border-radius:12px;
    padding:14px;
  }

  .wash-step-img {
  width: 100%;
  margin-top: 12px;   /* ← 文字とくっつかないように */
  border-radius: 8px; /* ← 少しだけ角丸に（任意）*/
}
  .wash-num{
    counter-increment:wash-step;
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--wash-brand);
    color:#fff;
    font-weight:800;
    font-size:18px;
  }
  .wash-num::after{content:counter(wash-step);}

  .wash-point-c {
  border-top: 3px solid var(--wash-accent);  /* ← ゴールドのライン */
  padding: 14px 20px 2px;                       /* ← 上下の余白 */
  margin-left: auto;
  margin-right: auto;  /* ← これが “枠を中央寄せ” */
  text-align: left;    /* ← 中の文章は左揃えのまま */
  background: rgba(171,152,98,0.08);  /* ← 薄いゴールド背景（8%くらいの透明感） */
  margin-bottom: 100px;
}

.wash-point-c-title {
  font-weight: 800;                           /* ← タイトルを太字に */
  margin-bottom: 6px;                         /* ← タイトルと本文の間の余白 */
  font-size: 1.05rem;                         /* ← 少しだけ大きく */
}

  .wash-checklist{margin:0;
    padding-left:1.2em
  }
  
  .wash-checklist li{margin:.35em 0}

  figure.wash-img{margin:10px 0 0;text-align:center}
  figure.wash-img img{width:100%;height:auto;border-radius:12px;border:1px solid var(--wash-line)}

  .wash-badge{display:inline-block;background:var(--wash-brand);color:#fff;font-weight:700;border-radius:999px;padding:.2em .7em;font-size:.9rem;margin-right:.4em}
  .wash-warning{color:#b00020;font-weight:700}

  .wash-cta{display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:16px}
  
 .wash-btn2{
    color:#d03521;
   
    
    padding:10px 14px;
    border-radius:12px;
    font-weight:700;
    margin: 0 auto;
  }
 
  .wash-btn{
    border:1px solid var(--wash-brand);
    color: #fff !important;
    background:var(--wash-brand);
    text-decoration:none;
    padding:10px 20px;
    border-radius:12px;
    font-weight:500;
    margin: 0 auto;
  }

  /* ゴーストボタン（白背景・赤文字） */
.wash-btn--ghost{
  background:#fff;
  color:var(--wash-brand);
}
.wash-btn--ghost:hover{
  background:#fff;                /* ← hover のときも変えない */
  color:var(--wash-brand);
}


  .wash-media{display:grid;
    gap:14px;
    grid-template-columns:120px 1fr;
    align-items:center;
    padding-bottom: 50px;
  }
  .wash-media img{width:100%;
    height:auto;
    border-radius:12px;
    
  }

.wash-box  {padding-bottom: 50px;
}

  footer.wash-footer{margin-top:40px;color:#777;font-size:.9rem;text-align:center}

/* ========== アイコン＋タイトル見出し ========== */
/* 見出しをフレックス化して中央揃え＋背景帯をここに */
.wash-section--icon{
  --wash-head-h: 48px;                /* ★見出し帯の高さ（アイコンもこの高さに揃う） */
  display: flex;
  align-items: center;
  gap: 12px;
  background: #F8F8F8;                /* 灰色の帯 */
  padding: 0 16px;                    /* 横のゆとりだけ。上下は高さで管理 */
  min-height: var(--wash-head-h);
  margin: 18px 0 12px;
}
.wash-icon{
  width: var(--wash-head-h);
  height: var(--wash-head-h);
  flex: 0 0 var(--wash-head-h);       /* つぶれ防止 */
  line-height: 0;                     /* 画像の下の隙間対策 */
}
.wash-icon img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;                 /* PNG透過を綺麗に表示 */
}

/* 旧スタイルの左バーを無効化 */
.wash-section.wash-section--icon::before { content: none; }


/* PCで少しだけ堂々と見せたい時（任意） */
@media (min-width: 960px) {
  .wash-section--icon { gap: 14px; }
  .wash-icon { --wash-icon-size: 1em; }       /* PCだけほんの少しUPもアリ */
}


/* 既存h2の装飾をオフ（左の赤バー等） */
.wash-section--plain{
  margin:0;                 /* ← h2の上下余白をラッパに任せる */
  padding:0;
  background:none;
  position:static;
}
.wash-section--plain::before{ content:none; }  /* ← 左バーを消す */

.wash-brush{
  position:relative;
    padding:15px 5px 15px 14px;
    margin:36px 0 14px;
    font-size:clamp(18px,3vw,24px);
    background-color:#F8F8F8;
  }

.wash-item { margin: 48px 0; }

.wash-item-label {
  background: #f3f3f3;
  padding: 10px 16px;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: 0.01em;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 50px;
}

.wash-item-icon {
  width: 30px;
  height: 30px;
  object-fit: contain;
}


.wash-item-card {
  background: #fff;
  border: 1px solid var(--wash-line);
  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
  border-radius: 14px;
  padding: 22px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 14px;
}

.wash-item-img {
  width: 120px;
  height: auto;
  border-radius: 12px;
  flex-shrink: 0;
}

.wash-item-body {
  flex: 1;
}

.wash-item-title {
  margin: 0 0 12px;
  font-size: 1.1rem;
  font-weight: 800;
}

.wash-item-text {
  margin: 0 0 14px;
  line-height: 1.7;
  color: var(--wash-ink);
}

.wash-item-list {
  margin: 0;
  padding-left: 1.2em;
  line-height: 1.7;
}

.wash-item-list li { margin-bottom: .4em; }

.wash-item-cta {
  display: flex;
  align-items: center; /* ← ボタンの縦位置をテキスト中央に揃える */
}

/* スマホでは通常の上下レイアウトに */
@media (max-width: 768px) {
  .wash-item-card {
    flex-direction: column;
  }
  .wash-item-cta {
    margin-top: 16px;
  }

  .wash-tit {padding: 0.5em;/*文字まわり（上下左右）の余白*/
  font-weight: 700;
  font-size: 18px;
}

.wash-tit2 {font-weight: 500;
  font-size: 16px;

}

.wash-toc--accordion { margin-bottom: 30px;
 }

h2.wash-section::before {
    width: 2px;  /* ← 6px → 4px に細くする（好みに応じて3pxもOK） */
  }
h2.wash-section {
    padding-left: 18px;  /* ← 元が 14px なので +4pxでスペースをゆったり */
  }

  .wash-flow-head {
  /* 見出しの強さ：数字を上げるとより目立つ */
  font-size: 1rem;
  margin-top: 5px;
  }

  .wash-flow-divider {
  position: relative;           /* <- 線を重ねるため */
  display: inline-block;        /* <- 幅をテキスト幅に合わせる */
  padding-bottom: 4px;          /* <- 下に少し余白を作る */
  /* 既存の色・余白などはそのまま残す場合： */
  margin-bottom: 10px;
  font-weight: 700;
  line-height: 1.8;
  color: var(--wash-ink-weak);
}

 h2.wash-section::before {
    width: 6px !important;
  }
  h2.wash-section {
    padding-left: 20px;  /* ← 元（14pxなど）より少し広げる */
  }


}

/* ===============================
   JIMNY Meeting Article Styles (HOTFIELD Ver.)
   =============================== */

.jimny-article {
  font-family: "Noto Sans JP", sans-serif;
  color: #222;
  line-height: 1.8;
  background-color: #fff;
  max-width: 900px;
  margin: 0 auto;
  padding: 40px 20px;
}

.jimny-title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #1a1a1a;
  border-left: 6px solid #d03521; /* HOTFIELDオレンジ */
  padding-left: 12px;
  margin-bottom: 8px;
}

.jimny-subtitle {
  font-size: 1rem;
  color: #666;
  margin-bottom: 30px;
}

.jimny-hero img {
  width: 100%;
  border-radius: 10px;
  margin-bottom: 8px;
}

.jimny-section {
  margin-bottom: 50px;
}

.jimny-h2 {
  font-size: 1.4rem;
  font-weight: 700;
  color: #d03521;
  border-bottom: 2px solid #f1f1f1;
  padding-bottom: 6px;
  margin-bottom: 16px;
}

.jimny-h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: #333;
  margin-top: 24px;
  margin-bottom: 8px;
  position: relative;
  padding-left: 25px;
}

.jimny-h3::before {
  content: "◆";
  color: #d03521;
  position: absolute;
  left: 0;
  top: 0;
}

.jimny-photo {
  text-align: center;
  margin: 20px 0;
}

.jimny-photo img {
  width: 100%;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}

.jimny-imgcaption {
  font-size: 0.9rem;
  color: #777;
  margin-top: 6px;
}

.jimny-quote {
  background: #fff7f5;
  border-left: 4px solid #d03521;
  padding: 16px 20px;
  font-style: italic;
  color: #333;
  margin: 20px 0;
}

.jimny-link {
  text-align: center;
  margin-top: 24px;
}

.jimny-link a {
  display: inline-block;
  color: #fff !important;
  background: #d03521;
  
  padding: 12px 20px;
  border-radius: 6px;
  text-decoration: none;
  transition: 0.3s;
}

.jimny-link a:hover {
  background: #ab2c1a;
}

/* Responsive */
@media screen and (max-width: 768px) {
  .jimny-article {
    padding: 24px 16px;
  }

  .jimny-title {
    font-size: 1.5rem;
  }

  .jimny-h2 {
    font-size: 1.2rem;
  }

  .jimny-h3 {
    font-size: 1rem;
  }
}