@charset "UTF-8";

/*基本色*/
:root{
    --main-color:#0066cc;
    --accent-color:#e0ffff;
    --dark-main-color:#2B5566;
    --text-bright-color:#ffffff;
    --icon-color:#ffffff;
    --gray-color:#ddd;
    --large-width:1000px;
    --middle-width:800px;
}

/*基本フォントサイズ*/
@media screen and (max-width: 599px){
    :root{
        font-size: 14px;
    }
    
}

@media screen and (min-width: 600px) and (max-width:799px){
    :root{
        font-size: 16px;
    }
    
}

@media screen and (min-width: 800px) {
    :root{
        font-size: 18px;
    }
    
}

body{
    font-size: 16px;
}


/*基本設定：ページ全体*/
body{
  margin: 0;
 font-family:'メイリオ',
        'Hiragino kaku Gothic Pro',
        sans-serif; 
}

/*コンテンツA：キービジュアル*/
.conA{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    min-height: 450px;
    background-image: linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.1)),url(img/top.png);
    background-position: center;
    background-size: cover;
    color: #ffffff;
    color: var(--text-bright-color:);
    text-align: center;
}

.conA h1{
    margin-top: 0;
    margin-bottom: 10px;
    font-family: 'Montserrat',sans-serif;
    font-size: 12vw;
    letter-spacing: 0.1em;
    line-height: 1.2;
    margin-left: 0.1em;
    
}

@media screen and (min-width: 768px){
    .conA h1{
        font-size: 80px;
        letter-spacing: 0.1em;
        margin-left: 0.1em;
    }
}

.subtitleA{
    display: flex;
    align-items: center; /* 垂直中心 */
  justify-content: center; /* 水平中心 */
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600;
    font-size: 8vw;
}

.subtitleA:before, .subtitleA:after {
    border-top: 0.75vw solid;
  content: "";
  width:2em; /* 線の長さ */
}

.subtitleA:before {
    margin-right: 0.5em;
}

.subtitleA:after {
    margin-left: 0.5em;
}

@media screen and (min-width: 768px){
    .subtitleA{
        font-size: 60px;
}
}

.subtitleB{
    margin:0px 20px 0px 20px;
    font-size: 18px;
    text-align: left;
}



@media screen and (min-width: 768px){  
.subtitleB{
    margin:0px 100px 0px 100px;
    font-size: 24px;
}
}

/*コンテンツB：NEWS
.conB .container{
        padding:20px;
        
        }

@media screen and (min-width: 768px){
        .conB .container{
            position:relative;
            display: flex;
            max-width: 1000px;
            max-width: var(--large-width);
            margin-left: auto;
            margin-right: auto;
        }   
    }

.btn-circle-fishy {
    position: absolute;
    margin-bottom: 20px;
      width: 80px;
  height: 80px;
  line-height:80px;
 border-radius: 50%;
  text-align: center;
  overflow: hidden;
  background-image: linear-gradient(45deg, #0066cc 60%, #ffffff 100%);
  transition: .4s;
    text-decoration: none;
      color: #ffffff;    
    font-weight:600;
  }

.btn-circle-fishy:hover {
  -webkit-transform: rotate(10deg);
  transform: rotate(10deg);
}



.conB .news{
   
   }

.newsmore time{
  }
*/

/*コンテンツC　工法と研究会について*/
.conC .container{
    position: relative;
    padding: 40px 20px 20px 20px ;
    text-align:center; 
}

@media screen and (min-width: 768px){
    .conC .container{
           display: flex;
        padding: 80px 20px 20px 20px ;
            max-width: 1000px;
            max-width: var(--large-width);
            margin-left: auto;
            margin-right: auto;
      
        }
}

 .conC .conC_abouttitle{
     position: absolute;
        top:0px;
        left: 20px;
        right: 20px;
        font-size: 5vw;
        color: #000000;
    }

 @media screen and (min-width: 768px){
        .conC .conC_abouttitle{
            font-size: 28px;
                }
    }

.conC .about_more{
  text-align: left;
  padding: 10px;
  font-size: 14px;
  color: #000000;
    }

@media screen and (min-width: 768px){
    .conC .about_more{
         margin:0;
        font-size: 20px;
                }
    
}

.conC a{
    color:#0066cc;
    color: var(--main-color);
    text-decoration: none;
}

.conC a:hover{
    text-decoration: underline;
}

.conC .about_point{
   margin: 10px auto;
  width: 100px;
   height: 100px;
   border-radius: 50%;
   background: -moz-radial-gradient(#ffffff, #66ccff); 
   background: -webkit-radial-gradient(#ffffff, #66ccff); 
   background: radial-gradient(#ffffff,#66ccff);
   color: #000000;    
  font-weight: 600;    
  line-height: 100px;
       }

    @media screen and (min-width: 768px){
    .conC .about_point{
    width: 400px;
    height: 120px;
    line-height: 120px;
    font-size: 18px;

    }
    }

/*コンテンツD：製品紹介*/
.conD{
    background:linear-gradient(45deg, #0066cc 60%, #ffffff 100%);
    
}
    .conD .container{
        position: relative;
        padding-top: 80px;
        padding-bottom: 20px;
        text-align:center;
        
        }

 @media screen and (min-width: 768px){
        .conD .container{
            display: flex;
            max-width: 1000px;
            max-width: var(--large-width);
            margin-left: auto;
            margin-right: auto;
        }   
    }
    
    .conD .conD_producttitle{
        position: absolute;
        top: 10px;
        left: 20px;
        right: 20px;
        text-align: center;
        font-size: 24px;
        color: #ffffff;
    }

 @media screen and (min-width: 768px){
        .conD .conD_producttitle{
            font-size: 28px;
            top:0px;
    }
    }

    .conD_product{
        padding-top: 10px;
        padding-left: 10px;
        padding-right: 10px;
        padding-bottom: 10px;
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom: 10px;
        text-align: center;
        background: #ffffff;
        border-radius: 10px;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 1);
        
        
    }
    
 @media screen and (min-width: 768px){
        .conD_product{
            flex:1;
        }
    }

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait){
    .conD .container{
        display:block;}
}

    .conD_productname{
        margin-top:0;
        margin-bottom: 5px;
        font-size:20px;
        color: #0066cc;
            }
    
    .product_more{
        margin-top: 0;
        margin-bottom: 20px;
        text-align: left;
        font-size: 14px;
        line-height: 1.8;
        opacity: 0.8;
        
    }
    
.post_more_red{
    color: red;
}
    .conD a{
        display: inline-block;
        margin-top: 20px;
        padding: 10px 20px;
        border: solid 3px currentColor;
        border-radius: 10px;
        background-color: #0066cc;
        background-color: var(--main-color);
        color: #ffffff;
        color: var(--text-bright-color);
        font-size: 14px;
        text-decoration: none;
        text-align: center;
    }
    
    .conD a:hover{
        background-image: linear-gradient(rgba(255,255,255,0.4),rgba(255,255,255,0.4));
       
    }
    
  /*フッター*/
footer{
    color: #000000;
    background-color:#ffffff;
 
}
 
footer .container{
    padding: 40px 20px;
}

@media screen and (min-width: 768px){
    footer .container{
        display: flex;
        flex-wrap: wrap;
        max-width: 1000px;
        max-width: var(--large-width);
        margin-left: auto;
        margin-right: auto;
    }
}

/*フッターA：サイト情報*/
.footA{
    margin-bottom: 30px;
}

@media screen and (min-width: 768px){
    .footA{
        flex:0 0 40%;
    }
}

.footA h2{
    margin-top: 0;
    margin-bottom: 0;
    font-family: 'Montserrat' , sans-serif;
    font-size: 6vw;
    letter-spacing: 0.05em;
}

@media screen and (min-width: 768px){
    .footA h2{
        font-size: 26px;;
    }
}

.footA p{
    margin-top: 0;
    margin-bottom: 0;
    font-size: 14px;
    }
    
.footA a{
    color: inherit;
    text-decoration: none;
}
/*フッターB：フッターメニュー*/
.footB{
    margin-bottom: 30px;
}

 @media screen and (min-width: 768px){
     .footB{
         flex: 0 0 60%;
               
     }
}

.footB a{
    display: block;
    margin: 20px auto;
    color: #000000;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0.05em;
    border-bottom: solid 1px gray;
    text-decoration: none;
}
    
.footB a:hover{
    background-color: rgba(0,0,0,0.3);
}

@media screen and (min-width: 768px){
     .footB a{
         display: inline-block;
         margin: 0;
         flex:1;
         border-left :solid 5px #0066cc;
         border-bottom: solid 0px gray;
         padding: 10px;
         text-align: center;
        }
}

/*フッターB：コピーライト*/
.footC{
    font-size: 12px;
    text-align: center;
    font-family: 'Montserrat' , sans-serif;
}

@media screen and (min-width: 768px){
     .footC{
         flex: 100%;
               
     }
}

/*ヘッダー*/
header{
    position: absolute;
    top:0;
    left: 0;
    z-index: 100;
    width: 100%;
    background-color: rgba(255,255,255,0.9);
}

.nohero header{
    position: static;
    border-bottom: solid 1px #ddd;
    border-bottom: solid 1px var(--gray-color);
}

@media screen and (min-width: 768px){
    header{
        background-color: #0066cc;
    }
}

@media screen and (min-width: 768px){
    header .container{
        display: flex;
        align-items: center;
        justify-content: space-between;
      
    
    }
}

/*ヘッダーA:サイト名*/
.headA{
    display: inline-block;
    line-height: 70px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: #0066cc;
    background-color: var(--main-color);
    color: #ffffff;
    color:var(--text-bright-color);
    font-family: 'Montserrat' , sans-serif;
    font-size: 6vw;
    font-weight: 600;
    text-decoration: none;
}


@media screen and (min-width: 768px){
    .headA{
        font-size: 28px;
        
    }
}

/*ヘッダーB:ナビゲーションメニュー*/
.headB ul{
    margin: 0;
    padding: 0;
    list-style: none;
}

@media screen and (min-width: 768px){
    .headB ul{
        display: flex;
        
    }
}

.headB a{
    display: block;
    padding: 15px;
    color: inherit;
    font-size: 12px;
    text-decoration: none;
}

.headB a:hover{
    background-color: rgba(0,0,0,0.3);
}

/*ヘッダー とナビゲーション固定*/
.header-nav-wrapper{
    position: fixed;
    z-index: 10;
    left: 0;
    top:0;
    width: 100%;
}

.main-wrapper{
    position: absolute;
    z-index: 0;
    left: 0;
    top: 70px;
    width: 100%;
}
@media screen and (min-width: 768px){
    .headB a{
        color: #ffffff;
        font-size: 14px;
        padding-right: 20px;
        padding-left: 20px;
    }
}

/*ヘッダーC:ハンバーガーボタン*/
@media screen and (max-width: 767px){
    /*小さい画面の設定*/
    header .container-small{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .headC{
        margin-right: 20px;
        padding: 0;
        border: none;
        outline: none;
        background: none;
        font-size: 28px;
        opacity: 0.5;
        cursor: pointer;
    }
    
    .headC:hover{
        opacity: 0.3;
    }
    
    .headB{
        display: none;
    }
}

@media screen and (min-width: 768px){
    /*大きい画面の設定*/
    .headC{
        display: none;
    }
    
    .headB{
        display: block !important;
    }
}

/*about・製品紹介共通*/
.post .container{
    max-width: 800px;
    max-width: var(--middle-width);
    margin-left: auto;
    margin-right: auto;
    padding: 30px 10px;
}

.post h1{
  padding: 0.3em;/*文字の上下 左右の余白*/
  color: #494949;/*文字色*/
  background: #f4f4f4;/*背景色*/
  border-left: solid 5px #0066cc;/*左線*/
    border-bottom: solid 3px #d7d7d7;/*下線*/
  font-size: 5vw;
}


@media screen and (min-width: 768px){
    .post h1{
        font-size: 2rem;
        }
}

/*about・製品紹介共通*/
.post p{
    font-size: 1rem;
    line-height: 2;
    padding-left: 10px;
    padding-right: 10px;
}

.post .title{
    font-size: 1.25rem;
    border-bottom: solid 3px #0066cc;
    border-bottom: solid 3px var(--main-color);
    padding-left: 5px;
}

.post img{
    max-width: 100%;
    }

/*パンくずリスト*/
.bread ol{
    display: flex;
    margin-top: 0;
    padding: 0;
    list-style: none;
}

.bread a{
    display: block;
    padding: 5px;
    color: inherit;
    font-size: 0.875rem;
    text-decoration: none;
}

.bread a::after{
    margin-left: 10px;
    content: '\f054';
    font-family: 'FontAwesome';
    opacity: 0.3;
}

.bread a:hover{
    background-color: rgba(0,0,0,0.3);
}

/*製品紹介*/
.productrist{
    position: relative;
    margin: 0.5em;
    padding: 0;
    border: solid 2px #0066cc;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
     
}

.productrist a{
    color: #ffffff;
}


.product_name{
    margin: 0;
    text-align: center;
    top:0;
    left:0;
    line-height: 20px;
    font-size: 20px;
    background: #0066cc;
    color: #ffffff;
    font-weight: bold;
    }

.product_details{
    margin: 10px 0px 10px 0px;
    padding-left: 10px;
    padding-right: 10px;
}

.product_details_red{
    color: red;
}

.proof {
    border: solid 2px #808080;
   width: 240px;  
    margin-top:10px;
    margin-left: 10px;
    margin-bottom: 10px;
  padding: 0.5em 1em 0.5em 1em;
    }

.proof li {
  line-height: 1.5;
  padding: 0.5em 0;
   list-style-type: none!important;/*ポチ消す*/
}

.proof li:before {
  font-family: FontAwesome;
  content: "\f00c";
  left : 1em; /*左端からのアイコンまで*/
  color: red; /*アイコン色*/
}

.btn-square-slant {
    display: inline-block;
    margin: 10px 0px 20px 10px;
    padding: 10px 20px;
    border-radius: 10px;
    background: #668ad8;/*ボタン色*/
    border-bottom: solid 3px #36528c;/*ボタン色より暗めに*/
    border-right: solid 3px #5375bd;/*ボタン色より暗めに*/
    color: #ffffff;
    color: var(--text-bright-color);
    font-size: 14px;
    text-decoration: none;
            }
    
  .btn-square-slant:hover{
        background-image: linear-gradient(rgba(255,255,255,0.4),rgba(255,255,255,0.4));
       
    }
    
/*製品紹介　ラップストーン*/

.red{
    color: red;
}

.item{
    border-left: solid 5px #0066cc;/*左線*/
     border-bottom: solid 3px #d7d7d7;/*下線*/
   }

.product p{
    font-size:5vw;
    }

.product li{
    text-align: left;
}

.itemA,
.itemB,
.itemD
{
    text-align: center;
}

@media screen and (min-width: 768px){
    .itemA{
    text-align: left;
    
}
}

@media screen and (min-width: 768px){    
    .product p{
    font-size:20px;
}
    }

/*製品紹介　ラップストーン　許可*/
.proofA ul{
    border: solid 2px #808080;
   width: 240px;  
    margin-top:10px;
    margin-left: 20px;
    margin-bottom: 10px;
  padding: 0.5em 1em 0.5em 1em;
    }

.proofA li {
  line-height: 1.5;
  padding: 0.5em 0;
  list-style-type: none!important;/*ポチ消す*/
}

.proofA li:before {
  font-family: FontAwesome;
  content: "\f00c";
  left : 1em; /*左端からのアイコンまで*/
  color: red; /*アイコン色*/
}


.itemA{
    padding-right: 20px;
    line-height: 2;
}

/*製品紹介　ラップストーン　適用目安・選定要素、規格*/

.itemB{
    margin: 10px;
    }

.tbl-r03,
.tbl-r04{
   border-collapse: collapse;
    width: 100%;
    table-layout: fixed;}

.itemB th,
.itemB .thB{
  background: #dcdcdc;
  border: solid 1px #ccc;
  color: #000000;
  padding: 6px;
    
}

.itemB .thB1{
    width: 8em;
   
}
.itemB td {
  border: solid 1px #ccc;
  padding: 6px;
    text-align: center;
    
}

.tbl-r03 span{
    display: inline-block;
         }

.tbl-r03 td span{
    font-size: 16px;
    display: block;
    text-align: center;
}


.tbl-r03 .spanA{
    font-size: 11px;
    display: block;
    text-align: center;
   
       }

.tbl-r03 .spanF{
    font-size: 12px;
    display: block;
    text-align: center;
   
       }


.tbl-r03 .spanB{
    font-size:30px;
    line-height: 1;
   
    }


.tbl-r03 .spanC{
    font-size: 20px;
}

@media screen and (max-width: 640px) {
    
    .itemB{
    margin: 20px;
}

    .itemB .thB1{
    width: 3em;
   
}
  .tbl-r03 {
    width: 100%;
         }
    
  .tbl-r03 tr {
    display: block;
    float: left;
        }
   
 
  .tbl-r03 tr td, 
  .tbl-r03 tr th {
    border-left: none;
    display: block;
      padding: 6px 10px;
      height: 60px;
        }

    .tbl-r03 thead {
    display: block;
    float: left;
    width: 35%;
        font-size: 18px;
  }
  .tbl-r03 thead tr {
    width: 100%;

      
  }
  .tbl-r03 tbody {
    display: block;
    float: left;
    width: 65%;
   
       
  }
  .tbl-r03 tbody tr {
    width: 100%;
      
    
  }

      
  .tbl-r03 tr td + td {
    border-left: none;
        }

.tbl-r03 span,
.tbl-r03 .thA,
.tbl-r03 .spanB,
.tbl-r03 .spanC,
    .tbl-r03 .spanF
    {
    display: flex;
  align-items: center;
  justify-content: center;
    font-size: 4.5vw;
}

    .tbl-r03 span{
    vertical-align: middle;
    }

.tbl-r03 td span,
.tbl-r03 .spanA,
.tbl-r03 .spanD{
    font-size: 4.5vw;
        }
    
     .tbl-r03 .spanB{
    font-size:10vw;
    }

    .tbl-r03 .spanC{
       font-size: 8vw;
}
 

}

/*製品紹介　ラップストーン　特長*/

.product_tamawari{
    text-align: center;
    margin: 0 auto;
  
     
 }

.product_tamawari img{
    width: 100%;
    padding-left: 10px;   
     }

@media screen and (min-width: 768px){ 
    .product_tamawari{
    display: inline-block;
        margin: 20px;
     vertical-align: top;/*縦の表示位置も指定できる*/}
    
    .product_tamawari img{
    width: auto;
     }
}


/*製品紹介　ラップストーン　規格*/
@media screen and (max-width: 640px) {
    .tbl-r04{
        width: 100%;
        table-layout: auto;
    }
    
    .thD li{
        text-align: left;
        
    }
    
}

.itemB .thD {
  border-top: none;
 border-bottom: none;
        text-align: center;
    line-height: 1;
    
}

.itemB .thE {
    border-top: none;
   border-bottom: solid 1px  #ccc; 
    padding: 6px;
    text-align: center;
    
}

.itemB .thC{
    background: #ffffff;}

.itemB li{
    list-style-type: none;
    text-align: left;
}

.tbl-r04 span{
    display: inline-block;
}

caption{
    caption-side: bottom;
    text-align: left;
}

.itemB img{
    width: 100%;
}

@media screen and (min-width: 768px){   
    .itemB img{
    width: 80%;
    }}

/*製品紹介　ラップストーン　仕様*/
.tbl-r05{
   border-collapse: collapse;
    width: 100%;
}

.tbl-r05 span{
    display: inline-block;
}

.tbl-r05 td{
    font-size: 3vw;
}

.tbl-r05 td:nth-child(1){
    white-space:nowrap;
}

@media screen and (min-width: 768px){ 
    .tbl-r05 td{
    font-size: 16px;
        }}
.tbl-r05 td:nth-child(2),td:nth-child(3){
    text-align: left;
}

/*製品紹介　ラップストーン　施工方法*/
.itemC img{
    width: 100%;
}

@media screen and (min-width: 768px){
.itemC{
    overflow: hidden;
}

figure{
    float: left;
    margin-right: 1.25%;
    margin-bottom: 5px;
    width: 25%;
}

figure:last-child{
    margin-right: 0;
    }}


.itemD ul{
    border: solid 1px #ccc;
    margin: 0px 10px 0px 10px;
    padding: 10px;
    }

.itemD_ul{
    background: #00ffff;
}
.itemD li{
    list-style-type: none;
    text-align: center;
}

  .itemD_li{
        font-size: 5vw;
        font-weight: 600;
    }
   
.itemD .red{
    font-weight: 600;
    font-size: 6vw;
}

.itemD p{
    margin: 0;}

.mark{
    line-height:1;
    padding: 0.25em 0;
   
 }

.mark:before {
  font-family: "FontAwesome";
  content: '\f103';
  font-weight: 900;
    color: #0000cd;
    font-size: 20vw;
}
@media screen and (min-width: 768px){
    .itemD p{
              font-size: 28px;
        
    }
    .itemD ul{
       margin: 0 auto;
        width:500px;
                   }
    
    .itemD_li{
        font-size: 24px;
          }
    
    .itemD .red{
    font-weight: 600;
        font-size:36px; }
    
.mark{
    line-height:1;
    padding: 0.15em 0;
 }
    .mark:before {
        font-size: 100px;
    }
}

/*製品紹介　ラップストーン　安定メカニズム*/
.itemE{
    margin-right: 10px;
 }
.itemE_li{
    font-size: 5vw;
    }
.itemE img{
    width: 80%;
}
.itemE p{
        font-size: 4.5vw;
        padding-left: 0;
    }

.itemE_li_style{
    list-style-type: upper-latin;
     padding-left: 0;
}
@media screen and (min-width: 768px){
.itemE_li{
    font-size: 20px;
    }
 
.itemE p{
        font-size: 18px;
            }
.itemE_li_style{
     font-size: 18px;
}

.itemE_li_style p{
     font-size: 18px;
}.itemE img{
    width: 40%;
}
    
}

/*製品紹介　ラップブロック　規格*/

.tbl-r06{
   border-collapse: collapse;
        width: 100%;
   table-layout:fixed;
        }

.tbl-r06 span{
    display: inline-block;
     
}

.tbl-r06 td{
    text-align:center;
}

.tbl-r06 th.rowspan1{
     padding: 0px 10px 0px 10px;
    width: 8em;   /* セルの横幅：8文字分 */
white-space: nowrap;}

.tbl-r06 th.rowspan2{
     background: #ffffff;
    padding: 0px 10px 0px 10px;
      text-align: center;
}

.tbl-r06 .nowrap{
    padding: 0px 10px 0px 10px;
    white-space: nowrap;
    text-align: center;
    font-size: 18px;
}

.tbl-r06 .nowrap1{
  white-space: nowrap;
    text-align: center;
    font-size: 18px;
}

.tbl-r06 .tbl-r06_span{
    font-size: 20px;

}
@media screen and (max-width: 640px) {
    .tbl-r06{
     table-layout:auto; 
     margin: 0 auto;
        }
    
  .tbl-r06 th.rowspan1{
    width: 1em;   /* セルの横幅：8文字分 */}
    
.tbl-r06 .nowrap{
    white-space:normal;
    font-size: 2vw;
    width: 2em;
    
}

    .tbl-r06 .nowrap1{
    white-space:normal;
    width: 4em;
        font-size: 2.5vw;
        text-align: left;
    
}
    .tbl-r06 th,
    .tbl-r06 tD
    {
          font-size: 2.5vw;
    }
    
.tbl-r06 .tbl-r06_span{
          font-size: 2.5vw;
    width: 7em;
    text-align: center;
    }
    
    .tbl-r06 span,
    .tbl-r06 .tbl-r06_span{
    display: block;
     
}
.tbl-r06 th.rowspan2{
    padding: 5px;
    width: 1em;}

}

/*製品紹介　ラップブロック　特長*/

.product_block{
       margin: 0 auto;
    text-align: center;
}
.product_block img{
    width: 100%;
       }

@media screen and (min-width: 768px){ 
    .product_block{
    overflow: hidden;
                       }
   
    .product_block1{
        float:left;
        margin-right: 10px;
        margin-left: 20px;
        padding: 20px;
        width:40%; 
       
    }}
    
   
/*製品紹介　ラップブロック　施工方法*/
@media screen and (min-width: 768px){ 
.figure1{
    float: left;
    margin-right: 5%;
    margin-bottom: 5px;
    width:40%;
}

.figure1:last-child{
    margin-right: 0;
    }}

/*製品紹介　ラップブロック　明度テクスチャー法*/

.itemF{
    margin: 0px 20px 0px 10px;
    text-align: left;
   }

.itemF .itemF_p{
    font-size: 4vw;
    margin: 0;
    text-align: center;}

@media screen and (min-width: 768px){

.itemF{
        text-align: center;
   
    }

.itemF .itemF_p{
    font-size: 16px;
   
}}

.itemF .green{
    color: green;
    font-weight: 900;
}

.itemG{
    margin: 0px 20px 0px 10px;
      line-height: 2;
    text-align: left;
}

.itemA .lby_p{
    text-align: left;
    font-size: 5vw;
}

@media screen and (min-width: 768px){
    .itemA .lby_p{
        font-size: 20px;
    }
}

.lby_seko{
    width: 100%;
    
}

@media screen and (min-width: 768px){
    .lby_seko{
    display: inline-block;
    float: left;
    margin-left: 10px;
    margin-bottom: 20px;
  
}
 .lby_seko img{
     width:48%;}

}

/*会員一覧*/


.memberlist{
    width: 100%;
   
               }

.memberlist .memberlist_tr1{
    width: 40%;
    text-align: left;
         border-bottom: 3px dotted #7facc9;
    padding: 10px 0px 10px 20px;
    white-space: nowrap;
}

.memberlist .memberlist_tr2{
     border-bottom: 3px dotted #7facc9;
    padding: 5px 0px 10px 10px;
}
.memberlist .memberlist_tr{
     padding: 5px 0px 0px 10px;
   
    }

@media screen and (max-width: 640px) {
    
.memberlist{
    display: block;
    margin: 0 auto;
       }
        
    .memberlist .memberlist_tr1{
        display: block;
        border-bottom:hidden;
        padding-left: 0px; 
        padding-bottom: 0px;
    }    
    
    .memberlist .memberlist_tr2{
        display: block;
        width: 100%;              
        
    }
    
    .memberlist .memberlist_tr{
        display: block;
        
       
    }
    }

/* お問い合わせページ： 問い合わせ先 */
.contact {
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 20px;
    border: solid 1px #ddd;
    border: solid 1px var(--gray-color);
    text-align: center;
}

.contact span {
    display: inline-block;
    margin-bottom: 20px;
    font-size:2.2rem;
    width: 2em;
    line-height: 2em;
    border-radius: 50%;
    text-align: center;
    background-color: #5D9AB2;
    background-color: var(--main-color);
    color: #fff;
    color: var(--icon-color);
}

.contact h2 {
    margin-top: 0;
    font-size: 1.2rem;
}

.contact a{
    font-size: 1.4rem;
    color: inherit;
    text-decoration: none;
}

@media(min-width:768px){
    .contact-wrap{
        display: flex;
    }
    
    .contact {
        flex:1;
        
    }
    
    .contact:first-child {
        margin-right: 20px;
    }
}

/* お問い合わせページ： 地図 */
.location iframe {
    width: 100%;
    height: 400px;
    vertical-align: bottom;
}

.location h2{
    margin: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #0066cc;
    background-color: var(--main-color);
    color: #fff;
    color: var(--text-bright-color);
    font-size: 1.5rem;
    text-align: center;
}