@charset "UTF-8";

/* CSS Document */

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


/*-----------------------------------
    1. Body / Typography 
-----------------------------------*/
html{overflow-x: hidden}
body { font-size: 16px;
    background-color: #fff;
    color: #5d5c59;
	font-family:
    游ゴシック体, "Yu Gothic", YuGothic,メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    /*font-family: 'Roboto', sans-serif;*/
    line-height: 28px;
    font-weight: 300; }
.sp{display: none}
.pc{display: block}
.br-sp {
	display:none;
}
.br-pc {
	display:block;
}
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; margin-bottom: 10px; color: #18150d; font-weight: 400; 
    }
h1 { font-size: 32px; line-height: 42px; }
h2 { font-size: 24px; line-height: 32px; color:#0457CC; }
h3 { font-size: 18px; line-height: 28px; }
h4 { font-size: 16px; line-height: 24px; margin-bottom: 10px; }
h5 { font-size: 14px; }
h6 { font-size: 12px; }
p { margin: 0 0 20px; }
p:last-child { margin-bottom: 0px; }
ul, ol { margin: 0; }
ul li, ol li { }
a { color: #0457CC; text-decoration: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
a:focus, a:hover { text-decoration: none; color: #1fb4ff; }
 
b, strong {
    font-weight: 400;
}
.listnone {text-align: center; list-style: none; padding: 0px;display: inline-flex;margin: 0 auto}
.listnone li{margin: 0 15px}
.lead { font-size: 21px; color: #3c3c3c; font-weight: 400; }
.italic { font-style: italic; }
.small-text { color: #b4b1ac; font-size: 12px; }
.text-caps { text-transform: uppercase; letter-spacing: 2px; }
::selection { background: #a8cbfd; color: #333; }
h3 small { font-weight: 400; line-height: 1; color: #0457CC; font-size: 14px; }
 
hr { margin-top: 20px; margin-bottom: 20px; border: 0; border-top: 1px solid #f1f3f8; }
blockquote { padding: 10px 20px; margin: 0px; font-size: 21px; line-height: 32px; color: #3c3c3c; font-style: italic; border-left: 5px solid #0457CC; }
.tel-text{ margin-top: 40px; font-size: 25px;line-height: 38px;text-align:left}
.top-box{position: relative;width:100%;margin: 0 auto;text-align: center}
.top-box img{margin: 0 auto;width:100%;text-align: center}


/*-------------- align ------------*/

/* =WordPress Core
-------------------------------------------------------------- */

.alignnone { margin: 5px 20px 20px 0; }
.aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; }
.alignright { float: right; margin: 0px 0 30px 30px;  }
.alignleft { float: left; margin: 0px 30px 0px 0;   }
a img.alignright { float: right; margin: 0px 0 30px 30px; }
a img.alignnone { margin: 5px 20px 20px 0; }
a img.alignleft { float: left; margin: 5px 20px 20px 0; }
a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%;    /* Image does not overflow the content area */ padding: 5px 3px 10px; text-align: center; }
.wp-caption.alignnone { margin: 5px 20px 20px 0; }
.wp-caption.alignleft { margin: 5px 20px 20px 0; }
.wp-caption.alignright { margin: 5px 0 20px 20px; }
.wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; }

/*-----------------------------------
    2. Form css 
-----------------------------------*/
label { }
.control-label { color: #474747; font-weight: 700; font-size: 14px; text-transform: uppercase; }
.form-control { width: 100%; height: 50px; padding: 6px 12px; 
    font-size: 16px; line-height: 1.42857143; color: #333; background-color: #fff; border: 1px solid #dcd9d3; 
    background-image: none; border-radius: 10px; -webkit-box-shadow: inset 0 0px 0px rgba(255, 255, 255, .075); 
    box-shadow: inset 3px 3px 3px rgba(255, 255, 255, .075); margin-bottom: 15px; }
.form-control:focus { border-color: #bab6ae;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, .075), 0 0 8px rgba(255, 255, 255, .6);
    box-shadow: inset 0 3px 3px rgba(255, 255, 255, .075), 0 0 8px rgba(235, 237, 238, .6);
    background-color: #fffefd; }
.textarea.form-control { background-color: #f6f8f9; height: auto; }
.required { }
.form-news-letter .form-control { float: left; width: 75%; margin-right: 10px; }
.form-group { margin-bottom: 10px; }
.get-in-touch { }
.get-in-touch .form-control { margin-bottom: 10px; }


/*----------------------- 
    4.1 Section space :
-------------------------*/

/*Note: Section space help to create top bottom space;*/

.space-small { padding-top: 20px; padding-bottom: 20px; }
.space-medium {position: relative;margin: 0 auto; padding-top: 30px; padding-bottom: 30px; }
.space-large { padding-top: 120px; padding-bottom: 120px; }
.space-ex-large { padding-top: 140px; padding-bottom: 140px; }

/*----------------------
   4.2 Margin Space
-----------------------*/
.mb0 { margin-bottom: 0px; }
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb35 { margin-bottom: 35px; }
.mb40 { margin-bottom: 40px; }
.mb60 { margin-bottom: 60px; }
.mb80 { margin-bottom: 80px; }
.mb100 { margin-bottom: 100px; }
.mt0 { margin-top: 0px; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt60 { margin-top: 60px; }
.mt70 { margin-top: 70px; }
.mt80 { margin-top: 80px; }
.mt100 { margin-top: 100px; }
.mt350 { margin-top: 350px; }
.mt450 { margin-top: 450px; }

/*----- less margin space from top --*/
.mt-20 { margin-top: -20px; }
.mt-40 { margin-top: -40px; }
.mt-60 { margin-top: -60px; }
.mt-80 { margin-top: -80px; }

/*-----------------------
   4.3 Padding space
-------------------------*/
.nopadding { padding: 0px; }
.nopr { padding-right: 0px; }
.nopl { padding-left: 0px; }
.pinside10 { padding: 10px; }
.pinside20 { padding: 20px; }
.pinside30 { padding: 30px; }
.pinside40 { padding: 40px; }
.pinside50 { padding: 50px; }
.pinside60 { padding: 60px; }
.pinside80 { padding: 80px; }
.pinside130 { padding: 130px; }
.pdt10 { padding-top: 10px; }
.pdt20 { padding-top: 20px; }
.pdt30 { padding-top: 30px; }
.pdt40 { padding-top: 40px; }
.pdt60 { padding-top: 60px; }
.pdt80 { padding-top: 80px; }
.pdb10 { padding-bottom: 10px; }
.pdb20 { padding-bottom: 20px; }
.pdb30 { padding-bottom: 30px; }
.pdb40 { padding-bottom: 40px; }
.pdb60 { padding-bottom: 60px; }
.pdb80 { padding-bottom: 80px; }
.pdl10 { padding-left: 10px; }
.pdl20 { padding-left: 20px; }
.pdl30 { padding-left: 30px; }
.pdl40 { padding-left: 40px; }
.pdl60 { padding-left: 60px; }
.pdl80 { padding-left: 80px; }
.pdr10 { padding-right: 10px; }
.pdr20 { padding-right: 20px; }
.pdr30 { padding-right: 30px; }
.pdr40 { padding-right: 40px; }
.pdr60 { padding-right: 60px; }
.pdr80 { padding-right: 80px; }

/*--------------------------------
4.4 Background & Block color 
----------------------------------*/
.bg-light { background-color: #F7F7F8; }
.bg-primary { background-color: #0457CC; }
.bg-default { }
.bg-white { background-color: #fff; }
.outline { border: 1px solid #e5e7ec; }
.section-title { }
.title { color: #18150d; }
.small-title{color: #84837f; font-size: 13px; letter-spacing: 1px; margin-bottom: 20px;}
.text-white { color: #fff; }
.primary-sidebar { }
.secondary-sidebar { }
.well-block{background-color: #fff;padding: 40px 7%;}

/*--------------------------------
5 Header / Navigations 
----------------------------------*/

/*--------------------
    5.1 Header Regular 
   ----------------------*/

.logo {width:80px; position: absolute; top:0px;left:20px; z-index:2}
.logo:hover {opacity: .5}
.header {height: 80px; background-color: #fff; z-index: 1; position: relative; padding-top: 0px;box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .1);padding: 0 1%}
.top-text { text-align: right; }
.top-text .text-block { padding-left: 20px; color: #fff; line-height: 18px; }

.inquiry-box {position: absolute;top:35px;right:1%}
.inquiry-box img{width: 170px;margin: 0 0 0 10px}
.inquiry-box a{color:#000}
.top-img{width: 100%;margin: 0 auto; margin-top: 40px}


/*--------------------------
    5.2 Navigations Regular
   ----------------------------*/

.hero-section {width: 100%; text-align: center; padding-top: 0px; padding-bottom: 0px; margin: 0 auto; /*background: linear-gradient(rgba(36, 39, 38, 0.5), rgba(36, 39, 38, 0.5)), rgba(36, 39, 38, 0.5) url(../images/hero-img.jpg) no-repeat center;*/ }
.hero-caption { padding-top: 100px; padding-bottom: 100px; }
.hero-title {width: 100%; font-family:
    游ゴシック体, "Yu Gothic", YuGothic,;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    font-size: 33px; color: #fff; line-height: 58px; font-weight: 600; margin-bottom: 30px; letter-spacing: -1px; margin: 0 auto}
.hero-text {text-align: center; font-size: 43px; color: #000; line-height: 58px; font-weight: bold; letter-spacing: -1px; margin: 0 auto;margin-bottom: 30px;margin-top: 40px}

.all-container{width: 1000px;margin: 0 auto}

nav.globalMenuSp{width:100%;text-align: left;}

nav.globalMenuSp ul {
    float: left;
    margin-left: 100px;
    margin-top: 43px;
  width: 100%;
}

nav.globalMenuSp ul li {
display: inline-block;
  list-style-type: none;
  padding: 0 10px ;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #000;
  text-decoration :none;
font-size: 18px;
    font-weight: normal
}
nav.globalMenuSp ul li a:hover {
 opacity: .3;

}



/*----------------------------------------------
    5.4 Page Header
----------------------------------------------*/
.page-header { background: linear-gradient(rgba(36, 39, 38, 0.5), rgba(36, 39, 38, 0.5)), rgba(36, 39, 38, 0.5) url(../images/page-header.jpg) no-repeat center; background-size: cover; margin: 0; border-bottom: none; padding-bottom: 0px; }
.page-caption { padding: 120px 0px; position: relative; z-index: 1; color: #fff; text-align: center; }
.page-caption h1 { color:#fff;}
.page-caption h5 { color:#fff;}
.page-title { color: #000; font-weight: bold;font-size: 30px; font-weight: bold; letter-spacing: -1px; }
.breadcrumb { }
.breadcrumb>.active { }
.page-breadcrumb {   }
.page-breadcrumb .breadcrumb { background-color: transparent; margin-bottom: 0px; font-size: 12px; text-transform: uppercase; }

.page-ttl{font-size:35px;font-weight: bold;color: #2cbfb1;text-align: center}
.page-text{margin-top: 30px; font-size: 17px;line-height: 30px;text-align: justify;}



/*-----------------------------------
8. Footer 
-------------------------------------*/
.footer { background-color: #fff; padding-top: 60px; padding-bottom: 60px;margin-top: 60px ;box-shadow: 1px  1px 0 2px rgba(0, 0, 0, .1);padding: 0 2%}
.footer-block{margin-top: 30px}
.footer-widget p { color: #747474; }
.footer-widget .widget-title { color: #fff; font-weight: 600; padding-bottom: 20px; margin-bottom: 30px; }
.footer-widget .widget-title  img {
	width:180px;
}
.footer-widget {text-align: center; margin: 0 auto}
.footer-widget ul { }
.footer-widget li { }
.footer-widget li a { color: #747474; line-height: 34px; }
.footer-widget li a:hover {opacity: .5; }
.footer-link { }
.footer-social { }
.footer-social ul { }
.footer-social ul li { }
.footer-social ul li a i { padding-right: 10px; width: 30px; }
.footer-social ul li a:hover i { color: #0457CC; }
.footer .contact li { position: relative; padding-left: 40px; display: block; '
margin-bottom: 8px; padding: 0 0 8px 0px; color: #747474; }

.widget-newsletter .form-control { height: 48px; color: #eee; background-color: #393836; border: none; box-shadow: none; 
    font-size: 14px; border-radius: 30px 0px 0px 30px;}
.widget-newsletter button { height: 48px; }

/*-------------- tiny footer ------------*/
.tiny-footer {  padding-top: 19px; padding-bottom: 9px; font-size: 12px; 
    color: #56575e; text-align: left; text-transform: uppercase; text-align: center; }
.copyright-content { padding: 12px; color: #747474; }

/*-----------------------------------
9. Pages 
-------------------------------------*/

.text-line{width: 300px;margin: 0 auto; margin-top: 15px;border: solid 2px }
.table-ttl{margin-top: 40px;font-weight: bold;font-size: 1.3vmax;line-height: 2vmax;color: #01b53d}


th{color: #000; background-color:#a4e4b9 ; padding: 10px;text-align: center}
td{color: #000;padding: 10px 15px; text-align: left}
.td2{text-align: center}

/*--------------------------
  9.4  common
---------------------------*/
.common-wide{width: }
.common-box{margin: 0 auto;margin-top: 30px;display: inline-block;width: 100%}
.common-box2{margin: 0 auto;margin-top: 30px;display: inline-block;width: 100%}
.common-ttl{font-size: 32px;line-height: 48px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 40px}
.common-ttl2{font-size: 24px;line-height: 33px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 10px}
.common-ttl3{font-size: 24px;line-height: 33px;font-weight: bold;color: #000;margin-top: 0px;padding: 1% 2%;background-color: #E0F1FE;display:inline-block;margin: 0 auto}
.common-ttl4{font-size: 23px;line-height: 37px;font-weight: bold;color: #000;margin-top: 20px;text-align: left;display: inline-block}
.common-ttl5{font-size: 20px;line-height: 28px;font-weight: normal;color: #000;margin-top: 20px;text-align:center}
.padding-box{padding:5%;}

.ttl{color: #999999;font-size: 32px;line-height: 48px;text-align: center;font-weight: bold;color: #2cbfb1}
.common-text{text-align: justify;
text-justify: inter-ideograph;margin-top: 20px; font-size: 20px;line-height: 32px;}
.common-text2{margin-top: 20px; font-size: 22px;line-height: 32px}
.common-text3{text-align: justify;
text-justify: inter-ideograph;margin-top: 10px; font-size: 17px;line-height: 28px}
.common-text-left{margin-top: 40px; font-size: 20px;line-height: 40px;text-align: justify;
text-justify: inter-ideograph;}
.bar{margin: 0 auto;text-align: center}
.bar img{width:30%}
.ttl-box{width: 100%;margin: 0 auto}
.space-bar{width: 100%;height: 1px;background-color: #e2e2e2;margin: 80px auto 0}

/*--------------------------
roof
---------------------------*/
.under-line{margin-top: 60px; font-size: 35px; font-weight: bold;}
.list{text-align: left;margin-top: 30px}
.list li{text-decoration: none;list-style: none;text-align: left;font-size: 32px;line-height:50px;  color: #000;}
.roof-img{width: 100%; margin: 0 auto;margin-top: 20px;text-align: center}
.roof-img img{width: 100%}
.sample1{width: 100%;margin-top: 20px;}
.sample2{width: 100%;margin-top: 5px;}
.sample3{width: 40%;margin: 5px auto 0;}
.sample4{width: 30%;margin: 5px auto 0;}
.nega-box{margin: 35px auto 0;text-align: center}
.nega-box3{margin: 5px auto 0;text-align: center;display: inline-block}
.graph{width: 60%;text-align: center}

/*--------------------------
insurence
---------------------------*/
#insurence{width: 100%;margin: 60px auto 0}
#insurence img{width: 100%}

/*--------------------------
wall-painting
---------------------------*/
#wall-painting{width: 100%;margin: ３0px auto 0}

/*--------------------------
consult
---------------------------*/
.consult-box{height: 330px}

/*--------------------------
construction_example
---------------------------*/
#construction_example{width: 70%;margin: 30px auto 0}

/*--------------------------
question
---------------------------*/
#question{width: 100%;margin: 30px auto 0}
.qa-icon{width: 30%}

/*--------------------------
description
---------------------------*/
.nega-box .certification{margin: 50px auto 0; width: 50%;}
#description{width: 100%;position: relative;}
.number{margin-top: 30px; font-size: 32px;font-weight: bold;color: #2cbfb1;text-align: center}
.point{font-size: 32px;font-weight: bold;color: #2cbfb1;
background: linear-gradient(transparent 40%, yellow 40%);
text-align: center;display: table;
  margin: auto;}


/*-------------------------
  9.9 Company
---------------------------*/


#company{width:100%;margin:40px auto 0;position: relative;text-align: center}
.company-box{display: table;
  margin: 0 auto;text-align: center;}
.company-ttl{font-size: 22px;text-align:center}

.__th{background: none}

table.company {
display: table;
  margin: 0 auto;text-align: center;
}

table.company th {
width:7%;
min-height: 13px;
padding: 0px 10px 15px 0;
text-align: justify;
text-justify: inter-ideograph;
vertical-align: top;
border: none;
white-space: nowrap;
overflow: visible;
font-feature-settings: "palt";
    text-align:justify;
  text-justify: inter-ideograph;
    font-weight: 100;
  font-size: 16px;
  line-height: 20px;
  color: #4d4d4d;letter-spacing: 1px;
     text-align-last: justify;       /* Chrome・Firefox用 */
  text-justify: inter-ideograph;  /* IE・Edge用 */
}

table.company th::after {
float: right;
padding: 0;
right: 10px;
top: 0;
height: 0;
width:0;
position: relative;
pointer-events: none;
border: none;
}

table.company td {
height: 12px;
margin: 0;
padding: 0px 10px 15px 10px;
text-align: left;
vertical-align: top;
border: none;
line-height: 20px;
    font-feature-settings: "palt";
    text-align:justify;
  text-justify: inter-ideograph;
    font-weight: 100;
  font-size: 16px;
  line-height: 20px;
  color: #4d4d4d;letter-spacing: 1px;
}

table.company tr {
border: none;
}

.__th{text-align: right}


/*--------------------------
movie
---------------------------*/

#movie{
  margin: 40px auto;
  text-align: center;
}
.movie{
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

/*--------------------------
contact
---------------------------*/
.inquire{width: 100%;margin-top: 100px;height: 210px;background: #00b900}

.inquire:before{content:"";
  display:block;
  z-index:1;
  width:100%;
  height:210px;
  background:url(../img/_inquire.png)center no-repeat;
  background-size:contain;}

.inquire2{width: 100%;margin-top: 100px;height: 210px;background: #00b900}

.inquire2:before{content:"";
  display:block;
  z-index:1;
  width:100%;
  height:210px;
  background:url(../img/_inquire2.png)center no-repeat;
  background-size:contain;}



/*-------------------------
  btn
---------------------------*/
.consult{width: 100%;margin: 40px auto;text-align: center;color: #fff}
.btn{color: #fff;background-color: #3FA8F4;padding: 1% 7%;font-size: 27px;font-weight: 600;border-radius: 35px}
.btn:hover{opacity: .7}
.consult a{color: #fff}
.consult a:hover{color: #fff}

/*-------------------------
  footer chase btn
---------------------------*/
        
.chase-btn1{position: fixed;bottom: -3px;left:15px; width:100%;vertical-align:top; /* 上端揃え */}
.chase-btn2{position: fixed;bottom: -3px;left:160px; width:100%;vertical-align:top; /* 上端揃え */}
.chase img{
  width: 140px
}
.chase img:hover{
  width: 140px;
  padding-bottom: 3px;
  transition: .4s ;
}
.chase-btn img:hover{opacity: .5}
.chase-left{position: fixed;bottom: 0;left:0; width:50%;vertical-align:top; /* 上端揃え */}
.chase-right{position: fixed;bottom: 0;right:0;width:50%;vertical-align:top; /* 上端揃え */}
.chase-left img{width:100%;}
.chase-right img{width:100%;}


/*下から上にフェードイン*/
.down-to-top {
  opacity: 0.1;
  transform: translateY(80px);
  transition: all 1s;
}
.down-to-top.scrollin {
  opacity: 1;
  transform: translateY(0);
}

/*ページトップボタン*/
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right:0;
  bottom:7px;
  background: #000;
  opacity: 1;
        z-index: 10001;
  }
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f062';
  font-size: 15px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}


/*==========  Non-Mobile First Method  ==========*/

    /* Large Devices, Wide Screens */
    @media only screen and (max-width : 1200px) {
     body{width:100%}
     .navigation {}
     .hero-title {font-size: 30px; line-height: 40px;}
     .hero-section {padding-top: 0px; padding-bottom: 0px;}
     .footer-widget {margin-bottom: 20px;}
     .footer-widget .widget-title {margin-bottom: 0px;}
        nav.globalMenuSp{width:100%;text-align: left;}

nav.globalMenuSp ul {
    float: left;
    margin-left: 100px;
    margin-top: 45px;
  width: 100%;
}

nav.globalMenuSp ul li {
display: inline-block;
  list-style-type: none;
  padding: 0 10px ;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #000;
  text-decoration :none;
font-size: 17px;
    font-weight: normal
}
nav.globalMenuSp ul li a:hover {
  color: #000;

}
     .sp{display: none}
     .pc{display: block}
    }

    /* Medium Devices, Desktops */
    @media only screen and (max-width : 992px) {
	body{width:992px;overflow-x: hidden}
        .logo {}
     .navigation {}
     .hero-title {font-size: 30px; line-height: 40px;}
     .hero-section {padding-top: 0px; padding-bottom: 0px;}
     .comment-info {padding-left: 100px;}
     .footer-widget {margin-bottom: 20px;}
     .footer-widget .widget-title {margin-bottom: 0px;}
    .space-medium {width:100%}
    .all-container{width: 100%;margin: 0 auto}
    
        
/*--------------------------
  9.4  common
---------------------------*/
.common-box{margin: 0 auto;margin-top: 30px;display: inline-block;width: 100%}
.common-box2{margin: 0 auto;margin-top: 30px;display: inline-block;width: 100%}
.common-ttl{font-size: 32px;line-height: 48px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 40px}
.common-ttl2{font-size: 24px;line-height: 33px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 10px}
.common-ttl3{font-size: 24px;line-height: 33px;font-weight: bold;color: #000;margin-top: 0px;padding: 1% 2%;background-color: #E0F1FE;display:inline-block;margin: 0 auto}
.common-ttl4{font-size: 23px;line-height: 37px;font-weight: bold;color: #000;margin-top: 20px;text-align: left;display: inline-block}
.common-ttl5{font-size: 20px;line-height: 28px;font-weight: normal;color: #000;margin-top: 20px;text-align:center}
.padding-box{padding:5%;}

.ttl{color: #999999;font-size: 32px;line-height: 48px;text-align: center;font-weight: bold;color: #2cbfb1}
.common-text{text-align: justify;
text-justify: inter-ideograph;margin-top: 20px; font-size: 20px;line-height: 32px}
.common-text2{margin-top: 20px; font-size: 22px;line-height: 32px}
.common-text3{text-align: justify;
text-justify: inter-ideograph;margin-top: 10px; font-size: 17px;line-height: 28px}
.common-text-left{margin-top: 40px; font-size: 20px;line-height: 40px;text-align: justify;
text-justify: inter-ideograph;}
.bar{margin: 0 auto;text-align: center}
.bar img{width:30%}
.ttl-box{width: 100%;margin: 0 auto}
.space-bar{width: 100%;height: 1px;background-color: #e2e2e2;margin: 80px auto 0}

    
    /*--------------------------
roof
---------------------------*/
.under-line{margin-top: 60px; font-size: 35px; font-weight: bold;}
.list{text-align: left;margin-top: 30px}
.list li{text-decoration: none;list-style: none;text-align: left;font-size: 32px;line-height:50px;  color: #000;}
.roof-img{width: 100%; margin: 0 auto;margin-top: 20px;text-align: center}
.roof-img img{width: 100%}
.sample1{width: 100%;margin-top: 20px;}
.sample2{width: 100%;margin-top: 5px;}
.sample3{width: 40%;margin: 5px auto 0;}
.sample4{width: 30%;margin: 5px auto 0;}
.nega-box{margin: 35px auto 0;text-align: center}
.nega-box3{margin: 5px auto 0;text-align: center;display: inline-block}
.graph{width: 60%;text-align: center}

/*--------------------------
insurence
---------------------------*/
#insurence{width: 100%;margin: 60px auto 0}
#insurence img{width: 100%}

/*--------------------------
wall-painting
---------------------------*/
#wall-painting{width: 100%;margin: ３0px auto 0}
        
/*--------------------------
consult
---------------------------*/
.consult-box{height: 330px}

/*--------------------------
construction_example
---------------------------*/
#construction_example{width: 70%;margin: 30px auto 0}

/*--------------------------
question
---------------------------*/
#question{width: 100%;margin: 30px auto 0}
.qa-icon{width: 30%}

/*--------------------------
description
---------------------------*/
.nega-box .certification{margin: 50px auto 0; width: 50%;}
#description{width: 100%;position: relative;}
.des{width: 100%}
.des img{position: absolute;
  top: 73%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;}
.des-box{width:500px;margin:0 auto}
.number{margin-top: 30px; font-size: 32px;font-weight: bold;color: #2cbfb1;text-align: center}
.point{font-size: 32px;font-weight: bold;color: #2cbfb1;
background: linear-gradient(transparent 40%, yellow 40%);
text-align: center;display: table;
  margin: auto;}


/*-------------------------
  9.9 Company
---------------------------*/

.company-table table{border:0px}
.company-table table tr{border:0px ;border-bottom:solid 1px}
        
    .sp{display: none}
     .pc{display: block}
    }

/* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 767px) {
        /*--------------------------
consult
---------------------------*/
.consult-box{height:auto}
}


    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {
	 body{width:100%}
        .header{position: fixed;width: 100%;height:70px}
        .logo {width:60px;position: absolute; top:7px;left: 6%; z-index:999}
        .hero-section{padding:0;padding-top:0px; margin: 0 auto}
        .inquiry-box{display: none}
        .inquiry-box img{margin-left: 30px; width:80%;}
     .navigation { float: none; }
          /*　ハンバーガーボタン　*/
.hamburger {
  display : block;
  position: fixed;
  z-index : 3;
  right : 13px;
  top   : 17px;
  width : 42px;
  height: 42px;
  cursor: pointer;
  text-align: center;
}
.hamburger span {
  display : block;
  position: absolute;
  width   : 30px;
  height  : 2px ;
  left    : 6px;
  background : #555;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition   : 0.3s ease-in-out;
  transition        : 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
  top: 10px;
}
.hamburger span:nth-child(2) {
  top: 20px;
}
.hamburger span:nth-child(3) {
  top: 30px;
}

/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top : 16px;
  left: 6px;
  background :#000;
  -webkit-transform: rotate(-45deg);
  -moz-transform   : rotate(-45deg);
  transform        : rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top: 16px;
  background :#000;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}

nav.globalMenuSp {
  position: fixed;
  z-index : 2;
  top  : 0;
  left : 0;
  color: #fff;
  background: #fff;
  text-align: center;
  width: 100%;
  opacity: 0;
  transition: opacity .6s ease, visibility .6s ease;
}

nav.globalMenuSp ul {
  margin: 0 auto;
  padding:70px 40px;
  width: 100%;
    text-align: left
}

nav.globalMenuSp ul li {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: .4s all;
border-bottom: 1px solid #999999
}
nav.globalMenuSp ul li:last-child {
  padding-bottom: 0;
}
nav.globalMenuSp ul li:hover{
  background :#ddd;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #999999;
  padding: 1em 0;
  text-decoration :none;
}

/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
  opacity: 100;

}
     .hero-title {font-size: 33px; line-height: 45px;}
    
     .footer-widget {margin-bottom: 20px;}
     .footer-widget .widget-title {margin-bottom: 0px;}
    .listnone {text-align:left; list-style: none; padding: 0px;display: block;margin: 0 auto}
.listnone li{margin: 0 15px}
  
.common-ttl{color: #999999;font-size: 23px;line-height:38px;text-align:left;font-weight: bold;color: #2cbfb1;margin-top:30px}
.common-text-left{margin-top: 20px; font-size: 18px;line-height: 30px;text-align: justify;
text-justify: inter-ideograph;}
.space-medium {width:100%}
.space-medium {padding: 3%;margin-bottom: 0;margin-top: 0}
.p-box{width: 100%;margin-top: 20px;}
.number{display: inline; width: 10%; margin-top: 33px; font-size: 23px;line-height: 0; font-weight: bold;color: #2cbfb1;text-align: left}
.point{width: 70%; margin-top:15px; font-size: 23px;line-height: 32px font-weight: bold;color: #2cbfb1;display: inline;background: linear-gradient(transparent 40%, yellow 40%)}
.mt350{display: none}
        
.all-container{width: 100%;margin: 0 auto}
        
/*--------------------------
  9.4  common
---------------------------*/
.common-box{margin: 0 auto;margin-top: 30px;display: inline-block;width: 100%}
.common-box2{margin: 0 auto;margin-top: 30px;display: inline-block;width: 100%}
.common-ttl{font-size: 24px;line-height: 34px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 25px}
.common-ttl2{font-size: 24px;line-height: 33px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 20px}
.common-ttl3{font-size: 24px;line-height: 33px;font-weight: bold;color: #000;margin-top: 0px;padding: 1% 2%;background-color: #E0F1FE;display:inline-block;margin: 0 auto}
.common-ttl4{font-size: 23px;line-height: 35px;font-weight: bold;color: #000;margin-top: 20px;text-align: left;display: inline-block}
.common-ttl5{font-size: 20px;line-height: 28px;font-weight: normal;color: #000;margin-top: 20px;text-align:center}
.padding-box{padding:5%;}

.ttl{color: #999999;font-size: 32px;line-height: 48px;text-align: center;font-weight: bold;color: #2cbfb1}
.common-text{text-align: justify;
text-justify: inter-ideograph;margin-top: 20px; font-size: 18px;line-height: 27px}
.common-text2{margin-top: 20px; font-size: 22px;line-height: 32px}
.common-text3{text-align: justify;
text-justify: inter-ideograph;margin-top: 10px; font-size: 17px;line-height: 28px}
.common-text-left{margin-top: 40px; font-size: 20px;line-height: 40px;text-align: justify;
text-justify: inter-ideograph;}
.bar{margin: 0 auto;text-align: center}
.bar img{width:30%}
.ttl-box{width: 100%;margin: 0 auto}
.space-bar{width: 100%;height: 1px;background-color: #e2e2e2;margin: 80px auto 0}

    
    /*--------------------------
roof
---------------------------*/
.under-line{margin-top: 60px; font-size: 35px; font-weight: bold;}
.list{text-align: left;margin-top: 30px}
.list li{text-decoration: none;list-style: none;text-align: left;font-size: 32px;line-height:50px;  color: #000;}
.roof-img{width: 100%; margin: 0 auto;margin-top: 20px;text-align: center}
.roof-img img{width: 100%}
.sample1{width: 100%;margin-top: 20px;}
.sample2{width: 100%;margin-top: 5px;}
.sample3{width: 30%;margin: 5px auto 0;}
.sample4{width: 80%;margin: 5px auto 0;}
.nega-box{margin: 15px auto 0;text-align: center}
.nega-box3{margin: 5px auto 0;text-align: center;display: inline-block}
.graph{width: 100%;text-align: center}

/*--------------------------
insurence
---------------------------*/
#insurence{width: 100%;margin: 60px auto 0}
#insurence img{width: 100%}

/*--------------------------
wall-painting
---------------------------*/
#wall-painting{width: 100%;margin: ３0px auto 0}

/*--------------------------
construction_example
---------------------------*/
#construction_example{width: 70%;margin: 30px auto 0}

/*--------------------------
question
---------------------------*/
#question{width: 100%;margin: 30px auto 0}
.qa-icon{width: 30%}

/*--------------------------
description
---------------------------*/
.nega-box .certification{margin: 50px auto 0; width: 80%;}
#description{width: 100%;position: relative;}


/*-------------------------
  9.9 Company
---------------------------*/

.company-table table{border:0px}
.company-table table tr{border:0px ;border-bottom:solid 1px}

/*--------------------------
contact
---------------------------*/
.inquire{width: 100%;margin-top:50px;height: 100px;background: #00b900}

.inquire:before{content:"";
  display:block;
  z-index:1;
  width:100%;
  height:100px;
  background-size:contain;}
        
        
.t-text{text-align: left;text-align: justify;
text-justify: inter-ideograph;}

/*-------------------------
  btn
---------------------------*/
.consult{width: 100%;margin: 30px auto;text-align: center;color: #fff}
.btn{color: #fff;background-color: #3FA8F4;padding: 3% 20%;font-size: 23px;font-weight: 600;border-radius: 35px}
.btn:hover{opacity: .7}
.consult a{color: #fff}
.consult a:hover{color: #fff}
        
        
/*-------------------------
  footer chase btn
---------------------------*/
        
.chase-sp-btn{
  width: 100%;
  display: flex;
  justify-content: space-between;
position: fixed;
bottom: 0;
left:0;
vertical-align:top;
padding: 0;
margin: 0;
letter-spacing: -1em;
}
        .chase{
          padding: 0;margin: 0;
        }
        .chase img{width: 50%;
          letter-spacing: -1em;padding: 0;margin: 0;}
          .chase img:hover{width: 50%;
            letter-spacing: -1em;padding: 0;margin: 0;
          opacity: .7;}
.chase-btn{width:100%;}
.chase-left{position: fixed;bottom: 0;left:0; width:50%;vertical-align:top; /* 上端揃え */}
.chase-right{position: fixed;bottom: 0;right:0;width:50%;vertical-align:top; /* 上端揃え */}
.chase-left img{width:100%;}
.chase-right img{width:100%;}


.space{height: 100px}

.br-sp {
	display:block;
}
.br-pc {
	display:none;
}
     .pc{display: none}
     .sp{display:block}

    }

    /* Custom, iPhone Retina */ 
    @media only screen and (max-width : 320px) {
		.logo {}
     .navigation { float: none; }
     .hero-title {font-size: 25px; line-height: 40px;}
     .hero-section {margin-top: 70px; padding-bottom: 0;}
     .comment-info {padding-left: 100px;}
     .footer-widget {margin-bottom: 20px;}
     .footer-widget .widget-title {margin-bottom: 0px;}
     .page-caption {padding: 80px 0px;}
     .common-ttl{margin: 0}
        
    .all-container{width: 100%;margin: 0 auto}
        
/*--------------------------
  9.4  common
---------------------------*/
.common-box{margin: 0 auto;margin-top: 10px;display: inline-block;width: 100%}
.common-box2{margin: 0 auto;margin-top: 10px;display: inline-block;width: 100%}
.common-ttl{font-size: 20px;line-height: 30px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 25px}
.common-ttl2{font-size: 20px;line-height: 30px;text-align: center;font-weight: bold;color: #FF7BAB;margin-top: 20px}
.common-ttl3{font-size: 20px;line-height: 30px;font-weight: bold;color: #000;margin-top: 0px;padding: 1% 2%;background-color: #E0F1FE;display:inline-block;margin: 0 auto}
.common-ttl4{font-size: 20px;line-height: 30px;font-weight: bold;color: #000;margin-top: 20px;text-align: left;display: inline-block}
.common-ttl5{font-size: 17px;line-height: 27px;font-weight: normal;color: #000;margin-top: 20px;text-align:center}
.padding-box{padding:5%;}

.ttl{color: #999999;font-size: 32px;line-height: 48px;text-align: center;font-weight: bold;color: #2cbfb1}
.common-text{text-align: justify;
text-justify: inter-ideograph;margin-top: 20px; font-size: 16px;line-height: 26px}
.common-text2{margin-top: 20px; font-size: 17px;line-height: 26px}
.common-text3{text-align: justify;
text-justify: inter-ideograph;margin-top: 10px; font-size: 17px;line-height: 28px}

.bar{margin: 0 auto;text-align: center}
.bar img{width:30%}
.ttl-box{width: 100%;margin: 0 auto}
.space-bar{width: 100%;height: 1px;background-color: #e2e2e2;margin: 80px auto 0}

    
    /*--------------------------
roof
---------------------------*/
.under-line{margin-top: 60px; font-size: 35px; font-weight: bold;}
.list{text-align: left;margin-top: 30px}
.list li{text-decoration: none;list-style: none;text-align: left;font-size: 32px;line-height:50px;  color: #000;}
.roof-img{width: 100%; margin: 0 auto;margin-top: 20px;text-align: center}
.roof-img img{width: 100%}
.sample1{width: 100%;margin-top: 20px;}
.sample2{width: 100%;margin-top: 5px;}
.sample3{width: 30%;margin: 5px auto 0;}
.sample4{width: 80%;margin: 5px auto 0;}
.nega-box{margin: 5px auto 0;text-align: center}
.nega-box3{margin: 5px auto 0;text-align: center;display: inline-block}
.graph{width: 100%;text-align: center}

/*--------------------------
insurence
---------------------------*/
#insurence{width: 100%;margin: 20px auto 0}
#insurence img{width: 100%}

/*--------------------------
wall-painting
---------------------------*/
#wall-painting{width: 100%;margin: 20px auto 0}

/*--------------------------
construction_example
---------------------------*/
#construction_example{width: 70%;margin: 20px auto 0}

/*--------------------------
question
---------------------------*/
#question{width: 100%;margin: 30px auto 0}
.qa-icon{width: 30%}

/*--------------------------
description
---------------------------*/
.nega-box .certification{margin: 20px auto 0; width: 80%;}
#description{width: 100%;position: relative;}


/*-------------------------
  9.9 Company
---------------------------*/

.company-table table{border:0px}
.company-table table tr{border:0px ;border-bottom:solid 1px}

     .pc{display: none}
     .sp{display:block}
        



	}