@charset "utf-8";
/* reset */
article, aside, details, figcaption, figure, footer, header, img, main, menu, nav, section {
	display: block;
}
a, abbr, address, article, aside, audio, b, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, html, i, iframe, img, ins, kbd, label, legend, li, main, mark, menu, nav, object, ol, p, pre, q, samp, section, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: 400;
	font-style: normal;
	vertical-align: baseline;
	background: 0 0;
}
html {
	font-size:100%;
	overflow-y: scroll;
}
body {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
	font-size:13px;
	*font-size:small;
	*font:x-small;
	font-size:small\9;
	font-weight: 400;
	line-height: 1.6;
	color: #333;
	-webkit-text-size-adjust: 100%;
}
*, ::after, ::before {
	box-sizing: border-box;
}
:focus {
	outline: 0;
}
button, input, pre, select, textarea {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: 13px;
	font-weight: 400;
	vertical-align: middle;
}
img {
	border: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, td, th {
	text-align: left;
}
ol, ul {
	list-style: none;
}
address {
	font-style: normal;
}

/* common */
img {
	display: block;
	width: 100%;
	height: auto;
}
input[type="image"]:hover,
a:hover img {
	opacity: 0.6;
}
/* #wrapper */
#wrapper {
	margin: 0 auto;
	width: 1200px;
	color: #186688;
}
#wrapper em {
	color: #FF5038;
}
/* header */
header {
	padding: 0 100px;
}
header img {
	padding: 12px 0;
	width: 290px;
}
/* .mainVisual */
.mainVisual {
	margin: 0 auto;
	padding: 33px 100px 20px;
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/mainVisual_bg.png) no-repeat center bottom;
}
.mainVisual > span {
	margin-bottom: 56px;
	display: block;
	font-size: 231%;
	font-weight: bold;
	font-style: italic;
	text-align: right;
}
.mainVisual > span em {
	font-style: italic;
	font-weight: bold;
}
.mainVisual > h1 {
	margin: 0 0 50px auto;
	width: 530px;
	font-size: 339%;
	font-weight: bold;
	position: relative;
}
.mainVisual > h1::before {
	content: "";
	width: 106px;
	height: 129px;
	display: block;
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/badge_max.png) no-repeat center center;
	background-size: contain;
	position: absolute;
	top: 0;
	left: -126px;
}
.mainVisual > h1::after {
	content: "";
	width: 97px;
	height: 70px;
	display: block;
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/badge_free.png) no-repeat center center;
	background-size: contain;
	position: absolute;
	top: -14px;
	right: 0;
}
.mainVisual > h1 span {
	display: block;
	font-size: 120%;
	font-weight: bold;
	white-space: nowrap;
}
.mainVisual > h1 span em {
	font-weight: bold;
}
.mainVisual .comBox {
	margin: 0 0 12px auto;
	width: 630px;
	border: 2px solid #186788;
}
.mainVisual .comBox h2 {
	padding: 6px 0;
	background-color: #186788;
	font-weight: bold;
	color: #FFF;
	text-align: center;
}
.mainVisual .comBox div {
	padding: 5px;
	background-color: #FFF;
}
.mainVisual .comBox div img {
	margin: 0 4px 10px;
	width: 94px;
	float: left;
}
.mainVisual .comBox div p {
	padding-left: 1em;
	text-indent: -1em;
	float: none;
	clear: both;
	font-size: 85%;
	color: #333;
}
.mainVisual form {
	margin: 0 0 0 auto;
	width: 630px;
	border: 2px solid #FF5039;
}
.mainVisual form h2 {
	padding: 6px 0;
	background-color: #FF5039;
	font-weight: bold;
	color: #FFF;
	text-align: center;
	position: relative;
}
.mainVisual form h2::before {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/badge_1min.png);
	position: absolute;
	top: -10px;
	left: -8px;
}
.mainVisual form > div {
	padding: 16px 16px 11px;
	background-color: #FFF;
}
.mainVisual form table th {
	padding: 2px 0 2px 3px;
	width: 64px;
	background-color: #FF5039;
	color: #FFF;
	vertical-align: middle;
	text-align: left;
	position: relative;
	overflow: hidden;
}
.mainVisual form table th::before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 34px 0 0 11px;
	border-color: #FFF transparent transparent transparent;
	position: absolute;
	top: 0;
	right: 0;
}
.mainVisual form table th::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 34px 11px;
	border-color: transparent transparent #FFF transparent;
	position: absolute;
	bottom: 0;
	right: 0;
}
.mainVisual form table td:first-of-type {
	padding-left: 10px;
	width: 175px;
}
.mainVisual form table td input[type="text"] {
	margin-top: -6px;
	padding: 5px;
	width: 50px;
	border: 1px solid #186688;
}
.mainVisual form table td input[type="text"]:first-child + input[type="text"] {
	width: 78px;
}
.mainVisual form table td a {
	padding-left: 20px;
	margin: 6px 30px 0 0;
	display: block;
	color: #186688;
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/icon_question.png) no-repeat left center;
	text-decoration: none;
}

/* section common */
section {
	margin-bottom: 70px;
}
section h1 {
	margin-bottom: 40px;
	padding: 0 100px;
	background-color: #DDE8EE;
}
section h1 span {
	padding: 26px 0 26px 200px;
	display: block;
	font-size: 235%;
	font-weight: bold;
	line-height: 1.6;
	white-space: nowrap;
}
section h1 span em {
	font-weight: bold;
}
section .lead {
	margin-bottom: 32px;
	text-align: center;
	font-size: 200%;
	font-weight: bold;
}
section > h2 {
	margin: 0 100px 20px;
	padding: 5px 0 44px;
	background-color: #FF5038;
	text-align: center;
	font-size: 231%;
	color: #FFF;
	font-weight: bold;
	position: relative;
	overflow: hidden;
	letter-spacing: -2px;
}
section > h2 em {
	font-weight: bold;
	color: #FFFF8C !important;
}
section > h2::before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 60px 0 0 600px;
	border-color: transparent transparent transparent #FFF;
	position: absolute;
	left: 0;
	bottom: -8px;
}
section > h2::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 60px 600px;
	border-color: transparent transparent #FFF transparent;
	position: absolute;
	right: 0;
	bottom: -8px;
}
.button {
	padding-top: 68px;
	position: relative;
}
.button::before {
	content: "";
	display: block;
	margin-left: -85px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 85px 0 85px;
	border-color: #FF5039 transparent transparent transparent;
	position: absolute;
	top: 20px;
	left: 50%;
}
.button > a {
	margin: 0 auto;
	width: 906px;
	display: block;
}

/* .timingBox */
.timingBox h1 span {
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/title_num_01.png) no-repeat 100px center;
}
.timingBox > ul {
	margin: 0 auto 46px;
	width: 951px;
	overflow: hidden;
}
.timingBox > ul li {
	margin: 0 23px;
	width: 271px;
	float: left;
}
.timingBox > ul li img {
	margin-bottom: 10px;
}
.timingBox > ul li p {
	text-align: center;
	font-size: 154%;
	font-weight: bold;
}
.timingBox > ul li p em {
	font-weight: bold;
}
/* .securityBox */
.securityBox {
	margin: 0 100px;
	border: 2px solid #186688;
}
.securityBlock {
	margin-bottom: 32px;
	padding: 36px 400px 20px 46px;
	background: #FFF1F0 url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/img_case.png) no-repeat right bottom;
	background-size: contain;
}
.securityBlock p {
	margin-bottom: 10px;
	font-size: 293%;
	font-weight: bold;
}
.securityBlock p em {
	font-weight: bold;
}
.securityBlock p + span {
	display: block;
	font-size: 139%;
}
.securityBox ul {
	margin: 0 auto 38px;
	width: 900px;
	overflow: hidden;
}
.securityBox ul li {
	width: 300px;
	float: left;
}
.securityBox ul li img {
	margin: 0 auto 12px;
	width: 130px;
}
.securityBox ul li p {
	font-weight: bold;
	font-size: 200%;
	color: #186688;
	text-align: center;
}

/* .planBox */
.planBox h1 {
	position: relative;
}
.planBox h1::before {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/title_badge_01.png);
	position: absolute;
	top: 14px;
	left: 102px;
}
.planBox h1 span {
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/title_num_02.png) no-repeat 100px center;
}
/* .feeBox */
.feeBox {
	margin: 0 100px;
	border: 2px solid #186688;
}
.feeBlock {
	margin-bottom: 32px;
	padding: 36px 400px 20px 46px;
	background: #FFF1F0 url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/img_plan.png) no-repeat right bottom;
	background-size: contain;
	letter-spacing: -1px;
}
.feeBlock p {
	margin-bottom: 10px;
	font-size: 293%;
	font-weight: bold;
}
.feeBlock p em {
	font-weight: bold;
}
.feeBlock p + span {
	display: block;
	font-size: 139%;
}
.feeBox > h3 {
	margin-bottom: 32px;
	font-size: 216%;
	font-weight: bold;
	text-align: center;
}
.feeBox > ul {
	margin: 0 auto 80px;
	width: 900px;
	overflow: hidden;
}
.feeBox > ul li {
	margin-left: 100px;
	width: 400px;
	float: left;
}
.feeBox > ul li:first-child {
	margin-left: 0;
	position: relative;
}
.feeBox > ul li:first-child::after {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/icon_plus.png);
	position: absolute;
	top: 40px;
	right: -65px;
}
.totalBox {
	margin: 0 auto 48px;
	width: 896px;
	border: 2px solid #FF5038;
	position: relative;
}
.totalBox::before {
	margin-left: -113px;
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/arrow_01.png);
	position: absolute;
	top: -59px;
	left: 50%;
}
.totalBox h4 {
	padding-left: 96px;
	background-color: #FF5038;
	color: #FFF;
	font-size: 154%;
	font-weight: bold;
	letter-spacing: -1px;
	position: relative;
}
.totalBox h4::before {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/icon_yen.png);
	position: absolute;
	top: -9px;
	left: 13px;
}
.totalBox h4 span {
	padding-right: 28px;
	font-size: 190%;
	font-weight: bold;
}
.totalBox p {
	padding: 20px 46px;
	font-size: 154%;
}
/* .stepBox */
.stepBox h1 {
	position: relative;
}
.stepBox h1::before {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/title_badge_02.png);
	position: absolute;
	top: 14px;
	left: 102px;
}
.stepBox h1 span {
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/title_num_03.png) no-repeat 100px center;
}
.stepIn {
	margin: 0 100px 26px;
	border: 2px solid #186688;
}
.step {
	margin-bottom: 32px;
	padding: 90px 386px 80px 46px;
	background: #FFF1F0 url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/img_step.png) no-repeat right bottom;
	background-size: contain;
	letter-spacing: -1px;
}
.step p {
	margin-bottom: 10px;
	font-size: 293%;
	font-weight: bold;
	white-space: nowrap;
}
.step p em {
	font-weight: bold;
}
.step p + span {
	display: block;
	font-size: 139%;
}
.stepIn > ul {
	margin-bottom: 36px;
	overflow: hidden;
}
.stepIn > ul li {
	width: 332px;
	float: left;
}
.stepIn > ul li img {
	margin: 0 auto 24px;
	width: 143px;
}
.stepIn > ul li h3 {
	margin-bottom: 16px;
	font-size: 193%;
	font-weight: bold;
	color: #FF5038;
	text-align: center;
}
.stepIn > ul li p {
	font-size: 154%;
	text-align: center;
}
.stepIn + .catch {
	margin: 0 100px;
	font-size: 231%;
	font-weight: bold;
	text-align: center;
}
.stepIn + .catch em {
	font-weight: bold;
}
/* .companyBox */
.companyBox h1 {
	position: relative;
}
.companyBox h1::before {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/title_badge_03.png);
	position: absolute;
	top: 14px;
	left: 102px;
}
.companyBox h1 span {
	font-size: 173% !important;
	background: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/title_num_04.png) no-repeat 100px center;
	line-height: 2;
	letter-spacing: -1px;
}
.companyBox h1 span em {
	font-size: 118% !important;
}
.companyBox .comBox {
	margin: 0 100px 6px;
	border: 2px solid #186688;
}
.companyBox .comBox h2 {
	padding: 6px 0;
	background-color: #186688;
	color: #FFF;
	font-weight: bold;
	text-align: center;
}
.companyBox .comBox div {
	padding: 10px 20px;
	overflow: hidden;
}
.companyBox .comBox div img {
	margin: 0 17px 0;
	width: 125px;
	float: left;
}
.companyBox .comBox + p {
	margin: 0 100px 10px;
	padding-left: 1em;
	text-indent: -1em;
	color: #000;
	font-size: 108%;
}
/* .buttonArea */
.buttonArea {
	margin: 0 100px 66px;
}
.buttonArea > h2 {
	margin-bottom: 76px;
	font-size: 231%;
	font-weight: bold;
	text-align: center;
	line-height: 2.4em;
}
.buttonArea h2 em {
	padding-left: 90px;
	font-weight: bold;
	position: relative;
}
.buttonArea h2 em::before {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/badge_max_02.png);
	position: absolute;
	top: -26px;
	left: 0;
}
.buttonArea .buttonCatch {
	height: 300px;
	background-color: #FFEDEB;
	border-radius: 100px 100px 0 0;
	position: relative;
}
.buttonArea .buttonCatch img.imgText {
	width: 404px;
	position: absolute;
	top: -40px;
	left: 100px;
}
.buttonArea .buttonCatch img.imgMan {
	width: 320px;
	position: absolute;
	left: 543px;
	bottom: 0;
}
.buttonArea .buttonBox {
	border: 6px solid #FF5139;
}
.buttonArea .buttonBox h2 {
	padding-left: 185px;
	background-color: #FF5139;
	color: #FFF;
	font-size: 277%;
	font-weight: bold;
	letter-spacing: -1px;
	position: relative;
}
.buttonArea .buttonBox h2::before {
	content: url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/promo/landing/01/badge_free_02.png);
	position: absolute;
	top: -36px;
	left: 42px;
}
.buttonBox .button {
	padding-bottom: 63px;
}
.buttonBox .button::before {
	top: 0;
}
.isoBox {
	margin: 0 190px 40px;
}
.isoBox ul {
	margin:0 auto 11px;
	overflow:hidden;
	text-align:center;
}
.isoBox ul li {
	display:inline;
	list-style-type: none;
}
.isoBox ul li a {
	padding:0 30px 0 18px;
	background:url(https://img.phoenix.webcrew.co.jp/11900/home-security/images/icon_link_grey.gif) no-repeat left center;
}
.iso {
	margin:0 auto;
	padding:13px 0 0;
	border-top:1px solid #18962F;
	overflow: hidden;
}

.iso .isoLeft {
	padding:12px 0 0 129px;
	float:left;
	width:290px;
	min-height:54px;
	height:auto !important;
	height:54px;
	background:url(https://img.phoenix.webcrew.co.jp/12200/files/images/logo_ISMS.png) no-repeat 0 0;
	background-size: 110px 48px;
	font-size:115%;
	font-weight:bold;
}

.iso .isoRight {
	padding:5px 20px 0 0;
	float:left;
	width:524px;
}
footer {
	padding: 6px 0;
	background-color: #186788;
	text-align: center;
	color: #FFF;
	font-size: 124%;
}
/* autocomplete */
.ac_results {
	padding: 0px;
	border: 1px solid black;
	background-color: white;
	overflow: hidden;
	z-index: 99999;
}
.ac_results ul {
	width: 100%;
	list-style-position: outside;
	list-style: none;
	padding: 0;
	margin: 0;
}
.ac_results li {
	margin: 0px;
	padding: 2px 5px;
	cursor: default;
	display: block;
	/* 
	if width will be 100% horizontal scrollbar will apear 
	when scroll mode will be used
	*/
	/*width: 100%;*/
	font: menu;
	font-size: 12px;
	/* 
	it is very important, if line-height not setted or setted 
	in relative units scroll will be broken in firefox
	*/
	line-height: 16px;
	overflow: hidden;
}
.ac_odd {
	background-color: #eee;
}
.ac_over {
	background-color: #0A246A;
	color: white;
}
.ac_scroll {
	overflow:auto;
	max-height:180px;
	height:auto !important;
	height:180px;
}