@CHARSET "UTF-8";
/******************************************************************************
 * マルカ  （ページ名）用スタイル
 * WEB SITE ver.2017
 * RESPONSIVE
 * PC width min-width:769px
 * SP max-width: 768px(iPhone6+ ヨコイチまで)
******************************************************************************/
@import url(html5-doctor-reset-stylesheet.min.css);
@import url(base.css);
@import url(page_base.css);

/******************************************************************************
 * h1
******************************************************************************/
body>article>h1{
  font-size:35px;
  line-height:1.5;
  margin-bottom:70px;
  color: #000;
}
body>article>h1>span{
  display:block;
  font-size:60px;
  margin-top:5px;
  color: #000;
}
body>article>h1>span>img{
  display:inline-block;
  width:140px;
  height:auto;
  margin:0 10px;
  vertical-align:-8px;
}
/** SMART PHONE **************************************************************/
@media screen and (max-width:767px){
	body>article>h1{
		font-size:22px;
		margin-bottom:40px;
    }
	body>article>h1>span{
		font-size:28px;
		margin-top:5px;
	}
	body>article>h1>span>img{
		width:80px;
		margin:0 4px 0 6px;
	}
}


/******************************************************************************

 * #reform
 
******************************************************************************/
#reform{
  width:900px;
	margin:70px auto;
	font-weight:bold;
	text-align:center;
}
#reform>h2{
	font-size:30px;
	line-height:1.5;
	color:#f76f1e;
}
#reform>h2+p{
	font-size:25px;
  color: #000;
	line-height:1.7;
	margin:56px auto;
}
#reform>p{
	font-size:22px;
  color: #000;
	line-height:1.8;
	margin:56px auto;
}
#reform>p>span{
	font-size:30px;
  line-height: 1.5;
	color:#f76f1e;
	display:block;
}
/** SMART PHONE **************************************************************/
@media screen and (max-width:767px){
	#reform{
    width: 100%;
		margin:30px auto;
		padding:0 10px;
	}
	#reform>h2{
		font-size:23px;
	}
	#reform>h2+p{
		font-size:20px;
		margin:30px auto;
	}
	#reform>p{
		font-size:18px;
		line-height:1.8;
		margin:30px auto;
	}
	#reform>p>span{
		font-size:20px;
		line-height:1.5;
    margin-top: 10px;
	}
}

/******************************************************************************

 * #point
 
******************************************************************************/
#point{
  width:900px;
	margin:0 auto 130px;
  color: #000;
}
#point>h2{
	font-size:48px;
	line-height:1.4;
	text-align:center;
	margin-bottom:54px;
  color: #000;
}
#point>h2>span{
	display:block;
	color:#f76f1e;
}
/**/
#point>ul{
	display:table;
	margin:auto;
	text-align:center;
	font-weight:bold;
}
#point>ul>li{
	margin-bottom:64px;
}
#point .point-num{
	display:table;
	background-size: 5px 1px;
	background-image: linear-gradient(to right, #4e4e4e, #4e4e4e 1px, transparent 1px, transparent 4px);
	background-repeat: repeat-x;
	background-position:center;
	margin:0 auto 35px;
	padding:0 120px;
}
#point .point-num span{
	background: #FFF;
	color:#f76f1e;
	font-size:45px;
	padding:20px
}
#point h3{
	font-size:40px;
  color: #000;
}
#point p{
	font-size:26px;
  line-height: 1.5;
  margin-top: 20px;
  color: #000;
}

/** SMART PHONE **************************************************************/
@media screen and (max-width:767px){
	#point{
    width: 100%;
		padding:0 16px;
		margin:80px auto 50px;
	}
	#point>h2{
		font-size:25px;
		margin-bottom:30px;
	}
	#point>ul>li{
		margin-bottom:30px;
	}
	#point .point-num{
		padding:0 50px;
		margin-bottom:10px;
	}
	#point .point-num span{
		font-size:25px;
		padding:10px
	}
  #point h3{
		font-size:22px;
    line-height: 1.5;
	}
  #point p{
    font-size:18px;
  }
}

/******************************************************************************

 * #voice
 
******************************************************************************/
#voice{
  width:900px;
	margin:0 auto 130px;
  color: #000;
}
#voice>h2{
  font-size: 28px;
  line-height: 1.3;
  text-align: center;
  margin-bottom: 50px;
}

/*****.voice-head*****/
.voice-head{
	width: 900px;
	margin: 0px auto 30px;
}
/*メイン写真*/
.voice-head>figure{
	width: 900px;
}
.voice-head>figure>figcaption{
	font-size: 36px;
	line-height: 1.4;
	letter-spacing: 1px;
	text-align:center;
	margin: 40px 0 60px 0;
	font-weight:bold;
	color:#333;
}
.voice-head>figure>figcaption>em{
	font-style: normal;
	color:#ED1E4E;
}
/********/
.voice-head__content{
  display: grid;
  grid-template-columns: 430px 450px;
  gap: 20px;
}
/********/
.voice-head__profile>figure{
	text-align:center;
	margin-bottom: 30px;
}
.voice-head__profile>div{
  display: grid;
  grid-template-columns: 200px 250px;
}
.voice-head__profile>div>figure{
  padding-left: 20px;
}
/*文章*/
.voice-head__profile>div>div{
	text-align:left;
	padding: 10px 0 0 10px;
}
.voice-head__profile>div>div>h3{
	font-size: 16px;
	line-height: 1.4;   
	letter-spacing: 1px;
	font-weight:bold;
	color:#333;
}
.voice-head__profile>div>div>p{
	margin-top: 20px;
	line-height: 1.4;   
	letter-spacing: 1px;
	font-weight:bold;
	color:#5D1C05;
}

/*****#MainBox*****/
#MainBox{
	width: 900px;
	padding: 50px 0;
	margin:30px auto 0;
	background:#EBE2DA;
	overflow:hidden;
}
#MainBox>div{
  display: grid;
  grid-template-columns: 450px 450px;
}
#MainBox>div h2{
	color: #B00000;
	font-size: 16px;
	letter-spacing: 1px;
	line-height: 1.6;
	border: 1px dotted #B00000;
	border-right: 0px;
	border-top: 0px;
	padding: 0 0 5px 15px;
	margin: 0 0 10px 0;
}
#MainBox>div p{
	font-size: 16px;
	color:#333;
	letter-spacing: 1px;
	line-height: 30px;
	text-indent: 1em;
}
/*左列設定*/
#MainBox div.leftTxt>div{
	margin-left: 90px;
	margin-right: 20px;
}
/*右列設定*/
#MainBox div.rightTxt>div{
	margin-right: 90px;
	margin-left: 20px;
}
#MainBox>div>div.leftTxt>div>p.txt_red{
	color:#B00000;
	text-indent:0;
	font-weight:bold;
}
.box02{
  background: url(../img/reform/img03.jpg) no-repeat center top;
  padding-top:500px; 
}
.img01{
	margin: 0 0 30px;
	text-align:left;
}
.img02{
  margin-top: 20px;
}
.img03{
  display: none;
}
.img04{
  margin: 0 0 10px 50px;
}
.img05{
	margin: 0 0 30px 30px;
}
.img06{
	margin: 20px 0 40px 15px;
}
.img07{
	margin: 30px 0 30px 25px;
}
.img08{
	margin:20px 0 0 50px;
}
.txt_mgt{
  margin-top:300px;
}
/** SMART PHONE **************************************************************/
@media screen and (max-width:767px){
  #voice{
    width:100%;
    margin:0 auto 130px;
  }
  #voice>h2{
    font-size: 20px;
    line-height: 1.6;
    margin-bottom: 40px;
  }

  /*****.voice-head*****/
  .voice-head{
    width: 100%;
  }
  /*メイン写真*/
  .voice-head>figure{
    width: 100%;
    display: flex;
    flex-direction: column-reverse;
  }
  .voice-head>figure>figcaption{
    font-size: 18px;
    margin: 0 0 15px 0;
  }
  /********/
  .voice-head__content{
    display: flex;
    flex-direction: column-reverse;
    padding: 0 10px;
  }
  /********/
  .voice-head__profile{
    text-align: center;
  }
  .voice-head__profile>figure{
    width: min(40%, 300px);
    margin:30px auto 30px;
  }
  .voice-head__profile>div{
    display: inline-grid;
    gap:10px;
    grid-template-columns: 40% 60%;
  }
  .voice-head__profile>div>div>h3{
    font-size: 15px;
  }

  /*****#MainBox*****/
  #MainBox{
    width: 100%;
    padding: 20px;
    margin:20px auto 0;
  }
  #MainBox>div{
    display: grid;
    grid-template-columns: 1fr;
    margin: 20px 0;
  }
  #MainBox>div h2{
    color: #B00000;
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 1.6;
    border: 1px dotted #B00000;
    border-right: 0px;
    border-top: 0px;
    padding: 0 0 5px 15px;
    margin: 0 0 10px 0;
  }
  #MainBox>div p{
    font-size: 16px;
    color:#333;
    letter-spacing: 1px;
    line-height: 30px;
    text-indent: 1em;
    text-align: justify;
  }
  /*左列設定*/
  #MainBox div.leftTxt>div{
    margin: 0;
  }
  /*右列設定*/
  #MainBox div.rightTxt>div{
    margin: 0;
  }
  #box01{
    display: flex;
    flex-direction: column-reverse;
  }
  #MainBox>.box01{
    display: flex;
    flex-direction: column-reverse;
  }
  .box02{
    background:none;
    padding-top:0; 
  }
  .img01{
    width: min(100%, 450px);
    margin:0 auto 20px;  
  }
  .img02{
    width: min(90%, 400px);
    margin:20px auto;  
  }
  .img03{
    display: block;
    width: min(100%, 450px);
    margin:0 auto 20px;  
  }
  .img04{
    width: min(90%, 400px);
    margin:20px auto;
  }
  .img05{
    width: min(90%, 400px);
    margin:20px auto;
  }
  .img06{
    width: min(90%, 400px);
    margin:20px auto;
  }
  .img07{
    width: min(90%, 400px);
    margin:20px auto;
  }
  .img08{
    width: min(80%, 400px);
    margin:20px auto 0;
  }
  .txt_mgt{
    margin-top:0;
  }
}