@charset "UTF-8";

/*--------------------------------------------

1. Basic
2. Slider
3. Drawer menu
4. Common Parts
5. Navigation
6. Contents
7. Table
8. List
9. Form

----------------------------------------------*/

/* **************************************************************************

1. Basic

************************************************************************** */

body {
    background:#fff;
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
    color:#333;
    box-sizing:border-box;
}

a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}

.mgnT10{margin-top:10px !important;}
.mgnT20{margin-top:20px !important;}
.mgnT30{margin-top:30px !important;}
.mgnT40{margin-top:40px !important;}
.mgnT50{margin-top:50px !important;}

.mgnR10{margin-right:10px !important;}
.mgnR20{margin-right:20px !important;}
.mgnR30{margin-right:30px !important;}
.mgnR40{margin-right:40px !important;}
.mgnR50{margin-right:50px !important;}

.mgnB10{margin-bottom:10px !important;}
.mgnB20{margin-bottom:20px !important;}
.mgnB30{margin-bottom:30px !important;}
.mgnB40{margin-bottom:40px !important;}
.mgnB50{margin-bottom:50px !important;}

.mgnL10{margin-left:10px !important;}
.mgnL20{margin-left:20px !important;}
.mgnL30{margin-left:30px !important;}
.mgnL40{margin-left:40px !important;}
.mgnL50{margin-left:50px !important;}

.pddT10{padding-top:10px !important;}
.pddT20{padding-top:20px !important;}
.pddT30{padding-top:30px !important;}
.pddT40{padding-top:40px !important;}
.pddT50{padding-top:50px !important;}

.pddR10{padding-right:10px !important;}
.pddR20{padding-right:20px !important;}
.pddR30{padding-right:30px !important;}
.pddR40{padding-right:40px !important;}
.pddR50{padding-right:50px !important;}

.pddB10{padding-bottom:10px !important;}
.pddB20{padding-bottom:20px !important;}
.pddB30{padding-bottom:30px !important;}
.pddB40{padding-bottom:40px !important;}
.pddB50{padding-bottom:50px !important;}

.pddL10{padding-left:10px !important;}
.pddL20{padding-left:20px !important;}
.pddL30{padding-left:30px !important;}
.pddL40{padding-left:40px !important;}
.pddL50{padding-left:50px !important;}

.alignL{text-align:left !important;}
.alignR{text-align:right !important;}
.alignC{text-align:center !important;}

.floatR{float:right !important;}
.floatL{float:left !important;}

.fclear{clear:both;}

.attention{ color:f66;}

a{ transition: all 500ms 0s ease; }

@media screen and ( min-width:768px ){
    .PcHide{display:none;}
}
@media screen and ( max-width:767px ){
    .SpHide{display:none;}
    .SpmgnT70{margin-top:70px !important;}
}


/* **************************************************************************

2. Slider

************************************************************************** */
.slick-list{
    margin-left: -40px !important;
}
.sliderbox {
    overflow: hidden;
}
.slider {
  display:none;
}
.slider.slick-initialized {
  display: block;
}
.slider img {
    width: 100%;
    height: auto;
}
.slider .slick-slide a {
    display: block;
    margin: 0 10px;
}
@media only screen and (max-width: 1200px){
    .slider .slick-slide a {
        margin: 0;
    }
}
.slick-prev,
.slick-next {
    width: 30px;
    height: 80px;
    z-index: 1;
}
.slick-next {
    right: -webkit-calc(4% + 20px);
    right: calc(4% + 20px);
}
.slick-prev {
    left: -webkit-calc(4% + 20px);
    left: calc(4% + 20px);
}
@media only screen and (max-width: 1200px){
    .slick-next {
        right: 20px;
    }
    .slick-prev {
        left: 20px;
    }
}
.slick-prev:before,
.slick-next:before {
    font: normal normal normal 80px/1 FontAwesome;
}
.slick-prev:before {
    content: "\f104";
}
.slick-next:before {
    content: "\f105";
}
/*-------------テキスト乗せる場合----------------*/
/*.slider img {
    position: relative;
}
.slider p{
    position: absolute;
    font-size: 3em;
    color: #333;
}
.slider p.img1{top: 40%;}
.slider p.img2{top: 10%;}
.slider p.img3{top: 80%;color:#fff;}
.slider p.img4{top: 70%;}
*/
@media print {
    .slider{
        display: none;
    }
}
/* **************************************************************************

3. Drawer menu

************************************************************************** */
nav.drawer-nav{
    background:#d3d89c;
}
.drawer--left .drawer-hamburger{
    /*right:10px !important;*/
    top:10px !important;
}
.drawer-open .drawer-hamburger-icon:after, .drawer-open .drawer-hamburger-icon:before {
    /*background-color: #fff;
    height: 4px;*/
}
.drawer-overlay{
    background-color: rgba(0,0,0,.2) !important;
}
/* **************************************************************************

4. Common Parts

************************************************************************** */
.header_line{width:100%; height:10px;background-color:#006265;z-index:50;}
.header h1{line-height:1;margin:0;}
.header h1 a:link,.header h1 a:visited,.header h1 a:hover,.header h1 a:active{color:#333;}
/*.header h1 .logo{display:block !important;}*/
.header{width:960px;margin:0 auto;background:#fff; z-index:49;}
.header_social .fa-phone-square{color:#ff5408;}
.header_social .fa-facebook-square{color:#3b5998;}
.header_social .fa-twitter-square{color:#0084b4;}
.footer{width:100%;background:#5D7F35;height:100px;margin-top:30px;color:#fff;}
.footer .copyright{text-align:center;font-style:normal;line-height:100px;}
.footer .copyright a:link,
.footer .copyright a:visited,
.footer .copyright a:hover,
.footer .copyright a:active{
    color:#fff;
}
footer .copyright a:hover{
    text-decoration:underline;
}
.wrap100{width:100%;}
@media screen and ( min-width:768px ){
    .header{max-width:100%;height:55px;}
    .header h1{}
    .header_logo{float:left;}
    .header_logo p{font-size:0.6em; color:#666;font-weight:normal;margin:5px 0 0 10px;}
    .header_social{font-size:2em;float:right;margin:10px 10px 0 0;}
    .contents{width:960px;max-width:100%;margin:0 auto;padding:0 10px;box-sizing:border-box;}
    .header .PhoneNumber{font-size:0.8em;font-weight:900;color:#ff5408;}
}
@media screen and ( max-width:767px ){
    .header{width:100%;height: 65px;}
    .header_line, .header{position:fixed;top:0;left:0;}
    .header h1{margin-top:15px;}
    .header_logo p{display:none;}
    .header_logo{float:left;margin: 2px 0 0 45px;}
    .header_social{font-size:1.5em;float:right;margin:25px 10px 0 0;}
    .drawer--left.drawer-open .drawer-nav{z-index:100;}
    .contents{width:100%;padding:0 10px;box-sizing:border-box;}
    .footer{height:5em;}
    .footer .copyright{line-height:1;padding-top:1.5em;}
}
@media screen and ( max-width:374px ){
    .header_social{font-size:1.25em;float:right;margin:25px 10px 0 0;}
}
/* **************************************************************************

5. Navigation

************************************************************************** */
.SpHide nav{
    clear:both;
    width:100%;
    background:#5d7f35;
    height:65px;
    max-width:100%;
}
.SpHide nav ul{
    width:960px;
    margin:0 auto;
    max-width:100%;
    margin:0 auto !important;
    padding:0 !important;
}
.SpHide nav ul li{
    height:65px;
    display:table-cell;
    text-align:center;
    vertical-align:middle;
}
.SpHide nav ul li span{
    font-size:0.8em;
}
.SpHide nav ul li a{
    display:table-cell;
    /*width:220px;*/
    width:300px;
    height:65px;
    color:#fff;
    vertical-align:middle;
}
.SpHide nav ul li.home a{
    width:60px !important;
}
.SpHide nav ul li a:hover{
    background:#34784A;
    color:#fff;
    vertical-align:middle;
}
ul.drawer-menu li{
    text-indent:1em;
    width:100%;
    background:#5d7f35;
    border-top:1px solid #34784A;
}
ul.drawer-menu li a{
    display:block;
    color:#fff;
    padding:1em 0;
    vertical-align:middle;
}
ul.drawer-menu li a:hover{
    width:100%;
    color:#fff;
    padding:1em 0;
    background:#34784A;
}
ul.drawer-menu li span{
    font-size:0.8em;
}
/* **************************************************************************

6. Contents

************************************************************************** */
@media screen and ( min-width:768px ){
    .Col2{width:calc( 50% - 5px);display:table-cell;margin-top:30px;padding:0 20px;box-sizing:border-box;border:solid 1px #ddd;}
    /*.Col2_1{float:left;}
    .Col2_2{float:right;}*/
    .Col2_1{}
    .Col2_2{}
}
@media screen and ( max-width:767px ){
    .Col2{width:100%;margin-top:30px;}
}
.Col1{width:100%;margin-top:30px;}
h2 {
    font-weight:normal;
    line-height:2em;
    border-top:solid 1px #A3AF9E;
    border-bottom:solid 1px #A3AF9E;
}
h3 {
    position: relative;
    padding: 0 0 10px 30px;
    font-size:20px;
    color: #333;
    font-weight:normal;
    border-bottom:1px solid #A3AF9E;
}
h3::before,
h3::after{
    content: "□";
    position: absolute;
}
h3::before{
    left:0;
    top:-3px;
    color:#00BBFF;
}
h3::after{
    left: 5px;
    top: 3px;
    color: #A3AF9E;
    color:#B2023F;
}
h2 .fa-commenting-o{color:#60C04C;}
h2 .fa-list-alt{color:#BAA64B;}
h2 .fa-users{color:#60C04C;}
h2 .fa-map-marker{color:#BAA64B;}
h2 .fa-envelope-o{color:#006CC3;}
h2 .fa-camera{color:#B2023F;}
h2 .fa-id-badge{color:#BAA64B;}
p{line-height:1.5;}
.googlemap{
    width:940px;
    max-width:100%;
    margin:0 auto;
    padding:0;
}
.works ul{
    margin:0;
    padding:0;
    text-align:center;
}
.works ul li{
    list-style-type:none;
    display:inline-block;
}
.works ul li p{
    text-align:center;
}
ul.list_upperroman li{
    list-style-type: upper-roman;
}
@media screen and ( max-width:950px ) {
    .googlemap {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 56.25%;
        overflow: hidden;
    }
    .googlemap iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}
@media screen and ( max-width:767px ){
    .works ul li img,
    .construction img{width:100%;}
}
.g-recaptcha{
    width:304px;
    text-align:center;
    margin:20px auto;
}
/* **************************************************************************

7. Table

************************************************************************** */
@media screen and ( min-width:768px ){
    .table00{display:table;}
    .table00 .tr{display:table-row;}
    .table00 .th{display:table-cell;white-space:nowrap;}
    .table00 .td{display:table-cell;}
}
@media screen and ( max-width:767px ){
    .table00 .th,
    .table00 .td,{
        display:block;
        width:100%;
    }
    .table00 .td{
        margin-left:2em;
    }
}
.table01{display:table;border-spacing:10px 0;}


/* **************************************************************************

8. List

************************************************************************** */

.info dl {
    /*padding: 0 10px 0px;*/
    font-size:1.0em;
    margin:20px 0;
}
.info dl dt {
    float: left;
    width: 8em;
    padding: 10px 0;
    color:#333;
    line-height:1.5;
    background:#fff;
}
.info dd {
    margin: 0;
    padding: 10px 0 10px 8em;
    line-height:1.5;
    border-bottom: 1px #ddd solid;
    background:#fff;
    color:#333;
}
.about dl {
    /*padding: 0 10px 0px;*/
    font-size:1.0em;
    margin:20px 0;
    border-top:1px #c9d5c3 solid;
    border-left:1px #c9d5c3 solid;
    border-right:1px #c9d5c3 solid;
}
.about dl dt {
    float: left;
    width: 10em;
    padding: 10px 0;
    color:#333;
    line-height:1.5;
    text-indent:1em;
    background:#e0e8dc;
}
.about dd {
    margin: 0;
    padding: 10px 0 10px 10em;
    line-height:1.5;
    border-bottom: 1px #c9d5c3 solid;
    text-indent:1em;
    background:#fff;
    color:#333;
}
.about dd ul{
    margin:0 0 0 32px;
    padding:0;
}
.about dd ul li{
    padding-right: 5px;
    text-indent: 0;
    line-height: 1.5;
}
.profile dl {
    /*padding: 0 10px 0px;*/
    font-size:1.0em;
    margin:20px 0;
    border-top:1px #c9d5c3 solid;
    border-left:1px #c9d5c3 solid;
    border-right:1px #c9d5c3 solid;
}
.profile dl dt {
    float: left;
    width: 10em;
    padding: 10px 0;
    color:#333;
    line-height:1.5;
    text-indent:1em;
    background:#e0e8dc;
}
.profile dd {
    margin: 0;
    padding: 10px 0 10px 11em;
    line-height:1.5;
    border-bottom: 1px #c9d5c3 solid;
    //text-indent:1em;
    background:#fff;
    color:#333;
}
.profile dd ul{
    margin:0 0 0 32px;
    padding:0;
}
.profile dd ul li{
    padding-right: 5px;
    line-height:1.5;
}
@media screen and ( min-width:768px ){
    .about dt.SalesList{
        height:6em;
    }
    .profile dt.SalesList{
        height:10.5em;
    }
    .about dt.AddList{
        height:3em;
    }
}
@media screen and ( max-width:767px ){
    .about dl dt {display: table-row;width:100%;text-indent:0.5em;line-height:1.5;}
    .about dd {display: table-row;width:100%;padding: 10px 0;text-indent:0.5em;line-height:3;}
    .profile dl dt {display: table-row;width:100%;text-indent:0.5em;line-height:1.5;}
    .profile dd {display: table-row;width:100%;padding: 10px 0;text-indent:0.5em;line-height:3;}
    .profile dd.jobhistory_dd,
    .profile dd.generaltopic_dd {
        line-height:1.5;
        padding:5px;
    }
}
/* **************************************************************************

9. Form

************************************************************************** */
form dl dt span.required {
    background: #8D3506;
}
form dl dt span.required, form dl dt span.optional {
    display: inline-block;
    float: right;
    color: #ffffff;
    line-height: 1;
    padding: 8px 9px;
    border-radius: 3px;
    margin-top: 8px;
}
form dl dt span {
    display: block;
    font-size: 85%;
    color: #3377ff;
}
form input[type="text"],
form input[type="email"],
form input[type="tel"] {
    max-width: 90%;
    height: 2em;
    padding: 2px 2%;
    border: 1px solid #ddd;
    border-radius: 3px;
    background: #fafafa;
    -webkit-appearance: none;
    font-size: 100%;
    font-family: inherit;
    margin-top: 5px;
}
.form01 dl {
    padding: 0 10px 0px;
    font-size:1.0em;
    margin:20px 0;
}
.form01 dl dt {
    float: left;
    width: 15em;
    padding: 10px 0;
    color:#333;
    line-height:2.7;
    /*text-indent:1em;*/
    background:#fff;
}
.form01 dd {
    margin: 0;
    padding: 10px 0 10px 15em;
    line-height:2.7;
    border-bottom: 1px #ddd solid;
    text-indent:1em;
    background:#fff;
    color:#333;
}
.form01 .input1 input[type="text"],
.form01 .input1 input[type="email"],
.form01 .input1 input[type="tel"]{
    width: 100% ;
}
.form01 .input2 input[type="text"],
.form01 .input2 input[type="email"],
.form01 .input2 input[type="tel"]{
    width:42.5%;
}
.form01 .input3 input[type="tel"]{
    width:25.8%;
}
.form01 .input3 .hyphen{
    display:inline;
    text-align:center;
}
.form01 .message{
    width:94%;
    height:8em;
    padding: 10px 2%;
    background: #fafafa;
    border: 1px solid #ddd;
    box-sizing:border-box;
}
@media screen and ( max-width:767px ){
    .form01 dl{padding:0;}
    .form01 dl dt {width:100%;text-indent:0.5em;padding: 5px 5px 5px 0;line-height: 1.7;background:#e0e8dc;box-sizing:border-box;}
    .form01 dd {width:100%;padding: 10px 0;text-indent:0;line-height:1;border-bottom:none;box-sizing:border-box;}
    .form01 .message{width: 98%;margin-top: 5px;}
    form input[type="text"], form input[type="email"], form input[type="tel"] {max-width: 95%;}
    .form01 .input2 input[type="text"], .form01 .input2 input[type="email"], .form01 .input2 input[type="tel"]{width:44.5%;}
    form dl dt span.required, form dl dt span.optional{text-indent:0;margin-top:0;}
}
@media screen and ( max-width:320px ){
    .form01 .input3 input[type="tel"]{width:25.5%;}
}
.btnblock{
    text-align:center;
}
.form01 .btnblock button#submit{
    width: 230px;
    margin:0 auto;
    padding:15px;
    color:#ffffff;
    font-size: 15px;
    line-height: 120%;
    text-align: center;
    text-decoration: none;
    background: #024500;
    border: 2px solid #024500;
    -webkit-box-shadow:0px 0px 0px 1px #ffffff inset;
    -moz-box-shadow:0px 0px 0px 1px #ffffff inset;
    box-shadow:0px 0px 0px 1px #ffffff inset;
    display: block;
    position:relative;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}
.form01 .btnblock button#submit::before{
    content: '';
    width: 6px;
    height: 6px;
    border: 0px;
    margin:0 15px 1px 0;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position:relative;
    display:inline-block;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}
.form01 .btnblock button#submit:hover{
    color:#024500;
    background: #ffffff;
    cursor: pointer;
}
.form01 .btnblock button#submit:hover::before{
    border-top: solid 2px #024500;
    border-right: solid 2px #024500;
}
