@charset "utf-8";
/* CSS Document */

/*--------------------  ??????  --------------------*/

@import "setup.css";
@import "common.css";
@import "base.css";
@import "boxtitle.css";
@import "contents.css";
@import "front-work.css";
@import "meanmenu.css";

/** page-voice ���Ă��I�[�i�[�l�́A�ǂ�Ȑl�H
---------------------------------------------------------------------------------*/
section#voice-01 .intoro {
	font-size: 15px;
}
@media screen and (max-width: 639px) {
	section#voice-01 { padding-top:40px; padding-bottom:10px; }
	section#voice-01 .voice-block {
		margin-bottom: 40px;
	}
	section#voice-01 div.num-circle .num {
		font-size: 25px;
	}
	section#voice-01 div.num-circle img {
		margin-top: 5px;
	}
	section#voice-01 .voice-block .box p {
		margin-bottom: 20px;
	}
}
@media screen and (min-width: 640px) {
	section#voice-01 { padding-top:80px; padding-bottom:80px; }
	section#voice-01 .intoro {
		margin-bottom: 60px;
        margin: 0 auto 10px;
	}
	section#voice-01 h3 {
		margin-bottom: 100px;
	}
	section#voice-01 .voice-block {
		position: relative;
		margin-bottom: 60px;
	}
	section#voice-01 .voice-block:last-of-type {
		margin-bottom: 0;
	}
	section#voice-01 .voice-block::after {
		content: "";
		display: block;
		position: absolute;
		height: 270px;
		width: 47%;
		background-color: #86a4be;
		left: 0;
		top: 0;
		z-index: -1;
	}
	section#voice-01 .voice-block .flex {
		align-items: flex-start;
	}
	section#voice-01 div.num-circle .num {
		font-size: 30px;
	}
	section#voice-01 .voice-block .flex .num-circle {
		width: 44%;
		position: relative;
		padding: 10px 0;
		z-index: 2;
	}
	section#voice-01 .voice-block .flex .num-circle h4 {
		color: #fff;
	}
	section#voice-01 .voice-block .flex .num-circle img {
		position: absolute;
		top: 120px;
		max-width:110%;
	}
	section#voice-01 .voice-block .flex .box {
		width: 56%;
		padding: 50px 30px 50px 80px;
		background-color: #fff;
		border: 1px solid #b2c8da;
		box-shadow: 10px 10px 0px rgba(178, 200, 218, 1);
		z-index: 1;
	}
	section#voice-01 .voice-block .flex .box p {
		margin-bottom: 50px;
	}
	/*box ���*/
	section#voice-01 .voice-block:nth-of-type(2n)::after {
		left: auto;
		right: 0;
	}
	section#voice-01 .voice-block:nth-of-type(2n) .flex {
		flex-direction: row-reverse;
	}
	section#voice-01 .voice-block:nth-of-type(2n) .flex .num-circle {
		flex-direction: row-reverse;
	}
	section#voice-01 .voice-block:nth-of-type(2n) .flex .num-circle .num {
		margin-left: 20px;
		margin-right: 0;
	}
	section#voice-01 .voice-block:nth-of-type(2n) .flex .num-circle h4 {
		text-align: right;
	}
	section#voice-01 .voice-block:nth-of-type(2n) .flex .num-circle img {
		right: 0;
	}
	section#voice-01 .voice-block:nth-of-type(2n) .flex .box {
		padding: 50px 80px 50px 30px;
	}
}