@charset "utf-8";

html {
  font-size: 10px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "YuGothic", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 500;
  overflow-y: scroll;
}

@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, html {font-family: "Meiryo";} /* IE11 */
}

body {
  /*overflow: hidden;*/
  width: 100%;
  background: #dcdcdc url(../img/001.jpg) no-repeat;
  background-blend-mode: multiply;
  /*background-position: -3100px -1150px;*/
  background-position: top -100px right 0px;
  /*background-position: 2080px 2400px;*/
  padding: 20px;
  border-top: solid 1px gray;/*ブラウザ境界線*/
  color: #333333;
}

.list_text {color: #333333;}

#container {
/*  display: flex;*/
  width: 100%;
}

#header_wrap_v {
  min-width: 800px;
  /*display: flex;*/
  box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2);
}

#header_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  white-space: nowrap;
  flex-wrap: wrap;
  padding: 10px 20px 10px 20px;
  background-color: white;
  /*border-bottom: solid 1px lightgray;*/
}

#header_wrap h2 {
  width: 100%;
  margin-bottom: 10px;
  font-size: 1.2rem;
  font-weight: 500;
}

h1 {
  text-indent: -999em;
  /*background-color: white;*/
}

h1 a {
  display: block;
  width: 266px;
  height: 45px;
  background: url(../img/logo_01.jpg) no-repeat;
}

header {
  /*width: 40%;*/
  display: flex;
  justify-content: flex-end;
  /*border: solid 1px gray;*/
  /*box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2);*/
}

header address,
#mail_top {
  font-style: normal;
  font-size: 3.0rem;
  font-weight: 700;
  color: #66cc00;
  /*text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.6);*/
}

#mail_top {display: flex;
  /*padding-left: 100px;*/}

nav {border-top: solid 3px #66cc00;}

nav ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  background-color: white;
  /*border-radius: 10px;*/
  text-align: center;
  /*box-shadow: 5px 5px 5px 5px rgba(0,0,0,0.3);*/
  font-size: 1.6rem;
  font-weight: 700;
  white-space: nowrap;

}

nav li {
  flex: 1;
  padding: 10px;
  /*border-top: solid 1px lightgray;*/
  /*background: linear-gradient(white 60%, #efefef);*/
}

#slogan {
  padding: 150px 100px 150px 100px;
  color: white;
  text-shadow: 0px 0px 2px rgba(0,0,0,1.0);
  font-weight: 700;
  /*box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2);*/
  /*border-bottom: solid 50px white;*/
}

#slogan_01 {
  font-size: 5rem;
}

#slogan_02 {
  margin-top: 20px;
  /*margin-left: 20px;*/
  font-size: 1.8rem;
  line-height: 1.5em;
}


#contents_wrap {
  width: 100%;
  display: flex;
  padding: 50px 50px 50px 50px;
  background-color: white;
  /*box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2)*/;
}

#sidebar {width: 25%;
  padding-right: 50px;
  /*overflow: auto;*/
}

#sidebar ul {
  position: sticky;
  top: 0px;
  width: 100%;
  /*padding-left: 5px;*/
  /*white-space: nowrap;*/
  box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.4);
}

#sidebar li {
  /*box-sizing: border-box;*/
  /*display: block;*/
  width: 100%;
  /*margin-left: 5px;*/
  border-left: solid 3px #66cc00;
  font-size: 1.6rem;
  padding: 20px;
  /*background: linear-gradient(white 60%, #efefef);*/
  font-weight: 700;
}

/*#sidebar a {display: block;}*/

/*#sidebar li:hover {background-color: #66cc00;}*/

#contents_main {width: 75%;}

#corporate {

}

#corporate h2,
#products h2,
#access h2,
#contact h2,
#recruit h2 {
  border-left: solid 3px #66cc00;
  /*background: linear-gradient(rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1));*/
  /*background: linear-gradient(white 60%, #efefef);*/
  font-size: 1.6rem;
  font-weight: 700;
  padding: 10px 10px 10px 20px;
  margin-bottom: 50px;
  box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.4);
}

table,
th,
td {
  font-size: 1.6rem;
  border: 1px #a9a9a9 solid;}

table {
  /*width: 100%;*/
  margin-left: auto;
  margin-right: auto;  
  background-color: white;
  line-height: 1.5em;
}

td {width: 70%;}

th,
td {padding: 20px;}

th {
  background-color: #f5f5f5;
}

#products,
#access {
  margin-top: 50px;
  font-size: 1.6rem;}

#products_img_wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 50px 50px 0 50px;}

#products p {padding-left: 50px;}

#access {padding-bottom: 30px;}
#access dl {padding-left: 50px;}
#access dt {
  margin-bottom: 20px;
  font-weight: 700;
  color: #006400;
  display: list-item;
  list-style-type: square;
}
#access dd {margin: 20px 0px 20px 50px;}

#contact p {
  color: #006400;
  margin: 0 0 20px 50px;
  display: list-item;
  list-style-type: square;
}

#contact p,
#contact dl,
#recruit p {font-size: 1.6rem;}

#contact dl {
  border: solid 1px lightgray;
  line-height: 2em;
  margin: 0 50px 0 50px;
  padding: 20px 0 20px 40px;
}
#contact dt {font-weight: 500;}
#contact dd {margin-left: 20px;}



footer {
  padding: 20px;
  background-color: #006400;
  color: white;
  /*border-top: solid 5px #66cc00;*/
  box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.2) inset;
  text-shadow: 0px 0px 1px rgba(0,0,0,0.6);
}

footer ul {
  display: flex;
  justify-content: space-around;
  flex-flow: wrap;
  font-size: 1.6rem;
  padding-bottom: 20px;
  border-bottom: solid 1px rgba(0,0,0,0.1);
}

/*footer address*/

#address_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 1.5em;
  font-size: 1.6rem;
  padding: 20px 0 20px 30px;
  border-bottom: solid 1px rgba(0,0,0,0.1);
  /*text-align: right;*/
}

footer small {
font-size: 1.2rem;
display: block;
width: 100%;
text-align: right;
margin-top: 20px;}

#footer_wrap {box-shadow: 0px 0px 0px 1px rgba(0,0,0,0.2);}