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

/*
display:-webkit-box;display:-ms-flexbox;display:flex;
-ms-flex-wrap: wrap;flex-wrap: wrap;
-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;
-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;
-webkit-box-align: center;-ms-flex-align: center;align-items: center;
*/
ul, li{margin:0px; padding:0px;}
:focus {outline: none;}
section{margin-bottom:80px;}
.inner{width:1000px; margin:0 auto;}
#stage{}
#header{margin-bottom:2px;background-size: cover; background-image:url(../image/mv.jpg); background-repeat:no-repeat; background-position:center center; }
#header .header-inner {width:1000px; margin:0 auto;height: 400px; padding-top:70px;}
#header .header-inner img{}
#header .header-inner h1{color:#FFF; font-size:3.5rem; font-weight:normal; line-height:55px;text-shadow: 0px 0px 5px #000, 0px 0px 5px #000, 0px 0px 5px #000, 0px 0px 5px #000;}
#header .header-inner h1 span{font-size:1.5rem;}
#header .header-inner h1 a{color:#FFF;}
#header .header-inner h1 a:hover{text-decoration:none;}
#header .header-inner p.title{ font-size:3rem;text-shadow: 0px 0px 5px #000, 0px 0px 5px #000, 0px 0px 5px #000, 0px 0px 5px #000;}
#header .header-inner p.title a{color:#FFF; }
#header .header-inner p.title a:hover{text-decoration:none;}
.gnavi {margin:0 auto; background:linear-gradient(90deg,#336699 0%,#336699 50%,#FFF 50%,#FFF 100%); margin-bottom:30px;}
.gnavi .inner{ width:auto;border-radius:0px 0px 80px 0px; background-color:#336699;}
.gnavi ul{display:-webkit-box;display:-ms-flexbox;display:flex; -webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;    min-width: 1100px;}
.gnavi ul li{
	text-align: center;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:40px;
	padding-right:40px;}
.gnavi ul li:last-child{border-right:none;}
.gnavi ul li{color:#FFF;}
.gnavi ul li a{color:#FFF;}

p.lead{margin-top:50px; margin-bottom:50px;}
#main{width:80%; margin:0 auto; padding-bottom:50px;}
#main h2{
	color: #336699;
	text-align: left;
	line-height: 50px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #336699;
	font-weight:bold;
	margin-bottom:40px;

}
#main h2.search{ background-image:url(../image/h2.png); background-repeat:no-repeat; text-align:center; line-height:50px;margin-bottom:10px;background-color:#b9d2ea;}
#main h2.search+p {
	margin: 20px 0;
	text-align: center;
}
#main h3{ background-color:#336699; color:#FFF;display: inline-block; font-weight:normal; padding:5px 10px;margin-bottom:20px;}
#main h4{color:#666666; font-weight:normal; margin-top:30px;}
#main #input-box{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;width: 1000px;
    margin: 30px auto;}
#main #input-box ul{ width:49%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
#main #input-box ul li{ margin-right:5px; margin-bottom:10px;}
#main #input-box ul li.title{width:120px;}
#main #input-box input[type="text"]{
	padding: 5px;
	border-radius: 5px;
	border: 1px solid #CCC;
	width:60px;
	text-align:center;
}
#main #input-box input[type="text"]:focus {
	border: 1px solid #999;
}

#main .btn-decide{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f5b466+0,fff875+100 */
background: #f5b466; /* Old browsers */
background: -moz-linear-gradient(left, #f5b466 0%, #fff875 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #f5b466 0%,#fff875 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #f5b466 0%,#fff875 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5b466', endColorstr='#fff875',GradientType=1 ); /* IE6-9 */
border-radius:25px;
width:270px; margin:0 auto;height:40px;
display:-webkit-box;display:-ms-flexbox;display:flex;
-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;
-webkit-box-align: center;-ms-flex-align: center;align-items: center;
font-size:18px;
font-weight:bold;

}
#main .btn-decide a{display:block; color:#FFF;-moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
-webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
-ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);}

.chart {margin:0 auto; background-color:#CDDDF5; margin-bottom:30px;}
.chart .inner{width:1000px; margin:0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;border-radius:10px 0px 0px 10px; background-color:#CDDDF5; padding:30px 0px;}
.chart .inner .box{width:48%; margin-bottom:20px;}
.chart .inner .box h3{margin:0px; font-size:1.3rem;}
.chart .inner .box img{width:100%; height:auto;}
/*==============================
テーブルスクロール
==============================*/
.scrollArea{white-space: nowrap;overflow:auto; height:600px; margin-bottom:30px;}
/*スクロールバーの横幅指定*/
/*スクロールバーの横幅指定*/
.scrollArea.deco::-webkit-scrollbar { height: 25px;}
/*スクロールバーの背景色・角丸指定*/
.scrollArea.deco::-webkit-scrollbar-track {  border-radius: 10px;	background: #f2f2f2;}
/*スクロールバーの色・角丸指定*/
.scrollArea.deco::-webkit-scrollbar-thumb {  border-radius: 10px;	background:#777;}
/*==============================
table header　固定
==============================*/

.table1 {background-color:#CCFFFF;margin-top:0px;}
.table1 th,.table1 td a{text-decoration:underline;}
.table1 th{
	position: sticky;
	top: 0;
	left: 0;
	color: #fff;
	text-align: center;
	background: #9999CC;
	color: #FFF;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding:5px;
	font-size:0.75rem;
}
.table1 td{border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding-left:10px;
	padding-right:10px;
	padding:5px;
	font-size:0.75rem;
}
.table1 td input[type=checkbox] {
    transform: scale(1.5);
	margin-right:10px;
}
.table1 th.fixed01{
	left: 0px;
	z-index: 3;

}



.table1 td.fixed02{
	left: 0px;
	z-index: 2;
	position: sticky;
	background-color: #9FFFFF;
}
.table1 td.fixed03{
left: 163px;
z-index: 1;
position: sticky;
background-color:#9FFFFF;
}





table {background-color:#CCFFFF; margin-top:20px;}
table th{
	position: sticky;
	top: 0;
	left: 0;
	color: #fff;
	text-align: center;
	background: #9999CC;
	color: #FFF;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding-left:5px;
	padding-right:5px;
	font-size:1rem;
	font-weight:normal;
}
table td{border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding-left:10px;
	padding-right:10px;
	padding-top:10px;
	padding-bottom:10px;
	font-size:1rem;
	text-align:center;
	white-space:nowrap;
	text-align:left;
}
table td input[type=checkbox] {
    transform: scale(1.5);
	margin-right:10px;
}
table th.fixed01{
	left: 0px;
	z-index: 3;

}



table td.fixed02{
	left: 0px;
	z-index: 2;
	position: sticky;
	background-color: #9FFFFF;
}
table td.fixed03{
left: 163px;
z-index: 1;
position: sticky;
background-color:#9FFFFF;
}






table.form {background-color:#e9eaea;}
table.form th{
	position: sticky;
	top: 0;
	left: 0;
	color: #fff;
	text-align: left;
	background: #e9eaea;
	color: #222;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 1rem;
	width:20%;
}
table.form td{border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
	padding-bottom:5px;
	font-size:1rem;
	text-align:left;
}
table.form th input[type=checkbox] {
    transform: scale(1.5);
	margin-right:10px;
}
table.form td textarea{	width: 100%;
	padding-top: 7px;
	padding-right: 5px;
	padding-bottom: 7px;
	padding-left: 5px;
	min-height:100px;
	border:none;

}


table.form td input[type="text"], table.form td input[type="email"]{
	width: 100%;
	padding-top: 7px;
	padding-right: 10px;
	padding-bottom: 7px;
	padding-left: 10px;
	border:none;
}
table.form td input[type="text"].w-20{width:20%;}
/*==============================
資料請求
==============================*/
.product-name{ margin-bottom:40px;}
.product-name ul{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.product-name ul li{
	padding-left: 10px;
	border-left-width: 5px;
	border-left-style: solid;
	border-left-color: #336699;
	margin-right:30px;
	font-size:16px;
}
.button-submit{text-align:center; border-radius:25px; background-color:#336699; color:#FFF; width:300px; margin:0 auto; padding-top:10px; padding-bottom:10px; margin-top:30px;}
.button-submit a{color:#FFF; display:block;}
/*==============================
クラス
==============================*/
.mb5{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.btn-sm{font-size:0.7rem; padding:2px 5px;}
.light-blue{color:#CCCCFF;}

input:invalid {
  border: solid 3px red;
  outline: 0;
}
input[type="number"]{width:100px;}


.flex-2col{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
.flex-2col .box{width:49%;}

.products_check_list {
	height: 380px;
}
.products_check_list tr:not(.on) {
	display: none;
}