@charset "utf-8";

/*----------------------------------------
　.about-box
-----------------------------------------*/
.about-box .top-box .text{
	text-align: center;
	line-height: 1.8;
	margin-bottom: 50px;
  }
  .about-box .top-box ul{
	text-align: center;
	margin-bottom: 25px;
  }
  .about-box .top-box ul li{
	font-size: 22px;
	line-height: 2.2;
  }
  .about-box .top-box .mintxt{
	color: #b71010;
	text-decoration: underline;
	font-weight: bold;
  }
  .about-box .top-box .list-box{
	max-width: 820px;
	width: 100%;
	margin:50px auto;
	position: relative;
	align-items: center;
  }
  .about-box .top-box .list-box:before{
	content: "";
	position: absolute;
	top: 0;
	width: 1px;
	height: 100%;
	left: 50%;
	background: #ccc;
  }
  .about-box .top-box .list-box .box{
	width: 46.5%;
  }
  .about-box .top-box .list-box h4{
	margin-bottom: 25px;
  }
  .about-box .top-box .list-box dl{
	justify-content: center;
  }
  .about-box .top-box .list-box dt{
	font-weight: bold;
	margin-right: 20px;
  }
  .about-box .top-box .list-box dd{
	color: #b71010;
  }
  .about-box .top-box .list-box li:not(:last-child){
	margin-bottom: 25px;
  }
  
  .about-box .top-box .list-box .item-txt{
	text-align: center;
	font-weight: bold;
	font-size: 22px;
	color: #b71010;
  }
  
  .about-box .top-box .list-box .item-box h4{
	text-align: center;
	border: 1px solid black;
	padding: 16px 0;
  }
  .about-box .top-box .list-box .item-box .item-txt{
	color: black;
  }
  .three-box .box{
	margin-bottom: 45px;
  }
  .three-box .box h4{
	text-align: center;
	margin-bottom: 22px;
  }
  .three-box .box ul li{
	border: 1px solid #2b8b31;
	width: 32%;
	text-align: center;
	height: 68px;
	line-height: 66px;
	position: relative;
	-webkit-transition: .3s;
	transition: .3s;
  
  }
  .three-box .minbox .mintxt,
  .three-box .box ul li .txt{
	color: #2b8b31;
  }
  .three-box .minbox .mintxt2{
	color: #b71010;
  }
  .three-box .minbox h3{
	color: #2b8b31;
	font-size: 22px;
	border-bottom: 1px solid #2b8b31;
	margin-bottom: 12px;
	padding-bottom: 11px;
	position: relative;
	padding-left: 25px;
  }
  .three-box .minbox h3:before{
	content: "";
	width: 20px;
	height: 20px;
	background: #2b8b31;
	display: block;
	top: 0;
	position: absolute;
	left: 0;
  }
  .three-box .minbox p{
	line-height: 1.8;
  }
  .three-box .minbox:not(:last-of-type){
	margin-bottom: 35px;
  }
  .table-box table{
	width: 100%;
	border-top: 1px solid rgb( 77,56,51 );
	border-left: 1px solid rgb( 77,56,51 );
	margin-bottom: 25px;
  }
  .table-box table th,
  .table-box table td{
	border-right: 1px solid rgb( 77,56,51 );
	border-bottom: 1px solid rgb( 77,56,51 );
	vertical-align: middle;
	padding: 20px;
	text-align: center;
  }
  .table-box table .item-th{
	width: 20%;
  }
  .table-box table .item{
	font-weight: bold;
	color: #b71010;
	font-size: 20px;
  }
  /*----------------------------------------
  .voice-box
  -----------------------------------------*/
  .voice-box{
	background: rgb( 77,56,51 );
	padding-bottom: 40px;
  }
  
  .voice-box h2{
	color: white;
	font-size: 32px;
	text-align: center;
	margin-bottom: 15px;
  }
  .voice-box .toptxt{
	text-align: center;
	color: white;
	font-size: 14px;
	margin-bottom: 45px;
  }
  .voice-box .minbox{
	border: 1px solid white;
	padding: 20px;
	box-sizing: border-box;
  }
  .voice-box .minbox{
	margin-bottom: 50px;
  }
  .voice-box .minbox:nth-of-type(2) dl{
	flex-direction:row-reverse;
  }
  
  .voice-box .minbox dt{
	width: 22%;
  }
  .voice-box .minbox dd{
	width: 75%;
  }
  .voice-box .minbox h3{
	background: white;
	padding: 10px 12px;
	box-sizing: border-box;
	font-size: 22px;
	margin-bottom: 20px;
  }
  .voice-box .minbox h4{
	color: white;
	border-bottom: 1px solid white;
	font-size: 18px;
	padding-bottom: 10px;
	margin-bottom: 15px;
  }
  .voice-box .minbox .cap{
	margin-bottom: 12px;
  }
  .voice-box .minbox dt li{
	color: white;
	justify-content: flex-start;
  }
  .voice-box .minbox dt li:first-child{
	margin-bottom: 12px;
  }
  .voice-box .minbox dt .txt{
	width: 50%;
  }
  .voice-box .minbox .data{
	border: 1px solid white;
	padding: 10px;
	box-sizing: border-box;
	margin-bottom: 18px;
	display: table;
	table-layout: fixed;
	width: 100%;
  }
  .voice-box .minbox .data .mintitle,
  .voice-box .minbox .data ul{
	display: table-cell;
	vertical-align: middle;
  }
  .voice-box .minbox .data .mintitle{
	width: 20%;
	background: #bbbb42;
	color: white;
	text-align: center;
	color: #333;
	line-height: 1.75;
  }
  .voice-box .minbox .data ul{
	padding-left: 12px;
  }
  .voice-box .minbox .data ul li{
	justify-content: flex-start;
	color: white;
  }
  .voice-box .minbox .data ul li:not(:last-child){
	margin-bottom: 12px;
  }
  .voice-box .minbox .text{
	color: white;
	line-height: 2.2;
  }
  .voice-box .text-box p{
	color: white;
	line-height: 1.8;
  }
  .voice-box .text-box p:not(:last-of-type){
	margin-bottom: 20px;
  }
  .voice-box .text-box p .itemtxt{
	color: #ff0;
  }
  .voice-box .contents-box{
	padding-bottom: 0;
  }
  
  /*----------------------------------------
  .step-box
  -----------------------------------------*/
  .step-box .text-box{
	margin-bottom: 25px;
  }
  .step-box .text-box p{
	text-align: center;
	line-height: 1.8;
  }
  .step-box .text-box p:not(:last-of-type){
	margin-bottom: 22px;
  }
  .step-box .text-box .item{
	color: #b71010;
	font-weight: bold;
  }
  .step-box .flow-box{
	max-width: 620px;
	width: 100%;
	margin:0 auto 50px;
  }
  .step-box .flow-box li{
	border: 1px solid #2b8b31;
	border-radius:6px;
	padding: 12px;
  }
  .step-box .flow-box li:not(:last-child){
	margin-bottom: 70px;
	position: relative;
  }
  .step-box .flow-box li:not(:last-child):after{
	width: 0;
  height: 0;
  border-style: solid;
  border-width: 25px 25px 0 25px;
  border-color: #2b8b31 transparent transparent transparent;
	content: "";
	position: absolute;
	left: 50%;
	bottom: -50px;
	-webkit-transform: translate(-50%,0);
	transform: translate(-50%,0);
  
  }
  .step-box .flow-box h3{
	border-radius: 6px 6px 0 0;
	background: #2b8b31;
	color: white;
	text-align: center;
	padding: 12px 0;
	font-size: 22px;
	margin-bottom: 10px;
  }
  
  .exsample-box{
	max-width: 820px;
	width: 100%;
	margin: auto;
  }
  .exsample-box{
	margin-bottom: 50px;
  }
  .exsample-box dd{
	border: 1px solid black;
	width: 50%;
	box-sizing: border-box;
	padding: 20px;
  }
  .exsample-box h3{
	text-align: center;
	background: #3aa9e1;
	padding: 15px 0;
	border-radius: 6px 6px 0 0;
	font-size: 18px;
	margin-bottom: 16px;
  }
  .exsample-box:last-of-type h3{
	background: #eb508b;
	color: white;
  }
  .exsample-box dt{
	width: 45%;
  }
  .exsample-box li{
	line-height: 2.2;
  }
  .exsample-box .text-right{
	text-align: right;
  }
  /*----------------------------------------
  faq-box
  -----------------------------------------*/
  .faq-box .inbox{
	background: #b1bac7;
	border-radius: 6px;
	box-sizing: border-box;
	padding: 20px;
  }
  .faq-box .inbox:not(:last-of-type){
	margin-bottom: 45px;
  }
  .faq-box .inbox dt,
  .faq-box .inbox dd{
	display: table;
	table-layout: fixed;
	width: 100%;
  }
  .faq-box .inbox dd{
	display: none;
	-webkit-transition: .5s;
	transition: .5s;
  
  }
  .faq-box .inbox dt{
	cursor: pointer;
  }
  .faq-box .inbox .icon,
  .faq-box .inbox .txt{
	display: table-cell;
	vertical-align:middle;
  }
  .faq-box .inbox dd .icon,
  .faq-box .inbox dd .txt{
	vertical-align: top;
  }
  .faq-box .inbox .txt{
	line-height: 1.8;
  }
  .faq-box .inbox .icon{
	font-size: 22px;
	width: 4%;
	line-height: 1.4;
  }
  
  .faq-box .btn-box{
	background: none;
  }
  
  
/*--------------------------------------------------------------------------
  index-top-box
  --------------------------------------------------------------------------*/
.index-top-box{
	margin-top: 80px;
	position: relative;
	width: 100%;
	background-color: black;
}

/* トップ画像 */
.index-top-img{
	margin: 0 auto;
	width: 100%;
	height: 66.67vw;
	background-image:url(/images/index-top-img.png);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

/* トップ画像 文言 */
.index-top-img h2{
	z-index: 10;
	font-size: 28px;
	color: white;
	letter-spacing: .1em;
	text-align: center;
	margin: 0 auto;
	line-height: 1.5;
}
.index-top-img .h2-1{/* トップ画像 文言1 */
    padding-top: 2em;
}
.index-top-img .h2-2{/* トップ画像 文言2 */
	margin-top: 12em;
}

/* 940px 以下で適用する内容 */
@media screen and (max-width: 940px){
	.index-top-box{
		margin-top: 4em;
	}
	.index-top-img h2{
		font-size: 160%;
	}
	.index-top-img{	
		height: 32em;
	}
	.index-top-img .h2-1{/* トップ画像 文言1 */
		padding-top: 2em;
	}
	.index-top-img .h2-2{/* トップ画像 文言2 */
		margin-top: 12em;
	}
}

/* 740px 以下で適用する内容 */
@media screen and (max-width: 740px){
	.index-top-box{
		margin-top: 4em;
	}
	.index-top-img h2{
		font-size: 140%;
	}
	.index-top-img{	
		height: 20em;
	}
	.index-top-img .h2-1{/* トップ画像 文言1 */
		padding-top: 1em;
	}
	.index-top-img .h2-2{/* トップ画像 文言2 */
		margin-top: 7em;
	}
}

/*--------------------------------------------------------------------------
  about-box / .step-box
  --------------------------------------------------------------------------*/
  .about-box,.step-box{
	width:100%;
}
.about-box .box,.step-box .box{
	margin: .5em auto;
	padding: .5em;
	width: calc(100% - 3em);
	max-width: 940px;
}
.box-h3{
	color: red;
	font-weight: bold;
}
.box-h3,.box-p{
	font-size: 130%;
	word-wrap: break-word;
	margin:.5em 0;
	line-height:1.4;
}

/* 画像外枠 */
.about-box .img{
	margin: 0 auto;
	padding: 0;
	width: calc(100% - 3em);
	max-width: 940px;
}
.about-box .img img{
	width: 100%;
	border:0;
}
/********************************************************************/
/* 740px 以下で適用する内容 */
/********************************************************************/
@media screen and (max-width: 767px){
	.index-top-box{
		margin-top: 3.5em;
	}
	.index-top-img h2{
		font-size: 140%;
	}
	.index-top-img{	
		height: 20em;
	}
	.index-top-img .h2-1{/* トップ画像 文言1 */
		padding-top: 1em;
	}
	.index-top-img .h2-2{/* トップ画像 文言2 */
		margin-top: 7em;
	}

	.about-box .top-box ul li{
	font-size:1.25rem;
	line-height: 1.6;
	}
	.about-box .top-box .text{
	font-size:1.25rem;
	margin-bottom: 1.25rem;
	}
	.about-box .top-box .list-box dt{
	margin-right: .25rem;
	}

	.about-box .top-box .list-box dt,
	.about-box .top-box .list-box dd{
	font-size:1.1rem;
	}
	.about-box .top-box .list-box .item-box h4{
	padding:1.25rem 0;
	}
	.about-box .top-box .list-box h4{
	margin-bottom: 2.25rem;
	}
	.about-box .top-box .list-box .item-box h4{
	margin-bottom: 1.25rem;
	}

	.about-box .top-box .list-box .item-txt{
	font-size:1.75rem;
	line-height:1.4;
	color: #b71010;
	}

	.about-box .top-box .list-box{
	margin: 2.25rem auto 0;
	}
	.three-box .box ul li:not(:last-child){
	margin-bottom:1.25rem;
	}
	.three-box .box ul li{
	width:100%;
	height:4rem;
	line-height:4.8rem;
	}
	.three-box .box{
	margin-bottom: 1.75rem;
	}

	.three-box .minbox .mintxt{
	font-size:1.25rem;
	}
	.three-box .box ul li .txt{
	font-size:1.75rem;
	}
	.three-box .minbox h3{
	font-size:1.75rem;
	margin-bottom:.75rem;
	padding-bottom:.75rem;
	padding-left:1.75rem;
	}
	.three-box .minbox h3:before{
	width:2rem;
	height:2rem;
	}
	.three-box .minbox p{
	font-size:1.25rem;
	line-height: 1.8;
	}

	.voice-box .minbox h3{
	padding:.75rem .75rem .5rem;
	font-size:1.75rem;
	margin-bottom:2rem;
	}
	.voice-box .minbox{
	padding:1rem;
	}

	.voice-box .minbox dt{
	width: 100%;
	align-items: center;
	-ms-flex-pack: justify;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	display: -ms-flexbox;
	display: flex;
	justify-content: space-between;
	margin-bottom: 1.25rem;

	}
	.voice-box .minbox h4{
	font-size:1.65rem;
	padding-bottom:.75rem;
	margin-bottom:.75rem;
	}

	.voice-box .minbox dt .itembox{
	width: 62%;
	}
	.voice-box .minbox .cap{
	width: 35%;
	margin-bottom: 0;
	}
	.voice-box .minbox dd{
	width: 100%;
	}
	.voice-box .minbox .data ul li,
	.voice-box .minbox dt .txt,
	.voice-box .minbox dt .mintxt{
	font-size:1.25rem;
	}
	.voice-box .minbox .data ul li:not(:last-child){
	margin-bottom: .75rem;
	}
	.voice-box .minbox .data .mintitle{
	font-size:1.25rem;
	}
	.voice-box .minbox .data{
	padding:1rem;
	margin-bottom:.75rem;
	}

	.voice-box .minbox .text{
	font-size:1.25rem;
	line-height: 1.6;
	}
	.step-box .text-box p,
	.voice-box .text-box p{
	font-size: 1.25rem;
	}
	.step-box .text-box p:not(:last-of-type),
	.voice-box .text-box p:not(:last-of-type){
	margin-bottom:1.25rem;
	}
	.step-box .text-box p{
	text-align: left;
	}
	.step-box .text-box p br{
	display: none;
	}
	.voice-box{
	padding:1rem;
	}
	.step-box .flow-box li:not(:last-child){
	margin-bottom:3.25rem;
	}
	.step-box .flow-box li:not(:last-child):after{
	border-width:1.25rem 1.25rem 0 1.25rem;
	bottom: -2.25rem;
	}
	.step-box .flow-box li{
	padding:1rem;
	}
	.step-box .flow-box h3{
	padding:.75rem 0;
	font-size:1.75rem;
	margin-bottom:.75rem;
	}
	.step-box .flow-box{
	max-width: none;
	margin: 0 auto 1.25rem;
	}
}


/*--------------------------------------------------------------------------
  color
  --------------------------------------------------------------------------*/
.red{ color:red; }
.green{ color:green; }