@charset "UTF-8";
/* CSS Document */



/*--------------------------------------------------------
　PC
--------------------------------------------------------*/

@media print, screen and (min-width: 769px){
	
	#s02 {
		width: 100%;
		min-width: 1100px;
		background: url(../images/bg_green.jpg) repeat;
		background-size: 250px;
		padding: 70px 0;
	}
	
	#s02 div.out_box{
		position: relative;
	}
	
	#s02 div.out_box div.point_right{
		width: 100px;
		position: absolute;
		right: 45px;
		top: -10px;
	}
	
	#s02 div.out_box div.point_left{
		width: 100px;
		position: absolute;
		left: 45px;
		top: -10px;
	}
	
	#s02 ul.box01{
		width: 100%;
		position: relative;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	
	#s02 ul.box02{
		width: 100%;
		position: relative;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: flex-start;
		flex-direction: row-reverse;
		margin: 35px 0;
	}
	
	#s02 ul.box01 li.photo,
	#s02 ul.box02 li.photo{
		width: 55%;
		line-height: 0;
		overflow: hidden;
	}
	
	#s02 ul.box01 li.text,
	#s02 ul.box02 li.text{
		width: 45%;
		background: #FFF;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	
	#s02 ul.box01 li.text div,
	#s02 ul.box02 li.text div{
		width: 350px;
	}
	
	#s02 ul.box01 li.text div h3,
	#s02 ul.box02 li.text div h3{
		line-height: 1.2;
		margin-bottom: 20px;
	}
	
	#s02 ul.box01 li.photo,
	#s02 ul.box02 li.text{
		-webkit-border-radius: 10px 0 0 10px;
		-moz-border-radius: 10px 0 0 10px;
		border-radius: 10px 0 0 10px;
		overflow: hidden;
	}
	
	#s02 ul.box02 li.photo,
	#s02 ul.box01 li.text{
		-webkit-border-radius: 0 10px 10px 0;
		-moz-border-radius: 0 10px 10px 0;
		border-radius: 0 10px 10px 0;
		overflow: hidden;
	}
}

/*--------------------------------------------------------
　SP
--------------------------------------------------------*/

@media print, screen and (max-width: 768px){
	
	#s02 {
		width: 100%;
		background: url(../images/bg_green.jpg) repeat;
		background-size: 250px;
		padding: 50px 0;
	}
	
	#s02 h2{
		margin-bottom: 50px;
	}
	
	#s02 div.out_box{
		position: relative;
	}
	
	#s02 div.out_box div.point_right{
		width: 80px;
		position: absolute;
		left: 15px;
		top: -15px;
	}
	
	#s02 div.out_box div.point_left{
		width: 80px;
		position: absolute;
		left: 15px;
		top: -15px;
	}
	
	#s02 ul.box01{
		width: 100%;
	}
	
	#s02 ul.box02{
		width: 100%;
		position: relative;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: flex-start;
		flex-direction: row-reverse;
		margin: 45px 0;
	}
	
	#s02 ul.box01 li.photo,
	#s02 ul.box02 li.photo{
		width: 100%;
		-webkit-border-radius: 10px 10px 0 0;
		-moz-border-radius: 10px 10px 0 0;
		border-radius: 10px 10px 0 0;
		line-height: 0;
		overflow: hidden;
	}
	
	#s02 ul.box01 li.text,
	#s02 ul.box02 li.text{
		width: 100%;
		-webkit-border-radius: 0 0 10px 10px;
		-moz-border-radius: 0 0 10px 10px;
		border-radius: 0 0 10px 10px;
		padding: 30px 15px;
		background: #FFF;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		overflow: hidden;
	}
	
	#s02 ul.box01 li.text div,
	#s02 ul.box02 li.text div{
		width: 350px;
	}
	
	#s02 ul.box01 li.text div h3,
	#s02 ul.box02 li.text div h3{
		line-height: 1.2;
		margin-bottom: 20px;
	}

}

@media print, screen and (max-width: 460px){

}