@charset "utf-8";


/**************************************************50
 * choose
 **************************************************/
#choose{
	text-align: center;
}
#choose .box{
}
#choose .box h2{
}
#choose .box ul{
	background-color: #DEF2E1;
	text-align: left;
}
#choose .box ul > li{
	line-height: 1.5;
	padding: 0.25em 0 0.25em 2em;
	position: relative;
}
#choose .box ul > li:before{
	background: url("https://tobita.biz/images/user/works/check.svg") left center no-repeat;
	background-size: contain;
	content: "";
	display: block;
	height: 1.5em;
	position: absolute;
	top: 1em;
	left: 0;
	-ms-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	text-indent: 0;
	width: 2em;
}
#choose .box ul > li + li{
	marign-top: 0.5em;
}
#choose .box > strong{
	background-color: #FD695F;
	border-radius: 1000px;
	color: #FFFFFF;
	display: inline-block;
	vertical-align: baseline;
}
#choose .box > strong span{
	color: #FFF376;
}
#choose .box > b{
	display: block;
}
#choose_carefully{
	background-color: #FFF9BA;
}
#choose_carefully{
	margin-top: 0.5em;
}
#choose_carefully strong{
}
#choose_carefully b{
}
#choose_point{
	background-color: #60CCDA;
	color: #FFFFFF;
	line-height: 1.5;
	padding-top: 0.25em;
	padding-bottom: 0.25em;
}
#choose_point strong{
	color: #FFF376;
}
@media screen and (min-width:320px){
	#choose .box > b span{
		display: inline-block;
		position: relative;
		vertical-align: baseline;
	}
	#choose .box > b span:before,
	#choose .box > b span:after{
		border-color: #FD6A5F transparent transparent transparent;
		border-style: solid;
		content: "";
		display: block;
		height: 0;
		position: absolute;
		top: 50%;
		width: 0;
	}
	#choose .box > b span:before{
		left: -0.5em;
		-ms-transform: translate(-100%, -50%);
		-webkit-transform: translate(-100%, -50%);
		transform: translate(-100%, -50%);
	}
	#choose .box > b span:after{
		right: -0.5em;
		-ms-transform: translate(100%, -50%);
		-webkit-transform: translate(100%, -50%);
		transform: translate(100%, -50%);
	}
}
@media screen and (min-width:320px) and (max-width:767px){
	#choose .box > b span:before,
	#choose .box > b span:after{
		border-width: 21px 12px 0 12px;
	}
}
@media screen and (max-width:767px){
	#choose{
		margin-bottom: 3.125%;
	}
	#choose .box{
		padding-top: -webkit-calc(0.8333333333333333% + 0.5em);
		padding-top: calc(0.8333333333333333% + 0.5em);
	}
	#choose .box h2{
	}
	#choose .box ul{
		margin: 0.5em 1em;
		padding: 0.5em 1em;
	}
	#choose .box ul > li{
		font-size: 125%;
	}
	#choose .box > strong{
		font-size: 137.5%;
		line-height: 1.25;
		margin: 0.375em 0;
		padding-top: 0.375em;
		padding-bottom: 0.375em;
		width: 12em;
	}
	#choose .box > b{
	}
	#choose_carefully{
		padding: 0.5em 3.333333333333333%;
		text-align: left;
	}
	#choose_point{
		border-radius: 0 0 10px 10px;
		padding: 0.25em 3.333333333333333%;
		text-align: left;
	}
}
@media screen and (min-width:768px){
	#choose{
		margin-bottom: 50px;
	}
	#choose .box{
		padding-top: 50px;
	}
	#choose .box h2{
	}
	#choose .box ul{
		display: inline-block;
		margin: 1.5em auto;
		padding: 1.5em 3em;
	}
	#choose .box ul > li{
		font-size: 150%;
	}
	#choose .box > strong{
		font-size: 175%;
		margin: 0.5em 0;
		width: 20em;
	}
	#choose .box > b{
	}
	#choose .box > b span:before,
	#choose .box > b span:after{
		border-width: 28px 16px 0 16px;
	}
	#choose_carefully{
		padding: 1.5em;
	}
	#choose_point{
		border-radius: 0 0 20px 20px;
	}
}