@charset "UTF-8";
/* カラー一括変更 */
a:link,a:visited{
  color: #ff6666;
}
a:hover,a:active{
  color: #ffaaaa;
}
#feed li a{
  color: #333333;
}
#feed li a:hover,#feed li a:active{
  color: #ffaaaa;
}
.hako{
  border-color: #e1e1e1;
/* color 一括変更 */
}
.big-table{
  border-color: #cc0000;
/* color 一括変更 */
}
.dtable div.cell-1{
  border-color: #cc0000;
  /* color 一括変更 */
  background-color: #ffd5aa;
/* color 一括変更 */
}
.dtable div.cell-2{
  border-color: #cc0000;
/* color 一括変更 */
}
.nav-menu-button{
  border-color: #cccccc;
/* color 一括変更 */
}
.nav-menu-button:hover{
  background-color: #eeeeff;
/* color 一括変更 */
}
#suma-nav-left{
  background-color: #666666;
/* color 一括変更 */
}
#suma-nav-right{
  background-color: #666666;
/* color 一括変更 */
}
#slidetoggle_menu dl dd p{
  border-color: #666666;
/* color 一括変更 */
}
#top-gazou{
  background-color: #f4f4f4;
/* color 一括変更 */
}
.top-gazou-hako{
  color: #333333;
/* color 一括変更 */
}
#aside dl dt{
  background-color: #800000;
/* color 一括変更 */
}
#aside dl dd p{
  border-color: #800000;
/* color 一括変更 */
}
#aside dl dd p a:hover{
  color: #ffcc00;
/* color 一括変更 */
}
.footer-copy{
  background-color: #aaaaaa;
/* color 一括変更 */
}
#footer p a:hover{
  color: #555555;
/* color 一括変更 */
}
#page-top a{
  background-color: #550000;
/* color 一括変更 */
}
#page-top a:hover{
  background-color: #ff9900;
/* color 一括変更 */
}
#feed-title{
  color: #666666;
/* color 一括変更 */
}
/* カスタム */
/* same-1:ページ下部の部分 */

/* 背景 */
#top-gazou{
  background-image: url(top-gazou-back.jpg);
  background-size: cover;
  background-position: 50% 50%;
}
#top-gazou2{
  background-image: url(top-gazou-back2.jpg);
  background-size: cover;
  background-position: 100% 30%;
}
body{
  background-image: url(body-back.jpg);
  background-attachment: fixed;
  /* 複雑な画像１枚で全体をカバーするとEDGEでカクカクするので、一枚でカバーする場合は背景はなるべくシンプルに */
  background-position: 100% 0%;
}
#inner{
  background-image: url(inner-back.jpg);
  background-attachment: fixed;
  /* 複雑な画像１枚で全体をカバーするとEDGEでカクカクするので、一枚でカバーする場合は背景はなるべくシンプルに */
  background-position: 100% 0%;
}
#aside dl dt{
  background-image: url(aside-back.jpg);
}
.hako-big{
  background-attachment: fixed;
  background-position: 100% 0%;
}
#footer{
  background-image: url(footer-back.jpg);
  background-attachment: fixed;
  background-position: 100% 0%;
}
#suma-nav-left{
  background-image: url(suma-nav.jpg);
}
#suma-nav-right{
  background-image: url(suma-nav.jpg);
}
/* pc-nav */
#pc-nav{
  text-align: center;
  background-image: url(menu.jpg);
  margin: 0px;
}
.dropmenu li{
  width: auto;
  height: auto;
  float: none;
  display: inline-block;
  background-image: url(menu.jpg);
  /* 背景を指定しないとIEで子要素をhoverできない */
  vertical-align: bottom;
/* 余白防止用 */
}
.dropmenu li{
  border-width: 0px 0px 0px 1px;
  border-style: solid;
  border-color: #660000;
}
.dropmenu li:last-child{
  border-right: solid 1px #660000;
}
.dropmenu li a{
  display: block;
  color: #333333;
  text-decoration: none;
}
.dropmenu li p{
  font-size: 18px;
  font-weight: bold;
  /*   */
  text-shadow: 
    white 1px 1px 10px, white -1px 1px 10px,
    white 1px -1px 10px, white -1px -1px 10px;

  text-align: center;
  padding: 15px 60px;
}
.dropmenu li a p:hover{
  color: #ffcc00;
}
.dropmenu li ul li{
  float: left;
}
.dropmenu li ul li:last-child{
  border-right: solid 0px #660000;
}
.dropmenu li ul li p{
  text-align: left;
  border-width: 1px 1px 0px 0px;
  border-style: solid;
  border-color:#660000;
}
#dropmenu li:hover ul li{
  height: auto;
}
@media screen and (max-width:1080px){
  #pc-nav{
  display:none;
}
#suma-nav{
  display:block;
}
.header-hako{
  padding: 60px 0px 10px 0px;
}
}
/* top-gazou-hako */
.top-gazou-hako{
  padding: 100px 15px;
}
/* top-gazou-midashi */
.top-midashi{
  font-size: 69px;
  color: #ffffff;
  /* */
  text-shadow: 
    brown 1px 1px 10px, brown -1px 1px 10px,
    brown 1px -1px 10px, brown -1px -1px 10px;

}
/* hako */
.hako{
  border-width: 0px;
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
}
/* aside */
#aside dl dd a{
  text-decoration: none;
}
/* 見出し */
.midashi1{
  color: #333333;
  font-size: 15px;
  margin: 0px 5px;
  text-align: left;
}
.midashi2{
  color: #333333;
  margin-bottom: 0px;
  border-bottom-width: 0px;
}
.midashi3{
  color: #333333;
  margin: 10px 0px 20px 0px;
  text-align: center;
  background-image: url(midashi3.jpg);
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
}
.midashi4{
  color: #660000;
  text-align: center;
  display: inline;
  border-bottom: 1px dotted #cccccc;
  margin: 0px 0px 10px 0px;
}
.midashi5{
  font-size: 18px;
  font-weight: bold;
  color: #660000;
  text-align: left;
  display: inline-block;
}
/* スマホの文章を読みやすく */
@media screen and (max-width:768px){
  .hako-little{
  text-align: left;
}
.list-hako-little li.li-25{
  text-align: left;
}
.list-hako-little li.li-33{
  text-align: left;
}
.list-hako-little li.li-50{
  text-align: left;
}
.midashi2{
  text-align: left;
}
.midashi3{
  text-align: left;
}
.midashi4{
  text-align: left;
}
}
/* スマホの文章を読みやすく 以上 */

/* スマホメニュー 下スクロールで隠す */
.hide-slide-btn{
  transition: 0.5s;
  transform: translateY(-70px);
}
/* ＝＝＝＝＝＝＝＝＝＝カスタムスマホ用＝＝＝＝＝＝＝＝＝＝ */
@media screen and (max-width:1080px){
  /* スマホ時のカスタムトップ画像の調整 */
#top-gazou{
  background-position: 50% 50%;
  background-attachment: scroll;
}
#top-gazou2{
  background-position: 50% 50%;
  background-attachment: scroll;
}
body{
  background-attachment: scroll;
}
#inner{
  background-attachment: scroll;
}
.hako-big{
  background-attachment: scroll;
}
#footer{
  background-attachment: scroll;
}
/* スマホ時のIDリンクの調整 */
.suma-link{
  margin-top: -50px;
  /* スマホ時のヘッダー固定分のリンクへのずれをなくす */
  padding-top: 50px;
/* スマホ時のヘッダー固定分のリンクへのずれをなくす */
}
/* トグル(スマホ用メニュー)=メニューの数が6つ以上なら、使わずに#aside-linkにリンク */
/* HTMLですること１：スマホメニューのMENU部分、スマホメニュー右側の<dt>の直後に<a href="#aside-link"><img src="suma-nav-menu-button-right.png" width="68" height="25" alt="menu" class="suma-nav-menu-button-right"></a>入れて、<dd>消えないように<p></p>は消して代わりに<div></div>（中身入れないdiv）を入れる。 */
/* HTMLですること２：#asideの下に<div id="aside-link" class="suma-link"></div>を設置 */
/* #aside-linkを設定するのは、#asideを指定すると#aside本来のmarginとpaddingが塗り替えられてしまうため */
/* CSSでは以下の2項目を設定。 */
#slidetoggle_menu dl dt{
  cursor: default;
}
#slidetoggle_menu dl dt.active{
  background:url("toggle_open.png") 10px 50% no-repeat;
}
/* トグル(スマホ用メニュー)=メニューの数が6つ以上なら、使わずに#aside-linkにリンク 以上 */

/* スマホ時だけasideを表示する */
#main{
  width: 100%;
}
#aside{
  width: 100%;
  display: block;
}
}
/* ＝＝＝＝＝＝＝＝＝＝カスタムスマホ用ここまで＝＝＝＝＝＝＝＝＝＝ */