@import url("../../../promotion_assets/css/page-top_news.css");
@import url("../../../promotion_assets/css/special-nav.css");
@import url("../../../promotion_assets/css/conversion-area.css");
@import url("../../../promotion_assets/css/breadcrumb.css");
@import url("../../../promotion_assets/css/promotion_common.css");
@import url("../../../promotion_assets/css/product_links.css");
@import url("../../../promotion_assets/css/product_links_other.css");
/*--------------------------------------------------------------------------------------*/
/*専用CSS*/
#product h1 span {
  font-size: 2.4rem;
  display:block;
  margin-bottom:2rem;
}
#product .text_center{
	text-align:center;
}
#product .blue{
	color:#005eb8;
}

#product .bg_blue{
	background-color:#005eb8;
	color:#fff;
	padding:0 0.5em;
	height:2em;
	display: flex;
	align-items: center;
	line-height:1;
}

#product .group_border{
	/*border: 1px solid #e6e6e6;
	padding: 3rem;
	margin-top:3rem;*/
}
#product .group_border h4{
	margin-bottom: 1.5rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid #E6E6E6;
}

#product section.contents .imageright div.w40 {
	width: calc(40% - 2rem);
}
#product section.contents .imageright figure.w60 {
	width: calc(60% - 2rem);
}
#product section.contents .imageright figure.w60 img{
	width:100%;
}

/*矢印*/
#product section.contents .step_arrow{
	position: relative;
	height:6rem;
}
#product section.contents .step_arrow::after {
	content: "";
	position: absolute;
	top: calc(50% - 0.8rem);
	right: calc(50% - 0.8rem);
	width: 0;
	height: 0;
	border-left: 1.5rem solid transparent;
	border-right: 1.5rem solid transparent;
	border-top: calc(1.5rem * 1.73) solid #E2E2E2;
}

/*わずか数分で設定完了 ステップ*/
#product section.contents .step{
	width:70%;
	margin:auto;
	border:1px solid #e6e6e6;
	padding:2rem;
}
#product section.contents .step.end{
	background-color:rgba(0,94,184,0.8);
}
#product section.contents .step.end h3{
	margin:0;
	color:#fff;
}
#product section.contents .step h3{
	color:#005eb8;
	text-align:center;
}
#product section.contents .step h4{
	text-align:center;
}
#product section.contents .step img{
	display:block;
	margin:0 auto;
	/*border:1px solid #e6e6e6;
	background-color:#f0f0f0;*/
	/*width:50rem;
	height:20rem;*/
}
#product section.contents .step h4 strong{
	font-size:120%;
	padding-left:0.5em;
}
#product section.contents .step_arrow2{
	position: relative;
	height:5rem;
}
#product section.contents .step_arrow2::after {
	content: "";
	position: absolute;
	top: 0;
	right: calc(50% - 6rem);
	width: 0;
	height: 0;
	border-left: 6rem solid transparent;
	border-right: 6rem solid transparent;
	border-top: calc(1.5rem * 1.73) solid #E2E2E2;
}

#product section.contents .step .step_3column{
	display: flex;
	justify-content: center
}
#product section.contents .step .step_3column div{
	margin:0 2.5rem;
}

/* H2背景グレー -----*/
#product section.contents.bg_gray {
	background-color: #f5f5f5;
}
#product section.contents.bg_gray .title {
	padding: 7.2rem 0 7.2rem 0;
	text-align:center;
}
#product section.contents.bg_gray .title h1,
#product section.contents.bg_gray .title h2,
#product section.contents.bg_gray .title h3{
	margin-bottom:0;
}
#product section.contents .w1000.block2{
	padding-top: 7.2rem;
}
#product section div.w1000-t {
	width: 100rem;
	margin: 0 auto;
	position: relative;
}
/* /H2背景グレー -----*/


/*--------------------------------------------------------------------------------------*/
@media (min-width:769px) and (max-width:1080px) {

	/*わずか数分で設定完了 ステップ*/
	#product section.contents .step .step_3column{
		justify-content: space-between;
	}
	#product section.contents .step .step_3column div{
		width:calc(100% / 3 - 1.5rem);
		margin:0;
	}
	#product section.contents .step .step_3column div img{
		width:calc(100%);
	}
	#product header div.indexpage img {
		right: auto;
		left: 36%;
	}
}
/*--------------------------------------------------------------------------------------*/
@media screen and (max-width:768px) {
	#product header{
		padding-bottom: 0rem;
	}
	#product .group_border{
		/*padding: 2rem;*/
	}

	#product section.contents .imageright div.w40,
	#product section.contents .imageright figure.w60,
	#product section.contents .imageright figure.w60 img{
		width:100%;
	}
	
	
	/*わずか数分で設定完了 ステップ*/
	#product section.contents .step {
		width: 100%;
		margin: 0;
	}
	#product section.contents .step .step_3column{
		display: block;
	}
	#product section.contents .step .step_3column div{
		margin:4rem 0 0rem;
	}
	#product section.contents .step .step_3column div:nth-of-type(1){
		margin-top:0rem;
	}
	
	/* H2背景グレー -----*/
	#product section div.w1000-t {
		width: auto;
	}
	/* /H2背景グレー -----*/
}