@charset "UTF-8";

/*-------お客様のご要望-------*/
.info_wrap{
	display: flex;
}
.info_box{
	margin-top: 40px;
}
.info_box h2 {
	color: #00a1e9;
	margin-top: 10px;
	margin-left: 83px;
	text-align: left;
}
.info_box p {
	margin-top: 10px;
}
.info_wrap .left_box{
	margin-top: 10px;
	margin-left: 83px;
	text-align: left;
	width: 100%;
}
.left_box p{
	text-align: justify;
	padding-right: 15px;
	margin-top: 0;
}
.info_wrap .right_box{
	margin-right: 80px;
	margin-top: 15px;
	margin-bottom: 20px;
}
#list_blue {
	color: #00a1e9;
}
.border_box{
	border: solid 1.5px #88C763;
	background: #FCFCF5;
	margin-top: 15px;
	padding: 5px 10px;
	width: 485px;
}
.border_box p{
	letter-spacing: -0.02em;
	line-height: 1.5;
	padding-right: 0;
	text-align: justify;
	font-weight: bold;
}
.deadline_box h2{
	color: #00a1e9;
	text-align: left;
	margin-left: 83px;
}

/*----- フローチャート・縦書き ------*/
.flowchart_box{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-lr;
	margin: 0 auto;
}
.flowchart_box h4{
	margin-top: 20px;
	font-size: 2.0rem;
/*--	line-height: 2.0em;        消す-*/
	background-color: #fff;
	margin: 10px 10px 10px 10px;
	border: 1.5px solid #00a1e9;
	border-radius: 5px;
	padding: 20px 5px 20px 5px;
}
.flowchart_box p{
	margin-top: 7px;
	text-align: left;
	height: 80px;
	margin-left: 5px;
	font-weight:bold;
}
.flex{
	display: flex;
}
.flex .arrow{
	margin-top: 15px;
}
/*----- フローチャート・矢印 ------*/
.arrow-clippath {
	position: relative;
	display: inline-block;
	width: 38px;
	height: 48px;
	background-color: #a1e8ff;
	clip-path: polygon(0 33%, 50% 33%, 50% 15%, 100% 50%, 50% 85%, 50% 67%, 0 67%);
}

/*-----メディアクエリ-----*/


/*-----タブレット版-----*/
/* 画面サイズが768px〜1024pxまではここを読み込む */
@media screen and (min-width: 768px) and (max-width: 1024px){
.info_wrap {
	margin:0 auto;
}
.info_box h2 {
	padding-left: 15px;
	text-align: left;
	margin-left: 0;
	font-size: 2.0rem;
}
.left_box p {
	text-align: justify;
	padding-right: 0;
}
.border_box {
	margin-right: 15px;
	padding: 5px 10px;
	width: 100%;
}
.info_wrap .left_box {
	margin-left: 0;
	padding-left: 15px;
}
.info_wrap .right_box {
	padding-left: 15px;
	padding-right: 15px;
	margin-right: 0;
}
}

/*-----モバイル版-----*/
/* 画面サイズが〜767pxまではここを読み込む */
@media screen and (max-width: 767px){

.info_box {
	margin-top: 20px;
}
.info_box h2 {
	color: #00a1e9;
	margin-top: 10px;
	font-size: 2.0rem;
	line-height: 1.6;
	text-align: left;
	margin-left: 0;
}
.left_box {
	text-align: left;
	width: 100%;
	padding-left: 0;
	margin-left: 0;
}
.left_box p {
	text-align: justify;
	padding-right: 0;
	display: block;
}
.border_box {
	width: 100%;
	margin-bottom: 20px;
}
.right_box {
	margin-top: 15px;
	margin-bottom: 20px;
	margin: 0 auto;
}
.info_wrap {
	flex-direction: column;
}
.info_wrap .left_box {
	margin-left: 0;
}
.info_wrap .right_box {
	margin: 0 auto;
}
.deadline_box h2 {
	text-align: center;
}
a.btn--radius {
	border-radius: 100vh;
	width: 60%;
	text-align: center;
	margin-top: 15px;
	margin-bottom: 20px;
}
.flowchart_box {
	margin: 0 auto;
	writing-mode: horizontal-tb;
}
.flowchart_box h4 {
	font-size: 1.8rem;
	background-color: #fff;
	margin: 0 10px 5px 10px;
	border-radius: 5px;
	padding: 5px 5px 5px 5px;
}
.arrow-clippath {
	transform:rotate(90deg);    /* 中心を基準点に時計回りに回転する */
	width: 30px;    /* 90%縮小 */
	height: 35px;
}
.flowchart_box p {
	margin-top: 0;
	text-align: left;
	height: 0;
	margin-left: 5px;
	font-weight: bold;
}
.flex {
	display: block;
	margin-top: 10px;
}
.flex p{
	margin-left: 40px;
}
}