@charset "utf-8";
/* CSS Document */

:root {
	--spv: / 640 * 100vw;
	--spp: / 640 * 100%;
}

/* -------------------------------------------------
	font
------------------------------------------------- */

/*
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 100;
	src: url('../font/NotoSansCJKjp-hinted_subset_woff/NotoSansCJKjp-Thin_sub.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 200;
	src: url('../font/NotoSansCJKjp-hinted_subset_woff/NotoSansCJKjp-Light_sub.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 300;
	src: url('../font/NotoSansCJKjp-hinted_subset_woff/NotoSansCJKjp-DemiLight_sub.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 500;
	src: url('../font/NotoSansCJKjp-hinted_subset_woff/NotoSansCJKjp-Medium_sub.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 900;
	src: url('../font/NotoSansCJKjp-hinted_subset_woff/NotoSansCJKjp-Black_sub.woff') format('woff');
}
*/
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 400;
	src: url('../font/NotoSansCJKjp-hinted_subset_woff/NotoSansCJKjp-Regular_sub.woff') format('woff');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 700;
	src: url('../font/NotoSansCJKjp-hinted_subset_woff/NotoSansCJKjp-Bold_sub.woff') format('woff');
}

/*! minireset.css v0.0.3 | MIT License | github.com/jgthms/minireset.css */
/* reset ----------------------------------------------------------*/
.wrapper {
	width:100%;
}

@media screen and (max-width: 640px) {
	.wrapper {
		max-width:640px;
		margin:0 auto;
		overflow:hidden;
	}
}

@media screen and (min-width: 641px) {
	.wrapper {
		min-width:1200px;
	}
}

html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	padding: 0;
	font-family: 'Noto Sans Japanese','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: 100%;
	font-weight: 400;
	clear:both;
}

h1 a {
	display: inline-block;
	margin: 0;
	padding: 0;
}

ul {
	list-style: none;
}

button,
input,
select,
textarea {
	margin: 0;
}

html {
	box-sizing: border-box;
	color:#333;
}

*, *:before, *:after {
	box-sizing: inherit;
	color:#333;
}

img,
embed,
iframe,
object,
audio,
video {
	height: auto;
	max-width: 100%;
}

img {
	border: 0;
	vertical-align:bottom;
	display:block;
}

main {
	max-width: 1200px;
	margin: 0 auto;
}

iframe {
	border: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
	text-align: left;
}

section {
	clear:both;
}

.text_center {
	text-align:center;
}

a {
	text-decoration:underline;
	color:#333;
}

a:hover img.overwhite{
	cursor:pointer;
	filter: alpha(opacity=60);        /* ie lt 8 */
	-ms-filter: "alpha(opacity=60)";  /* ie 8 */
	-moz-opacity:0.6;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.6;              /* Safari 1.x */
	opacity:0.6;
	zoom:1;
	transition:ease 0.6s;
}

.nowrap {
  white-space: nowrap;
}

@media screen and (max-width: 640px) {
	img {
		width:100%;
	}
}

/* clear -------------------------------------------------------*/
.clear {
	clear:both;
}

.clearfix {
	zoom:1;
}

.clearfix:after{ 
	content: ""; 
	display: block; 
	clear: both;
}

/* responsive -------------------------------------------------------*/

@media screen and (min-width: 641px) {
	.pc-none {
		display: none !important;
	}
}

@media screen and (max-width: 640px) {
	.sp-none {
		display: none !important;
	}
}

/* YTM -------------------------------------------------------*/
body > iframe, body > img, body > span { display: none; }


/* browser -------------------------------------------------------*/
@media screen and (min-width: 641px) {.pc_only { display:block; } .sp_only {display:none; }}
@media screen and (max-width: 640px) {.pc_only { display:none; } .sp_only {display:block; }}

/* margin -------------------------------------------------------*/
@media screen and (min-width: 641px) {.mt20 { margin-top:20px;} .mt30 { margin-top:30px; } .mt40 { margin-top:40px; } .ml_pc { margin-left:20px; }}
@media screen and (max-width: 640px) {.mt20 { margin-top:calc(20 var(--spv)); } .mt30 { margin-top:calc(30 var(--spv)); } .mt40 { margin-top:calc(40 var(--spv)); } .ml_pc { margin-left:calc(30 var(--spv)); }}

/* header ----------------------------------------------------------*/
@media screen and (min-width: 641px) {
	header {
		width:1100px;
		height: 83px;
		margin:0 auto;
		padding: 20px 0 0;
	}
}

@media screen and (max-width: 640px) {
	header {
		width:100%;
		height: calc(126 var(--spv));
		margin:0;
		padding: calc(37 var(--spv)) 0 0 4%;
		box-sizing: border-box;
	}
	header h1 {
		width:calc(497 var(--spp));
		margin:0;
		padding:0;
	}
}

/* footer ----------------------------------------------------------*/

footer p.num {
	text-align:right;
	color:#343434;
	margin-bottom:4px;
	margin-top:75px;
	font-size:10px;
	clear:both;
}

footer p.inner {
	width:930px;
	margin:0 auto;
	box-sizing:border-box;
	padding:0 15px;
}

#str-footer{
	width:900px;
	margin:0 auto;
	border-top:solid 1px #434343;
}

#str-footer-inner{
	padding:10px 0 40px;
}

#str-footer .nav-common{
	float:left;
}

.nav-common li{
	padding:0 6px;
	float:left;
	background:transparent url(/-/media/jpz/zrh/campaign/nb2501/images/nav-common-bg.gif) no-repeat right center;
}

.nav-common li a {
	color:#5c5c5c;
	font-size:13px;
}

.nav-common li a:hover {
	color:#5c5c5c;
	font-size:13px;
	text-decoration:none;
}

#str-footer #copyright{
	margin-left:6px;
	float:right;
	font-size:12px;
}

#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 50;
}

#page-top a {
	width: 85px;
	display: block;
}

@media screen and (min-width: 641px) {
	footer {
		margin-top: 80px;
	}
}

@media screen and (max-width: 640px) {
	#str-footer{
		width:94%;
		margin:0 auto 9%;
		border-top: none;
		font-size:calc(20 var(--spv));
	}
	
	#str-footer-inner{
		padding:2% 0 6%;
	}

	.nav-common li{
		background:transparent url(/-/media/jpz/zrh/campaign/nb2501/images/nav-common-bg.gif) no-repeat right center;
	}

	.nav-common li a {
		font-size:calc(20 var(--spv));
	}

	.nav-common li a:hover {
		font-size:calc(20 var(--spv));
	}

	#str-footer #copyright{
		margin-left:6px;
		float:right;
	}

	#page-top a {
		width: 50px;
		display: block;
	}
}

/* utility -------------------------------------------------------*/

.box900 {
	max-width: 900px;
	margin: 0 auto;
	position: relative;
}
.box908 {
	max-width: 910px;
	margin: 0 auto;
	position: relative;
}

@media screen and (max-width: 640px) {
	.box-sp {
		width: calc(600 / 640 * 100%);
		margin: 0 auto;
		position: relative;
	}
	
	.bg-yellow {
		padding: calc(35 var(--spv)) 0 calc(40 var(--spv));
	}
}

/* first-view -------------------------------------------------------*/

@media screen and (min-width: 641px) {
	#first-view {
		width: 100%;
		overflow: hidden;
	}
	#first-view h2 {
		height: 627px;
		position: relative;
	}
	#first-view img {
		max-width: none;
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
	}
}

/* cta -------------------------------------------------------*/

.cta {
	padding: 20px 0 30px;
	background: url("/-/media/jpz/zrh/campaign/firequote2501/images/cta_bg.png") repeat center center;
	text-align: center;
}
.cta p,
.cta li {
	color: #fff;
	line-height: 1;
}
.cta .text1 {
	font-size: 28px;
	font-weight: 700;
}
.cta .text1::before,
.cta .text1::after {
	width: 38px;
	height: 42px;
	margin: 0 11px;
	content: "";
	display: inline-block;
	background: url("/-/media/jpz/zrh/campaign/firequote2501/images/cta_deco_01.png") no-repeat 0 0 / 100% auto;
	vertical-align: -4px;
}
.cta .text1::after {
	transform: rotateY(180deg);
}
.cta .btn {
	margin-top: 19px;
	display: inline-block;
}
.cta .text2 {
	margin-top: 0.5em;
	font-size: 18px;
	font-weight: 700;
	line-height: calc(24 / 18);
}
.cta .notes {
	width: 884px;
	margin: 30px auto 0;
}
.cta .notes li {
	font-size: 16px;
	line-height: calc(22 / 16);
	text-align: left;
}

@media screen and (min-width: 641px) {
	.cta .btn:hover {
		opacity: 0.7;
	}
}

@media screen and (max-width: 640px) {
	.cta {
		padding: calc(30 var(--spv)) 0 calc(28 var(--spv));
		background-size: calc(10 var(--spv)) auto;
	}
	.cta .text1 {
		font-size: calc(36 var(--spv));
	}
	.cta .text1::before,
	.cta .text1::after {
		width: calc(35 var(--spv));
		height: calc(38 var(--spv));
		margin: 0 calc(20 var(--spv));
		vertical-align: calc(-4 var(--spv));
	}
	.cta .btn {
		width: calc(574 var(--spp));
		margin-top: calc(19 var(--spv));
	}
	.cta .text2 {
		margin-top: 0.4em;
		font-size: calc(24 var(--spv));
		line-height: calc(38 / 24);
	}
	.cta .notes {
		width: calc(574 var(--spp));
		margin: calc(26 var(--spv)) auto 0;
	}
	.cta .notes li {
		font-size: calc(22 var(--spv));
		line-height: calc(30 / 22);
		text-indent: -1em;
		margin-left: 1em;
	}
}

/* common-box1 -------------------------------------------------------*/

.common-box1 {
	width: 900px;
	margin: 0 auto;
	padding: 0 25px 25px;
	background: #1b93cf;
	border-radius: 8px;
}
.common-box1 .headline {
	padding: 29px 0 27px;
	text-align: center;
	color: #fff;
	font-weight: 700;
	font-size: 36px;
	line-height: 1;
}

@media screen and (max-width: 640px) {
	.common-box1 {
		width: calc(594 var(--spp));
		padding: 0 calc(14 var(--spv)) calc(14 var(--spv));
		border-radius: calc(8 var(--spv));
	}
	.common-box1 .headline {
		padding: calc(36 var(--spv)) 0 calc(31 var(--spv));
		font-size: calc(48 var(--spv));
	}
}

/* entry -------------------------------------------------------*/

#entry {
	margin-top: 70px;
	text-align: center;
}

#entry ul li {
	padding: 42px 0;
	background: #fff;
}
#entry ul li .step {
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
}
#entry ul li .text1 {
	height: 40px;
	margin-top: 10px;
	padding-top: 3px;
	box-sizing: border-box;
	border-radius: 20px;
	font-size: 20px;
	color: #fff;
	font-weight: 700;
	line-height: 1;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	background: #ff7569;
}
#entry ul li:nth-child(1) .text1 { width: 170px; }
#entry ul li:nth-child(2) .text1 { width: 282px; }

#entry ul li .desc {
	width: 19em;
	margin: 27px auto 0;
	font-size: 18px;
	line-height: calc(30 / 18);
	color: #333;
	font-weight: 700;
	text-align: left;
}

@media screen and (min-width: 641px) {
	#entry ul {
		display: flex;
		justify-content: space-between;
	}
	#entry ul li {
		width: 415px;
	}
	#entry ul li .desc {
		padding-top: 190px;
	}
	#entry ul li:nth-child(1) .desc {
		background: url("/-/media/jpz/zrh/campaign/firequote2501/images/entry_fig_01.png") no-repeat center top;
	}
	#entry ul li:nth-child(2) .desc {
		background: url("/-/media/jpz/zrh/campaign/firequote2501/images/entry_fig_02.png") no-repeat center top;
	}
}

@media screen and (max-width: 640px) {
	#entry {
		margin-top: calc(70 var(--spv));
	}

	#entry ul li {
		padding: calc(40 var(--spv)) 0 calc(225 var(--spv));
	}
	#entry ul li + li {
		margin-top: calc(14 var(--spv));
	}
	#entry ul li:nth-child(1) {
		background: #fff url("/-/media/jpz/zrh/campaign/firequote2501/images/entry_fig_01_sp.png") no-repeat center bottom / 31.25vw auto;
	}
	#entry ul li:nth-child(2) {
		background: #fff url("/-/media/jpz/zrh/campaign/firequote2501/images/entry_fig_02_sp.png") no-repeat center bottom / 31.25vw auto;
	}
	#entry ul li .step {
		font-size: calc(34 var(--spv));
	}
	#entry ul li .text1 {
		height: calc(52 var(--spv));
		margin-top: 1.2vw;
		padding-top: 0;
		border-radius: calc(26 var(--spv));
		font-size: calc(26 var(--spv));;
	}
	#entry ul li:nth-child(1) .text1 { width: calc(210 var(--spv)); }
	#entry ul li:nth-child(2) .text1 { width: calc(367 var(--spv)); }

	#entry ul li .desc {
		width: calc(502 var(--spv));;
		margin: 1em auto 0;
		font-size: calc(24 var(--spv));
		line-height: calc(38 / 24);
	}
}

/* present -------------------------------------------------------*/

#present {
	margin-top: 40px;
	margin-bottom: 70px;
}
#present .p-box {
	padding-bottom: 17px;
	background: #fff;
}
#present .p-box .product {
	height: 80px;
	padding-top: 3px;
	background: #eaf3f9;
	font-size: 24px;
	line-height: 1;
	font-weight: 700;
}
#present .p-box .col2 .desc p {
	font-size: 18px;
	line-height: calc(30 / 18);
}
#present .p-box .notes {
	width: 775px;
	margin: 5px auto 0;
}
#present .p-box .notes li {
	font-size: 16px;
	line-height: calc(22 / 16);
}

@media screen and (min-width: 641px) {
	#present .p-box .product {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#present .p-box .col2 {
		margin-top: 44px;
		display: flex;
		justify-content: center;
		gap: 0 30px;
	}
	#present .p-box .col2 .pic {
		width: 405px;
	}
	#present .p-box .col2 .desc {
		width: 340px;
	}
}

@media screen and (max-width: 640px) {
	#present {
		margin-top: calc(50 var(--spv));
		margin-bottom: calc(70 var(--spv));
	}
	#present .p-box {
		padding-bottom: calc(38 var(--spv));
	}
	#present .p-box .product {
		height: calc(135 var(--spv));
		padding-top: calc(34 var(--spv));
		box-sizing: border-box;
		font-size: calc(30 var(--spv));
		line-height: calc(34 / 30);
		text-align: center;
	}
	#present .p-box .col2 .pic {
		width: calc(456 var(--spv));
		margin: calc(30 var(--spv)) auto 0;
	}
	#present .p-box .col2 .desc {
		width: calc(513 var(--spv));
		margin: calc(27 var(--spv)) auto 0;
	}
	#present .p-box .col2 .desc p {
		font-size: calc(24 var(--spv));
		line-height: calc(39 / 24);
	}
	#present .p-box .notes {
		width: calc(513 var(--spv));
		margin: calc(20 var(--spv)) auto 0;
	}
	#present .p-box .notes li {
		font-size: calc(22 var(--spv));
		line-height: calc(30 / 22);
	}
}

/* detail -------------------------------------------------------*/

#detail {
	margin: 70px 0;
}

#detail .white-box {
	padding: 44px 45px 42px;
	background: #fff;
	text-align: center;
}
#detail .white-box .detail-item + .detail-item {
	margin-top: 65px;
}
#detail .white-box .detail-item h4 {
	padding-bottom: 0.3em;
	margin-bottom: 1.1em;
	text-align: center;
	font-size: 24px;
	font-weight: 700;
	color: #1b93cf;
	line-height: 1;
	display: inline-block;
	position: relative;
}
#detail .white-box .detail-item h4::after {
	width: calc(100% + 1em);
	height: 0;
	content: "";
	display: block;
	border-bottom: dotted 3px #1b93cf;
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
}
#detail .white-box .detail-item p,
#detail .white-box .detail-item li {
	font-size: 18px;
	line-height: calc(30 / 18);
	text-align: left;
	letter-spacing: 0.05em;
}
#detail .white-box .detail-item p + p {
	margin-top: 1.5em;
}
#detail .white-box .detail-item p + p.mt {
	margin-top: 2.7em;
}
#detail .white-box .detail-item .small {
	font-size: 16px;
	line-height: calc(22 / 16);
	font-weight: normal;
}
#detail .white-box .detail-item .notes {
	margin: 10px 0 0;
}
#detail .white-box .detail-item .notes li {
	font-size: 16px;
	line-height: calc(22 / 16);
	font-weight: 400;
	list-style-type: none;
	letter-spacing: 0;
	text-indent: -1em;
	margin-left: 1em;
}
#detail .white-box .detail-item ul {
	list-style-type: disc;
	margin-left: 25px;
}
#detail .white-box .detail-item ul li p.indent {
	margin-top: 0 !important;
	text-indent: -1.3em;
	margin-left: 1.3em;
}
#detail .white-box .detail-item .with-square {
	text-indent: -1em;
	margin-left: 1em;
	margin-top: 0;
	color: #333 !important;
}
#detail .white-box .detail-item .with-square::before {
	content: "◆";
	color: #333 !important;
}
#detail .white-box .detail-item .with-square + .with-square {
	margin-top: 1em;
}
#detail .white-box .detail-item .mail1-1 {
	width: auto;
	height: 16px;
	margin-right: 0.2em;
	display: inline-block;
	vertical-align: -0.34em;
}
#detail .white-box .detail-item .mail1-2 {
	width: auto;
	display: inline-block;
	vertical-align: -0.1em;
}
#detail .white-box .detail-item .mail2 {
	width: auto;
	margin-top: 4px;
	display: inline-block;
	vertical-align: -0.22em;
}

@media screen and (max-width: 640px) {
	#detail {
		margin: calc(70 var(--spv)) 0;
	}

	#detail .white-box {
		padding: calc(40 var(--spv)) calc(30 var(--spv)) calc(38 var(--spv));
	}
	#detail .white-box .detail-item + .detail-item {
		margin-top: calc(65 var(--spv));
	}
	#detail .white-box .detail-item h4 {
		font-size: calc(30 var(--spv));
	}
	#detail .white-box .detail-item h4::after {
		
	}
	#detail .white-box .detail-item p,
	#detail .white-box .detail-item li {
		font-size: calc(24 var(--spv));
		line-height: calc(38 / 24);
	}
	#detail .white-box .detail-item .sp-ls0 {
		letter-spacing: 0;
	}
	#detail .white-box .detail-item .small {
		font-size: calc(22 var(--spv));
		line-height: calc(30 / 22);
	}
	#detail .white-box .detail-item .notes {
		margin: 10px 0 0;
	}
	#detail .white-box .detail-item .notes li {
		font-size: calc(22 var(--spv));
		line-height: calc(30 / 22);
	}
	#detail .white-box .detail-item ul {
		margin-left: 5vw;
	}
	#detail .white-box .detail-item .mail1-1 {
		height: calc(24 var(--spv));
		vertical-align: -0.4em;
	}
	#detail .white-box .detail-item .mail1-2 {
		height: calc(20 var(--spv));
	}
	#detail .white-box .detail-item .mail2 {
		height: calc(26 var(--spv));
		margin-top: 1.2vw;
	}
}

/* c-policy -------------------------------------------------------*/

#c-policy .notes {
	margin-top: 5px;
	display: block;
}
#c-policy .notes .small {
	display: block;
	line-height: 1.8 !important;
	text-indent: -1em;
	margin-left: 1em;
}