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

/* ************************************************************
block01
************************************************************ */

#block01{
margin: 10% auto;
width: 100%;
padding: 0 5% 0 10%;
}

#block01 article{
margin:0 auto;
width: 100%;
max-width: 1200px;
display: flex;
justify-content: center;
align-content: center;
flex-flow: row wrap;
}

#block01 article .block01-text{
width: 42%;
margin: 3% 0 0 0 ;
}

#block01 article .block01-img{
width: 58%;
margin: 0 auto;
padding:4% 5% 8% 10%;
position: relative;
}	
	
/* block01 左部分 */
#block01 article .block01-text p:nth-child(1){
margin: 8% 8%;
color: #ef8575;
font-size: 35px;
text-align: center;
padding: 1em 0 1em 0.5em;
margin: 0.5em 0;
background: #fff;
border-radius: 60px;
position:relative;
left: -15px;
}

#block01 article .block01-text p:nth-child(2){
margin: 7% 0 6% 0;
padding: 0 0 0 5%;
color: #6a3906;
font-size: 25px;
line-height: 1.6em;
text-align: left;
}

#block01 article .block01-text h1{
margin: 0 0 6% 0;
padding: 0 0 0 5%;
font-size: 18px;
font-weight: 900;
line-height: 1.9em;
text-align: left;
}

#block01 article .block01-text p:nth-child(4){
padding: 0 0 0 5%;
font-size: 18px;
line-height: 1.7em;
text-align: left;
}

/* メディアクエリ */
/* ******************************************* */
@media screen and (max-width: 1400px) {
 /* ---------------------------------- */

#block01 article .block01-text{
width: 42%;
margin: 3% 0 0 0 ;
}

#block01 article .block01-img{
width: 58%;
margin: 0 auto;
padding:4% 5% 8% 10%;
position: relative;
}
	
#block01 article .block01-text p:nth-child(1){
margin: 1%;
font-size: 30px;
}

#block01 article .block01-text p:nth-child(2){font-size: 20px;}
#block01 article .block01-text h1{font-size: 17px;}
#block01 article .block01-text p:nth-child(4){font-size: 17px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

#block01 article .block01-text{width: 44%;}

#block01 article .block01-img{
width: 56%;
padding:4% 3% 4% 10%;
}

 /* ---------------------------------- */
}


/* ******************************************* */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */

#block01 article{
margin: 8% auto;
display: block;
}

#block01 article .block01-text{
margin: 10% auto 7%;
width: 100%;
}

#block01 article .block01-img{
margin:0 auto;
width: 80%;
padding:0 5%;
text-align: center;
}

/* block01 左部分 */

#block01 article .block01-text p:nth-child(1){
margin:8% auto;
width:100%;
text-align: center;
max-width:500px;
left:0;
}

#block01 article .block01-text p:nth-child(2){
margin: 7% auto 0;
max-width:600px;
font-size:25px;
}

#block01 article .block01-text h1{
margin: 4% auto 0;
max-width:600px;
font-size:18px;
}

#block01 article .block01-text p:nth-child(4){
margin: 4% auto 0;
max-width:600px;
font-size:18px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block01 article .block01-img{width: 85%;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */
 
#block01{padding: 0 10% 20% 10%;}
#block01 article .block01-text h1,

#block01 article .block01-text p:nth-child(4){
margin: 6% auto;
font-size:14px;
}

#block01 article  br{display:none}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block01{margin: 10% auto 70%;}

#block01{padding: 0 10% 0% 10%;}
#block01 article .block01-text p:nth-child(1){font-size: 28px;}

#block01 article .block01-text p:nth-child(2){
margin: 7% auto;
font-size:22px;
}

#block01 article .block01-img{
width: 95%;
padding:0 0;
}

 /* ---------------------------------- */
}


/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */


#block01 article .block01-text p:nth-child(1){font-size: 24px;}

#block01 article .block01-text p:nth-child(2){
margin: 10% auto;
font-size:20px;
}

#block01 article .block01-img{
width: 95%;
padding:0 0;
}

 /* ---------------------------------- */
}

/* ************************************************************
block02
************************************************************ */

#block02{
margin: 12% auto 0;
width: 100%;
}

#block02 article{
padding: 0 0 10% 30%;
position: relative;
}

#block02 article>div{
width: 100%;
max-width:1200px;
}

#block02 article>div h2{
margin: 5% 0 2% 0;
font-size: 42px;
color: #6a3906;
line-height: 2;
font-weight: 700;
}

#block02 article>div h2 span{
position: relative;
line-height: 1;
}

#block02 article>div h2 span::before{
content: '';
width: 100%;
height: 15px;
background-color: #f7c6c7;
border-radius: 20px;
position: absolute;
bottom: 2px;
left: 0%;
z-index: -10;
}

#block02 .support-box>img:nth-child(1){
position: absolute;
top:-70px;
left: 300px;
}

#block02 .support-box>img:nth-child(2){
position: absolute;
top:-100px;
right: 170px;
z-index: -50;
}

#block02 ul{
width: 130%;
padding: 4% 30% 7% 8%;
background-color: #fff;
border-radius:100px;
display: flex;
justify-content: space-evenly;
align-items: center;
flex-flow: row wrap;
}

#block02 ul li{
width: 24%;
padding:2%
}

#block02 ul li:nth-child(3){margin: 0 15% 0 2%;}
#block02 ul li:nth-child(4){margin: 0 2% 0 15%;}

#block02 .block02-square{
background-color: #fede6b;
width: 800px;
height: 400px;
border-radius:0 70px 70px 0;
position: absolute;
bottom: 250px;
left:-3px;
z-index: -200;
}

/* メディアクエリ */

/* *********** ******************************** */
@media screen and (max-width: 1700px) {
 /* ---------------------------------- */

#block02 article{padding: 0 0 10% 28%;}

#block02 article>div h2{
font-size: 36px;
line-height: 2;
}

#block02 .support-box>img:nth-child(1){
width:240px; 
top:-30px;
left: 300px;
}

#block02 .support-box>img:nth-child(2){
width:180px; 
top:-50px;
right: 170px;
}

#block02 ul{padding: 4% 35% 7% 8%;}
#block02 ul li:nth-child(3){margin: 0 14% 0 2%;}
#block02 ul li:nth-child(4){margin: 0 2% 0 14%;}
#block02 .block02-square{bottom: 200px;}
	
 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1600px) {
 /* ---------------------------------- */

#block02 .support-box>img:nth-child(2){
width:180px; 
top:-50px;
right: 120px;
}

#block02 .block02-square{
width: 650px;
height: 300px;
bottom: 230px;
}
    
 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

#block02{margin: 5% auto;}

#block02 article>div h2{
font-size: 35px;
line-height: 1.8;
}

#block02 .support-box>img:nth-child(1){
width:200px; 
top:10px;
left: 280px;
}

#block02 .support-box>img:nth-child(2){
width:160px; 
top:-50px;
right: 85px;
}

#block02 ul li:nth-child(4){margin: 0 2% 0 14%;}

#block02 .block02-square{
width: 650px;
height: 280px;
bottom: 200px;
}
    
 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1300px) {
 /* ---------------------------------- */

#block02 article{padding: 0 0 10% 32%;}

#block02 article>div h2{
font-size: 28px;
line-height: 1.7;
}

#block02 article>div h2 span::before{height: 10px;}

#block02 .support-box>img:nth-child(1){
width:170px; 
top:0px;
left: 270px;
}

#block02 .support-box>img:nth-child(2){
width:120px; 
top:-40px;
right: 85px;
}

#block02 ul li:nth-child(3){margin: 0 13% 0 2.5%;}
#block02 ul li:nth-child(4){margin: 0 2.5% 0 13%;}

#block02 .block02-square{
width: 550px;
height:230px;
border-radius:0 50px 50px 0;
bottom: 180px;
}
    
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

#block02{margin: 15% auto 5%;}
#block02 article{padding: 0 0 10% 25%;}
#block02 article>div h2{font-size: 26px;}
#block02 article>div h2 span::before{height: 10px;}

#block02 .support-box>img:nth-child(1){
width:150px; 
top:0px;
left: 180px;
}

#block02 .support-box>img:nth-child(2){
width:110px; 
top:-40px;
right: 80px;
}

#block02 ul{
width: 130%;
padding: 4% 32% 5% 8%;
border-radius:70px;
}

#block02 .block02-square{
width: 500px;
bottom: 150px;
}

 
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */

#block02{margin: 15% 0 5%;}
#block02 article{padding: 0 0 10% 15%;}

#block02 article>div h2{
font-size: 24px;
line-height: 1.7;
}

#block02 article>div h2 span::before{height: 9px;}

#block02 .support-box>img:nth-child(1){
width:135px; 
top:30px;
left: 70px;
}

#block02 .support-box>img:nth-child(2){
width:90px; 
top:-30px;
right: 80px;
}

#block02 ul{
padding: 4% 32% 5% 8%;
border-radius: 60px;
}

#block02 ul li{
width: 25%;
padding:2%
}

#block02 .block02-square{
width: 400px;
bottom: 100px;
}	

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 900px) {
 /* ---------------------------------- */

#block02 ul{padding: 4% 30% 5% 8%;}
#block02 .support-box>img:nth-child(1){left: 40px;}
#block02 .block02-square{bottom: 80px;}	

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block02{margin: 35% auto 10%;}
#block02 article{padding: 0 10% 0 10%;}

#block02 article>div h2{
font-size: 23px;
line-height: 1.8;
text-align: left;
position: absolute;
top:-140px;
left: 210px;
}

#block02 article>div h2 span::before{height: 5px;}

#block02 .support-box>img:nth-child(1){
width:130px; 
top:-150px;
left: 50px;
}

#block02 .support-box>img:nth-child(2){
width:110px; 
top:-130px;
right: 40px;
}

#block02 ul{
width: 100%;
padding: 10% 10%;
border-radius: 40px;
}

#block02 ul li{
padding: 2% 2% 2% 2%;
width: 40%;
}

#block02 ul li:nth-child(3){margin: 0 auto;}
#block02 ul li:nth-child(4){margin: 0 auto;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 680px) {
 /* ---------------------------------- */
 
#block02{margin: 35% auto 10%;}
#block02 article{padding: 0 10% 0 10%;}

#block02 article>div h2{
font-size: 21px;
line-height: 1.7;
top:-130px;
left: 200px;
}

#block02 article>div h2 span::before{height: 5px;}

#block02 .support-box>img:nth-child(1){
width:130px; 
top:-150px;
left: 40px;
}

#block02 .support-box>img:nth-child(2){
width:110px; 
top:-130px;
right: 40px;
}

#block02 ul{
width: 100%;
padding: 10% 10%;
border-radius: 40px;
}

#block02 ul li{
padding: 2% 2% 2% 2%;
width: 40%;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */

#block02{margin: 25% auto 10%;}

#block02 article>div h2{
font-size: 20px;
line-height: 2;
top:-200px;
left: 200px;
}

#block02 .support-box>img:nth-child(1){
width:120px; 
top:-180px;
left: 60px;
}

#block02 .support-box>img:nth-child(2){
width:110px; 
top:-130px;
right: 40px;
}

#block02 ul{
width: 100%;
padding: 7% 9%;
border-radius: 40px;
}

#block02 ul li{
padding: 2% 2% 2% 2%;
width: 40%;
}

#block02 ul li:nth-child(3){margin: 0 auto;}
#block02 ul li:nth-child(4){margin: 0 auto;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block02{margin: 35% auto 10%;}

#block02 article>div h2{
font-size: 19px;
line-height: 2;
top:-200px;
left: 170px;
}

#block02 article>div h2 span::before{height: 5px;}

#block02 .support-box>img:nth-child(1){
width:120px; 
top:-190px;
left: 30px;
}

#block02 .support-box>img:nth-child(2){
width:90px; 
top:-200px;
right: 35px;
}

#block02 ul{
width: 100%;
padding: 10% 10% 15% 10%;
border-radius: 30px;
display: flex;
flex-flow: column nowrap;
}

#block02 ul li{
margin: 0 auto;
padding: 4% 4% 4% 5%;
width: 70%;
}

/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */

#block02{margin: 40% 0 0 0;}

#block02 article>div h2{
font-size: 16px;
top:-160px;
left: 140px;
}

#block02 .support-box>img:nth-child(1){
width:100px; 
top:-140px;
left: 30px;
}

#block02 .support-box>img:nth-child(2){
width:90px; 
top:-170px;
right: 20px;
}

#block02 ul{
width: 100%;
padding: 10% 10% 15% 10%;
border-radius: 30px;
display: flex;
flex-flow: column nowrap;
}

#block02 ul li{width: 60%;}

 /* ---------------------------------- */
}


/* くわしくみるボタン */
.box-button1 {
margin: 7% 12% 0 55%;
width: 35%;
position: relative;
bottom: 130px;
}

.box-button1 a{
display: block;
width: 100%;
color: #fff;
font-size: 1.5vw;
text-align: center;
background-color: #f9a898;
border-radius: 80px;
box-shadow: 3px 7px #de9283;
line-height: 300%;	
}

.box-button1 a::after{
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f0da";
padding-left: 20px;
}

.box-button1 a:active {
position: relative;
top: 3px;
box-shadow: none;
}

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

/* メディアクエリ くわしくみるボタン */
/* *********** ******************************** */
@media screen and (max-width: 1700px) {
 /* ---------------------------------- */

.box-button1 {bottom: 120px;}

 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1600px) {
 /* ---------------------------------- */

.box-button1 {bottom: 120px;}

 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

.box-button1 {bottom: 100px;}

.box-button1 a{
font-size: 1.4vw;
border-radius: 80px;
box-shadow: 2px 6px #de9283;
line-height: 280%;	
}

.box-button1 a:active {top: 2px;}
    
 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1300px) {
 /* ---------------------------------- */

.box-button1 {bottom: 85px;}

 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

.box-button1 {
margin: 7% 15% 0 53%;
width: 35%;
}

.box-button1 a{
font-size: 1.8vw;
box-shadow: 2px 5px #de9283;
}

.box-button1 a:active {top: 2px;}
    
 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */

.box-button1 {width: 33%;}

 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 900px) {
 /* ---------------------------------- */

.box-button1 {bottom: 75px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

.box-button1 {
margin: 0 12% 0 18%;
width: 60%;
bottom: 30px;
}

.box-button1 a{
font-size: 3vw;
line-height: 280%;	
}

.box-button1 a:active {top: 3px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 680px) {
 /* ---------------------------------- */

.box-button1 {
margin: 0 12% 0 18%;
width: 60%;
bottom: 25px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */

.box-button1 {bottom: 20px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

.box-button1 {
margin: 0 10% 0 14%;
width: 70%;
bottom: 25px;
}

.box-button1 a{
font-size: 3.3vw;
box-shadow: 2px 4px #de9283;
}

.box-button1 a::after{padding-left: 10px;}

 /* ---------------------------------- */
}

/* ************************************************************
block03
************************************************************ */

#block03{
margin: 0 auto;
width: 100%;
padding: 0 5% 0 5%;
}

#block03>article{
width: 100%;
max-width: 1200px;
margin:0 auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-flow: row nowrap;
}

#block03>article .block03-text{
width: 40%;
margin:0 auto 10%;
text-align: left;
position: relative;
}

#block03>article .block03-img{
margin: 0 ;
width: 60%;
position: relative;
bottom: 50px;
padding:5%;
}

#block03 article .block03-text h2{margin: 4% 0 4% 0;}

#block03 article .block03-text h2 span{
font-size: 2.4vw;
padding: 0 1.5%;
color: #6a3906;
position: relative;
font-weight: 900;
}

#block03 article .block03-text h2 span::before{
content: '';
margin: 0 0 0 0 ;
width: 100%;
height: 12px;
background-color: #8fd6a6;
border-radius: 20px;
position: absolute;
bottom: 5%;
left: 0;
z-index: -1;
}

#block03 article .block03-text p{
padding: 5% 0 4% 0%;
font-size: 18px;
font-weight: 800;
line-height: 2.1em;
}

/* メディアクエリ */
/* *********** ******************************** */
@media screen and (max-width: 1400px) {
 /* ---------------------------------- */

#block03{padding: 0 10%;}
#block03 article .block03-text p{font-size: 16px;}

#block03>article .block03-text{
width: 50%;
margin:0 auto 10%;
}

#block03>article .block03-img{
margin: 0 ;
width: 50%;
}

 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1100px) {
 /* ---------------------------------- */

#block03{padding: 0 7% 0 13%;}
#block03 article .block03-text p{font-size: 1.3vw;}
   
#block03>article .block03-img{
padding:7% 3% 7% 3%;
bottom: 30px;
}
	
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 900px) {
 /* ---------------------------------- */

#block03 article .block03-text p{font-size: 1.5vw;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block03{
margin: 0 auto;
padding: 0 15% 0 15%;
}

#block03>article{
margin:0 auto;
display: block;
}

#block03>article .block03-text{
width: 100%;
margin: 30% 0 0 0 ;
}

#block03>article .block03-img{
margin: 0 auto;
width: 100%;
padding: 0 12% ;
top: 50px;
}

#block03 article .block03-text h2{margin: 5% 0 8% 0;}
#block03 article .block03-text h2 span{font-size: 4.5vw;}
#block03 article .block03-text h2 span::before{height: 10px;}

#block03 article .block03-text p{
padding: 2% 0 2% 0;
font-size: 2.4vw;
font-weight: 600;
line-height: 2.2em;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */

#block03 article .block03-text h2 span{font-size: 5vw;}
#block03 article .block03-text p{font-size: 2.7vw;}
    
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block03{
margin: 10% 0 10% 0 ;
padding: 0 10% 0 10%;
}

#block03 article .block03-text h2 span{font-size: 6vw;}

#block03 article .block03-text p{
font-size: 2.8vw;
line-height: 2em;
}

#block03 article .block03-text p br{display: none;}

#block03>article .block03-img{
padding: 5% 5% 5% 0 ;
top: 25px;
}
    
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */

#block03{padding: 0 8% 0 13%;}

#block03 article .block03-text p{
font-size: 3vw;
line-height: 2em;
}

#block03>article .block03-img{left: 10px;}
    
 /* ---------------------------------- */
}

/* block03 くわしくみるボタン */
.box-button2 {
margin: 7% 10% 0 0;
width: 90%;
}

.box-button2 a{
display: block;
width: 100%;
color: #fff;
font-size: 1.5vw;
text-align: center;
background-color: #8fd6a6;
border-radius: 80px;
box-shadow: 3px 7px #8fb989;
line-height: 300%;	
}

.box-button2 a::after{
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f0da";
padding-left: 20px;
}

.box-button2 a:active {
position: relative;
top: 3px;
box-shadow: none;
}

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

/* メディアクエリ くわしくみるボタン */

/* *********** ******************************** */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

.box-button2 {
margin: 7% 25% 0 0;
width: 75%;
}

.box-button2 a{
font-size: 1.4vw;
border-radius: 80px;
box-shadow: 2px 6px #8fb989;
line-height: 280%;	
}

.box-button2 a:active {top: 2px;}
    
 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

.box-button2 {
margin: 7% 30% 0 0;
width: 70%;
}

.box-button2 a{
font-size: 1.8vw;
box-shadow: 2px 5px #8fb989;
}

 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 900px) {
 /* ---------------------------------- */

.box-button2 {
margin: 7% 35% 0 0;
width: 65%;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

.box-button2 {
margin: 7% 32% 0 0;
width: 68%;
}

.box-button2 a{
font-size: 3vw;
line-height: 280%;	
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

.box-button2 {
margin: 7% 36% 0 0;
width: 64%;
}

.box-button2 a{font-size: 3.3vw;}
.box-button2 a::after{padding-left: 10px;}

 /* ---------------------------------- */
}

/* ************************************************************
block04
************************************************************ */

#block04{
margin: 3% auto;
width: 100%;
padding: 0 15% 0 15%; 
}

#block04 article{
padding: 6% 11%;
background-color: #fff;
border-radius: 80px;
}

#block04 article>div{
width: 100%;
display: flex;
justify-content: flex-start;
align-items: baseline;
flex-flow: wrap;
}

#block04 article>div::after{
content: '';
margin: 1% 0 2.5% 0 ;
width: 100%;
height: 4px;
background-color: #f9a898;
border-radius: 20px;
}

#block04 article>div img{
margin: 0 2% 0 0 ;
width: 17%;
}

#block04 article>div p{
font-size: 1vw;
position: relative;
bottom: 6px;
}

#block04 article>ul{margin: 0 auto;}

#block04 article>ul li{
margin: 1em 0;
width: 100%;
font-size: 0.9vw;
background-color: #fff8e7;
border-radius: 100px;
padding: 2.3% 0 2.3% 5%;

display: flex;
justify-content: flex-start;
align-items: center;
}

#block04 article>ul li p:nth-child(1){
width: 10%;
margin: 0 5% 0 0 ;
letter-spacing: 0.1em;
}

#block04 article>ul a{
color:  #6a3906;
font-size: 17px;
line-height: 1.5;
}


/* メディアクエリ */
/* *********** ******************************** */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

#block04{padding: 0 13% 0 13%; }

#block04 article{
padding: 6% 12%;
border-radius: 70px;
}

#block04 article>div::after{
height: 3px;
border-radius: 20px;
}

#block04 article>div p{font-size: 1.2vw;}

#block04 article>ul li{
font-size: 1.1vw;
padding: 2% 0 2% 5%;
}

 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1300px) {
 /* ---------------------------------- */

#block04{padding: 0 13% 8% 13%; }

#block04 article{border-radius: 60px;}
#block04 article>div::after{height: 2px;}

#block04 article>div img{
margin: 0 3% 0 0 ;
width: 20%;
}

#block04 article>div p{font-size: 1.2vw;}

#block04 article>ul li{
margin: 0.8em 0;
font-size: 1.3vw;
}
    
 /* ---------------------------------- */
}

/* *********** ******************************** */
@media screen and (max-width: 1100px) {
 /* ---------------------------------- */

#block04{padding: 0 12% 0 12%; }
#block04 article>ul a{font-size: 15px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 900px) {
 /* ---------------------------------- */

#block04 article{border-radius: 50px;}
#block04 article>div::after{margin: 0.5% 0 2% 0 ;}

#block04 article>div p{
font-size: 1.8vw;
bottom: 3px;
}

#block04 article>ul li{
font-size: 1.5vw;
padding: 2.3% 0 2.3% 5%;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block04{
margin: 20% auto;
padding: 0 5%; 
}

#block04 article{
padding: 7% 10%;
border-radius: 40px;
}

#block04 article>div::after{margin: 0.5% 0 3% 0 ;}

#block04 article>div img{
margin: 0 4% 0 0 ;
width: 25%;
}

#block04 article>div p{font-size: 2vw;}

#block04 article>ul li{
font-size: 1.8vw;
padding: 2.3% 0 2.3% 5%;
display:block;
}

#block04 article>ul li p:nth-child(1){
width: 100%;
padding:0 0 0 3%;
text-align: left;
}

#block04 article>ul li p:nth-child(2){
width: 100%;
padding:0 0 0 3%;
text-align: left;
line-height:1.5;
}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */

#block04 article>div p{font-size: 2.5vw;}

#block04 article{
padding: 10% 9%;
border-radius: 30px;
}

#block04 article>div::after{margin: 0.5% 0 4% 0;}
#block04 article>div img{width: 30%;}

#block04 article>ul li{
font-size: 2.5vw;
padding: 3% 8% 3%;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block04 article>div img{width: 40%;}
#block04 article>div p{font-size: 2.8vw;}

#block04 article>ul li{
font-size: 3vw;
padding: 3% 8% 3%;
}

#block04 article>ul a{font-size: 13px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */

#block04{padding: 0 7%; }
#block04 article{border-radius: 20px;}
    
 /* ---------------------------------- */
}

/* ************************************************************
block05
************************************************************ */

#block05{
margin: 10% auto 0 -50%;
width: 200%;
background:#fff;
border-radius:50% 50% 0 0;
padding:8% 0 3%;
z-index:-2;
}

#block05 .absolute{
margin:0 auto;
width:100%;
height:auto;
position:relative;
max-width:1920px;
}

#block05 .mark-left{
position:absolute;
top:-150px;
left:5%;
}

#block05 .mark-right{
position:absolute;
top:-150px;
right:5%;
}

#block05 h3{
margin:0 auto 0;
width:100%;
letter-spacing: 0.05em;
line-height:1.5;
font-weight:bold;
}

#block05 h3 span{
font-size:50px;
padding:0 10px;
color: #6a3906;
position: relative;
z-index:1;
}

#block05 h3 span::before{
content: '';
margin: 0 0 0 0;
width: 100%;
height: 12px;
background-color: #f9a898;
border-radius: 20px;
position: absolute;
bottom: 7%;
left: 0;
z-index: -1;
}

#block05 article{
margin:2% auto;
width:100%;
max-width:1200px;
display:flex;
justify-content: space-around;
align-items: center;
flex-flow:row nowrap;
}

#block05 article .photo{
margin:0 auto;
width:50%;
padding:0 5% 0 0;
}

#block05 article .box{
margin:0 auto;
width:50%;
}

#block05 article .box h4{
margin:0 auto;
width:100%;
display: flex;
align-items: center;
}

#block05 article .box h4 .name{
font-size:35px;
line-height:1.4;
letter-spacing: 0.05em;
font-weight:bold;
color:#ef8575;
border-bottom:3px solid #ef8575;
}

#block05 article .box h4 .reserve{
margin:2% 0 0 5%;
font-size:18px;
height:40px;
line-height:1;
letter-spacing: 0.05em;
background:#ef8575;
color:#fff;
border-radius:25px;
padding:10px 5% 0;
}

#block05 article .box .address{
margin:3% auto;
width:100%;
font-size:16px;
line-height:1.4;
letter-spacing: 0.05em;
text-align: left;
}

#block05 article .box dt{
margin:5% auto 0;
width:100%;
max-width:150px;
font-size:18px;
line-height:1.4;
letter-spacing: 0.05em;
text-align: left;
border-bottom:2px solid #6a3906;
text-align: center;
}

#block05 article .box dd{
margin:3% auto 0;
width:100%;;
font-size:18px;
line-height:1.4;
}

#block05 ul{
margin:2% auto;
width:100%;
max-width:1000px;
display:flex;
justify-content: space-around;
}

#block05 ul li{padding:0 5%;}
#block05 ul li a img{transition: 0.5s;}

#block05 ul li a img:hover{
opacity: 0.3;
transition: 0.5s;
}

/* *********** ******************************** */
@media screen and (max-width: 1800px) {
 /* ---------------------------------- */

#block05{margin: 12% auto 0 -50%;}
#block05 .absolute{max-width:1500px;}

#block05 .mark-left{
left:0%;
max-width:250px;
}

#block05 .mark-right{
right:0%;
max-width:250px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

#block05{
margin: 14% auto 0 -50%;
padding:8% 0 5%;
}

#block05 .absolute{max-width:1200px;}
#block05 .mark-left,#block05 .mark-right{max-width:200px;}
#block05 h3{margin:2% auto 0;}
#block05 h3 span{font-size:45px;}
#block05 h3 span::before{height: 10px;}
#block05 article{padding:0% 3%;}
#block05 article .box h4 .name{font-size:30px;}

#block05 article .box h4 .reserve{
font-size:16px;
height:35px;
}

#block05 article .box .address{font-size:14px;}

#block05 article .box dt{
max-width:120px;
font-size:16px;
}

#block05 article .box dd{font-size:16px;}

#block05 ul{
margin:2% auto 0;
max-width:800px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

#block05{margin: 16% auto 0 -50%;}

#block05 .absolute,
#block05 article{
max-width:1000px;
}

 /* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
#block05{margin: 18% auto 0 -50%;}
#block05 .absolute,#block05 article{max-width:760px;}
#block05 .mark-left,#block05 .mark-right{max-width:180px;}
#block05 h3{margin:2% auto 0;}
#block05 h3 span{font-size:35px;}
#block05 h3 span::before{height: 8px;}
#block05 article .box h4 .name{font-size:25px;}

#block05 article .box h4 .reserve{
font-size:14px;
height:32px;
}

#block05 article .box .address{font-size:13px;}

#block05 article .box dt{
max-width:120px;
font-size:14px;
}

#block05 article .box dd{font-size:14px;}

#block05 ul{
margin:4% auto 2%;
max-width:700px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block05{margin: 20% auto 0 -50%;}
#block05 .absolute,#block05 article{max-width:600px;}
#block05 article{display:block}

#block05 article .photo{
margin:0 auto;
width:90%;
padding:0 0 0 0;
}

#block05 article .box{
margin:5% auto;
width:90%;
}

#block05 .mark-left,#block05 .mark-right{
max-width:150px;
top:-90px;
}

#block05 ul{
margin:4% auto 2%;
display:block;
max-width:400px;
}

#block05 ul li{padding:2% 5%;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */

#block05{margin: 22% auto 0 -50%;}
#block05 .absolute,#block05 article{max-width:450px;}
#block05 .mark-left,#block05 .mark-right{max-width:120px;}
#block05 ul li{padding:2% 10%;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block05{margin: 24% auto 0 -50%;}
#block05 .absolute,#block05 article{max-width:380px;}

#block05 .mark-left,#block05 .mark-right{
max-width:100px;
top:-80px;
}

#block05 h3{margin:5% auto 0;}
#block05 h3 span{font-size:30px;}
#block05 h3 span::before{height: 8px;}

#block05 article .photo{
margin:2% auto;
width:100%;
padding:0 5% 0 0;
}

#block05 article .box{
margin:8% auto;
width:100%;
}

 /* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */
#block05{margin: 26% auto 0 -50%;}
#block05 .absolute,#block05 article{max-width:340px;}

#block05 .mark-left,#block05 .mark-right{
max-width:80px;
top:-60px;
}

#block05 article .photo{
margin:0 auto;
width:95%;
padding:0 0 0 0;
}

#block05 article .box{
margin:5% auto;
width:95%;
}

#block05 ul li{padding:2% 15%;}

 /* ---------------------------------- */
}
