@charset "utf-8";

@media screen and (min-width:391px) {
	.page {
		font-size: 1.15em;
		margin: 0 auto;
		padding: 0 0 2em 0;
		width: 940px;
	}
	.page h2 {
		margin: 0;
		padding: 0;
		text-align: center;
	}
	.page div.intro {
		background-color: #FFFFD1;
		padding: 35px 30px 30px 30px;
		margin: 0;
		box-sizing: border-box;
	}
	.page div.intro p:nth-of-type(1) {
		font-size: 1.1em;
		line-height: 150%;
	}
	.page div.intro p:nth-of-type(1) strong {
		color: #FF0000;
	}
	.page div.intro div.example {
		border: solid 1px #002789;
		background-color: #FFF;
		padding: 20px;
		margin: 20px 0 0 0;
		background-image: url("/parts/contents/online_quote/img01.png");
		background-position: center right 20px;
		background-repeat: no-repeat;
	}
	.page div.intro div.example h3 {
		padding: 0;
		margin: 0;
		color: #002789;
		font-size: 1.1em;
	}
	.page div.intro div.example ul {
		text-align: left;
		padding: 0;
		margin: 10px 0 0 0;
	}
	.page div.intro div.example ul li {
		line-height: 150%;
	}
	.page div.intro div.example ul li:before {
		content: "●";
		font-size: 0.3em;
		vertical-align: middle;
		padding: 0 5px 0 0;
	}
	.page div.intro div.sample {
		background-color: #D7EAFF;
		padding: 30px 35px 35px 35px;
		margin: 30px 0 0 0;
		box-sizing: border-box;
	}
	.page div.intro div.sample h3 {
		color: #002789;
		text-align: center;
		font-size: 1.25em;
		padding: 0;
		margin: 0;
	}
	.page div.intro div.sample p {
		padding: 15px 0 0 0;
		text-align: center;
		margin: 0;
	}
	.page div.flow {
		width: 690px;
		margin: 0 auto;
	}
	.page div.flow h3 {
		text-align: center;
		font-size: 1.65em;
		color: #168568;
		border-top: solid 5px #168568;
		background-color: #D0E7E1;
		padding: 15px 0 10px 0;
		margin: 40px 0 0 0;
	}
	.page div.flow > div {
		margin: 40px 0 0 0;
	}
	.page div.flow > div p:nth-of-type(1) {
		text-align: left;
		font-size: 1.25em;
		line-height: 150%;
		background-position: top left;
		background-repeat: no-repeat;
		min-height: 49px;
		box-sizing: border-box;
		padding: 10px 0 0 65px;
		margin: 0 0 20px 0;
	}
	.page div.flow > div:nth-of-type(1) p:nth-of-type(1) {
		background-image: url("/parts/contents/online_quote/num01.jpg");
	}
	.page div.flow > div:nth-of-type(2) p:nth-of-type(1) {
		background-image: url("/parts/contents/online_quote/num02.jpg");
	}
	.page div.flow > div:nth-of-type(3) p:nth-of-type(1) {
		background-image: url("/parts/contents/online_quote/num03.jpg");
	}
	.page div.flow > div p:nth-of-type(1) span {
		font-size: 0.75em;
		font-weight: normal;
	}
	.page dl.note {
		text-align: left;
		width: 690px;
		padding: 0;
		margin: 40px auto 0 auto;
		font-size: 0.85em;
	}
	.page dl.note dt {
		font-weight: bold;
		padding: 0 0 5px 0;
		margin: 0;
	}
	.page dl.note dd {
		padding: 0;
		margin: 0;
		line-height: 150%;
	}
	.page dl.note dd:before {
		content: "●";
		font-size: 0.3em;
		vertical-align: middle;
		padding: 0 5px 0 0;
	}
}
@media screen and (max-width:390px) { 
	.page {
		font-size: 0.85em;
		padding: 0 0 2em 0;
	}
	.page h2 {
		margin: 0 auto;
		padding: 0;
		width: 92%;
	}
	.page div.intro {
		background-color: #FFFFD1;
		padding: 20px 0;
		margin: 0;
		box-sizing: border-box;
	}
	.page div.intro p:nth-of-type(1) {
		font-size: 1.15em;
		width: 92%;
		margin: 0 auto;
	}
	.page div.intro p:nth-of-type(1) strong {
		color: #FF0000;
	}
	.page div.intro div.example {
		border: solid 1px #002789;
		background-color: #FFF;
		width: 92%;
		box-sizing: border-box;
		padding: 10px;
		margin: 20px auto 0 auto;
	}
	.page div.intro div.example h3 {
		padding: 0;
		margin: 0;
		color: #002789;
		font-size: 1.1em;
	}
	.page div.intro div.example ul {
		text-align: left;
		padding: 0;
		margin: 5px 0 0 0;
	}
	.page div.intro div.example ul li {
		line-height: 150%;
	}
	.page div.intro div.example ul li:before {
		content: "●";
		font-size: 0.3em;
		vertical-align: middle;
		padding: 0 3px 0 0;
	}
	.page div.intro div.sample {
		background-color: #D7EAFF;
		width: 92%;
		box-sizing: border-box;
		padding: 10px 0 20px 0;
		margin: 20px auto 0 auto;
	}
	.page div.intro div.sample h3 {
		color: #002789;
		text-align: center;
		font-size: 1.25em;
		padding: 0;
		margin: 0;
	}
	.page div.intro div.sample p {
		padding: 0;
		margin: 0 auto;
		text-align: center;
	}
	.page div.flow {
		width: 100%;
		margin: 0;
	}
	.page div.flow h3 {
		text-align: center;
		font-size: 1.65em;
		color: #168568;
		border-top: solid 5px #168568;
		background-color: #D0E7E1;
		padding: 5px 0 3px 0;
		margin: 30px 0 0 0;
	}
	.page div.flow > div {
		width: 92%;
		box-sizing: border-box;
		margin: 25px auto 0 auto;
	}
	.page div.flow > div p:nth-of-type(1) {
		text-align: left;
		font-size: 1.25em;
		line-height: 150%;
		background-position: top left;
		background-repeat: no-repeat;
		min-height: 49px;
		box-sizing: border-box;
		padding: 0 0 0 65px;
		margin: 0 0 10px 0;
	}
	.page div.flow > div:nth-of-type(1) p:nth-of-type(1) {
		background-image: url("/parts/contents/online_quote/num01.jpg");
	}
	.page div.flow > div:nth-of-type(2) p:nth-of-type(1) {
		background-image: url("/parts/contents/online_quote/num02.jpg");
	}
	.page div.flow > div:nth-of-type(3) p:nth-of-type(1) {
		background-image: url("/parts/contents/online_quote/num03.jpg");
	}
	.page div.flow > div p:nth-of-type(1) span {
		font-size: 0.75em;
		font-weight: normal;
	}
	.page dl.note {
		text-align: left;
		width: 92%;
		padding: 0;
		margin: 10px auto 0 auto;
		font-size: 0.85em;
	}
	.page dl.note dt {
		font-weight: bold;
		padding: 0 0 5px 0;
		margin: 0;
	}
	.page dl.note dd {
		padding: 0;
		margin: 0;
		line-height: 150%;
	}
	.page dl.note dd:before {
		content: "●";
		font-size: 0.3em;
		vertical-align: middle;
		padding: 0 5px 0 0;
	}
}