@charset "utf-8";
/* CSS Document */

.billboard{
	width:100%;
	height: 150px;
	background-image: url(../img/pic_billboard.png);
	background-repeat: no-repeat;
	background-size: cover;
	margin: 0 0 20px;
	padding: 0;
}

.billboard .inner{
	width:100%;
	max-width:1040px;
	height: auto;
	margin: 0 auto;
}

.billboard .inner h2{
	font-size: 4.0rem;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	line-height: 150px;
}



/* パンくず
==========================================*/

.breadcrumb{
	width:100%;
	height: 30px;
}

.breadcrumb ul{
	width:100%;
	max-width: 1200px;
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	margin: 15px auto 0;
	font-size: 1.3rem;
}

.breadcrumb ul li{
	margin: 0 15px 0 0;
}

.breadcrumb ul li::after{
	content: ">";
	margin: 0 0 0 15px;
}

.breadcrumb ul li:last-child::after{
	content: "";
}

.content_wrap{
	width:90%;
	max-width:1200px;
	height: auto;
	margin: 0 auto;
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.main_content{
	width:70%;
	max-width:800px;
	height: auto;
	margin: 0;
	padding: 0;
}

.center{
	text-align: center;
}



/* 製品一覧　
==========================================*/

.main .product_list{
	border: #7d7d7d 1px solid;
	box-sizing: border-box;
	margin: 0 0 15px;
}

.product_list .head{
	border-bottom: #7d7d7d 1px solid;
	background-color: #dee5ee;
	position: relative;
	padding: 10px 50px;
}

.product_list .head .new{
	background-image: url(../../img/product/flag_new.png);
	background-repeat: no-repeat;
	width: 36px;
	height:48px ;
	position: absolute;
	top:0;
	left:0;
}

.product_list .head h2{
	font-size: 2.0rem;
}

.product_list .head h2 span{
	font-size: 1.2rem;
}

.product_list .body{
	padding: 20px 10px;
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.product_list .pic_box{
	width:30%;
	margin: 0;
}
.product_list .pic_box img{
	width:100%;
}

.product_list .txt_box{
	width:65%;
}

.product_list .txt_box p{
	font-size: 1.5rem;
	line-height: 1.8em;
	margin: 0 0 20px;
}

.product_list .icn{
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
}

.product_list .icn li{
	margin: 0 10px 0 0;
}

.btn{
	width:50%;
	height: 50px;
	text-align: center;
	margin: 0 auto;
	padding: 30px 0;
}

.btn a{
	display: inline-block;
	width:100%;
	height: 100%;
	font-size: 2.0rem;
	color:#17868a ;
	border: #17868a 4px solid;
	line-height: 45px;
	box-sizing: border-box;
	/*-webkit-transition: all .2s linear 0s;
	transition: all .2s linear 0s;*/
}

.btn a:hover{
	text-decoration: none;
}



/* 製品詳細
==========================================*/

h2.detail_midashi{
	font-size: 2.5rem;
	line-height: 0.8em;
	border-left: #17868A 4px solid;
	border-bottom: #17868A 1px solid;
	padding: 5px 0 0 10px;
	margin: 0;
}

h2.detail_midashi span{
	font-size: 1.3rem;
}

.pagelink{
	border: #bfbfbf 2px solid;
	box-sizing: border-box;
	margin: 20px 0;
	padding: 15px;
	background-color: #F5FFFC;
}

.pagelink ul{
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	font-size: 1.5rem;
}

.pagelink ul li{
	margin: 0 20px 0 0;
	padding: 0 0 0 15px;
	white-space: nowrap;
}

.pagelink ul li .fa-chevron-circle-right{
	color: #17868A;
}

h3{
	font-size: 2.0rem;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #17868a;
	margin: 0;
	padding: 10px ;
	box-sizing: border-box;
}

.product_list02{
	border: #7d7d7d 1px solid;
	box-sizing: border-box;
	margin: 0 0 15px;
	padding: 15px;
}

.icn.small{
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin: 10px 0 0;
}

.icn.small li{
	margin: 0;
}

.product_table{
	border-collapse:collapse;
	border: #7d7d7d 3px solid;
	font-size: 1.5rem;
	width: 100%;
}

.product_table th,
.product_table td{
	padding: 10px;
	border: #7d7d7d 1px solid;
}

.product_table th{
	background-color: #F5FFFC;
	vertical-align: middle;
}

.product_table td{
	line-height: 1.5em;
}
.product_table td img{
	width:100%;
}

.pagelink02{
	margin: 20px 0 30px;
}

.pagelink02 ul{
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content:flex-end;
	font-size: 1.5rem;
}

.pagelink02 ul li{
	margin: 0 20px 0 0;
	padding: 0 0 0 15px;
}

.pagelink02 ul li .fa-chevron-circle-right{
	color: #17868a;
}

.pagelink02 ul li:last-child{
	margin: 0;
}

.product_list02 h4{
	font-size: 2.0rem;
	font-weight: bold;
	color: #17868a;
	border-left: #17868a 3px solid;
	padding: 0 0 0 10px;
	margin: 30px 0 20px;
}

.product_list02 p{
	font-size: 1.5rem;
	line-height: 1.5em;
}

.column{
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin: 20px 0;
	padding: 0 0 20px;
	border-bottom: #17868a 1px dotted;
}

.column.last{
	border-bottom: none;
}

.column .column_box{
	width: 48%;
}

.column .column_box p{
	margin: 0 0 15px;
}

.normal{
	font-size: 1.5rem;
	list-style-type: disc;
	list-style-position: inside;
}

.normal li{
	margin: 0 0 10px;
}

.column .column_box h5{
	font-size: 1.7rem;
	font-weight: bold;
	border-bottom: #17868a 1px solid;
	padding: 0 0 10px;
	margin: 0 0 10px;
}

.column .column_box h5.point{
	font-size: 1.7rem;
	font-weight: normal;
	border-bottom: none;
	padding: 0;
	margin: 0 0 10px;
	height: 50px;
	color: #17868a ;
	line-height: 1.0em;
}

.column .column_box h5.point .number{
	float: left;
}

.column .column_box h5.point .midashi{
	display: table-cell;
	vertical-align: middle;
	height: 50px;
}

.column .column_box h5.point img{
	vertical-align: middle;
	display: inline-block;
	margin: 0 10px 0 0;
}

.point_list{
	font-size: 1.5rem;
}

.point_list li{
	background-image: url(../hi-story/img/icn_diamond.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 0 0 0 30px;
	margin: 0 0 20px;
	line-height: 1.5em;
}

.check_list dt{
	background-image: url(../hi-story/img/icn_check.gif);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	font-size: 1.7rem;
	padding: 0 0 0 25px;
	margin: 0 0 5px;
}

.check_list dd{
	font-size: 1.5rem;
	line-height: 1.5em;
	margin: 0 0 20px;
}

table.noborder,
table.noborder th,
table.noborder td{
	border: none;
}

table.noborder{
	font-size: 1.5rem;
}

table.noborder th{
	white-space: nowrap;
}

table.noborder th,
table.noborder td{
	padding: 10px;
}

.thum_box{
	width:100%;
	height: auto;
	margin: 0;
	box-sizing: border-box;
}

.thum_box img{
	width:100%;
	border: #F3F1F1 10px solid;
	box-sizing: border-box;
}

.effect_box{
	text-align: center;
	width:100%;
	height: auto;
}
.effect_box img{
	width:100%;
}

/* サブ　
==========================================*/
.sub{
	width:28%;
	max-width:290px;
	height: auto;
	margin: 0;
}

.sub_inner{
	border: #6eb7ab 6px solid;
	padding: 10px 0;
	box-sizing: border-box;
}

.sub_inner .title{
	width:220px;
	height:50px ;
	margin: 0 auto;
}

.sub_box{
	width:100%;
	max-width: 250px;
	height: auto;
	background-color: #FFFFFF;
	margin: 0 auto;
	padding: 10px 0;
	box-sizing: border-box;
	font-size: 1.5rem;
}

.sub_box li{
	background-image: url(../hi-story/img/line_sidearea.jpg);
	background-repeat: no-repeat;
	background-position: bottom center;
	padding: 10px 0 10px 0;

}

.sub_box li .fa-chevron-circle-right{
	color: #17868A;
}

.sub_box li:last-child{
	background: none;
}

.sub_box li.disabled{
	color: #A3A3A3;
}

.sub_box li.disabled::before{
	content:url(../hi-story/img/icn_arrow_disabled.png);
	margin: 0 8px 0 0;
}


@media screen and (max-width: 768px) {
	
.breadcrumb ul{
	width:96%;
	margin: 15px auto 0;
	font-size: 1.3rem;
}
	
.content_wrap{
	width:96%;
}	

.sub{
	width:24%;
}
	
.main_content{
	width:72%;
}
	
.pagelink ul{
	font-size: 1.2rem;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	-ms-flex-flow:row wrap;
	flex-wrap: wrap;
}
	
.pagelink ul li{
	margin: 0 15px 10px 0;
	padding: 0 ;
}	
	
.btn{
	width:60%;
}

.pagelink02 ul{
	font-size: 1.2rem;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	-ms-flex-flow:row wrap;
	flex-wrap: wrap;
}	
	
}


@media screen and (max-width: 480px) {

.billboard{
	margin: 0;
}	

.billboard .inner h2{
	font-size: 3.0rem;
}	
	
.breadcrumb{
	width: 96%;
	height: auto;
    margin: 0 auto;
    padding: 4% 0;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
}
	
.breadcrumb ul{
	width:100%;
	margin: 0;
}	
	
.breadcrumb ul li{
	white-space: nowrap;
}
	
.content_wrap{
	display: block;
}	
	
.sub{
	display: none;
}	
	
.main_content{
	width:100%;
}
	
.pagelink{
	padding: 10px 10px 0 10px;
}	
	
.btn{
	width:90%;
}	
	
.product_list .body{
	display: block;
}
	
.product_list .pic_box,
.product_list .txt_box{
	width:100%;
}	
	
.product_list .pic_box{
	margin: 0 0 15px;
}
	
.pagelink02{
	margin: 0 0 30px;
}

.pagelink02 ul{
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	font-size: 1.2rem;
}

.pagelink02 ul li{
	margin: 0 15px 10px 0;
	padding: 0;
}
	
.column{
	display: block;
	border: none;
	margin: 0;
	padding: 0;
}	
	
.column .column_box{
	width:100%;
	margin: 0 0 30px;
}	
	
	.product_table th{
		white-space: nowrap;
	}	
	
}