@charset "utf-8";


.vs_bnr {
	background-image: url(/img/business/campaign/intro/vs/vs_topImg_pc.jpg);
}

@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
	.vs_bnr {
		background-image: url(/img/business/campaign/intro/vs/vs_topImg_sp.jpg);
	}
}


.vs_box01 {
	margin-bottom: 80px;
}
.vs_box01 h3{
	font-size: 1.5rem;
	color: #54c3f1;
	text-align: center;
	margin-bottom: 15px;
}
.vs_list01{
	justify-content: center;
}
.vs_list01 li{
	width: 250px;
	height: 250px;
	margin: 0 8px;
	background: #f3fbff;
	border-radius: 125px;
	justify-content: center;
	align-content: center;
	flex-wrap: wrap;
	text-align: center;
}
.vs_list01 li h4{
	width: 100%;
	color: #4abcf2;
	margin-bottom: 20px;
}
.vs_list01 li p{
	width: 100%;
	font-size: 1.25rem;
	color: #999;
	font-weight: bold;
}
.vs_table{
	width: 100%;
	margin-bottom: 100px;
}
.vs_table thead th{
	padding: 8px 0;
	font-size: 1.25rem;
}
.vs_table thead th:nth-child(1){
	border-top: none;
	border-left: none;
}
.vs_table thead th:nth-child(2){
	background: #0083ba;
	color: #fff;
	font-weight: bold;
}
.vs_table thead th:nth-child(3){
	background: #999999;
	color: #fff;
}
.vs_table tbody th{
	
	font-size: 0.875rem;
	background: #4abcf2;
	color: #fff;
	border-bottom: 1px #f5f5f5 solid;
}
.vs_table tbody td{
	font-size: 0.875rem;
	text-align: center;
	padding: 10px 0;
}
.vs_table th,
.vs_table td{
	border: 1px #dbdbdb solid;
}

.vs_table tbody tr:nth-child(odd) td:nth-child(2){
	background: #f3fbff;
	color: #4abcf2;
	font-weight: bold;
}
.vs_table tbody tr:nth-child(odd) td:nth-child(3){
	background: #f5f5f5;
}
.vs_table tbody tr:nth-child(even) td:nth-child(2){
	color: #4abcf2;
	font-weight: bold;
}
.vs_case{
	border-top: 1px #dbdbdb solid;
	padding-top: 50px;
	margin-bottom: 50px;
}
.vs_tit01{
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 20px;
}
.vs_tit01 span{
	color: #4abcf2;
	font-size: 1rem;
	margin-right: 10px;
}
.vs_tit01 span strong{
	font-size: 1.5rem;
}
.vs_caselist{
	margin-bottom: 30px;
}
.vs_caselist li{
	width: 47.75%;
}
.vs_txt01{
	background: #f3fbff;
	padding: 15px 0;
	font-size: 1.25rem;
	text-align: center;
	color: #4abcf2;
}
.vs_txt01 strong{
	font-size: 1.5rem;
}
.vs_contact{
	background: #fff;
	box-shadow: 0 8px 20px rgba(0,0,0,0.1);
	width: 75%;
	margin: 100px auto;
	padding: 30px;
	text-align: center;
}
.vs_txt02{
	font-size: 1.1rem;
	margin-bottom: 15px;
}
.vs_con_btn a{
	position: relative;
	background: #45b6f4;
	display: inline-block;
	padding: 16px 100px 16px 160px;
	color: #fff;
	font-size: 1.25rem;
	text-decoration: none;
	font-weight: bold;
	margin-bottom: 15px;
}
.vs_con_btn a::after{
	content: "";
	position: absolute;
	width: 37px;
	height: 25px;
	top: 20px;
	left: 100px;
	background: url(/img/business/campaign/intro/vs/img_07.png) no-repeat;
	background-size: 37px;
}
.vs_txt03{
	font-size: 1.5rem;
	vertical-align: middle;
}
.vs_txt03 span{
	font-size: 0.875rem;
}
.vs_line_bor{
	border: 1px #000 solid;
	padding: 5px 8px 4px;
	vertical-align: middle;
	margin-right: 5px;
	position: relative;
	top: -2px;
}






@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
	
	.vs_box01 h3{
		font-size: 1rem;
	}
	.vs_list01{
		display: block;
	}
	.vs_list01 li{
		width: 180px;
		height: 180px;
		border-radius: 50%;
		margin: 0 auto 15px;
	}
	.vs_tabbox{
		position: relative;
		overflow-x: scroll;
		width: 100%;
	}
	.vs_table{
		width: 900px;
		margin-bottom: 0;
	}
	.vs_case{
		margin-bottom: 30px;
		padding-top: 30px;
	}
	.vs_tit01{
		font-size: 1rem;
	}
	.vs_tit01 span{
		font-size: 0.75rem;
		display: block;
	}
	.vs_tit01 span strong{
		font-size: 1rem;
	}
	.vs_caselist{
		display: block;
	}
	.vs_caselist li{
		width: 100%;
		margin-bottom: 25px;
	}
	.vs_txt01{
		font-size: 0.875rem;
	}
	.vs_txt01 strong{
		font-size: 1rem;
	}
	.vs_txt02{
		font-size: 0.875rem;
		line-height: 1.4rem!important;
	}
	.vs_con_btn a{
		width: 100%;
		padding: 10px 0;
		font-size: 1rem;
		padding-left: 30px;
	}
	.vs_con_btn a::after {
	    width: 22px;
	    height: 15px;
	    top: 15px;
	    left: 30px;
	    background-size: 22px;
	}
	.vs_txt03{
		font-size: 1.3rem;
	}
	.vs_txt03 span{
		font-size: 0.75rem;
	}
	.vs_line_bor{
		padding: 3px 5px 1px;
	}
	.vs_contact{
		width: 100%;
		margin: 70px 0 50px;
		box-shadow: 0 5px 10px rgba(0,0,0,0.06);
	}
	.vs_contact .ui_font_s{
		font-size: 0.8rem;
	}
	.vs_list01 li h4{
		font-size: 0.875rem;
		margin-bottom: 5px!important;
	}
	.vs_list01 li p{
		font-size: 0.93rem;
		line-height: 1.4rem!important;
	}
	.table-data-scroll-notice {
	    position: sticky;
	    z-index: 9;
	    left: calc(50% - 25rem);
	    top: calc(50% - 17.5rem);
	    width: 50rem;
	    height: 0;
	    pointer-events: none;
	    opacity: 1;
	    transition: opacity .4s cubic-bezier(.39,.575,.565,1) 3s;
	}
	.table_scr_mark{
		position: sticky;
		left: 50%;
		top: 50%;
		width: 150px;
		height: 0;
		transition: 0.7s;
	}
	.table_scr_mark::after{
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 150px;
		background: url(/img/business/campaign/intro/vs/img_scroll.png) no-repeat;
		background-size: 100% 100%;
		transform: translateX(-50%) translateY(-50%);
	}
	.ui_scroll.is_on .table_scr_mark{
		opacity: 0;
	}
	
	
}




/* /business H1 Renewal */
.vs_bnr {
  background-image: none;
}