@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 section.contents .title_type_pc_parent{
	display: flex;
	justify-content: space-between;
}
#product section.contents .title_type_pc{
	display: flex;
	justify-content: center;
	width:calc(100%) !important;
}

#product section.contents .title_type_pc h4{
	width:50%;
}

#product section.contents .title_type_arrow:hover{
	/*opacity:0.7;*/
}

#product section.contents .title_type_arrow{
	background-color:rgba(0,94,184,1.0);
	color:#fff;
	display:flex;
	justify-content:center;
	align-items:center;
	padding:0.5em 0;
	position: relative;
	text-align:center;
	opacity:1;
	transition:opacity 0.3s;
	/*cursor:pointer;*/
}
#product section.contents .title_type_arrow.left:before{
	content: "";
	position: absolute;
	top: calc(50% - 2.4rem);
	left:0;
	width: 0;
	height: 0;
	border-top: 2.4rem solid transparent;
	border-bottom: 2.4rem solid transparent;
	border-left: calc(2.4rem) solid #fff;
}
#product section.contents .title_type_arrow.right:after{
	content: "";
	position: absolute;
	top: calc(50% - 2.4rem);
	right:0;
	width: 0;
	height: 0;
	border-top: 2.4rem solid #fff;
	border-bottom: 2.4rem solid #FFF;
	border-left: calc(2.4rem) solid transparent;
}

#product section.contents .title_type_arrow.center:before{ 
	content: "";
	display: inline-block;
	position: absolute;
	left: -2.4rem;
	top: calc(50% - 1.7rem);
	width: 3.4rem;
	height: 3.4rem;
	box-sizing: border-box;
	border-top: #fff solid 4px;
	border-right: #fff solid 4px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

#product section.contents .title_type_a_parent{
	display: flex;
	justify-content: space-between;
}

#product section.contents .title_type_a{
	display:flex;
	justify-content: start;
	align-items: center;
	width:calc(100% / 2 - 1.4rem) !important;
}

#product section.contents .title_type_a h4{
	text-align:center;
	width:15em;
	margin-bottom:0;
	margin-right:1em;
	padding:0.5em 0;
}

#product section.contents .title_type_a .blue{
	background-color:#8bb0cd;
	color:#fff;
}
#product section.contents .title_type_a .green{
	background-color:#56b651;
	color:#fff;
}

#product section.contents .title_type{
	/*display:flex;*/
	font-size: 1.8rem;
	width:15em;
	margin-bottom: 4rem;
}
/*
#product section.contents .title_type span{
	width:10em;
}*/
#product section.contents .title_type .title_type_arrow{
	padding:0.5rem 0;
}
#product section.contents .title_type_blue {
	background-color: #8bb0cd;
	color: #fff;
	display:flex;
	justify-content:center;
	align-items:center;
	font-size: 1.8rem;
	width:15em;
	margin-bottom: 4rem;
	padding: 0.5rem 0;
}
#product section.contents .title_type_green {
	background-color:#56b651;
	color: #fff;
	display:flex;
	justify-content:center;
	align-items:center;
	font-size: 1.8rem;
	width:15em;
	margin-bottom: 4rem;
	padding: 0.5rem 0;
}

/*h3見出し*/
#product section.contents h3 span.sub_title{
	display:block;
	text-align:center;
	font-size:1.4rem;
	border:1px solid rgba(0,94,184,1.0);
	color:rgba(0,94,184,1.0);
	font-weight:normal;
	
	margin-bottom: 1rem;
	position:relative;
	width:10em;
	height:2.4rem;
	display:flex;
	justify-content:center;
	align-items:center;
}
/*
#product section.contents h3 span.sub_title:after{ 
	content: "";
	display: inline-block;
	position: absolute;
	right: -0.6em;
	top: calc(50% - 0.6em);
	width: 1.2em;
	height: 1.2em;
	box-sizing: border-box;
	border-top: rgba(0,94,184,1.0) solid 1px;
	border-right: rgba(0,94,184,1.0) solid 1px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
*/


/*特殊な位置にnote要素が来た場合の補正*/
#product section .spanbox.warp {
	flex-wrap: wrap;
}
#product section .spanbox.warp span.note{
	width:100%;
	padding-left: 6em;
}


#product section .lineBox{
	border:1px solid #e6e6e6;
	padding:3rem;
}

#product section .ValueDesign{
	display: flex;
	align-items: center
}
#product section .ValueDesign figure{
	margin-right:2em;
}

/*幅調整*/
#product section.contents .imageright div.w30{
	width: calc(100% - 70rem - 2rem);
}
#product section.contents .imageright figure.w70{
	width: calc(70rem - 2rem);
}
#product section.contents .imageright figure.w70 img{
	width:100%;
}
#product section.contents .imageright div.w40{
	width: calc(100% - 60rem - 2rem);
}
#product section.contents .imageright figure.w60{
	width: calc(60rem - 2rem);
}
#product section.contents .imageright figure.w60 img{
	width:100%;
}


/*icon*/
#product section.contents .flexBox div .icon_panel,
#product section.contents .flexBox div .icon_panel{
	width:4rem;
	height:4rem;
	margin: 0 0.5em 0 0;
}
/*リスト*/
#product section.contents ol.num{
	margin-left:1.5em;
	text-indent:-1.5em;
}
#product section.contents ol.num li{
	/*list-style: symbols;*/
}

/**/
#product section.contents .flexbox_type1{
	display:flex;
	justify-content: space-between;
}
#product section.contents .flexbox_type1 img{
	margin-bottom:1em;
}

#product section.contents .flexbox_type1_position_parent{
	padding-top: 9em;
	/*position: relative;
	top: 37%;
	height: calc(50% - 15rem);
	border: 1px solid;
	height: fit-content;*/
}

#product section.contents .flexbox_type1_position{

	position:relative;
	margin-top:2rem;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
#product section.contents .flexbox_type1_position .arrow_div{
	margin:1em auto;
	width:100%;
}
#product section.contents .flexbox_type1_position p{
	margin:0;
}
#product section.contents .flexbox_type1_position p:nth-of-type(1){
	margin-right:1em;
}
#product section.contents .flexbox_type1 img.arrow{
  margin-bottom: 0em;
}

#product section span.after.height3,
#product section span.before.height3{
	height:4rem;
}

#product section .blue_large{
	font-size:2.4rem;
	color:rgba(0,94,184,1.0);

}
#product section .blue_large span{
	font-size:1.8rem;
}

/*マージンの調整*/
#product section.contents .top_adjust1{
	margin-top:16rem;
}
#product section.contents .top_adjust2{
	margin-top:0rem;
}
#product section.contents .top_adjust3{
	margin-top:0rem;
}

/*文字色*/
#product section.contents .text_blue{
	color:rgba(0,94,184,1.0);
}
#product section.contents .text_red{
	color:rgba(229,0,0,1.0);
}

#product section .spanbox.al_st {

	align-items: start;
}

/* トップのイメージ*/
#product section .imageleft_s8as{
	display :flex;
	justify-content:space-between;
	margin-bottom: 7.2rem;
	margin-top: 6rem;
	padding: 0 5rem;
	
}
#product section .imageleft_s8as img{
	margin:0;
	width:100%;
}

#product section .imageleft_s8as1{
	width:29rem;
}
#product section .imageleft_s8as2{
	width:56rem;
}

/*ページスクロール*/
#product section .scroll_link{
	/*text-align:right;*/
	margin-top:1rem;
	margin-right:1.5em;
}
#product section .scroll_link_a{
	opacity:1;
	transition:opacity 0.3s;
}
#product section .scroll_link_a:hover{
	opacity:0.7;
}
#product section .scroll_link_a::after {
	content: "";
	display: inline-block;
	position: relative;
	top: -0.1rem;
	left: 0.5rem;
	width: 0.8rem;
	height: 0.8rem;
	box-sizing: border-box;
	border-bottom: rgba(0,94,184,1.0) solid 1px;
	border-right: rgba(0,94,184,1.0) solid 1px;
	transform: rotate(45deg);
}
#product section.contents .scroll_link2{
	width:auto !important;
}
#product section.contents .scroll_link2 p{
	margin-bottom: 0rem;
}
#product span.small_title{
	display:block;
	font-weight:normal;
	font-size:1.4rem;
	color:#333;
}
#product h3.green_title{
	color: #55b651;
}
#product section.contents .panelsolution h3 {
	margin-bottom: 1.5rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid #E6E6E6;
}
#product section.contents .panelsolution h4 {
	margin-bottom: 1rem;
}

/*商品特長横並び*/
#product section.contents .title_type_parent {
	display: flex;
	justify-content: space-between;
}
#product section.contents .title_type_parent div {
	/*margin-left: 2rem;*/
	width:calc(100% / 4 - 2rem) !important;
}
#product section.contents .title_type_parent div:nth-of-type(1) {
	margin-left: 0rem;
}
#product section.contents .title_type_parent img{
	margin:0;
	width:calc(100%);
}

/*プッシュイン*/
#product section.contents .flexBox figure.steps{
	width:auto;
	display: flex;
	align-items: center;
	border: 1px solid #e6e6e6;
}
#product section.contents .flexBox figure.steps img{
	width:25rem;
	margin:0 1rem 0 0;
	height:auto;
}
#product section.contents .flexBox div img.icon {
	width: 5.1rem;
	margin:0;
	margin-right: 0.8rem;
}
#product section.contents ol.figcaption li,
#product section.contents .flexBox div.disc ol li{
	margin-left:2rem;
	list-style: decimal;
}

#product section.contents .lineBox .flexBox div img{
	width:45rem;
}

/*--------------------------------------------------------------------------------------*/
@media (min-width:769px) and (max-width:1080px) {
	#product section.contents .imageright div.w30{
		width: calc(30% - 2rem);
	}
	#product section.contents .imageright figure.w70{
		width: calc(70% - 2rem);
	}
	#product section.contents .imageright div.w40{
		width: calc(40% - 2rem);
	}
	#product section.contents .imageright figure.w60{
		width: calc(60% - 2rem);
	}
}
/*--------------------------------------------------------------------------------------*/
@media screen and (max-width:768px) {
	#product section .lineBox{
		padding:2rem;
	}
	#product section.contents .imageright div.w30{
		width: calc(100%);
	}
	
	/*特殊な比較*/
	#product section.contents .flexbox_type1{
		display:block;
	}
	#product section.contents .flexbox_type1_position{
		top:0rem;
		display: flex;
	    justify-content: center;
	    align-items: start;
	    margin:0rem 0;
	}
	#product section.contents .flexbox_type1_position p{
		/*width:25%;*/
	}
	#product section.contents .flexbox_type1_position .arrow{
		margin:2rem;
		transform: rotate(90deg);
	}
	/*画像小さく*/
	#product section.contents img.mobil_small{
		width:60%;
	}
	
	/*マージンの調整*/
	#product section.contents .top_adjust1{
		margin-top:3rem;
	}
	#product section.contents .top_adjust2{
		margin-top:3rem;
	}
	#product section.contents .top_adjust3{
		margin-top:6rem !important;
	}
	#product section.contents .imageright figure.w70{
		width: calc(100%);
	}
	#product section.contents .imageright figure.w60{
		width: calc(100%);
	}
	#product section.contents .imageright div.w40{
		width: calc(100%);
	}
	
	
	#product section .imageleft_s8as{
		display:block;
	}
	/* トップのイメージ*/
	#product section .imageleft_s8as{
		display :block;
		margin-bottom: 7.2rem;
		margin-top: 7.2rem;
		padding: 0rem;
	}
	#product section .imageleft_s8as1{
		width:60%;
		display:block;
		margin:0 auto 2rem;
	}
	#product section .imageleft_s8as2{
		width:100%;
	}
	#product section.contents .title_type_a_parent {
		display: block;
	}
	#product section.contents .title_type_a {
		width: calc(100%) !important;
	}
	#product section.contents .title_type_parent {
		display: block;
	}
	#product section.contents .title_type_parent div{
		width:100% !important;
		margin-top:4rem;
	}
	#product section.contents .title_type_parent div:nth-of-type(1){
		margin-top:0rem;
	}
	#product section.contents .lineBox .flexBox div img {
		width: 100%;
	}
	#product section.contents .flexbox_type1_position_parent {
		padding-top: 0em;
		margin:2rem 0;
	}
	#product section.contents .flexbox_type1 img.arrow{
		transform: rotate(90deg);
	}
	#product section.contents .title_type_a h4{
		width:10em;
	}
	#product section.contents .title_type_a:nth-of-type(1){
		margin-bottom:4rem;
	}

}