@charset "utf-8";

#root {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

body {
    width: 100%;
}

.telWrap {
    color: inherit !important;
}

.brPc > br {
    display: none;
}

/*-- 下層カバー --------------------------------------------------------------*/

.inCoverBg {
    margin: 0 auto;
    padding: 0 15px;
    max-width: 1920px;
    width: 100%;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.inCoverTit {
    font-size: 26px;
    margin: 40px 0 0;
    padding: 20px 0;
    font-weight: 700;
    color: #FFF;
    text-shadow: 3px 1px 1px #333;
    background: url(https://kankyo-system200529.smooooth.jp/system_panel/uploads/images/text_deco01.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}


/*----------------------------------------------------------------------------*/
/*-- 共通見出し --------------------------------------------------------------*/


.modTit01 {
    font-size: 20px;
    font-weight: bold;
    line-height: 1.73em;
}

.modTit02 {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.8em;
}

.modTit03 {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.73em;
}

.modTit04 {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.727em;
}

.thmTitBorder {
    border: 3px solid #28a7e1;
}

/*-- ****** ------------------------------------------------------------------*/
/*-- 共通テキスト ------------------------------------------------------------*/


.modTxt01 {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.75em;
}

.modTxt02 {
    font-size: 16px;
    line-height: 1.75em;
    font-weight: bold;
}

.modTxt03 {
    font-size: 15px;
    line-height: 1.75em;
    font-weight: 500;
}

.modTxt04 {
    font-size: 13px;
    line-height: 1.75em;
    font-weight: 500;
}

.modTxt05 {
    font-size: 14px;
    line-height: 1.75em;
    font-weight: 500;
}


/*-- ****** ------------------------------------------------------------------*/
/*-- 共通ボタン --------------------------------------------------------------*/


.modBtn01 {
    max-width: 200px;
    width: 100%;
    height: 40px;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background: #ccc;
    border: solid 1px #ccc;
    transition: .5s;
}

.modBtn01large {
    max-width: 300px;
}

.modBtnImg01 {
    position: absolute;
    height: 14px;
    right: 10px;
}

.modBtn01.thmClrWh {
    background: #FFF;
    border: 1px solid #FFF;
    color: #0071bc;
}

.modBtn01.thmClrLgr {
    background: #90c31f;
    border: 1px solid #90c31f;
    color: #FFF;
}

.modBtn01.thmClrLgr:hover {
    background: #b5d866;
    transition: .5s;
}

.modBtn01.thmClrSax {
    background: #28a7e1;
    border: 1px solid #28a7e1;
    color: #FFF;
}

.modBtn01.thmClrSax:hover {
    background: #6abde2;
    transition: .5s;
}


.modBtn01.thmClrWh:hover {
    background: #c0d6e4;
    transition: .5s;
}

.modBtn02 {
    display: inline-block;
    color: #333;
    font-weight: bold;
    text-decoration: underline;
}

.modBtn02:hover {
    color: #ACACAC;
}

/*-- ****** -----------------------------------------------------------------*/
/*-- 共通カラー -------------------------------------------------------------*/


.thmClrSax {
    color: #28a7e1;
}

.thmClrWh {
    color: #FFF;
}

.thmBgGwh {
    background-color: #eef2f5;
}

.thmBgGgr {
    background: #f2f5ee;
}

.thmBgSax {
    background-color: #28a7e1;
}

.thmBgWh {
    background-color: #FFF;
}

.thmBgLgr {
    background-color: #90c31f;
}

.thmBgBlGr {
    background: rgb(51,208,246); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(51,208,246,1) 0%, rgba(42,171,229,1) 50%, rgba(43,179,242,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(51,208,246,1) 0%,rgba(42,171,229,1) 50%,rgba(43,179,242,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(51,208,246,1) 0%,rgba(42,171,229,1) 50%,rgba(43,179,242,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33d0f6', endColorstr='#2bb3f2',GradientType=0 ); /* IE6-9 */
}

.thmBxShadow01 {
    box-shadow: 0 0 3px rgba(0,0,0,0.1);
}

/*-- ****** -----------------------------------------------------------------*/
/*-- header -----------------------------------------------------------------*/

.hHamBtn > .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(251, 115, 206, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.p-navTxt {
    text-shadow: none;
}


.timesfont {
    font-family: "Times New Roman";
}

/*-- ****** -----------------------------------------------------------------*/
/*-- パンくずリスト ----------------------------------------------------------*/

.pankuzuWr {
    margin: 0 auto;
    max-width: 1920px;
    width: 100%;
}

.pankuzuAr {
    margin: 0 auto;
    padding: 30px 15px;
    max-width: 1200px;
    width: 100%;
    display: flex;
    align-items: center;
}

.pankuzuCt {
    font-size: 14px;
    display: flex;
    align-items: center;
    color: #333;
}

.pankuzuCt:hover {
    color: #333;
}

.pankuzuIcon {
    margin: 0 5px 0 0;
    font-size: 20px;
    padding: 0 0 2px;
    color: #90c31f;
}

.pankuzuTxt {
    font-size: 14px;
}

.pankuzuCt > p {
    text-decoration: underline;
}

.pankuzuCt:hover > p {
    text-decoration: none;
}

/*-- ****** -----------------------------------------------------------------*/
/*-- coverTxt ---------------------------------------------------------------*/



/*---------------------------------------------------------------------------*/
/*-- footer -----------------------------------------------------------------*/

.fCt01 {
    margin: 0;
}

.fIt01 {
    /* white-space: nowrap; */
    padding: 0 2.97%;
    border-bottom: 1px solid #CCC;
}

.fCt02 {
    margin: 40px auto 0;
    /* display: block !important; */
    justify-content: center;
    width: 100%;
}

.fBx01 {
    width: 100%;
    /* justify-content: center !important; */
}

.fIt02 {
    position: static;
    width: 100%;
    margin: 40px 0 0 !important;
    justify-content: center;
}

.fBx01 {
    max-width: 500px;
    margin: 0 auto;
    flex-direction: column;
}

.fLk01 {
    text-align: center;
}

.fIt02 {
    flex-direction: column;
    align-items: center;
}

.fLk02 {
    margin: 20px auto 0 !important;
    max-width: 260px !important;
}

.fIt01 {
    padding: 10px 5px;
}


.fLk01 {
    border-bottom: 1px solid #CCC;
}

.fIt01 {
    border-bottom: none;
}

.fLk01 {
    padding: 13px 0;
}

.fIt01 {
    padding: 0;
}



.fLkTxt {
    min-width: 1px;
}

.fCt02 {
    text-align: center;
}

.fCt01 {
    margin: 0 auto;
}

.fAr {
    max-width: 500px;
    margin: 0 auto;
}

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

.thogBg01 {
    background-size: 10% !important;
    }

.thogBg02 {
    background-size: 21% !important;
}

.thogBg03 {
    background-size: 18% !important;
}

.thogBg04 {
    background-size: 25% !important;
}

.workCt01:hover .workMask,
.workCt02:hover .workMask {
    opacity: 0;
    transition: 1s;
}

.workCt01:hover .workMask01,
.workCt02:hover .workMask01 {
    background: rgba(255,255,255,0);
}

.workCt01:hover .workMask01
.workCt02:hover .workMask01 {
    background: rgba(255,255,255,0);transition: 1s;
}

.workCt01:hover .workTit01,
.workCt02:hover .workTit01 {
    color: #FFF;
    border-color: #FFF;
    box-shadow: 3px 3px 8px #999;
    text-shadow: 3px 3px 3px #999;
}

.workCt01,
.workMask01,
.workTit01 {
    transition: 1s;
}

.compBg02 {
    background-size: 480px !important;
    background-position: center 23% !important;
}

.workCt01 {
    border-bottom: 1px solid #FFF;
}

.workCt02 {
    border-bottom: 1px solid #FFF;
}

.voiceTit03 {
    position: relative;
    padding: 0 0 0 25px;
}

.voiceTit03:before {
    font-family: FontAwesome;
    content: "\f0c8";
    position: absolute;
    left: 0;
    top: 0;
    color: #90c31f;
}

.voiceBtnImg01 {
    transform: rotate(90deg) !important;
}

.modCt01 {
    /padding: 20px 10px !important;*/
    padding: 20px 10px;
}

.modAr01 {
    /*padding: 40px 15px !important;*/
    padding: 40px 15px ;
}
  
.inCommonWr {
    /padding: 50px 0!important;*/
    padding: 50px 0;
}

/* チャットボットの文字表示位置調整*/

.sc-ckVGcZ {
    margin: 0 auto;
    padding: 0 0 0 88px;
    width: 100%;
    text-align: center !important;
}

.bnrWrap a:hover {
    opacity: .6;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 375px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

.workCt02:nth-of-type(odd) {
    border-right: 1px solid #FFF;
}



/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 414px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */




/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 544px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

.fIt02 {
    flex-direction: row;
}
  
.fLk02 {
    margin: 0 0 0 20px !important;
    max-width: 200px !important;
}
  
.thogBg01 {
    background-position: 85% 100% !important;
    background-size: 60px !important;
    }

.thogBg02 {
    background-position: 95.3% 100% !important;
    background-size: 21% !important;
}

.thogBg03 {
    background-position: 93.8% 100% !important;
    background-size: 119px !important;
}

.thogBg04 {
    background-position: 93.8% 100% !important;
    background-size: 119px !important;
}
  
.modTit01 {
    font-size: 30px;
}

.modTit02 {
    font-size: 26px;
}

.modTit03 {
    font-size: 23px;
}

.modTit04 {
    font-size: 22px;
}
  
.modTxt01 {
    font-size: 24px;
}

.modTxt02 {
    font-size: 20px;
}

.modTxt03 {
    font-size: 16px;
}
  
.workCt01 {
    border-bottom: 0;
    border-right: 1px solid #FFF;
}
  
.inCoverTit {
    font-size: 32px;
    margin: 60px 0 0;
}
  
.inCoverBg {
    height: 400px;
}
  
.modCt01 {
    padding: 40px 10px !important;
}

.modAr01 {
    padding: 80px 15px !important;
}
  
.inCommonWr {
    padding: 100px 0!important;
}


/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 768px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */



.fBx01 {
    flex-direction: row;
}
  
.fLk01 {
    text-align: left;
}

.fIt01 {
    border-right: 1px solid #CCC;
    border-bottom:  none;
}
  
.fIt01 {
    padding: 0 1.47%;
    /* width: 14.4%; */
    display: inline-block;
    /* min-width: 1px; */
    vertical-align: top;
    min-height: 73px;
}
  
.fBx01 {
    max-width: 100%;
    width: 100%;
}

.fAr {
    max-width: 100%;
}
  
.fLk01 {
    padding: 0;
    border-bottom: none;
}
  
.fLk01:nth-of-type(n + 2) {
    margin: 5px 0 0;
}
  
.inCoverTit {
    font-size: 40px;
    margin: 80px 0 0;
}
  
.inComCol01 {
    max-width: 20%;
    flex: 0 0 25%;
}
  
.inComRow01 .inSpaCircle {
    height: 150px !important;
    max-width: 150px !important;
}
  
.inComRow01 .inSpaNum {
    font-size: 60px !important;
}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 992px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */



/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 1024px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

.fCt02 {
    justify-content: flex-end;
}

.fIt02 {
    margin: 0 0 0 47px;
}
  
.inComRow01 .inSpaCircle {
    height: 190px !important;
    max-width: 190px !important;
}
  
.inComRow01 .inSpaNum {
    font-size: 80px !important;
}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 1200px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */



/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 1400px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 1500px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

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

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

.fCt02 {
    margin: 0 0 0 auto !important;
    width: calc(100% - 213px);
    padding: 0 553px 0 0;
    /* width: 100%; */
    /* max-width: 1250px; */
    text-align: right;
}
  
.fBx01 {
    padding: 0 523px 0 0;
}
  
.fIt02 {
    position: absolute;
    margin: 0 !important;
    top: 50px;
    right: 50px;
    max-width: 480px;
    width: 100%;
}


/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

} /* min-width: 1750px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */


@media screen and (max-width:768px) {
  .bnrWrap {
      display: block !important;
  } 
    .bnrWrap a {
      width: 100%;
  } 
    .bnrWrap img {
      width: 100%;
  } 
}