/***** PC用のデザインCSS *****/
@charset "UTF-8";
body {
  font: 100%/1.4 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background-color: #ffffff;
  margin: 0;
  padding: 0;
  color: #666666;
}

/* エレメント / タグセレクター */
ul, ol, dl { 
/* ブラウザー間の相違により、リストの余白とマージンをゼロにすることをお勧めします。一貫性を保つために、量をここで指定するか、リストに含まれるリスト項目 (LI、DT、DD) で指定できます。より詳細なセレクターを記述しない限り、ここで指定する内容が .nav リストにも適用されることに注意してください。 */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;
/* 上マージンを削除すると、マージンを含む div からマージンがはみ出す場合があるという問題を回避できます。残った下マージンにより、後続のエレメントからは離されます。 */
	padding-right: 15px;
	padding-left: 15px;
 /* div 自体ではなく div 内でエレメントの両側に余白を追加すると、ボックスモデル計算が不要になります。代わりに、両側に余白を指定した div をネストして使用することもできます。 */
}

a img { /* このセレクターは、一部のブラウザーでイメージをリンクで囲んだ場合にイメージの周囲に表示される初期設定の青いボーダーを削除します。 */
	border: none;
}

/* サイトのリンクのスタイル付け */
a:link {
	color: #666666;
	text-decoration: none;
}

/*a:visited {
	color: #4fb74c;
	text-decoration: none;
}*/

a:hover, a:active, a:focus {
	text-decoration: underline;
}

a .hover_img{
  transition:all 0.8s ease; /*0.5秒かけて要素を変化させる*/
}

/* マウスオーバーで要素変化 */
a:hover {
  transition:all 0.8s ease; /*0.8秒かけて要素を変化させる*/
  filter: alpha(opacity=30);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=30)";  /* ie 8 */
  -moz-opacity:0.3;                 /* FF lt 1.5, Netscape */
  -khtml-opacity: 0.3;              /* Safari 1.x */
  opacity:0.3;
}


/* ~~ この固定幅コンテナが他の div を囲みます。~~ */
.container {
  width: 1000px;
  margin: 0 auto; /* レイアウト中央揃え */
}


/***** 共通ヘッダーここから *****/
.header {
  width: 100%;
  margin: 0;
  /*background-color: #ccccff;*/
}
.sitename {
  width: 100%;
  height: 120px;
  padding: 20px;
  font-size: 3em;
}

.head01 {
  height: 120px;
}



/* メニュー */
nav{
  letter-spacing: -0.4em;
  font-weight: 700;
  font-size: 1.2em;
}

nav ul{
    padding: 0px; 	
    margin: 0px;
}

nav ul li {
  color: #666666;
  display: inline-block;
  width: 24.5%;
  height: 60px;
  letter-spacing: normal;
}

nav li+li {
  border-left: solid 1px rgba(175,212,89,0.5);
}

nav ul li > li2 {
  color: #666666;
  display: table;
  text-align: center;
  line-height: 60px;
  width: 100%;
  height: 60px;
/*  padding-top: 30px;*/
  background: -moz-linear-gradient(top,rgba(175,212,89,0.1),rgba(175,212,89,0.5),rgba(175,212,89,0.5)); /* Firefox用 */   
  background: -o-linear-gradient(rgba(175,212,89,0.1),rgba(175,212,89,0.5),rgba(175,212,89,0.5)); /* Opera */ 
  background: -webkit-gradient(linear,left top,left bottom,from(rgba(175,212,89,0.1)),color-stop(70%,rgba(175,212,89,0.1)),to(rgba(175,212,89,0.5))); /* Safari,Google Chrome用 */ 
}


.contents {
  width: 700px;
  padding: 10px;
  color: #ffffff;
  font-size: 1.2em;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/***** 共通ヘッダーここまで *****/

/***** 共通フッターここから *****/
.footer {
  width: 100%;
  padding: 20px;
}

.footer_box {
  width: 100%;
  padding: 0;
}


.footer_link {
    position: relative;
}
.footer_km {
    position: absolute;
    left: 350px;
    top: 20px;
}

.footer_kz {
    position: absolute;
    left: 100px;
    top: 230px;
}

.footer_k2 {
    position: absolute;
    left: 580px;
    top: 230px;
}

.footer_text {
  position: absolute;
  bottom: 20px;
  margin: 20px 100px;
}


#copyright {
  padding: 0;
  text-align: center;
  font-size: 0.8em;
}

/***** 共通フッターここまで *****/


/**** トップページここから ****/
.top_news {
  padding: 40px 160px;
}

.top_news p {
  font-size: 1.4em;
  font-weight: 700;
  padding: 0px;
  margin: 0px;
}

#news_text {
  padding: 20px;
  border-style: solid;
  border-color: #afd459;
  height: 120px;
  overflow-y: scroll;
}

#news_text hr {
  border-top: 1px dotted #8c8b8b;
}


/* スライダー 20180326追加 */ 
#css-slider { 
width: 1000px; 
height: 512px; 
overflow: hidden; 
} 
  
.slide-item { 
width: 1000px; 
height: 512px; 
float: left; 
position: relative; 
} 
  
  
.slider-wrapper { 
width: 300%; 
position: relative; 
left: 0; 
will-change: transform; 
animation: slider 15s infinite; 
} 
  
@keyframes slider { 
  0% { transform: translateX(0); } 
  50% { transform: translateX(-1000px); } 
  100% { transform: translateX(0); } 
} 

/* スライダー 20180326ここまで */ 





/**** トップページここまで ****/

/**** 会社概要ページここから ****/
.about_company {
  padding: 40px 160px;
}

.about_company p {
  font-size: 1.4em;
  font-weight: 700;
  padding: 0px;
  margin: 0px;
  border-bottom: solid 2px #afd459;
}

.about_company_in {
  padding: 20px;
}

.about_company_in th {
  width: 140px;
  padding: 10px;
  text-align: left;
  vertical-align: top;
}
.about_company_in td {
  padding: 10px;
  text-align: left;
  vertical-align: top;
}

.about_tbl_ub {
  border-bottom: solid 1px #afd459;
}
/**** 会社概要ページここまで ****/


/**** 製品情報ページここから ****/

.prot_data {
  width: 900px;
  padding: 10px 50px;
  display: flex;
  flex-wrap: wrap;  /* 子要素の折り返し */
  background-color: #ffffff;
}

.prot_data > span {
  font-size: 1.8em;
  line-height: 1.5em;
  font-weight: bold;
}


.prot_data_in {
  padding: 0px 0px 0px 0px;
}

.prot_data_in > span {
  font-size: 1.2em;
  line-height: 1.2em;
  font-weight: bold;
}

.prot_tbl {
  width: 100%;
  margin: 0px 0px 50px 0px;
  padding: 0;
  text-align: left;
  background-color: #fff;
  font-size: 0.9em;
  line-height: 120%;
  border: solid 2px #afd459;
  border-collapse: collapse;
}

.prot_tbl td {
  text-align: left;
  padding: 4px;
  border: solid 1px #afd459;
  border-collapse: collapse;
}

.prot_tbl td span {
  font-size: 0.8em;
  font-weight: 300;
}


/**** 製品ページここまで ****/

/***** 問い合わせページ ここから *****/
.mail_box_title {
  font-size: 2.5em;
  text-align: left;
}

.mail_box {
  width: 800px;
  margin:0 auto;
  text-align: left;
  padding: 10px;
  background-color: #fff;
  line-height: 180%;
}

.mail_box p {
  border-left: outset 10px #4fb74c;
  border-bottom: inset 2px #4fb74c;
  font-size: 1.6em;
  line-height: 200%;
}

.mail_box_in {
  margin: 20px;
}

.mail_form_tbl {
  width: 780px;
  margin: 0;
  text-align: left;
  background-color: #fff;
  font-size: 1em;
  line-height: 120%;
}

.mail_form_tbl th {
  width: 200px;
  text-align: left;
  padding: 18px;
  background-color : #afd459;
}

.mail_form_tbl th span {
  color: #ff0000;
  font-size: 0.8em;
  font-weight: normal;
}

.mail_form_tbl td {
  text-align: left;
  padding: 18px;
}

.mail_form_tbl td span {
  font-size: 0.8em;
  font-weight: 300;
}



/* テキストボックスのデザイン */
.mail_form_tbl td input[type="text"] {
  width:400px;
  height:40px;
  margin: 0px;
/*  padding: 4px 10px;*/
  padding: 2px 10px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 1.1em;
}

/* テキストエリアのデザイン */
.mail_form_tbl textarea {
  width:400px;
  height:80px;
  margin: 0px;
  padding: 4px 10px;
  border-radius: 4px;
  border: 1px solid #ccc;
  vertical-align: top;
  text-wrap:normal;
  white-space: pre-wrap;
  font-size: 1.1em;
}

/* チェックボックスのラベルのデザイン */
.cr_parts {
  font-size: 1.2em !important;
  position:relative;
  padding-left: 4px;
  margin-right: 20px;
  vertical-align: middle;
  cursor: pointer;
}

p.privacy {
  font-size: 0.9em;
  border: 0;
  line-height: 1em;
  padding: 0.5em;
}

p.privacy a {
  color: #aa6666;
  text-decoration: underline;
}

/* 仮に入れたテキストの装飾 */
:placeholder-shown {
    color: #aaaaaa;
}
/* Google Chrome, Safari, Opera 15+, Android, iOS */
::-webkit-input-placeholder { 
    color: #aaaaaa;
}

/* Firefox 18- */
:-moz-placeholder {
  color: #aaaaaa;
  opacity: 1;
}

/* Firefox 19+ */
::-moz-placeholder {
  color: #aaaaaa;
  opacity: 1;
}

/* IE 10+ */
:-ms-input-placeholder {
  color: #aaaaaa;
  opacity: 1;
}

/* 送信ボタンのデザイン ここから */
.mail_form_button {
  height: 3em;
  margin: 0 1em;
  padding: 0 2em;
  background-color: #4fb74c;
  color: #ffffff;
  font-size: 1.2em;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  border-style: none;
}


.mail_form_button:hover {
  transition:all 0.8s ease; /*0.8秒かけて要素を変化させる*/
  filter: alpha(opacity=30);        /* ie lt 8 */
  -ms-filter: "alpha(opacity=30)";  /* ie 8 */
  -moz-opacity:0.3;                 /* FF lt 1.5, Netscape */
  -khtml-opacity: 0.3;              /* Safari 1.x */
  opacity:0.3;
  cursor: pointer;
}

/* 送信ボタンのデザイン ここまで */


.thanx_text {
  margin: 100px 140px;
  padding: 10px;
  top: 5em;
  line-height: 1.5em;
  text-align: center;
}

.thanx_text span {
  font-size: 2em;
  font-weight:bold;
}

/***** お問い合わせページ ここまで *****/

/***** 個人情報ページ ここから *****/
.privacy_title {
  font-size: 2.5em;
  text-align: left;
}

.privacy_box {
  width: 800px;
  margin:0 auto;
  text-align: left;
  padding: 10px;
  background-color: #fff;
  line-height: 180%;
}

.privacy_box p {
  border-left: outset 10px #4fb74c;
  border-bottom: inset 2px #4fb74c;
  font-size: 1.6em;
  line-height: 200%;
}

.privacy_box_in {
  margin: 30px;
}

.privacy_box_in ul {
  font-weight: 900;
  padding-top: 1.5em;
}

.privacy_box_in li {
  list-style-type: none;
  line-height: 1.1em;
}



/***** 個人情報ページ ここまで *****/