@charset "utf-8";
/*===========================
add
===========================*/
/*----------------------
img
----------------------*/
img{
	image-rendering: -webkit-optimize-contrast;
}

/*----------------------
none
----------------------*/
.pcOFFtabletOFFspON{display: none;}
@media screen and (max-width: 768px) {
	.pcOFFtabletOFFspON{display: none;}
}
@media only screen and (max-width: 600px) {
	.pcOFFtabletOFFspON{display: block;}
}

.pcOFFtabletONspOFF{display: none;}
@media screen and (max-width: 768px) {
	.pcOFFtabletONspOFF{display: block;}
}
@media only screen and (max-width: 600px) {
	.pcOFFtabletONspOFF,
	.pcONtabletONspOFF{display: none;}
}

@media screen and (max-width: 768px) {
	.pcONtabletOFFspOFF{display: none;}
}

@media screen and (min-width: 769px) {
	.pcOFFtabletONspON{display: none;}
}

@media screen and (min-width:601px) and (max-width: 768px) {
	.pcONtabletOFFspON{display: none;}
}

/*===========================
lft
===========================*/
.cont2-add .first .lft {
  margin-right: 0;
	margin-bottom: 20px;
	z-index: 1;
}
@media screen and (max-width: 768px) {
	.cont2-add .first .lft {
	  width: calc(100% - 5%);
	  margin-right: 5% !important;
		box-sizing: border-box;
	}
}

.cont2-add .first .lft::before {
  content: '';
  position: absolute;
  top: 30px;
  left: 30px;
  width: 100%;
  height: 100%;
  background-color: #fff;
  background-size: 3px 3px;
  z-index: -1;
	opacity: 0.5;
}
@media only screen and (max-width: 600px) {
	.cont2-add .first .lft::before {
	  top: 20px;
	  left: 20px;
	}
}


/*===========================
top-add
===========================*/

/*mainCatch------------------------------*/
@media screen and (min-width: 769px) {
	#mainCatch {
	  padding-top: 10em;
	}
}
@media screen and (max-width: 768px) {
	#mainCatch {
	  padding-top: 0.7em !important;
	}
}
@media screen and (max-width: 600px) {
	#mainCatch {
	  padding-top: 1em !important;
	}
}

.mainCatchInner p{
	margin: 0 !important;
	padding: 0 !important;
}

#mainCatch p span{
	display: block;
}

@media screen and (min-width: 769px) {
	.mainCatchInner p{
		line-height: 200% !important;
	}

	#mainCatch p span{
		font-size: 1.7em;
	}
}
@media screen and (max-width: 768px) {
	.mainCatchInner p{
		line-height: 140% !important;
	}

	#mainCatch p span{
		font-size: 1.3em;
	}
}
@media screen and (max-width: 600px) {
	.mainCatchInner p{
		line-height: 180% !important;
	}

	#mainCatch p span{
		font-size: 1.6em;
	}
}


/*box01------------------------------*/
@media screen and (max-width: 600px) {
	.top-add .box01 .catch2{
		text-align: center !important;
	}
}

@media screen and (max-width: 768px) {
	.top-add .box01 .txt2{
		text-align: left;
	}
}

/*box02------------------------------*/
.top-add .box02 .name{
	font-weight: bold;
}
@media screen and (max-width: 768px) {
	.top-add .box02 .name{
		text-align: right;
	}
}

/*===========================
cont1-add
===========================*/
/*box01----------------------------------*/
@media only screen and (min-width: 769px) {
	.cont1-add .box01 h2 + p{
		text-align: center;
		font-size: 1.2em;
		margin-bottom: 50px;
	}
}
@media only screen and (max-width: 768px) {
	.cont1-add .box01 h2 + p{
		margin-bottom: 30px;
		padding: 0 5%;
	}
}

/*box02----------------------------------*/
@media only screen and (max-width: 600px) {
	.cont1-add .box02 h2 span{
		font-size: 0.9em;
	}
}


.cont1-add .box02 h3{
	margin: 50px 0 30px;
}

.cont1-add .box02 h4{
	color: #14a83a;
}
.cont1-add .box02 p + h4{
	margin-top: 30px;
}

/*clip-box*/
.cont1-add .box02 .clip-box{
	padding-top: 10px;
}

.cont1-add .box02 .clip-box h3{
	line-height: 150%;
}


/*caption----------------------------------*/
.cont1-add .caption{
	text-align: center;
	margin-top: 8px;
	color: #787878;
}

/*===========================
cont2-add
===========================*/
/*box01----------------------------------*/
/*first*/
@media only screen and (min-width: 769px) {
	.cont2-add .box01 .lft{
		position: relative;
	  width: calc(55% - 40px);
	  margin-right: 40px;
	}

	.cont2-add .box01 .lft::before {
	  width: 130%;
		height: 105%;
	}
}

/*rgt*/
@media only screen and (min-width: 769px) {
	.cont2-add .box01 .rgt{
		padding-left: 30px;
		position: relative;
		z-index: 1;
	}
}

.cont2-add .box01 .rgt h2{
	text-align: left;
	margin: 0 0 20px;
	color: #2ba866;
	font-size: 1.8em;
	font-weight: bold;
}
@media only screen and (max-width: 768px) {
	.cont2-add .box01 .rgt h2{
		margin: 30px 0 10px;
		padding: 0;
		font-size: 2em;
	}
}
@media only screen and (max-width: 600px) {
	.cont2-add .box01 .rgt h2{
		margin: 15px 0 10px;
		padding: 0;
		font-size: 1.1em;
		text-align: center;
	}
}


/*box02----------------------------------*/

@media only screen and (min-width: 769px) {
	.cont2-add .box02 h2 + p{
		text-align: center;
		font-size: 1.2em;
		margin-bottom: 50px;
	}
}
@media only screen and (max-width: 768px) {
	.cont2-add .box02 h2 + p{
		margin-bottom: 30px;
		padding: 0 5%;
	}
}


.cont2-add .box02 .wrapper + .wrapper{
	margin-top: 100px;
}


/*box03----------------------------------*/

/*sub01*/
.cont2-add .box03 h3 + p{
	margin-bottom: 30px;
}

.cont2-add .box03 h4{
	text-align: center;
	font-size: 1.6em;
	margin-bottom: 20px;
}
@media only screen and (max-width: 600px) {
	.cont2-add .box03 h4{
		font-size: 1.3em;
		margin-bottom: 10px;
	}
}


@media only screen and (max-width: 768px) {
	.cont2-add .box03 .column1_60p{
		width: 100%;
		padding: 15px;
	}
}

@media only screen and (min-width: 769px) {
	.cont2-add .box03 .li02{
		margin-left: 40px;
	}
}

.cont2-add .box03 .liCircle li{
	float: left;
	margin-right: 20px;
}

@media only screen and (max-width: 768px) {
	.cont2-add .box03 .liCircle li{
		margin-right: 0;
		width: 33%;
	}
}
@media only screen and (max-width: 600px) {
	.cont2-add .box03 .liCircle li{
		width: 49%;
		font-size: 0.9em;
	}
}

@media only screen and (min-width: 769px) {
	/*li01*/
	.cont2-add .box03 .li01 li:nth-child(1),
	.cont2-add .box03 .li01 li:nth-child(5),
	.cont2-add .box03 .li01 li:nth-child(7){
		width: 90px;
	}
	.cont2-add .box03 .li01 li:nth-child(2),
	.cont2-add .box03 .li01 li:nth-child(8){
		width: 121px;
	}
	.cont2-add .box03 .li01 li:nth-child(6){
		width: 60px;
	}
	.cont2-add .box03 .li01 li:nth-child(3),
	.cont2-add .box03 .li01 li:nth-child(4){
		width: 73px;
	}

	/*li02*/
	.cont2-add .box03 .li02 li:nth-child(1){
		/*width: 60px;*/
		/*width: 175px;*/
		width: 142px;
	}
	.cont2-add .box03 .li02 li:nth-child(2){
		/*width: 42px;*/
		/*width: 60px;*/
		width: 175px;
	}
	.cont2-add .box03 .li02 li:nth-child(3){
		width: 92px;
	}
	.cont2-add .box03 .li02 li:nth-child(4){
		width: 72px;
	}
	.cont2-add .box03 .li02 li:nth-child(5){
		width: 142px;
	}
	.cont2-add .box03 .li02 li:nth-child(6){
		width: 175px;
	}
	.cont2-add .box03 .li02 li:nth-child(7){
		/*width: 60px;*/
		width: 92px;
	}
	.cont2-add .box03 .li02 li:nth-child(8){
		/*width: 72px;*/
		width: 92px;
	}
	.cont2-add .box03 .li02 li:nth-child(9){
		width: 142px;
	}
}

.cont2-add .box03 .liCircle:before,
.cont2-add .box03 .liCircle:after{
	content: ".";
	display: block;
	height: 0;
	overflow: hidden;
}
.cont2-add .box03 .liCircle:after{
	clear: both;
}


/*box04----------------------------------*/
/*first*/
.cont2-add .box04 .sub01{
	margin-bottom: 50px;
}
.cont2-add .box04 .sub01:last-child{
	margin-bottom: 0;
}

/*h3*/
.cont2-add .box04 h3{
	border: 1px solid;
	font-size: 1.6em;
	color: #14a83a;
	padding: 10px 0;
	margin-bottom: 20px;
	background-color: #fff;
}
@media only screen and (max-width: 600px) {
	.cont2-add .box04 h3{
		text-align: center;
		font-size: 1.2em;
		margin-bottom: 15px;
		line-height: 100%;
	}
}

.cont2-add .box04 .in01{
	margin-top: 50px;
}

/*h4*/
.cont2-add .box04 h4{
	color: #14a83a;
}

/*catchS*/
.cont2-add .box04 .catchS{
	text-align: center;
}
@media only screen and (max-width: 600px) {
	.cont2-add .box04 .catchS{
		text-align: left;
	}
}


/*===========================
cont3-add
===========================*/
/*box01----------------------------------*/
@media screen and (max-width: 768px) {
	.cont3-add .box01 .contPad80p{
		width: 100%;
	}
}

@media screen and (min-width: 769px) {
	.cont3-add .box01 p{
		font-size: 1.2em;
		line-height: 200%;
		padding-top: 40px;
	}
}

.cont3-add .box01 .lay1-2_1{
	background-color: #fff;
	padding: 20px;
	box-sizing: border-box;
}


/*box02----------------------------------*/
@media screen and (min-width: 769px) {
	.cont3-add .box02 .txtWrap p{
		text-align: center;
	}
}


/*box03----------------------------------*/
.cont3-add .box03 h2 + p{
	margin-bottom: 20px;
}
@media screen and (min-width: 769px) {
	.cont3-add .box03 h2 + p{
		text-align: center;
	}
}

.cont3-add .box03 h3{
	color: #14a83a;
}
@media screen and (min-width: 769px) {
	.cont3-add .box03 h3{
		font-size: 2em;
	}
}

.cont3-add .box03 .lay3Plural{
	text-align: left;
}
.cont3-add .box03 .lay3Plural ul{
	margin-left: 22px;
}
.cont3-add .box03 .lay3Plural li{
	list-style-type: disc;
	margin-bottom: 10px;
}
.cont3-add .box03 .lay3Plural li:last-child{
	margin-bottom: 0;
}


/*box04----------------------------------*/
.cont3-add .box04 h2{
	margin-bottom: 10px;
	color: #14a83a;
}
@media screen and (min-width: 769px) {
	.cont3-add .box04 h2{
		font-size: 2.5em;
	}
}

.cont3-add .box04 .contactBtnWrap{
	margin-top: 20px;
}





/*-----------
   色変更
-----------*/

/* column  */

.column1_100p {
	border:1px solid #e1e1e1;
	background: rgba(255,255,255,.9);
}

.column1_80p {
	border:1px solid #00aa9f;
	background: rgba(255,255,255,.9);
}

.column1_60p {
	border:1px solid #14a83a;
	background: rgba(255,255,255,.9);
}

.column2_80p {
	border:3px double #14a83a;
	background: rgba(255,255,255,.9);
}

.column2_60p {
	border:3px double #00aa9f;
	background: rgba(255,255,255,.9);
}


.column3_80p {
	border:4px dashed #00aa9f;
	background: rgba(255,255,255,.95);
}

.column3_60p {
	border:4px dashed #00aa9f;
	background: rgba(255,255,255,.95);
}

.column4_80p {
	border:4px dashed #00aa9f;
	background: rgba(255,255,255,.95);
}

.column4_60p {
	border:4px dashed #00aa9f;;
	background: rgba(255,255,255,.95);
}

/* table  */

table.table3 th {
	background-color:#e1e1e1;
	color:#333;
}

table.table2 th {
	background-color:#e1e1e1;
	color:#333;
}

.tdColorBeige {
	background:#FEF8E9 !important;
	text-align:center;
	vertical-align:middle;
}

table.table2 td.tdBgC01 {
	background-color:#FFF;
}

table.table2 td.tdBgC02 {
	background-color:#EEE;
}

table.table2 td.tdBgC03 {
	background-color:#DDD;
}


table.table2 td.tdBgC04 {
	background-color:#CCC;
}


table.table2 td.tdBgC05 {
	background-color:#BBB;
}



/* addon-circle */

.circle-big::before {
	color: #FFF;
	background:#F59338;
}


ol.liFeature li::before {
	color: #FFF;
	background:#EEB853;
}

/* buttons */

.txtBnr a {
	background-color:#00aa9f;
}



.txtBnr2 a {
	color:#FFF;
	background-color:#00aa9f;;
	margin:0.4em 0;
}



.txtBnr3 a {
	color:#FFF;
	background-color:#00aa9f;
}

.txtBnrInline a {
	color:#FFF;
	background-color:#00aa9f;
}



/* contactBtn */


.txtContacBnr a {
	color:#FFF;
	background-color:#14a83a;
}

.txtContacBnrPC {
	color:#FFF;
	background-color:#14a83a;
}

/* catch */

h3.h3Catch1 {
	color:#00aa9f;
}

h3.h3Catch2 {
	color:#00aa9f;
}

/* catchiphrase */

.catch1 {
	color:#14a83a;
}

.catch2 {
	color:#14a83a;
}

.catchS {
	color:#14a83a;
}

/* list */

ul.liCircle li::before {
	background:#14a83a;
}

/* flow */


.area_flowC .inner_flow {
	background: rgba(250,250,250,.85);
}

.area_flowC .inner_flow .largeTxt {
	color:#14a83a;
	border-bottom:1px dotted #CCC;
}



.txtIcon3 {
    background-color: #00aa9f;
}


/*===========================
フローティングバナー
===========================*/


/* color:var(--contact-color); で利用 */
:root {
	--contact-color:#39b975;
}

/* color:var(--contact-bg); で利用 */
:root {
	--contact-bg:#5cc68e;
}

/* color:var(--contact-hover); で利用 */
:root {
	--contact-hover:#7bdca9;
}

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto
}
.center-block {
  display: block;
  margin-right: auto;
  margin-left: auto
}
.emergencyWrap {
    position: fixed;
    right: 1%;
    bottom: 11%;
    z-index: 1000;
    padding: 10px 30px;
    background-color: var(--contact-bg);
    border-bottom: 6px solid var(--contact-color);
    border-radius: 12px;
}
@media screen and (max-width: 768px) {
    .emergencyWrap {
        right: 0;
        bottom: 0;
        width: 100%;
        border-radius: 0;
        border: none;
        /*background-color: #51baf1;*/
    }
}
/*@media screen and (max-width: 480px) {
  .emergencyWrap {
    bottom: 50px;
  }
}*/
.emergencyWrap > span {
    display: block;
    margin-bottom: 8px;
    margin-top: 3px;
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
}
.emergencyWrap .emergencyBtnWrap {
    display: block;
}
@media screen and (max-width: 768px) {
    .emergencyWrap .emergencyBtnWrap {
        /*display: flex;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;*/
        align-items: center;
        -ms-flex-align: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-pack: justify;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
    }
}
.emergencyWrap a {
    display: block;
    margin-bottom: 0px;
    margin-top: 8px;
    padding: 2px;
    color: #fff;
    background-color: var(--contact-color);
    border-radius: 5px;
    text-align: left;
    font-size: 14px;
    font-weight: bold;
}
@media screen and (max-width: 768px) {
    .emergencyWrap a {
        margin: 3px 8px;
    }
}
.emergencyWrap a.tel {
    display: block;
    padding: 8px 8px;
    color: #fff;
    text-align: center;
    font-size: 14px;
    letter-spacing: 1px;
    font-weight: bold;
}
.emergencyWrap a.tel .fa-phone-volume {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-size: 20px;
}
.emergencyWrap a.tel span {
    display: inline-block;
    vertical-align: middle;
    margin-left: 2px;
}
.emergencyWrap a.tel:hover {
    background-color: var(--contact-hover);
    text-decoration: none;
}
.emergencyWrap a.contact {
    display: block;
    padding: 8px 8px;
    color: #fff;
    text-align: left;
    font-size: 14px;
    letter-spacing: 1px;
    font-weight: bold;
}
.emergencyWrap a.contact .fa-envelope {
    color: #fff;
    font-size: 20px;
    display: inline-block;
    vertical-align: middle;
}
.emergencyWrap a.contact span {
    display: inline-block;
    margin-left: 35px;
    display: inline-block;
    vertical-align: middle;
}
.emergencyWrap a.contact:hover {
    background-color: #69d782;
    text-decoration: none;
}
@media screen and (max-width: 768px) {
    .emergencyWrap a.contact {
        text-align: center;
        padding: 8px 0px 8px 8px;
    }
    .emergencyWrap a.tel span {
        font-size: 14px;
        font-weight: 900;
    }
    .emergencyWrap a.contact span {
        display: block;
        margin-left: 15px;
        text-align: center;
        margin: auto;
    }
    .emergencyWrap a.contact .fa-envelope {
        color: #fff;
        font-size: 20px;
        display: block;
        text-align: center;
        margin: auto;
    }
}
@media screen and (max-width: 340px) {
    .emergencyWrap a.tel span {
        font-size: 13px;
        font-weight: 900;
    }
} /*　addに追加　*/
.emergencyWrap {
    box-sizing: border-box;
}
@media screen and (max-width: 768px) {
    .emergencyWrap .emergencyBtnWrap {
        display: flex;
        justify-content: center;
    }
    .emergencyWrap a.tel {
        width: 30%;
        display: inline-block;
        padding: 8px 8px;
        color: #fff;
        text-align: center;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: bold;
        box-sizing: border-box;
    }
    footer {
        padding-bottom: 150px;
    }
}
.catch04 {
    font-size: 2em;
    font-weight: 800;
    line-height: 1.6em;
    color: #20993b;
    text-align: center;
    margin-bottom: 1em;
}
.tx-center {
	text-align: center;
}
.tx-flex {
	text-align: center;
}
 @media screen and (max-width: 768px) {
.tx-flex {
 text-align: left;/*PCで中央、スマホタブレット左寄せ*/
}
}
.mb20 {
	margin-bottom: 20px!important;
}
.wrap-bg {
    position: relative;
    top: 0rem;
    left: 0px;
    width: 100vw;
    height: auto;
    background: url(../images/backgrounds/background-01.svg) no-repeat;
    background-position: top -100px left !important;
    background-size: contain !important;
}
@media only screen and (max-width: 768px) {
    .catch01 {
        font-size: 1.1em;
        line-height: 1.6em;
        text-align: left;
        margin-bottom: 1em;
    }
    .wrap-bg {
        background-position: top 0px left !important;
        background-size: initial !important;
    }
}
.wd40 {
    width: 40% !important;
    margin: auto;
}
.wd50 {
    width: 50% !important;
    margin: 0 auto;
}
.wd60 {
    width: 60% !important;
    margin: 0 auto;
}
.wd70 {
    width: 70% !important;
    margin: 0 auto;
}
.wd80 {
    width: 80% !important;
    margin: 0 auto;
}
.wd85 {
    width: 85% !important;
    margin: 0 auto;
}
.wd90 {
    width: 90% !important;
    margin: 0 auto;
}
.wd95 {
    width: 95% !important;
    margin: 0 auto;
}
@media only screen and (max-width: 768px) {
    .wd40, .wd50, .wd60, .wd70, .wd80, .wd85, .wd90, .wd95 {
        width: 100% !important;
        margin: auto;
    }
}
.box-sd {
	padding: 2em 4em;
	/*background-color: #fff;*/
	border: 1px solid #ccc;
	box-sizing: border-box;
	background-color: rgba(255,255,255,0.80);
}
@media only screen and (max-width: 600px) {
    .box-sd {
        padding: 15px;
    }
}
#pagetop {
    position: fixed;
    bottom: 30px;
    right: 10px;
    z-index: 20;
}
@media only screen and (max-width: 600px) {
    #pagetop {
        position: fixed;
        bottom: 120px;
        right: 10px;
        z-index: 20;
    }
}