@charset "utf-8";

/* ++++++++++++++++++++++++++++++++++++++++++++++
service	websecurity
++++++++++++++++++++++++++++++++++++++++++++++ */
.serviceDetailIntro {
	background:url(/service/websecurity-managed/img/bg_title.jpg) #303c48 no-repeat 100% 50%;
	background-size: cover;
	color: #fff;
	}
@media only screen and (max-width:639px) {
.serviceDetailIntro {
	padding-top: 140px;
	background:url(/service/websecurity-managed/img/bg_title.jpg) #303c48 no-repeat 100% -5%;
	background-size: auto 200px;
	}
}
	.serviceDetailIntro p{
		font-size: 1.125rem;
		margin-bottom: .5rem;
		}
	.serviceDetailIntro h1.top{
		color: #fff;
		font-weight: bold;
		text-shadow: 0 0 15px #000;
		}
		.serviceDetailIntro h1.top img{
			margin-bottom: 1rem;
			}
	.serviceDetailIntro p.top{
		text-shadow: 0 0 15px #000;
		}
.serviceDetailIntro.mini{
	padding-top: 2.25rem;
	background:url(/service/websecurity-managed/img/bg_title2.jpg) #464156 no-repeat 100% 50%;
	}

@media only screen and (max-width:639px) {
.serviceDetailIntro.mini{
	min-height: 0;
	padding-top: 100px;
	background:url(/service/websecurity-managed/img/bg_title2.jpg) #464156 no-repeat 100% -5%;
	background-size: auto 100px;
	}
	.serviceDetailIntro.mini h1{
		margin-bottom: -.6rem;
		}
.sp_br{display:none;}
}
	.serviceDetailIntro.mini h1 .subheader{
		color: #fff;
		font-size: 18px !important;
		margin-bottom: 0;
		}
	.serviceDetailIntro.mini h1 img{
		zoom:1;
    width: 280px;
    height: 30px;
		}
.sectionEnd { display:block; clear:both; width:0; height:0; margin-bottom:3rem; border:0; }

/* コンバージョンエリア -------------*/
.cv_area{
	margin:4rem auto 2rem;
	border:5px solid #333;
	background:#fff;
	}
.cv_area h3{
	color:#fff;
	padding:0.3rem 0;
	margin:0;
	background:#333;
	text-align:center;
	font-size:1.3rem;
	}
	.cv_area_top{background:#eee;padding-bottom:1rem;}
	.order_link{font-size:14px;}
	.cv_area_top .button{padding:1rem 6rem;font-size:1.6rem;margin:2rem 0 1rem;}
	.cv_links{
		width:100%;
		margin:0.7rem auto;}
	.cv_links li{
		border-right:1px solid #ccc;
		width:33%;
		float:left;
		padding:0.5rem 0rem;
		font-size:0.95rem;
		text-align:center;
		}
	.cv_links li:last-child{border:none;}

/* 見出し -------------*/
.h4-title-border{
	margin-bottom:1.5rem;
	padding:0.5rem 1rem;
	border:#999 1px solid;
	border-radius:3px;
	font-size:1.1rem;
	}
.h5-title-bg{
	margin-bottom:1rem;
	padding:0.5rem 1rem;
	border-radius:3px;
	font-size:1.0rem;
	background:#ece7e7;
	}

/* TOP -------------*/
.top-safety{
	margin-top: -1rem;
	padding: 3rem 0 1.5rem;
	}
	.top-safety h2{
		padding: .5rem;
		}
	.top-safety .tit{
		margin-bottom: 1.5rem;
		padding-bottom: .2rem;
		font-size: 1rem;
		border-bottom: 1px solid #c4c4c4;
		}
.top-example{
	}
	.top-example .button.hollow{
		border:none;
		}
	.top-example .button.hollow:hover,
	.top-example .button.hollow:focus{
		background: #f6f6f6;
		}
	.top-example .button.hollow h3{
		margin: 0 0 1rem 0
		}
	.top-example .button.hollow .text{
		color: #000;
		text-align: left;
		}
	.top-example .button.hollow .arrow{
		margin-bottom: 0;
		color: #b82126;
		font-weight: bold;
		}
	.top-example .button.hollow .arrow::before{
		margin-right: .2rem;
		content: url(../img/top/ico_arrow_red.png);
		}

.top-function{
	padding: 4rem 0 2rem;
	background: url(../img/top/bg_function.jpg) #21212a no-repeat 100% 0;
	color: #fff;
	}
	.top-function section{
		margin-bottom: 3rem;
		}
	.top-function h2,
	.top-function h5{
		color: #fff;
		}
	.top-function h2{
		padding-bottom: 2rem;
		}
	.top-function h5{
		margin: 1.2rem 0 0 1rem;
		}
	@media screen and (max-width: 1000px) {
	.top-function h5{
		margin: 0 0 0 0;
		}
		}
	.top-function p{
		margin-top: 1rem;
		}
.top-info{

	}
	.top-info > dt{
		}
		.top-info > dt > span{
			margin-left: 1rem;
			padding: .4em .8em;
			border-radius: 1em;
			background: #666;
			color: #fff;
			font-weight: normal;
			}
		.top-info > dt > .news{
			background: #27b3b1;
			}
		.top-info > dt > .security{
			background: #ff9308;
			}
	.top-info > dd{
		margin-bottom: 1rem;
		padding-bottom: 1rem;
		border-bottom: 1px dotted #adadad;

		}

/* 料金 -------------*/
.price-fig table{
	width: 100%;
	min-width:900px;
	}
	@media screen and (max-width: 1000px) {
		.price-fig{
			overflow-x: scroll;
			}
	}
	.price-fig table thead th,
	.price-fig table thead td{
		border:1px solid #fff;
		}
	.price-fig table thead td{
		background: #fff;
		border-bottom:1px solid #ccc;
		}
	.price-fig table thead th{
		width:15%;
		margin-bottom: 0;
		padding: .8rem 0;
		background: #524a71;
		color: #fff;
		font-size: 1.125rem;
		text-align: center;
		}
	.price-fig table tbody th,
	.price-fig table tbody td{
		border:1px solid #ccc;
		font-size: 0.875rem;
		}
.price-fig table tbody th.sub-tit {
	background: #333;
	color: #fff;
	text-align: left;
	padding-bottom: 0.25rem;
}
	.price-fig table tbody td{
		text-align: center;
		}
.price-fig .num{
	font-size: 1.375rem;
	}
.price-fig .label{
	margin-right: 0.3rem;
	padding: 0.3rem;
	border-radius: 0.3rem;
	vertical-align: 2px;
	font-size:10px;
	}
.price-fig .none{
	display: block;
	width: 12px;
	height: 2px;
	margin: 15px auto;
	background: #333;
	}
.price-fig .circle{
	display: block;
	width: 24px;
	height: 24px;
	margin: 4px auto;
	border:3px solid #7169A8;
	border-radius: 50%;
	}
.has-tip{
	border-bottom:none;
	font-weight: normal;
	}
.has-tip img{
	margin-left: .2rem;
	vertical-align: top;
	}
.tooltip {
	max-width: 23rem !important;
	}

/*診断内容 ------------*/
.list-diagnosis li{
	border: solid 1px #bbb;
	border-radius: .2rem;
	padding: .7rem;
	background: #fff;
	width: 23%;
	float: left;
	margin: 0 .5rem 1rem;
	text-align: center;
	line-height: 1.2em;
	height: 3.4rem;
}
@media only screen and (max-width:639px) {
	.list-diagnosis li{
		width: 44%;
		height: 3.8rem;
	}
}
/* お申し込み -------------*/
.order_flow{
	display: table;
	width: 100%;
	padding: 2rem 0;
	}
	.order_flow > li{
		position: relative;
		display: table-cell;
		width: 27%;
		padding-left: 2%;
		border-right: 5px solid #f6f6f6;
		height: 150px;
		vertical-align: middle;
		background: #b6242c;
		color: #fff;
		font-size: 1.125rem;
		}
	.order_flow > li::after{
		display: block;
		position: absolute;
		top:0;
		right: 0;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 75px 0 75px 46px;
		border-color: transparent transparent transparent #b6242b;
		content: '';
		background: #f6f6f6;
		}
@media only screen and (max-width:900px) {
	.order_flow > li{
		width: 25%;
		font-size: 1rem;
		}
	.order_flow > li::after{
		display: none;
		}
}
	.order_flow > li:last-child{
		width: auto;
		line-height: 142px;
		border-right: 0;
		background: #fff;
		border:4px solid #b6242c;
		border-radius: 4px;
		color: #b6242c;
		}
	.order_flow > li:last-child::after{
		display: none;
		}
		.order_flow > li > strong{
			display: block;
			font-size: 1.25rem;
			margin-bottom: 1rem;
			font-weight: normal;
			}
.order_info section{
	padding-bottom: 1rem;
	}
.order_info .h4-title-border {
	background: #524a71;
	color: #fff;
	border:solid 1px #524a71;
}
/* websecurityトップページ　テキストリンクcss -------------*/
.a_text_white{color: #fff;}
.a_text_white:hover{
	text-decoration: none;
	color: #fff;
}
/* 20170412 websecurityトップページ　一行ニュース設置css -------------*/
.sitelock_index_headline {
background-color: #fff;
padding-bottom:2.15rem;
}
.sitelock_index_headline > .icon-new {
    margin-right: 2rem;
}
/* 20170412 websecurityトップページ　バナー設置css -------------*/
.top_banner:hover img{opacity:0.8;}