section {
position: relative;
}


 #mv {
 background-color: #fff;
     display: flex;
    justify-content: space-between;
    position: relative;
 }




 #mv .left {
 width: 50%;
 margin-left: auto;
    background-image: url(/images/top/main_bk_left.jpg);
background-repeat: repeat-x;
background-size: contain;
    min-height: 90vh;
    background-position: right;
   max-height: 1400px;
}

 #mv .left .left_triangle {
 background-image: url(/images/top/main_bk2_left.png);
background-size: contain;
min-height: 90vh;
width: 100%;
 }





 #mv .right {
 width: 50%;
 margin-right: auto;
    background-image: url(/images/top/main_bk_right.jpg);
background-repeat: repeat-x;
background-size: contain;
    min-height: 90vh;
    background-position: left;
    max-height: 1400px;
}

 #mv .right .right_triangle {
 background-image: url(/images/top/main_bk2_right.png);
 background-size: contain;
min-height: 90vh;
width: 100%;
background-position: right;
 }






.an-fadeleft {
    font-size: 30px;
    font-weight: bold;
    animation-name: fadeleft;
    animation-duration: 2s;
    animation-iteration-count: 1;
}
@keyframes fadeleft {
from {
    opacity: 0;
     transform: translateX(150px);
}
to {
    opacity: 1;
    transform: translateX(0);
}
}




.an-faderight {
    font-size: 30px;
    font-weight: bold;
    animation-name: faderight;
    animation-duration: 2s;
    animation-iteration-count: 1;
}
@keyframes faderight {
from {
    opacity: 0;
    transform: translateX(0);
}
to {
    opacity: 1;
transform: translateX(150px);
}
}




#mv img {
width: 100%;
height: auto;
}



#mv h2 {
    padding-top: 100px;
    width: 28%;
				margin-left: auto;
				margin-right: auto;
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    max-width: 600px;
min-width: 300px;
}



#mv .inner {
padding-top: 30vh;
}



#mv .button_mv {
padding-top: 45vh;
}








#greetings {
    background-image: url(../images/greetings_bk.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 30vh;
    background-position: center;
    max-height: 50vh;
}


#greetings dl {
   padding-top: 100px;
   text-align: center; 
   padding-bottom: 100px;
}

#greetings dl dt {
 font-size: 38px;
 padding-bottom: 60px;
 color: #6e8e14;
 letter-spacing: 0.4em;
}

#greetings dl dd {
 font-size: 20px;
 line-height: 2.4em;
 letter-spacing: 0.2em;
}





/*===================================共通===========================================*/


#painting dl.title , #waterproof dl.title , #sale dl.title , #painting dl.title , #contact dl.title , #assessment dl.title , #blog dl.title {
   padding-top: 100px;
   text-align: center; 
}

#painting dl.title dt , #waterproof dl.title dt , #sale dl.title dt , #painting dl.title dt , #contact dl.title dt , #assessment dl.title dt , #blog dl.title dt   {
 font-size: 38px;
 padding-bottom: 60px;
 color: #6e8e14;
 letter-spacing: 0.4em;
}




#painting dl.title dd , #waterproof dl.title dd , #sale dl.title dd , #painting dl.title dd , #contact dl.title dd , #assessment dl.title dd , #blog dl.title dd {
 font-size: 18px;
 line-height: 2.4em;
 letter-spacing: 0.2em;
padding-bottom: 40px;
}

/*==============================================================================*/





#waterproof {
/*background-image: url(/images/white_bk.png);
background-repeat: repeat;*/
}






#waterproof .button {
padding-bottom: 100px;
}





#waterproof p.ph {
margin-top: 40px;
padding-bottom: 70px;
}


#waterproof .ph_wrap {
position: relative;
}


#waterproof .ph_wrap .cursive {
position: absolute;
top: -20px;
left: 10px;
} 





#waterproof .ph_wrap p.ph img {
width: 100%;
height: auto;
}




/*#waterproof .wrapper {
    background: url('../images/waterproof_diagonal.png');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
    padding-bottom: 100px;
}
*/

#waterproof .button {
padding-bottom: 100px;
}


#waterproof .wrapper {
    background-image: url("../images/painting_City.png");
    background-repeat: repeat-x;
    background-position: bottom;
    background-size: inherit;
}


/*==============================================================================*/


#sale {

}


#sale .wrapper {
    background-image: url(../images/sale_bk.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 90vh;
    background-position: center;
    max-height: 1300px;
}


#sale .wrapper2 {
    background-image: url(/images/sale_bk_2.jpg) !important;
}






#sale .inner_wrap {
padding-top: 200px;
padding-bottom: 200px;
}


#sale .inner {
position: relative;
}




#sale dl {
padding-bottom: 30px;
}




#sale .sale_box {
background-color: rgba( 255, 255, 255, 0.8 );
width: 80%;
margin-left: auto;
margin-right: auto;
padding: 3%;
}



#sale .sale_box .sale_box_inner {
width: 100%;
box-sizing: border-box;
border: solid #adb794 1px;
position: relative;
}


#sale .sale_box .sale_box_inner .cursive {
position: absolute;
top: 20px;
right: 20px;
}




#sale .left_sale_ph {
position: absolute;
left: -10%;
bottom: -100px;
animation: fluffy1 3s ease infinite;
}

#sale .right_sale_ph {
position: absolute;
right: -10%;
bottom: -100px;
animation: fluffy1 3s ease infinite;
}


@keyframes fluffy1 {
  0% { transform:translateY(0) }
  5% { transform:translateY(0) }
  10% { transform:translateY(0) }
  20% { transform:translateY(-15px) }
  25% { transform:translateY(0) }
  30% { transform:translateY(-15px) }
  50% { transform:translateY(0) }
  100% { transform:translateY(0) }
}


#sale .button {
    padding-bottom: 40px;
}








/*==============================================================================*/


#painting {
background-image: url(/images/yelow_bk.png);
background-repeat: repeat;
}


#painting .wrapper {
    background-image: url("../images/painting_bottom.jpg");
    background-position: bottom;
    background-size: contain;
}




#painting .inner {
padding-bottom: 100px;
}



#painting  .ph_wrap {
position: relative;
padding-bottom: 60px;
}

#painting  .ph_wrap .cursive {
position: absolute;
top: 50px;
left: -50px;
}


#painting .ph_wrap p.ph img {
width: 100%;
height: auto;
}


#painting dl.title dd {
padding-bottom: 80px;
}






/*==============================================================================*/


#contact {
background-image: url("/images/white_bk.png");
background-repeat: repeat;
}

#contact .inner {
position: relative;
}

#contact .inner .contact_man_ph {
position: absolute;
bottom: 0;
left: -200px;
}


#contents_wt {
    width: 100%;
    margin-bottom: 0px;
    position: relative;
    text-align: left;
    overflow: hidden;
    box-sizing: border-box;
border-bottom: 3px solid #6e8e14;
}


.bg_fx {
    background-image: url(/images/bg_fx.jpg);
}


.fixed-bg_fx {
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    min-height: 220px;
}


#contact .inner .Job_offer_bn {
width: 90%;
margin-left: auto;
margin-right: auto;
}



#contact .inner .Job_offer_bn img {
width: 100%;
height: auto;
}






#contact  .ph_wrap {
position: relative;
padding-bottom: 60px;
margin-top: 60px;
}

#contact  .ph_wrap .cursive {
position: absolute;
top: 80px;
right: -20px;
}



#contact .ph_wrap p.ph img {
width: 100%;
height: auto;
}


#contact .tel_button_wrap {
padding-top: 40px;
padding-bottom: 60px;
}

#contact .tel_button_wrap p.top_txt {
text-align: center;
font-size: 14px;
padding-bottom: 20px;
}

#contact .tel_button_wrap p.bottom_txt  {
text-align: center;
font-size: 12px;
padding-top: 10px;
}



#contact .tel_button_wrap p.bottom_txt {

}




#contact .button i {
padding-right: 0.5em;
}





/*==============================================================================*/



#assessment {

}

#assessment .wrapper {
    background-image: url("/images/assessment_bk.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    height: 980px;
    background-position: center;
}

#assessment dl {
padding-bottom: 40px;
}



.balloon_box {
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 20px 10px;
  min-width: 120px;
  width: 100%;
  color: #fff;
  font-size: 16px;
  background: #6e8e14;
  text-align: center;
  box-sizing: border-box;
}

.balloon_box:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #6e8e14;
}

.balloon_box p {
  margin: 0;
  padding: 0;
  font-size: 20px;
line-height: 1.4em;
}

.balloon_box p b {
color: #ffdc48;
}



#assessment .left {
width: 56%;
float: left;
}



#assessment .right {
width: 40%;
float: right;
}

#assessment .right img {
width: 100%;
height: auto;
}







/*===============================クイックフォーム================================================*/
	

.select-box01 select {
	width: 100%;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #999;
	background: #fff;
	background: url("/arrow01.png") right 50% no-repeat, -webkit-linear-gradient(top, #fff 0%, #efebe1 100%);
	background: url("https://www.replus-co.jp/gaihekitosou/arrow01.png") right 50% no-repeat, linear-gradient(to bottom, #fff 0%, #efebe1 100%);
	background-size: 20px, 100%;
	font-size: 16px;
	color: #000;
	font-weight: bold;
	padding-top: 7px;
	padding-right: 3px;
	padding-bottom: 7px;
	padding-left: 41px;
	-webkit-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-moz-border-radius: 5px;
 margin-bottom: 8px;
 box-sizing: border-box;
}




.block7 #mailform {
	width: 100%;
}

.block7 #mailform .form {
	padding-top: 10px;
	padding-left: 0px;
	width: 98%;
	float: left;
 margin-bottom: 20px;
}


	
input[type="text"] {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}

.block7 form .submit {
	margin-bottom: 0px;
	width: 80%;
	float: left;
}


.block7 form .form .cover {
position: relative;
}


.block7 form .form .cover .icon {
	color: #FFF;
	background-color: #E40F18;
	width: 30px;
	font-size: 20px;
	line-height: 1.8em;
	position: absolute;
	font-weight: 700;
	top: 0;
	left: 1px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-bottomleft: 3px;
	z-index: 60;
 padding-left: 0.2em;
}


.block7 form .form .cover .icon img {
position: absolute;
top: 0;
}





.block7 form .form .cover .icon2 {
	color: #FFF;
	background-color: #E40F18;
	width: 30px;
	top: 3px;
	font-size: 20px;
	line-height: 1.7em;
	position: absolute;
	font-weight: 700;
	left: 1px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-bottomleft: 3px;
	z-index: 60;
 padding-left: 0.2em;
}


.block7 form .form .cover .icon2 img {
position: absolute;
top: 0;
}






.block7 form .form .cover .deco {
	border: 0;
	font-size: 16px;
	color: #000;
	border: 1px solid #999;
	width: 100%;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-top: 2px;
	margin-right: 0;
	margin-bottom: 2px;
	margin-left: 0;
	padding-top: 7px;
	padding-right: 0px;
	padding-bottom: 7px;
	padding-left: 41px;
	font-weight: 700;
 box-sizing: border-box;
}

input.deco::-webkit-input-placeholder {
 color: #000;
 font-weight: 700;
}
input.deco:-ms-input-placeholder {
 color: #000;
 font-weight: 700;
}
input.deco::-moz-placeholder {
 color: #000;
 font-weight: 700;
}
input.switch {
	width: 100%;
 animation: switch1 2s ease infinite;
}


	
/*	-----------------フォームの費用を確認する画像との下の画像　赤い三角-------------------*/	

	
.block7 #mailform .form .submit {
	width: 100%;
	margin-top: 7px;
	margin-left: auto;
	margin-right: auto;
}	
	
	
	
	.block7 .submit {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
   position: relative;
	}	
	
	
	
.block7 .submit img.icon_click img {
	width: 100%;
	}
	


	
.block7 form .form .submit {
	margin-bottom: 5px;
  position: relative;
}


.block7 form .submit .finger {
position: absolute;
right: 0;
top: 20px
}


.block7 form .submit .finger img {

}
 

  .animation{
  animation: move-y .8s infinite alternate ease-in-out;
  display: inline-block;
}

 .keyframe1{
    animation-name: anim_v;
}

@keyframes move-y {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(10px);
  }
}





.block7 .form {
	width: 90%;
	padding-top: 10px;
	padding-left: 20px;
}
   
   

   
   
   
    
.block7 form .answer {
	font-size: 28px;
 padding-top: 20px;
padding-bottom: 20px;
}


.block7 form .answer_area {
	font-size: 23px;
	font-weight: bold;
	color: #000;
	clear: both;
	float: none;
	line-height: 1.4em;
}
.block7 .form_text {
	padding-left: 10px;
	padding-right: 10px;
	text-align: left;
	font-size: 11px;
    margin-top: 3px;
}

	
.block7 .formError {
display: none;
}
 
 

 
 

/*==============================================================================*/
	
 #blog {
/* background-image: url("/images/white_bk.png");
background-repeat: repeat;*/
 }
 
  #blog .inner {
 position: relative;
 padding-bottom: 40px;
  }
 
  #blog .inner .blog_man_ph {
  position: absolute;
bottom: 0px;
right: -50px;
  }
 
 
  #blog .blog_wrap {
  padding-left: 20%;
  padding-right: 20%;
  }
 
 
  #blog dl.blog_title {
  padding-top: 100px;
   text-align: center; 
  }
  
  
  
 
  #blog dl.blog_title  dt{
   font-size: 38px;
 padding-bottom: 60px;
 color: #6e8e14;
 letter-spacing: 0.4em;
  }
 
 
  #blog dl.blog_title  dd{
  font-size: 18px;
  color: #6e8e14;
  padding-top: 20px;
  padding-bottom: 20px;
  border-top: 1px solid #6e8e14;
  border-bottom: 1px solid #6e8e14;
  text-align: center;
  }
 
 
  #blog .comment {
  margin-bottom: 60px;
  height: 269px;
overflow-y: scroll;
  }


 #blog .comment dl {
 overflow: hidden;
 border-bottom: 1px dotted #333;
 }
 
 
  #blog .comment dl a {
  text-decoration: none;
  }
 
 


 #blog .comment dl dt {
font-size: 17px;
color: #6f5b4d;
font-weight: bold;
padding-bottom: 10px;
padding-top: 20px;
 }
 
  #blog .comment dl dd {
font-size: 17px;
color: #333;
padding-bottom: 20px;
  }
 
 
 
 
 
/*============================================================*/

@media (max-width:1500px) { 


}



@media (max-width:1200px) { 


#mv .left {
background-size: cover;

}

#mv .right {
background-size: cover;
}



}


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

}