@charset "UTF-8";
body{ margin:0;padding:0; 
	font-family:"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","メイリオ","Meiryo", sans-serif;
background-color: #ebeaea;
}
#container1 {
	width: 100%;
	text-align: center;
	}
#container2 {
	width: 100%;
	text-align: center;
}

#container_prod {
	text-align: center; 
	width: 980px; 
	height:auto; 
	margin: 30px 30px ; 
}

/*メニューエリア*/
.contents {
  overflow: hidden;
  width: 960px;
  height: auto;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  display: flex;
}
.nav .title {
  display: block;
  width: 200px;
  height: 40px;
  font-weight:bold;
  color: #000;
  font-size: 12px;
  line-height: 3.5;
  padding: 0 15px;
  background: #bbb;
  border-bottom: 1px solid #eee;
  box-sizing: border-box;
  text-decoration: none;
  transition: 0.5s;
}
.nav {
  width: 200px;
  margin: 0;
  padding: 0;
	z-index:10;
     font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
}
.longtx {
  font-size: 10px;
  line-height: 4.6;
}
.nav li {
  position: relative;
  width: 0px;
  height: 40px;
}
.nav > li {
  border-bottom: none;
}
.nav li:last-child {
  border-bottom: none;
}
.nav li:hover > ul > li {
  border-bottom: none;
}
.nav li > ul > li:last-child {
  border-bottom: none;
}
.nav li a {
  display: block;
  width: 200px;
  height: 40px;
  color: #000;
  font-size: 12px;
  line-height: 3.5;
  padding: 0 15px;
  background: #ccc;
  border-bottom: 1px solid #eee;
  box-sizing: border-box;
  text-decoration: none;
  transition: 0.5s;
}
.nav > li:hover > a {/*layer-1*/
  color: orange;
  background: #333;
  transition: 0.5s;
}
.nav > li li:hover > a {/*layer-2*/
  color: olive;
  background: #ccc;
}
.nav li:hover > ul > li {
  overflow: visible;
  top: -40px;
  left: 200px;
  height: 40px;
}
.nav li ul li {
  overflow: hidden;
  height: 0;
  left: 200px;
  list-style: none;
  transition: 0.2s;
}
.nav li ul li a {
  background: #ccc;
  transition: 0.5s;
  opacity:0.95;
}
.nav li ul:before {
  position: absolute;
  content: "";
  top: 14px;
  left: 190px;
  border: 5px solid transparent;
  border-left: 5px solid #fff;
}
.nav li:hover ul li ul li:hover > a {/*layer-3*/
  color: pink;
  background: #afc6e2;
}
.content_sub {
  width: 740px;
  height: auto;
  margin: 0;
  padding: 0 20px;
  text-align: left;
  box-sizing: border-box;
}
.content_1sub {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0 0px;
  text-align: center;
  box-sizing: border-box;
}
/*メニューend*/


/*サムネ*/

.sum {
	width:			215px;
	height:			200px;
	overflow:		hidden;
	margin:			15px 15px;
	position:		relative;
	float: left;
}
.sum .caption {
	font-size:		130%;
	text-align: 		center;
	padding-top:		90px;
	color:			#fff;
}
.sum .mask {
	width:			100%;
	height:			100%;
	position:		absolute;
	top:			0;
	left:			0;
	opacity:		0;
	background-color:	rgba(0,0,0,0.3);
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.sum:hover .mask {
	opacity:		1;
}

.produc{
	padding: 10px 0 0px 15px;
	float: left;
}
/*サムネend*/


.wrapper	{ 
	text-align: left; 
	width: 980px; 
	height:auto; 
	margin: 0 auto; 
}
.header {
	width: 980px;
}
a:hover img {
    opacity: 0.5;
	transition: 0.6s ;
}
.footer {
	margin:50px 0px 20px 300px;
	text-align:center;
	font-size:12px;
	width:900px;
}
.clear {
	clear:both;
}
.footer ul li {
    float: left;
    padding: 0 20px;
	border-left: 1px solid #999
}
.footer a {
	color:#333;
	text-decoration:none;
}

.footer a:hover {
	color:#FF6600;
	text-decoration:none;
}

.box{
	width:100%;
	position:absolute;
	}
.box img { width: 100%; }
.logo{float: left;}
.contact {float: right;}
.content {width: 100%;
margin-top: 20px;}
.content_box {
	float: left;
	width: 50%;}
.news {
	max-width: 1800px;
	text-align: center;
margin: 20px 20px;}
.news img{
	
	width: 100%;
}
.gallery {margin-top: 20px;}

.video { width: 100%; }

/* Company
=========================================================== */
#stage .wrapper	{ text-align:center;}
#stage .wrapper .plofTx	{ text-align: left; margin: 0; padding: 40px 150px 20px; }
#stage .wrapper .plofTx h4	{ font-size: 2em; font-weight: bold; padding: 0 0 15px; }
#stage .wrapper .plofTx h5	{ color: #451111; font-size: 1.5em; font-weight: bold; margin-bottom: 10px; padding: 10px 0; border-bottom: 1px solid #ccc; }
#stage .wrapper .plofTx p	{ padding: 0 0 10px; line-height: 1.6em; }
#stage .wrapper table	{ width:600px; text-align:left; margin: 0 auto; }
#stage .wrapper table tr	{  }
#stage .wrapper table tr th	{ font-size: 110%; font-weight: bold; width: 160px; padding: 30px 3px; border-bottom: 1px solid #ccc; }
#stage .wrapper table tr td	{ font-size: 120%; padding: 30px 3px; border-bottom: 1px solid #ccc; }
#stage .wrapper table tr td span	{ font-size: 90%; }
.companylogo{padding: 30px;}
.companypic{padding-top: 5px;}

/*メニュー*/
*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.menu-container{
    padding-top: 2rem;
}
 
.gnav {
    display: flex;
    height: 4rem;
    margin: 0 auto;
    width: 1000px;
}
.gnav > li {/*親階層のみ幅を25%にする*/
    width: 25%;z-index: 10;
}
/*全てのリスト・リンク共通*/
.gnav li {
    list-style: none;
    position: relative;
}
.gnav li a {
    background: #000;
    border-right: 1px solid #888;
    color: #fff;
    display: block;
    height: 4rem;
    line-height: 4rem;
    text-align: center;
    text-decoration: none;
    width: 100%;
}
/*子階層以降共通*/
.gnav li li {
    height: 0;
    overflow: hidden;
    transition: .5s;
    filter:alpha(opacity=95);
    -moz-opacity: 0.95;
    opacity: 0.95;
}
.gnav li li a {
    border-top: 1px solid #888;
}
.gnav li:hover > ul > li {
    height: 4rem;
    overflow: visible;
}
.gnav li ul li ul {
    left: 100%;
    position: absolute;
    top: 0;
    width: 100%;
}
/*一番右のメニュー*/
.gnav > li:nth-child(5) ul li ul {
    left: -100%;
}
/*aの背景色を指定*/   
.gnav li:hover a {/*親階層*/
    background: #333;
}
.gnav li li a {/*子階層*/
    background: #333;
}
.gnav li li:hover a {
    background: #222;
}
.gnav li ul li ul li a {/*孫階層*/
    background: #333;
}
.gnav li ul li ul li:hover a {
    background: #333;
}
.gnav li ul li ul li ul li a {/*ひ孫階層*/
    background: #333;
}
.gnav li ul li ul li ul li:hover a {
    background: #333;
}
/*リストに「▶︎」を付ける*/
.gnav > li > ul:before{/*子階層*/
    border: 5px solid transparent;
    border-top: 5px solid #fff;
    content: "";
    right: 1rem;
    position: absolute;
    top: 2rem;
    transform: translateY(-40%);
}
.gnav li ul li ul:before {/*孫階層*/
    border: 5px solid transparent;
    border-left: 5px solid #fff;
    content: "";
    left: -20px;
    position: absolute;
    top: 2em;
    transform: translateY(-50%);
}
.gnav li:nth-child(5) ul li ul:before {/*一番右のメニューの孫階層*/
    border: 5px solid transparent;
    border-right: 5px solid #fff;
    left: auto;
    right: -20px;
}
.preparation{margin:200px;}
.preparation p{font-size:20px;}


/* Inquiry
=========================================================== */
#stage .wrapper	{ padding: 40px 0 30px; }
.charge strong	{ color: #333; font-size: 2em; font-weight: bold;float: left; }
ul.inquiry	{ margin-top: 15px; padding: 35px 10px; border-top: 2px solid #666; border-bottom: 2px solid #666;line-height: 2px; }
ul.inquiry	{ color: #333; font-size: 1.5em; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
ul.inquiry li	{ float: left; padding-right: 15px; }
ul.inquiry li strong	{ color: #333; font-size: 1.5em; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }

ul.recruit	{ margin-top: 15px; padding: 35px 10px; border-bottom: 2px solid #666; solid #666;line-height: 2px; }
ul.recruit	{ color: #333; font-size: 1.5em; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }
ul.recruit li	{ float: left; padding-right: 15px; }
ul.recruit li	{ color: #333; font-size: 1.5em; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; }

ul.recruit .mail_0	{ color: #4000ff !important; }