@charset "UTF-8";
/* sp(320px) */

/* 現在ご相談いただいている業務内容 */
#soudan {
	background-color: #f8f8f8;
	padding-block: 40px 40px;
}
#soudan ul {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 1em;

	padding-inline-start: 30px;
}
#soudan ul li {
	background-color: #fff;
	border: 1px solid #e5e5e5;
	border-radius: .8em;
	position: relative;
	padding: 1.6em 2em 1.6em 34px;
}
#soudan ul li .icn {
	inline-size: 50px;
	position: absolute;
	inset: 22px auto auto -25px;
}
#soudan ul li p {
	margin-block-end: 0;
}

/* PX AGENTの強み */
#tsuyomi {
	padding-block: 40px 40px;
}
#tsuyomi ul {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 3.0em;

	inline-size: 85%;
	margin-inline: auto;
}
#tsuyomi ul li .ttl {
	font-size: 17px;
	font-weight: bold;
	line-height: 1.4;
	color: #000;
	text-align: center;
	margin-block: 1.4em 1.0em;
}

/* 既にご利用いただいたお客様の声 */
#voices {
	background-color: #f8f8f8;
}
#voices .box {
	background-color: #fff;
	border: 2px solid #e5e5e5;
	border-radius: .8em;
	position: relative;
	padding: 1.5em 1.5em 1.5em 36px;

	margin-inline-start: 25px;
}
#voices .box:not(:last-of-type) {
	margin-block-end: 2em;
}
#voices .box.rev {
	padding: 1.5em  36px 1.5em 1.5em;

	margin-inline-start: 0;
	margin-inline-end: 25px;
}
#voices .box .icn {
	inline-size: 50px;
	position: absolute;
	inset: 18px auto auto -25px;
}
#voices .box.rev .icn {
	inset: 18px -25px auto auto;
}
#voices .box p {
	margin-block-end: 0;
}

/* よくいただくご質問 */
#faq {
	padding-block: 40px 0;	
}
#faq dt {
	font-size: 15px;
	font-weight: bold;
	line-height: 1.4;
	color: #000;
	padding-block: 0em 1.2em;
}
#faq dd:not(:last-of-type) {
	padding-block: 0em 2.2em;
	margin-block-end: 2.2em;
	border-block-end: 1px dotted #838383;
}
#faq dt,
#faq dd {
	position: relative;
	padding-inline-start: 31px;
}
#faq dt::before,
#faq dd::before {
	font-family: "Manrope", sans-serif;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	border-radius: 50%;
	inline-size: 1.3em;
	block-size: 1.3em;
	line-height: 1.3em;
	position: absolute;
}
#faq dt::before {
	content: 'Q';
	color: #fff;
	background: #000;
	inset: .1em auto auto 0;
}
#faq dd::before {
	content: 'A';
	color: #fff;
	background: #5caaff;
	inset: .1em auto auto 0;
}

/* お問い合わせフォーム */
#contact {
	padding-block: 60px 20px;
}










@media handheld, print, screen and (min-width: 375px) {
/* iphone6 */


/* end of media query(iphone6) */	
}



@media handheld, print, screen and (min-width: 414px) {
/*  iPhone6 Plus */

/* end of media query(iPhone6 Plus) */	
}



@media handheld, print, screen and (min-width: 480px) {
/* tablet */

/* 現在ご相談いただいている業務内容 */
#soudan {
	padding-block: 50px 50px;
}
#soudan ul li {
	padding: 1.6em 2em 1.6em 44px;
}
#soudan ul li .icn {
	inline-size: 60px;
	inset: 20px auto auto -30px;
}

/* PX AGENTの強み */
#tsuyomi {
	padding-block: 0px 0px;
}
#tsuyomi ul {
	inline-size: 80%;
}

/* 既にご利用いただいたお客様の声 */
#voices .box {
	border: 2px solid #e5e5e5;
	padding: 1.5em 2em 1.5em 45px;

	margin-inline-start: 30px;
}
#voices .box:not(:last-of-type) {
	margin-block-end: 2em;
}
#voices .box.rev {
	padding: 2.0em  45px 2.0em 2em;

	margin-inline-start: 0;
	margin-inline-end: 30px;
}
#voices .box .icn {
	inline-size: 58px;
	inset: 16px auto auto -29px;
}
#voices .box.rev .icn {
	inset: 16px -29px auto auto;
}

/* よくいただくご質問 */
#faq {
	padding-block: 50px 0;	
}
#faq dt {
	font-size: 16px;
	padding-block: 0em 1.4em;
}
#faq dd {

}
#faq dd:not(:last-of-type) {
	padding-block: 0em 2.6em;
	margin-block-end: 2.6em;
}
#faq dt,
#faq dd {
	padding-inline-start: 38px;
}
#faq dt::before,
#faq dd::before {
	font-size: 20px;
}
#faq dt::before {
	inset: -.1em auto auto 0;
}
#faq dd::before {
	inset: 0em auto auto 0;
}

/* お問い合わせフォーム */
#contact {
	padding-block: 40px 40px;
}

	@media (-webkit-min-device-pixel-ratio: 2){
		

	/* end of media query(retina) */	
	}

/* end of media query(tablet) */	
}



@media handheld, print, screen and (min-width: 620px) {
/* iPad */

/* 現在ご相談いただいている業務内容 */
#soudan {
	padding-block: 60px 100px;
}
#soudan ul {
	grid-template-columns: 1fr 1fr 1fr;
	column-gap: 3%;
	row-gap: 0;

	padding-inline-start: 0;
}
#soudan ul li {
	border: 2px solid #e5e5e5;
	padding: 1.6em 2em 44px 2em;
}
#soudan ul li .icn {
	inline-size: 65px;
	inset: auto 25px -32px auto;
}

/* PX AGENTの強み */
#tsuyomi {
	padding-block: 10px 0px;
}
#tsuyomi ul {
	grid-template-columns: 1fr 1fr 1fr;
	column-gap: 3%;
	row-gap: 0;

	inline-size: auto;
}
#tsuyomi ul li .ttl {
	font-size: 18px;
	margin-block: 1.4em 1.0em;
}

/* 既にご利用いただいたお客様の声 */
#voices .box {
	border: 2px solid #e5e5e5;
	padding: 2.5em 3em 2.5em 60px;

	margin-inline-start: 0;
}
#voices .box:not(:last-of-type) {
	margin-block-end: 2em;
}
#voices .box.rev {
	padding: 2.5em  60px 2.5em 3em;

	margin-inline-start: 0;
	margin-inline-end: 0;
}
#voices .box .icn {
	inline-size: 80px;
	inset: 16px auto auto -40px;
}
#voices .box.rev .icn {
	inset: 16px -40px auto auto;
}

/* 既にご利用いただいたお客様の声 */
#voices .box {
	border: 2px solid #e5e5e5;
	padding: 2.0em 2em 2.0em 50px;

	margin-inline-start: 30px;
}
#voices .box:not(:last-of-type) {
	margin-block-end: 2em;
}
#voices .box.rev {
	padding: 2.0em  50px 2.0em 2em;

	margin-inline-start: 0;
	margin-inline-end: 30px;
}
#voices .box .icn {
	inline-size: 64px;
	inset: 16px auto auto -32px;
}
#voices .box.rev .icn {
	inset: 16px -32px auto auto;
}

/* よくいただくご質問 */
#faq {
	padding-block: 60px 0px;	
}
#faq dt {
	font-size: 17px;
	padding-block: 0em 1.4em;
}
#faq dd:not(:last-of-type) {
	padding-block: 0em 2.6em;
	margin-block-end: 2.6em;
}
#faq dt,
#faq dd {
	padding-inline-start: 42px;
}
#faq dt::before,
#faq dd::before {
	font-size: 22px;
}
#faq dt::before {
	inset: -.1em auto auto 0;
}
#faq dd::before {
	inset: 0em auto auto 0;
}

/* お問い合わせフォーム */
#contact {
	padding-block: 80px 40px;
}



/* end of media query(iPad) */	
}



@media handheld, print, screen and (min-width: 900px) {
/* pc */

/* 現在ご相談いただいている業務内容 */
#soudan {
	padding-block: 80px 120px;
}
#soudan ul {
	column-gap: 4%;
	row-gap: 0;
}
#soudan ul li {
	padding: 1.6em 2em 44px 2em;
}
#soudan ul li .icn {
	inline-size: 81px;
	inset: auto 30px -40px auto;
}

/* PX AGENTの強み */
#tsuyomi {
	padding-block: 30px 0px;
}
#tsuyomi ul {
	grid-template-columns: 1fr 1fr 1fr;
	column-gap: 4%;
	row-gap: 0;

	inline-size: auto;
}
#tsuyomi ul li .ttl {
	font-size: 20px;
	margin-block: 1.4em 1.0em;
}

/* よくいただくご質問 */
#faq {
	padding-block: 80px 0px;	
}
#faq dt {
	font-size: 18px;
	padding-block: 0em 1.4em;
}
#faq dd:not(:last-of-type) {
	padding-block: 0em 2.6em;
	margin-block-end: 2.6em;
}
#faq dt,
#faq dd {
	padding-inline-start: 50px;
}
#faq dt::before,
#faq dd::before {
	font-size: 26px;
}
#faq dt::before {
	inset: -.1em auto auto 0;
}
#faq dd::before {
	inset: -.1em auto auto 0;
}

/* お問い合わせフォーム */
#contact {
	padding-block: 100px 40px;
}






/* end of media query(pc) */
}

@media handheld, print, screen and (min-width: 1120px) {

/* 既にご利用いただいたお客様の声 */
#voices .box {
	border: 2px solid #e5e5e5;
	padding: 2.5em 3em 2.5em 60px;

	margin-inline-start: 0;
}
#voices .box:not(:last-of-type) {
	margin-block-end: 2em;
}
#voices .box.rev {
	padding: 2.5em  60px 2.5em 3em;

	margin-inline-start: 0;
	margin-inline-end: 0;
}
#voices .box .icn {
	inline-size: 80px;
	inset: 16px auto auto -40px;
}
#voices .box.rev .icn {
	inset: 16px -40px auto auto;
}

/* end of media query(pc) */
}