@charset "utf-8";

/*
 * CSS Document
 * Name : nrpa-kentei | flow.php / flow-style.css
 * Production Date : 2023.03.11
 * container width = 
 			1920 / 1600 / 1440 / 1366 / 1280 / 1080=1024 / 960 / 800-768 / 600 / 500-480 / 425-320
*/


/* =============================================================================
	flow top-image
============================================================================= */
#flowSec-01 .topImg-base .topImg-ipg {
	width: 100%;
	height: 0;
	padding-top: 26.5625%;
	background: url(../img/pTop-img/flowTop_img-L.jpg) center top no-repeat;
	background-size: cover;
}
#flowSec-01 .topImg-text .topImg-svg {
	width: 100%;
	height: 0;
	padding-top: 26.5625%;
	background: url(../img/pTop-img/flowTop_img-L.svg) center top no-repeat;
	background-size: cover;
}

@media screen and (max-width:1080px) {
	#flowSec-01 .topImg-base .topImg-ipg {
		width: 100%;
		height: 0;
		padding-top: 31.25%;
		background: url(../img/pTop-img/flowTop_img-M.jpg) center top no-repeat;
		background-size: cover;
	}
	#flowSec-01 .topImg-text .topImg-svg {
		width: 100%;
		height: 0;
		padding-top: 31.25%;
		background: url(../img/pTop-img/flowTop_img-M.svg) center top no-repeat;
		background-size: cover;
	}
}

@media screen and (max-width:960px) {
	#flowSec-01 .topImg-base .topImg-ipg {
		width: 100%;
		height: 0;
		padding-top: 46.875%;
		background: url(../img/pTop-img/flowTop_img-S.jpg) center top no-repeat;
		background-size: cover;
	}
	#flowSec-01 .topImg-text .topImg-svg {
		width: 100%;
		height: 0;
		padding-top: 46.875%;
		background: url(../img/pTop-img/flowTop_img-S.svg) center top no-repeat;
		background-size: cover;
	}
}

@media screen and (max-width:600px) {
	#flowSec-01 .topImg-base .topImg-ipg {
		width: 100%;
		height: 0;
		padding-top: 75%;
		background: url(../img/pTop-img/flowTop_img-SS1.jpg) center top no-repeat;
		background-size: cover;
	}
	#flowSec-01 .topImg-text .topImg-svg {
		width: 100%;
		height: 0;
		padding-top: 75%;
		background: url(../img/pTop-img/flowTop_img-SS1.svg) center top no-repeat;
		background-size: cover;
	}
}

@media screen and (max-width:480px) {
	#flowSec-01 .topImg-base .topImg-ipg {
		width: 100%;
		height: 0;
		padding-top: 90%;
		background: url(../img/pTop-img/flowTop_img-SS2.jpg) center top no-repeat;
		background-size: cover;
	}
	#flowSec-01 .topImg-text .topImg-svg {
		width: 100%;
		height: 0;
		padding-top: 90%;
		background: url(../img/pTop-img/flowTop_img-SS2.svg) center top no-repeat;
		background-size: cover;
	}
}


/* ==========================================================================
   flow body-Layout
========================================================================== */
/* #flowSec-04 btn ======================================================= */
.btn-area {
	width: 70%;
	display: flex;
	justify-content: center;
}
.btn-area a {
	display: block;
	width: 30%;
}
.btn-area a {margin-right: 3%;}
.btn-area a:last-child {margin-right: 0;}

@media screen and (max-width:1440px) {
	.btn-area {
		margin-left: auto;
		margin-right: auto;
		width: 80%;
	}
}

@media screen and (max-width:1366px) {
	.btn-area {width: 90%;}
	.bodyLR-space {
		margin-left: 4.5%;
		margin-right: 4.5%;
	}
	.body-flex-left.flw04 {
		margin-left: 0;
		margin-right: 0;
	}
}

@media screen and (max-width:1080px) {
	.btn-area {width: 100%;}
}

@media screen and (max-width:800px) {
	.btn-area {
		margin-top: 1.25rem;
		flex-wrap: wrap;
	}
	.btn-area a {
		width: 15em;
		margin-right: 0;
		margin-bottom: 1em;
	}
	.btn-area a:first-child {
		margin-right: 2rem;
	}
}

@media screen and (max-width:600px) {
	.btn-area {
		margin-right: 8%;
		width: 92%;
		display: block;
	}
	.btn-area a {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
	}
	.btn-area a:first-child,
	.btn-area a:last-child {margin-right: auto;}
}

@media screen and (max-width:500px) {
	.btn-area {
		margin-right: 12.6%;
		width: 87.4%;
	}
	.btn-area a {width: 95%;}
}
@media screen and (max-width:425px) {
	.btn-area a {width: 100%;}
}


/* #flowSec-05 Title ===================================================== */
#flowSec-05 .pSec-title-wa {line-height: 1.3;}
#flowSec-05 .pSec-title-eng {line-height: 1.4;}

#flowSec-05 .secTop-txt {
	margin-left: auto;
	margin-right: auto;
	text-align: center; 
}
#flowSec-05 .secTop-txt .pWhat-txt-L {border-top: none;}

@media screen and (max-width:800px) {
	#flowSec-05 .secTop-txt {
		width: 91%;
		text-align: justify;
	}
	#flowSec-05 .secTop-txt .pWhat-txt-L {display: none;}
	#flowSec-05 .secTop-txt .pWhat-txt-S {
		display: block;
		font-size: .9375rem;
		margin-top: 0;
		border-top: none;
	}
}



/* #flowSec-05 pbody-title ============================================= */
#flowSec-05 .pbody-title {
	margin-top: 0;
	display: flex;
	justify-content: flex-start;
	align-items:flex-start;
	align-content: center;
}
#flowSec-05 .title-txt {
	display: block;
	margin-top: 6px;
	width: 100%;
	margin-bottom: .5rem;
}
.flwNum {
	display: block;
	width: 28px;
	height: 28px;
	padding-left: .25rem;
	margin-top: .15rem;
}

@media screen and (max-width:500px) {
	#flowSec-05 .pbody-title {
		padding-left: 0;
		text-indent: 0;
	}
}

/* #flowSec-05 flow number 設定 ---------------- */
.flwNum.flowNum-1 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-1.svg) center center no-repeat;
	background-size: cover;
}
.flwNum.flowNum-2 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-2.svg) center center no-repeat;
	background-size: cover;
}
.flwNum.flowNum-3 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-3.svg) center center no-repeat;
	background-size: cover;
}
.flwNum.flowNum-4 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-4.svg) center center no-repeat;
	background-size: cover;
}
.flwNum.flowNum-5 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-5.svg) center center no-repeat;
	background-size: cover;
}
.flwNum.flowNum-6 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-6.svg) center center no-repeat;
	background-size: cover;
}
.flwNum.flowNum-7 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-7.svg) center center no-repeat;
	background-size: cover;
}
.flwNum.flowNum-8 {
	width: 28px;
	height: 0;
	padding-top: 28px;
	background: url(../img/flow/flowNumb-8.svg) center center no-repeat;
	background-size: cover;
}




/* ==========================================================================
   flow body-image
========================================================================== */
/* #flowSec-04 =========================================================== */
/* flowImg-01 ---------------------------- */
.left-img-S.flowImg-S-01 {display: none;}
.left-img-L.flowImg-L-01 {
	display: flex;
	flex-direction: row;
}
.flowImg-L-01 .flowImg-01a {
	width: 45%;
	height: auto;
	margin-right: 1.5rem;
}
.flowImg-L-01 .flowImg-01b {
	width: 44.75%;
	height: auto;
} 
.flowImg-L-01 .text-name {
	font-size: 1rem;
	letter-spacing: -0.05em;
}
.flowImg-01a .text-name span {
	color: #009e41;
	margin-right: -.25em;
}
.flowImg-01b .text-name span {
	color: #ec6c00;
	margin-right: -.25em;
}

@media screen and (max-width:1600px) {
	.left-img-L.flowImg-L-01 {
		width: calc(37.316% - 1.5rem);
		height: auto;
	}
}

@media screen and (max-width:1366px) {
	.pbody-txt.book-info {width: 60%;}
	.left-img-L.flowImg-L-01 {width: calc(40% - 1.5rem);}
	.flowImg-L-01 .text-name {font-size: .9375rem;}
}

@media screen and (max-width:1080px) {
	.pbody-txt.book-info {width: 55%;}
	.left-img-L.flowImg-L-01 {width: calc(45% - 1.5rem);}
}

@media screen and (max-width:960px) {
	.pbody-txt.book-info {width: 50%;}
	.left-img-L.flowImg-L-01 {width: calc(50% - 1.5rem);}
	.flowImg-L-01 .text-name {font-size: .9375rem;}
}

@media screen and (max-width:800px) {
	.left-img-L.flowImg-L-01 {display: none;}
	.pbody-txt.book-info {width: 92%;}
	.left-img-S.flowImg-S-01 {
		margin: .75rem auto;
		display: flex;
		justify-content: center;
		width: 70%;
	}
	.flowImg-S-01 .flowImg-01a {
		width: 45%;
		height: auto;
		margin-right: 1.5rem;
	}
	.flowImg-S-01 .flowImg-01b {
		width: 45%;
		height: auto;
	}
	.flowImg-S-01 .text-name {
		font-size: .9375rem;
	}
	
}

@media screen and (max-width:600px) {
	.left-img-S.flowImg-S-01 {width: 80%;}
}

@media screen and (max-width:500px) {
	.left-img-S.flowImg-S-01 {width: 100%;}
	.flowImg-S-01 .text-name {
		margin-left: -0.25em;
		text-align: center;
	}
	#flowSec-04 .attention-txt {width: 95%;}
}



@media screen and (max-width:400px) {
	.left-img-S.flowImg-S-01 {
		width: 60%;
		display: block;
	}
	.flowImg-S-01 .flowImg-01a {
		margin-right: 0;
		width: 100%;
		margin-bottom: .75rem;
	}
	.flowImg-S-01 .flowImg-01b {
		width: 100%;
	}
	.flowImg-S-01 .text-name {margin-left: -0.4em;}
}




/* flowImg-02/flowImg-03 ---------------------------- */
.flowImg-L-02 .flowImg-02 {
	width: 100%;
	height: 0;
	padding-top: 55%;
	background: url(../img/flow/flow-02.jpg) center center no-repeat;
	background-size: cover;
}
.flowImg-L-03 .flowImg-03 {
	width: 100%;
	height: 0;
	padding-top: 56%;
	background: url(../img/flow/flow-03.jpg) center center no-repeat;
	background-size: 115% auto;
}

@media screen and (max-width:1600px) {
	.flowImg-L-02 .flowImg-02 {padding-top: 60%;}
	.flowImg-L-03 .flowImg-03 {
		padding-top: 58%;
		background-size: 120% auto;
	}
}

@media screen and (max-width:1366px) {
	.flowImg-L-03 .flowImg-03 {
		padding-top: 53%;
		background-size: 110% auto;
	}
}

@media screen and (max-width:1080px) {
	.flowImg-L-03 .flowImg-03 {
		padding-top: 62%;
		background-size: 125% auto;
	}
}

@media screen and (max-width:960px) {
	.flowImg-L-02 .flowImg-02 {
		padding-top: 69%;
		background-size: 115% auto;
	}
	.flowImg-L-03 .flowImg-03 {
		padding-top: 67.5%;
		background-size: 140% auto;
	}
}

@media screen and (max-width:800px) {
	.right-img-S.flowImg-S-02 {width: 80%;}
	.flowImg-S-02 .flowImg-02 {
		width: 100%;
		height: 0;
		padding-top: 60%;
		background: url(../img/flow/flow-02.jpg) center center no-repeat;
		background-size: cover;
	}
	.flowImg-S-03 .flowImg-03 {
		width: 100%;
		height: 0;
		padding-top: 60%;
		background: url(../img/flow/flow-03.jpg) center center no-repeat;
		background-size: 120% auto;
	}
}

@media screen and (max-width:500px) {
	.right-img-S.flowImg-S-02 {width: 100%;}
}


/* #flowSec-05 =========================================================== */
/* #flowSec-05 flowNum-1/2 --------------------------- */
.flowImg-L-04 .flowImg-04 {
	width: 100%;
	height: 0;
	padding-top: 53%;
	background: url(../img/flow/flow-04.jpg) center center no-repeat;
	background-size: cover;
}
.flowImg-L-05 .flowImg-05 {
	width: 100%;
	height: 0;
	padding-top: 48%;
	background: url(../img/flow/flow-05.jpg) center center no-repeat;
	background-size: cover;
}
.flowImg-L-06 .flowImg-06 {
	width: 100%;
	height: 0;
	padding-top: 57.6%;
	background: url(../img/flow/flow-06.jpg) center bottom no-repeat;
	background-size: cover;
}

@media screen and (max-width:1600px) {
	.flowImg-L-04 .flowImg-04 {padding-top: 65%;}
	.flowImg-L-05 .flowImg-05 {
		padding-top: 65%;
		background-size: 115% auto;
	}
	.flowImg-L-06 .flowImg-06 {
		padding-top: 63%;
		background-size: 110% auto;
	}
}

@media screen and (max-width:1440px) {
	.flowImg-L-04, .flowImg-L-05, .flowImg-L-06,
	.flowImg-L-07, .flowImg-L-08, .flowImg-L-09 {margin-top: 3.5rem;}
	.flowImg-L-06 .flowImg-06 {
		padding-top: 57.6%;
		background-size: cover;
	}
}

@media screen and (max-width:1366px) {
	.flowImg-L-04 .flowImg-04 {padding-top: 55%;}
	.flowImg-L-05 .flowImg-05 {
		padding-top: 57.6%;
		background-size: cover;
	}
}

@media screen and (max-width:1080px) {
	.flowImg-L-04 .flowImg-04 {
		padding-top: 65%;
		background-size: 110% auto;
	}
}

@media screen and (max-width:960px) {
	.flowImg-L-05 .flowImg-05 {
		padding-top: 65%;
		background-size: 113% auto;
	}
	.flowImg-L-06 .flowImg-06 {
		padding-top: 63%;
		background-size: 110% auto;
	}
}

@media screen and (max-width:800px) {
/*
	.left-img-S.flowImg-S-03,
	.left-img-S.flowImg-S-04,
	.right-img-S.flowImg-S-05 {width: 70%;}
*/
	.flowImg-S-04 .flowImg-04 {
		width: 100%;
		height: 0;
		padding-top: 57.6%;
		background: url(../img/flow/flow-04.jpg) center center no-repeat;
		background-size: cover;
	}
	.flowImg-S-05 .flowImg-05 {
		width: 100%;
		height: 0;
		padding-top: 57.6%;
		background: url(../img/flow/flow-05.jpg) center center no-repeat;
		background-size: cover;
	}
	.flowImg-S-06 .flowImg-06 {
		width: 100%;
		height: 0;
		padding-top: 57.6%;
		background: url(../img/flow/flow-06.jpg) center center no-repeat;
		background-size: cover;
	}
}

@media screen and (max-width:500px) {
	.left-img-S.flowImg-S-03,
	.left-img-S.flowImg-S-04,
	.right-img-S.flowImg-S-05 {width: 100%;}
	.right-img-S.flowImg-S-05 {margin-top: 2rem;}
}



/* #flowSec-05 flowNum-3 --------------------------- */
.tstPrice-ttl {font-size: 1.125rem;}
.tstPrice-txt {
	padding-left: 1.125rem;
	font-size: 1rem;
}
.tstPrice-txt span {
	font-size: 1.0625rem;
	font-weight: bold;
	color: #717171;
}
.belong-txt {
	font-size: 1.125rem;
	color: #717171;
}
.belong-txt span {
	font-size: .9375rem;
	font-weight: normal;
	color: #212121;
}

@media screen and (max-width:800px) {
	.tstPrice-ttl {font-size: 1.0625rem;}
	.tstPrice-txt {font-size: .9375rem;}
	.tstPrice-txt span {font-size: 1rem;}
	.belong-txt {font-size: 1.0625rem;}
	.belong-txt span {font-size: .875rem;}
}


/* #flowSec-05 flowNum-3 left-img-L ---------------- */

/* 試験申込み募集時に表示 */
/*.body-flex-left.number-3 {
	align-items: center;
	margin-top: -5px;
}*/
.transfer-box, .destination-box {
	width: 100%;
	padding: 10px 16px;
	background-color: #faf5e6;
	border: 2px solid #aaa;
	margin-bottom: 1.25rem;
}
.box-title {font-size: 1rem;}
.box-txt {
	font-size: .9375rem;
	padding-left: .75rem;
}

@media screen and (max-width:800px) {
/* 試験申込み募集時に表示 */
/*.left-img-S.flowImg-S-06 {
		margin-top: 0;
		margin-left: 1.5rem;
		width: 90%;
	}
*/
	.transfer-box,.destination-box {
		display: flex;
		align-items: center;
		margin-bottom: .75rem;
		border: 1px solid #aaa;
	}
	.box-title {
		font-size: 1.0625rem;
		line-height: 1.3;
		margin-right: 1rem;
	}
	.box-title span {display: block;}
	.box-txt {font-size: .9375rem;}
}

@media screen and (max-width:600px) {
	.left-img-S.flowImg-S-06 {
		margin-top: 0;
		margin-left: 0;
		width: 95%;
	}
	.transfer-box,.destination-box {
		display: block;
	}
	.box-title span {display: inline;}
	.box-title::before {
		content: "◆";
		color: #7f7d7d;
	}
	.box-txt {margin-left: .25rem;}
}


/* #flowSec-05 flowNum-3 entry-btn ----------------- */
.entry-btn-sm {display: none;}
.entryDL-btn {
	display: block;
	font-size: 1.375rem;
	line-height: 2.2;
	text-align: center;
	color: #fff;
	background-color: #0071bc;
	border-radius: 1.5rem;
}
.entryDL-btn:hover {
	font-size: 1.4375rem;
	color: #fff;
	text-shadow: 2px 2px 3px #777;
	border-radius: 1.5625rem;
}

@media screen and (max-width:800px) {
	.entry-btn-sm {
		margin: 1rem auto;
		display: block;
	}
	.entryDL-btn {font-size: 1.25rem;}
	.entryDL-btn:hover {font-size: 1.375rem}
	.attention-txt.num3 {width: 95%;}
}



/* #flowSec-05 flowNum-4/5/6 ---------------------- */
.bodyText-flex {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.textItem-1, .textItem-2, .textItem-3 {
	width: 30%;
	height: auto;
}

.flowImg-L-07 .flowImg-07 {
	width: 100%;
	height: 0;
	padding-top: 45%;
	background: url(../img/flow/flow-07.jpg) center center no-repeat;
	background-size: cover;
}

@media screen and (max-width:1600px) {
	.flowImg-L-07 .flowImg-07 {padding-top: 55.583%;}
}

@media screen and (max-width:1440px) {
	.right-img-L.flowImg-L-07 {margin-top: 0;}
	.flowImg-L-07 .flowImg-07 {
		padding-top: 60%;
		background-size: 110% auto;
	}
}

@media screen and (max-width:1366px) {
	.bodyText-flex {display: block;}
	.textItem-1, .textItem-2, .textItem-3 {width: 100%;}
	.textItem-1, .textItem-2 {margin-bottom: 1.25rem;}
	.body-flex-right.number-456 {align-items: center;}
}

@media screen and (max-width:960px) {
	.flowImg-L-07 .flowImg-07 {
		width: 100%;
		height: 0;
		padding-top: 73%;
		background: url(../img/flow/flow-07b.jpg) center center no-repeat;
		background-size: 110% auto;
	}
}

@media screen and (max-width:800px) {
	.flowImg-S-07 .flowImg-07 {
		width: 100%;
		height: 0;
		padding-top: 62%;
		background: url(../img/flow/flow-07b.jpg) center center no-repeat;
		background-size: cover;
	}
}

@media screen and (max-width:500px) {
	.right-img-S.flowImg-S-07 {width: 100%;}
}


/* #flowSec-05 flowNum-7 ------------------------- */
.flowImg-ttl {
	line-height: 1;
	margin-bottom: .35rem;
}
.flowImg-08.flowImg-flex {
	display: flex;
	justify-content: space-between;
}
.flowImg08-left, .flowImg08-right {
	width: 48%;
	height: auto;
}
.card-name {
	margin-top: .25rem;
	font-size: .875rem;
	text-align: center;
}

@media screen and (max-width:1600px) {
	.pbody-txt.number-7 {width: 60%;}
	.left-img-L.flowImg-L-08 {width: calc(40% - 1.5rem);}
}

@media screen and (max-width:1440px) {
	.pbody-txt.number-7 {width: 55%;}
	.left-img-L.flowImg-L-08 {width: calc(45% - 1.5rem);}
}

@media screen and (max-width:1080px) {
	.pbody-txt.number-7 {width: 50%;}
	.left-img-L.flowImg-L-08 {width: calc(50% - 1.5rem);}
}

@media screen and (max-width:960px) {
	.card-name {font-size: .8125rem;}
	.pbody-txt.number-7 {width: 43%;}
	.left-img-L.flowImg-L-08 {width: calc(57% - 1.5rem);}
}

@media screen and (max-width:800px) {
	.pbody-txt.number-7 {width: 90%;}
	.left-img-L.flowImg-L-08 {display: none;}
	.left-img-S.flowImg-S-08 {
		display: block;
		width: 80%;
	}
}

@media screen and (max-width:700px) {
	.left-img-S.flowImg-S-08 {width: 90%;}
}

@media screen and (max-width:700px) {
	.left-img-S.flowImg-S-08 {width: 100%;}
}

@media screen and (max-width:500px) {
	.left-img-S.flowImg-S-08 .left-img-S,
	.left-img-S.flowImg-S-08 .right-img-S {
		width: 100%;
		min-width: inherit;
	}
}

@media screen and (max-width:480px) {
	.flowImg-08.flowImg-flex {
		display: flex;
		flex-direction: column;
		width: 60%;
		margin-left: auto;
		margin-right: auto;
	}
	.flowImg08-left, .flowImg08-right {width: 100%;}
	.flowImg08-left {margin-bottom: .5rem;}
}

@media screen and (max-width:425px) {
	.flowImg-08.flowImg-flex {
		width: 80%;
		min-width: 240px;
	}
}



/* #flowSec-05 flowNum-9 ------------------------- */
.body-flex-right .right-img-L.ratio-change {width: calc(35% - 1.5rem);}
.body-flex-right .pbody-txt.ratio-change {
	width: 70%;
	margin-left: 1.5rem;
}

.flowImg-L-09 .flowImg-ttl, .flowImg-L-09 .card-name,
.flowImg-L-09 img {
	margin-left: 45%;
	width: 55%;
	height: auto;
}

@media screen and (max-width:1600px) {
	.flowImg-L-09 .flowImg-ttl, .flowImg-L-09 .card-name,
	.flowImg-L-09 img {
		margin-left: 35%;
		width: 65%;
	}
}

@media screen and (max-width:1440px) {
	.flowImg-L-09 .flowImg-ttl, .flowImg-L-09 .card-name,
	.flowImg-L-09 img {
		margin-left: 25%;
		width: 75%;
	}
}

@media screen and (max-width:1366px) {
	.body-flex-right .right-img-L.ratio-change {width: calc(28% - 1.5rem);}
	.body-flex-right .pbody-txt.ratio-change {
		width: 72%;
		margin-left: 1.5rem;
	}
	.flowImg-L-09 .flowImg-ttl, .flowImg-L-09 .card-name,
	.flowImg-L-09 img {
		margin-left: 0;
		width: 100%;
	}
}

@media screen and (max-width:1080px) {
	.body-flex-right .right-img-L.ratio-change {width: calc(35% - 1.5rem);}
	.body-flex-right .pbody-txt.ratio-change {
		width: 65%;
		margin-left: 1.5rem;
	}
}

@media screen and (max-width:960px) {
	.body-flex-right .right-img-L.ratio-change {width: calc(38% - 1.5rem);}
	.body-flex-right .pbody-txt.ratio-change {
		width: 62%;
		margin-left: 1.5rem;
	}
}

@media screen and (max-width:800px) {
	.body-flex-right .pbody-txt.ratio-change {
		margin-left: 10%;
		width: 90%;
	}
	.right-img-S.flowImg-S-09 {width: 55%;}
}

@media screen and (max-width:600px) {
	.right-img-S.flowImg-S-09 {width: 60%;}
}

@media screen and (max-width:500px) {
	.right-img-S.flowImg-S-09 {width: 65%;}
}

@media screen and (max-width:425px) {
	.right-img-S.flowImg-S-09 {
		width: 75%;
		min-width: 240px;
	}
}