@charset"utf-8";

/*=======================================
全般的なスタイル
=======================================*/
* {
          margin:0; padding:0;           /*全要素のマージン・パディングをリセット*/
}
body{
     background-color:#ffcc66;                     /*ページ全体の背景色*/
     background-image:url("images/bg_body.jpg");   /*ウェブページ全体の背景画像*/
     font-size:150%;                          /*フォントサイズを120%にする*/ 
     font-family: 'Georgia','Trebuchet MS','MS PGothic',sans-serif;   /* フォントの種類 */
     line-height:1.5;                         /*行の高さを1.5倍にする*/
     color:#333333;                           /*文字色を濃い目のグレーにする*/ 
}
div#pagebody{
            width:1000px; margin:0 auto;    /*内容全体をセンタリング*/
            background-color:#ffffee;       /*内容全体の背景色*/
            background-image:url("images/page-body.jpg");
            background-repeat:repeat;
}
div#pagebody1{
            width:1000px; margin:0 auto;    /*内容全体をセンタリング*/
            background-color:#ffffee;       /*内容全体の背景色*/
            background-image:url("images/page-body1.jpg");
            background-repeat:repeat;
}
img {border:0;}        /*画像のボーダーを0にする*/

p {
     width:660px;      /*幅の指定*/
     margin:10px;      /*マージン*/
     text-indent:1em;  /*インデント幅*/
}


/*==================================
ヘッダ
==================================*/

h1 {
          width:990px; height:250px;
          margin-bottom:10px;
          padding:10px 0 0 10px;     /*見出しの位置調整*/
          font-style:italic;   /*フォントの種類*/
          background-image:url(images/header.PNG);    /*背景画*/
          background-repeat:no-repeat;
          font-size:90px; 　                     /*フォントのサイズ*/
          color:#660099;                         /*文字色*/
          line-height:88px; 
}

h1 a {text-decoration:none;      /*リンクの下線を無くす*/}

h1 p {
          text-align:right;
          padding:60px 0 0 180px;
          font-size:55px;
         font-style:italic;
          color:#4400cc;
}

h1 a:hover { color:#9933cc; }
	
/*==================================
メインメニュー
==================================*/

ul.ddmenu{
        width:960px;height:50px;     /*メインメニュー部分の幅と高さ*/
        margin:30px 20px 10px 20px;               /*マージン*/
}
ul.ddmenu li{
        font-size:100%;			/*フォントサイズ*/
        list-style-type:none;     /*リストマーカー無しにする*/
        display:inline;           /*リスト項目をインライン表示にする*/
        float:left;               /*リスト項目を横に並べる*/
        position:relative;
}
ul.ddmenu a{
          background-color:#ffff00;    /*背景色*/
          color:#ffffff;            /*文字色*/  
          display:block;            /*リンク部分をブロック表示にする*/
          width:240px;height:35px;  /*幅と高さ*/
          padding:5px 0 ;            /*パディング*/
          text-align:center;        /*テキストをセンター揃えにする*/
          text-decoration:none;     /*リンク部分を下線無しにする*/
          background-image:url(images/bg_menu1.png);   /*背景画像を指定*/　
          background-repeat:no-repeat;                 /*背景画像を繰り返さない*/
}
ul.ddmenu a:hover{
          background-color:orange;     /*背景色*/
          background-image:url(images/bg_menu2.png);   /*リンクにマウスが乗ったら背景画像を変更する*/
}

/* -------------------- */
/* ▼サブメニューの装飾 */
/* -------------------- */
ul.ddmenu ul {
   display: none;       /* ★標準では非表示にする */
   margin: 0px;         /* ★サブメニュー外側の余白(ゼロ) */
   padding: 0px;        /* ★サブメニュー内側の余白(ゼロ) */
   position: absolute;  /* ★絶対配置にする */
}

/* ---------------------------------- */
/* ▼サブメニューがある場合に開く処理 */   /* ※サブメニューが1階層しか存在しない場合の記述 */
/* ---------------------------------- */
ul.ddmenu li:hover ul {
   display: block;      /* ★マウスポインタが載っている項目の内部にあるリストを表示する */
}

#topic-path{font-size:15px;}

#mob-btn {
        margin:30px 0 20px 10px;          
}

/*===========================================
サブメニュー（左カラム）
===========================================*/
h2 {
      width:260px; height:50px;         /*幅と高さ*/
       padding-top:10px;          /*パディング*/
      font-size:28px;                   /*フォントサイズ*/
     text-align:center;
     background-image:url(images/bg_h2.png);   /*背景画像*/
      background-repeat:no-repeat;            /*背景画像を繰り返さない*/
      background-color:#ffff66;         /*背景色*/
      color:#ffffff;                    /*文字色*/
}
div#submenu {
         width:260px;                   /*幅の指定*/
         margin:10px 10px 10px 25px;    /*位置調整*/
         float:left;                    /*サブメニューのカラムを左寄せにする*/
}
div#submenu ul li {
         list-style-type:none;          /*リストマーカーを無しにする*/
}
div#submenu ul li a{
        display:block;                  /*リンク部分をブロック表示にする*/
        height:42px;                    /*高さ*/
        padding:16px 0 2px 25px;          /*パディング*/
        text-decoration:none;           /*リンクの下線を無くす*/
        font-size:22px;                   /*フォントサイズ*/
        background-image:url(images/bg_submenu.png); /*リンク領域に背景画像をつける*/
        background-repeat:no-repeat;    /*背景画像を繰り返さない*/
        color:#993300;                  /*文字色*/
}
div#submenu ul li a rt{text-align:left;}        

div#submenu ul li a:hover {
          text-decoration:underline;    /*リンクにマウスが乗ったら下線を表示*/
}
div#submenu ul li a:before {
        content: url("images/icon_submenu.gif") ;    /*アイコン画像を挿入*/
        vertical-align:text-bottom;                    /*縦方向の表示位置*/
}

/*====================================
インフォメーション（右カラム）
====================================*/
div#info {
       width:660px;         /*幅の指定*/
       float:left;         /*カラムを左寄せにする*/
       padding:10px 10px 0 0;  /*パディング*/
       backdrop-filter:blur(50px);	/*セルの背景をぼかす*/
}

h3 {
       font-size:30px;     /*文字サイズ*/
       width:650px;        /*横幅*/
       padding:0 0 10px 20px;  /*パディング*/
       background-color:#ff9900;  /*背景色*/
       color:#ffffff;             /*文字色*/
       border-radius:3px;         /*角丸にする*/
}

h3 ruby{ruby-position:under;}

h3 rt{text-align:left;}

.gallery_4-16a {
        width:330px; height:187px;     /*画像の表示サイズを指定*/
        margin: 0;              /*マージン*/
        float:left;                   /*画像を左寄せにする*/
}
.gallery_4-16b {
        width:330px; height:187px;     /*画像の表示サイズを指定*/
        margin:0;              /*マージン*/
        float:right;                   /*画像を右寄せにする*/
}
.gallery_ff1 {
        width:330px; height:187px;     /*画像の表示サイズを指定*/
        margin: 0;              /*マージン*/
        float:left;                   /*画像を左寄せにする*/
}
.gallery_ff2 {
        width:330px; height:187px;     /*画像の表示サイズを指定*/
        margin:0;              /*マージン*/
        float:right;                   /*画像を右寄せにする*/
}

#virt {
        width:500px; height:281px;     /*画像の表示サイズを指定*/
        margin-left: 40px;              /*マージン*/
}

#virt1 {
        width:600px; height:325px;     /*画像の表示サイズを指定*/
        margin-left: 30px;              /*マージン*/
}

hr {
	margin:25px 0px;		    /*マージン*/
	border:5px dotted #996600;	   /*内容の区切りを点線表示にする*/
}


/*===========================
フッタ
===========================*/
div#footer {
         clear:both;         /*回り込みを解除する*/
         height:40px;        /*高さの指定*/
         padding:10px 0 0 0; /*パディング*/
         font-size:x-small;  /*フォントサイズを小さくする*/
         text-align:center;  /*センタリング*/
}


/*--------------------------------------	
pagetop
--------------------------------------*/
#pagebody .pagetop{
        text-align:right;
}
#pagebody .pagetop a{
        padding-left:20px;
        background:url(images/btn_top.gif) left bottom no-repeat;
}

#pagebody1 .pagetop{
        text-align:right;
}
#pagebody1 .pagetop a{
        padding-left:20px;
        background:url(images/btn_top.gif) left bottom no-repeat;
}