@charset "utf-8";

/* スマートフォン向けレイアウト */

/** body */
body {
  width: 100%;
  background-color: #FFFFFF;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #000000;
}

a {
  color: #000000;
  text-decoration: none;
}

a:hover {
  color: #333333;
  text-decoration: underline;
}

.redlink a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #FF3333;
}

.redlink2 a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #F25A5D;
}

.orangelink a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #F78225;
}

.orangelink2 a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #FDA900;
}

.yellowlink a:hover {
  color: #000000;
  text-decoration: none;
  background-color: #fdf5ce;
}

.yellowlink2 a:hover {
  color: #000000;
  text-decoration: none;
  background-color: #FCE23F;
}

.greenlink a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #2EA46D;
}

.greenlink2 a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #B7D11A;
}

.bluelink a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #005BA0;
}

.bluelink2 a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #419BD0;
}
  
.bluelink3 a:hover {
  color: #000000;
  text-decoration: none;
  background-color:lightblue;
}

.purplelink a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #8C3C85;
}

.purplelink2 a:hover {
  color: #FFFFFF;
  text-decoration: none;
  background-color: #B271A7;
}  

/** ヘッダー */
header {
  text-align: center;
  position: relative;
  overflow: hidden;
}

header h1 {
  margin: 0 auto;
  padding: 15px 5px 7px 5px;
  width: 90%;
}

header h1 img {
  width: 100%;
  max-width: 400px;
}

header ul#s_nav {
  margin-bottom: 15px;
  position: relative;
  left: 50%;
  float: left;
}

header ul#s_nav li {
  float: left;
  position: relative;
  left: -50%;
}

header ul#s_nav li a {
  display: block;
  font-size: 0.8em;
  margin-right: 20px;
  padding-left: 20px;
}

header ul#s_nav li.contact a {
  background: url(../../images/icn_contact.png) no-repeat left center;
  margin-top: 8px;
}

header ul#s_nav li.news a {
  background: url(../../images/icn_news.png) no-repeat left center;
  color: #FF0000;
  margin-top: 8px;
}

header ul#s_nav li.sitemap a {
  background: url(../../images/icn_sitemap.png) no-repeat left center;
  margin-top: 8px;
}

header ul#s_nav li.topbanner a img {
  width: auto;
  height: 24px;
  vertical-align: middle;
}

header p {
  width: 100%;
}

header p img {
  width: 100%;
  height: auto;
  max-width: 960px;
}

/** グローバルナビゲーション */
#nav {
  display: none;
}

/** グローバルナビゲーション2 */
#nav2 {
  display: none;
}

/** グローバルナビゲーション3 */
#nav3 {
  display: block;
}

#nav3 ul {
  margin-bottom: 0;
}

#nav3 ul li.parent {
  text-align: center;
  float: left;
  width: 50%;
  border-bottom: 3px double #000000;
}

#nav3 ul li.parent:nth-child(odd) {
  width: 49%;
  border-right: 1px dotted #000000;
}

#nav3 ul li.parent a{
  display: block;
  width: 100%;
  margin: 3px auto;
}

/** コンテンツエリア */
div#contents {
  padding-bottom: 40px;
}

div#contents section#topimage p {
  width: 100%;
  padding: 15px 0;
}

div#contents section#topimage p img {
  width: 100%;
  height: auto;
  max-width: 960px;
  max-height: 480px;
}

div#contents section#link h2 {
  margin: 10px 5px 15px 0;
  background: url(../../images/bg_headerLine2.png) repeat-x bottom;
  padding-bottom: 10px;
}

div#contents section#link ul li {
  line-height: 2.5em;
  list-style-type: disc;
  margin-left: 20px;
}

/** WORKS */
div#contents section#work h2 {
  margin: 0 0 15px 5px;
}

div#contents section#work article {
  text-align: center;
  width: 50%;
  min-width: 120px;
  float: left;
  margin-bottom: 30px;
}

div#contents section#work article img {
  width: 100%;
  height: auto;
  max-width: 184px;
}

div#contents section#work article h3 {
  font-size: 0.9em;
  font-weight: bold;
}

div#contents section#work article p {
  text-align: left;
  font-size: 0.7em;
  line-height: 2.0em;
  padding: 0 15px;
}

/** NEWS */
div#contents section#news, div#contents section#news2 {
  margin-left: 5px;
}

div#contents section#news h2, div#contents section#news2 h2 {
  margin: 0 5px 15px 0;
  background: url(../../images/bg_headerLine2.png) repeat-x bottom;
  padding-bottom: 10px;
}

div#contents section#news article h3, div#contents section#news2 article h3 {
  font-size: 0.8em;
  margin-bottom: 10px;
}

div#contents section#news article h3 span, div#contents section#news2 article h3 span {
  background-color: #ffffff;
  padding: 2px 5px;
  border-radius: 2px;
  color: #000000;
}

div#contents section#news article h3.greenheader span{
  background-color: #2EA46D;
  padding: 2px 5px;
  border-radius: 2px;
  color: #ffffff;
}

div#contents section#news article p, div#contents section#news2 article p {
  line-height: 1.4em;
  font-size: 0.8em;
  margin: 0 0 20px 10px;
}


div#contents section#news article table, div#contents section#news2 article table {
  line-height: 1.4em;
  font-size: 0.8em;
  margin: 0 0 20px 10px;
}

div#contents section#news article td a, div#contents section#news2 article td a {
  text-decoration: underline;
}

div#contents section#news article td a:hover, div#contents section#news2 article td a:hover {
  text-decoration: none;
}

/** カテゴリーエリア */
.categoryarea {
  max-width: 120px;
  padding-right: 10px;
  vertical-align: middle;
}

.categoryarea span {
  border-radius: 3px;
  padding: 3px;
}

/** リンクカラー */
.color0 {
  color: #FFFFFF;
  background-color: #2EA46D;
}

.color1 {
  color: #FFFFFF;
  background-color: #FF3333;
}

.color2 {
  color: #FFFFFF;
  background-color: #F78225;
}

.color3 {
  color: #FFFFFF;
  background-color: #005BA0;
}

.color4 {
  color: #FFFFFF;
  background-color: #8C3C85;
}

.color5 {
  color: #FFFFFF;
  background-color: #F25A5D;
}

.color6 {
  color: #FFFFFF;
  background-color: #FDA900;
}

.color7 {
  color: #FFFFFF;
  background-color: #B271A7;
}

.color8 {
  color: #FFFFFF;
  background-color: #B7D11A;
}

.color9 {
  color: #000000;
  background-color: #FCD900;
}

.color10 {
  color: #FFFFFF;
  background-color: #419BD0;
}

.color11 {
  color: #000000;
  background-color: #fdf5ce;
}

.color12 {
  color: #000000;
  background-color: lightblue;
}

/** INFORMATION */
div#contents section#information {
  text-align: center;
  margin-left: 5px;
}

div#contents section#information h2 {
  text-align: left;
  margin: 0 5px 15px 0;
  background: url(../../images/bg_headerLine2.png) repeat-x bottom;
  padding-bottom: 10px;
}

div#contents section#information ul li {
  width: 100%;
  margin-bottom: 5px;
}

div#contents section#information ul li img {
  width: auto;
  height: auto;
  max-width: 200px;
}

div#contents section#information div {
  text-align: left;
}

div#contents section#information article h3 {
  font-size: 0.6em;
  margin-bottom: 10px;
}

div#contents section#information article h3 span {
  background-color: #2EA46D;
  padding: 2px 5px;
  border-radius: 2px;
  color: #ffffff;
}

div#contents section#information article p {
  line-height: 1.4em;
  font-size: 0.7em;
  margin: 0 0 20px 10px;
}

div#contents section#information article p a {
  text-decoration: underline;
}

div#contents section#information article p a:hover {
  text-decoration: none;
}

/** カテゴリーリンク */
#categorylink {
  margin: 20px 0;
}

#categorylink li {
  float: left;
  width: 30%;
  text-align: center;
  margin-bottom: 20px;
  margin-right: 10px;
  padding: 5px 0;
  border-radius: 2px;
  font-size: 0.9em;
}

#categorylink a {
  color: #FFFFFF;
}

#categorylink .color9 a {
  color: #000000;
}

#categorylink .color11 a {
  color: #000000;
}

#categorylink .color12 a {
  color: #000000;
}

/** ページトップへボタン */
div#iconarea {
  display: none;
}

div#iconarea2 {
  display: none;
}

/** ページトップへボタン */
a#pagetopBtn img {
  position: fixed;
  bottom: 10px;
  right: 1px;
}

/** フッター */
footer {
  border-top: 10px solid #2EA46D;
}

footer div {
  margin: 20px 0 0 20px;
}

footer div p {
  font-size: 0.7em;
  line-height: 2.0em;
}

footer div small {
  font-size: 0.6em;
}

footer div img {
  width: 98%;
  height: auto;
  max-width: 250px;
  margin: 8px 5px;
}