@charset "UTF-8";

.lead_notes {
	line-height: 1.6;
}


@media screen and (min-width: 641px), print {
	/* ------------------  pc   ------------------   */
	.page_header img {
		width: 363px;
	}
	
	.main-image_wrap {
		line-height: 0;
	} 
	
	.main-image {
		margin-bottom: 8px;
		box-shadow: 8px 8px #e4f1f5;
	}
	
	.heading_lead {
		letter-spacing: 0.5px;
	}
	
	.lead_notes {
		margin: 0 15px 53px;
		line-height: 1.7;
	}
	
	.product_anchor {
		margin-bottom: 36px;
	}
	
	.product_anchor:after {
		content: "";
		display: block;
		clear: both;
	}
	
	.product_anchor li {
		float: left;
		width: 198px;
		height: 135px;
		margin-left: 2px;
		text-indent: -9999px;
	}

	.product_anchor li:first-child {
		margin-left: 0;
	}
	
	.product_anchor li#anchor_story1 a {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: 0 0;
	}
		
	.product_anchor li#anchor_story2 a {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -199px 0;
	}
		
	.product_anchor li#anchor_story3 a {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -398px 0;
	}
		
	.product_anchor li#anchor_story4 a {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -598px 0;
	}
		
	.product_anchor li#anchor_story5 a {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -798px 0;
	}
		
	.product_anchor li a {
		display: block;
		width: 198px;
		height: 135px;
		cursor: pointer;
		z-index: 999;
	}

	.product_anchor li#anchor_story1 a:hover {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: 0 -135px;
	}
		
	.product_anchor li#anchor_story2 a:hover {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -199px -135px;
	}
		
	.product_anchor li#anchor_story3 a:hover {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -398px -135px;
	}
		
	.product_anchor li#anchor_story4 a:hover {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -598px -135px;
	}
		
	.product_anchor li#anchor_story5 a:hover {
		background: url(../images/nav_bg3.png) no-repeat;
		background-position: -798px -135px;
	}
		
}

		
}


@media screen and (max-width: 640px){
	/* ------------------  sp   ------------------   */
	
	.page_header img {
		width: 363px;
	}
		
	.heading_lead {
		margin-top: 13px;
	}
	
	.lead_notes {
		margin-bottom: 16px !important;
	}
	
}


/* --------------------------------------------  
	 floatFooter pc   
--------------------------------------------  */

@media screen and (min-width: 641px), print {

	#floatFooter_wrap:after {
		content: "";
		display: block;
		clear: both;
	}
		
	#floatFooter {
		width: 100%;
		height: 62px;
		margin-top: 8px;
		overflow: hidden;
		background: rgba(0,140,214,0.9);
		position: fixed;
		bottom: -120px;
		left: 0;
		box-sizing: border-box;
		z-index: 600;
		overflow: visible;
	}
	
	#floatFooter ul {
		width: 1008px;
		margin: 0 auto;
		overflow: visible;
	}
	
	#floatFooter ul:after {
		content: "";
		display: block;
		clear: both;
	}
	
	#floatFooter ul li {
		float: left;
		width: 200px;
		height: 62px;
		text-indent: -9999px;
		position: relative;
		overflow: visible;
	}
	
	#floatFooter ul li:before {
		content: "";
		display: block;
		width: 24px;
		height: 24px;
		background: url(../../cmn/images/icon/float_icon_off.png) no-repeat rgba(255,255,255,0.0);
		background-size: contain;
		border-radius: 30px;
		position: absolute;
		top: -8px;
		right: 0;
		left: 0;
		margin: auto;
		overflow: visible;
		z-index: 10;
	}
	
	#floatFooter ul li:after {
		content: "";
		display: block;
		width: 22px;
		height: 22px;
		background: rgba(255,255,255,0.9);
		background-size: contain;
		border-radius: 22px;
		position: absolute;
		top: -8px;
		right: 0;
		left: 0;
		margin: auto;
		overflow: visible;
		z-index: 8;
	}
	
	#floatFooter ul li#float_story1 {
		background: url(../images/localnav3.png) no-repeat;
		background-position: 0 0;
	}
	
	#floatFooter ul li#float_story2 {
		background: url(../images/localnav3.png) no-repeat;
		background-position: -200px 0;
	}
	
	#floatFooter ul li#float_story3 {
		background: url(../images/localnav3.png) no-repeat;
		background-position: -400px 0;
	}
	
	#floatFooter ul li#float_story4 {
		background: url(../images/localnav3.png) no-repeat;
		background-position: -600px 0;
	}
	
	#floatFooter ul li#float_story5 {
		width: 201px;
		background: url(../images/localnav3.png) no-repeat;
		background-position: -800px 0;
	}
	
	#floatFooter ul li a {
		display: block;
		height: 70px;
		width: 200px;
	}
	
	#floatFooter ul li:hover {
		background-color: rgba(0,167,227,0.9) !important;
	}
	
	#floatFooter ul li:hover:before {
		background: url(../../cmn/images/icon/float_icon_on.png) no-repeat rgba(255,255,255,0.0);
	}
}

@media screen and (max-width: 640px){
	/* ------------------  sp   ------------------   */
	
	#floatFooter {
		display: none;
	}

}