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

img {
  max-width: 100%;
  height: auto;
}

#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 ;
}

/* --- 修正箇所 1：footer全体の枠 --- */
.footer {
	margin: 50px auto 20px; /* 左右をautoにすることで中央寄せになります */
	text-align: center;
	font-size: 12px;
	width: 100%; /* 幅を画面いっぱいに確保 */
}

/* --- 追加箇所：ulタグの余白リセット --- */
.footer ul {
    padding: 0;
    margin: 0;
}

/* --- 修正箇所 2：リストの中身 --- */
.footer ul li {
    /* float: left; ←元の記述（これが左寄せの原因） */
    display: inline-block; /* 横並びのまま、文字と同じように中央揃えに従う設定に変更 */
    padding: 0 20px;
	border-left: 1px solid #999;
}

/* （微調整）一番左の項目の「左側の線」を消すとより綺麗です */
.footer ul li:first-child {
    border-left: none;
}

.clear {
	clear:both;
}

.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;}

/* NEWS
=========================================================== */
/* NEWSセクション全体を囲む部分 */
#news-section {
  width: 90%;          /* スマホなどでは画面の90%の幅にする（左右に適度な余白ができる） */
  max-width: 1000px;   /* PCなどで広がりすぎないように最大幅を決める */
  margin: 0 auto;      /* 【重要】これで左右均等になり、中央寄せになります */
  padding: 20px 0;     /* 上下の余白（お好みで調整） */
}

#news-section h2 {
  font-size: 40px;      /* 文字サイズを大きく（お好みで30px〜50px等に調整してください） */
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif; /* 明朝体の指定 */
  text-align: center;   /* タイトル文字を中央揃えにする */
  margin-bottom: 30px;  /* 下のリストとの余白 */
  font-weight: normal;  /* 明朝体の繊細さを出すために太字を解除（お好みで削除可） */
}

/* --- 以下は前回のリスト用スタイルのままです --- */
.news-list {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.news-list li {
  border-bottom: 1px solid #ddd;
}

.news-list li a {
  display: flex;
  align-items: flex-start;
  padding: 15px 0;
  text-decoration: none;
  color: #333;
  transition: background-color 0.3s;
}

.news-list li a:hover {
  background-color: #f9f9f9;
}

/* 日付のスタイル */
.news-date {
  width: 150px;         
  font-size: 18px; 
  flex-shrink: 0;
  font-weight: bold;
  color: #666;
}

/* タイトルのスタイル */
.news-title {
  font-size: 18px;
  width: 100%;
  line-height: 1.6;
}

/* --- スマホ向け調整 --- */
@media screen and (max-width: 768px) {
  .news-list li a {
    display: block; /* 縦並びにする */
  }
  
  .news-date {
    width: 100%;
    margin-bottom: 5px;
  }
}

/* ヘッダー全体を位置の基準にする設定 */
.header {
  position: relative;
}

/* 英語リンクを右側に配置する設定 */
.enlink {
  position: absolute;
  right: 20px;
  margin: 0;
  font-weight: bold;
}


/* 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; }