@charset "utf-8";
/*=======================================
全体的なスタイル
=======================================*/
html {
    scroll-behavior: smooth;
}
* {
    margin:0; padding:0;
}
body {
    background-image:url("images/bg_body.png");  
    font-size:100%;
    font-family: "ヒラギノ角ゴシック Pro W3","Hiragino Kaku Gothic Pro W3"," MS Ｐゴシック","Helvetica Neue","Helvetica",sans-serif;
    line-height:2.2;
    color:#3d3d3d;
}
div#pagebody {
    width:1000px; margin:0 auto;
    background-color:#ffffff;
}
a:hover {
    color:#cc0000; 
}
a {
    text-decoration:none;
}
/*=======================================
ヘッダ
=======================================*/
div#header {
    height:248px
}
div#header h1 {
    padding:4px 0px 0px 20px;
}
/*=======================================
メインメニュー
=======================================*/
ul#menu {
    width:960px; height:50px;
    margin:0px 20px;
}
ul#menu li {
    list-style-type:none;
    display:inline;
    float:left;
}
ul#menu li a {
    background-color: #b93205;
    color:#feeb81;
    display:block;
    width:160px; height:35px;
    padding:5px 0px 5px 0px;
    text-align:center;
    text-decoration:none;
    font-size:130%;
    text-shadow: -1px -1px 1px #333, 1px 1px 1px #333;
    background-image:url(images/image_button2.png);
    background-repeat:no-repeat;
}
ul#menu li a:hover {
    background-color:#600c00;
    background-image:url(images/image_button2_on.png);
}
/* -- ドロップダウン-- */
ul#menu ul  { 
    display: none;
    margin: 0px;
    padding: 0px;
    position: absolute;    
}
ul#menu li:hover ul {    
    display: block;    
}
ul#menu ul li { 
    width: 160px;
    float: none;
}
/*========================================
ヘッダ画像
========================================*/
#img_subpage {
    width:960px; height:240px;
    margin:5px 20px;
}
/*========================================
サブメニュー（左カラム）
========================================*/ 
h2 {
    width:152px; height:25px;
    padding:0px 3px 30px 7px;
    color:#fff;
    font-size:30px;
    text-align:center;
    text-shadow: -1px -1px 1px #ccc, 1px 1px 1px #333;   /* テキストに影をつける */
    background-repeat:no-repeat;
    background: linear-gradient(#976a02, #be8604);　　/* 縦のグラデーション */
    
}
div#submenu {
    position: fixed;
}
div#submenu {
    width:163px;
    margin:0px 10px 20px 20px;
    float:left;
}
div#submenu ul li {
    list-style-type:none;
}
div#submenu ul li a {
    display:block;
    height:40px;
    padding:10px 5px 5px 5px;
    text-decoration:none;
    border-bottom:1px dotted gray;
    background-image:url(images/bg_submenu.png);
    background-repeat:no-repeat;
    color:#333333;
}
div#submenu ul li:first-child a {
    border-top:1px dotted gray;
}
div#submenu ul li a:hover {
    text-decoration:underline;
}
div#submenu ul li a:before { 
    content: url("images/susumu.png");
    margin:0px 5px 0px 2px;
    vertical-align:middle;
}
/*========================================
インフォメーション（右カラム）
========================================*/
div#info {
    width:787px;
    float:right;
    padding:0px 20px 0px 0px;
}
div#navi { 
     position: fixed;
     right: 0;
     opacity: 0.5;
 } 
h3 {
    font-size:21px;
    width:773px;
    padding:5px 0px 5px 15px;
    background: linear-gradient(#976a02, #be8604);　　　/* 縦のグラデーション */
    text-shadow: -1px -1px 1px #ccc, 1px 1px 1px #333;   /* テキストに影をつける */
    color:#fff;
    border-radius:3px;
    -moz-border-radius:3px; -webkit-border-radius:3px;  
    -o-border-radius:3px; -ms-　　　/* 角丸 */
}
h4 {
    font-size:21px;
    width:773px;
    padding:5px 0px 5px 15px;
    background: linear-gradient(#234300, #427f00);　　　/* 縦のグラデーション */
    text-shadow: -1px -1px 1px #ccc, 1px 1px 1px #333;   /* テキストに影をつける */
    color:#fff;
    border-radius:3px;
    -moz-border-radius:3px; -webkit-border-radius:3px;  
    -o-border-radius:3px; -ms-　　　/* 角丸 */
}
h5 {
    font-size:16px;
    color:#330033;
}
b {
    font-size:14px;
}
p {
    width:755px;
    margin:15px;
    text-indent:1em;
}
figcaption {
    text-align: center;
    margin: 0px;   
 } 
/*  =============俳句================  */
.infoimg_index {
    width: 260px; height:auto;
    margin: 10px 15px 20px 20px;
    float:right;
}
/*  ===============================  */
.infoimg_index1 {
    width: 234px; height:153px;
    margin:10px 0px 20px 10px;
    float:right;
}
.infoimg_index2 {
    width: 450px; height:auto;
    margin:15px auto 0px auto;
    float:none;
}
/*  =============俳句の対画像================  */
.infoimg_index3 {
    width: 450px; height:auto;
    margin:15px 0px 10px 10px;
    float:left;
}
/*  ======================================  */
.infoimg_index4 {
    width: 700px; height: auto;
    margin:20px 20px 10px 10px;
    float:none;
} 
.infoimg_index5 {
    width: 755px; height: auto;
    margin:20px 10px 10px auto;
    float:none;
} 
.infoimg_index6 {
    width: 640px; height: auto;
    margin:10px 10px 10px 20px;
    float:none;
}     
.infoimg_subpage {
    width: 428px; height: auto;
    margin:20px auto 0px auto;
    float:none;
}
.infoimg_subpage3 {
    width: 360px; height: auto;
    margin:10px 15px 10px 10px;
    float:left;
}
.infoimg_ballet {
    width: 300px; height: auto;
    margin: 20px 30px 20px 10px;
    float:left;
}
.infoimg_subpage4 {
    width: 360px; height: auto;
    margin:10px 40px 0px 15px;
    float:left;
}
.infoimg_subpage5 {
    width:230px; height:auto;
    margin:10px 10px 0px 10px;
    float:left;
}
.infoimg_subpage6 {
    width:350px; height:auto;
    margin:10px 20px 0px 10px;
    float:left;
}.infoimg_subpage7 {
    width: 360px; height: auto;
    margin:10px 10px 10px 15px;
    float:right;
}
hr {
    clear: both;
    width: 786px;
    margin: 30px 0px 10px 0px;
    border: 1px dotted #976a02;
}  
div#info li {
    list-style-type:none;
}
span {
    color:#e85f05;
}
img.pattern1 {                           /*黄金色線で囲む */ 
    padding:1px;
    border: 2px solid #996600;
    border-radius: 2px;
}
img { vertical-align: -0.2em;
}
.hidden { 
    visibility: hidden 
}
div#artbox {                               /*黄色線で囲む */            
    padding: 1rem;
    border: 2px solid #fbda8f;
    border-radius: 8px;
}
a:link, a:visited {
    color: #725002;
    text-decoration: none; 
}
a:hover {
    text-decoration: underline;
}
.new::after {
   content: "NEW";
   font-size: .75rem;
   background: #e85f05;
   color: #fff;
   padding: 4px;
   margin-left: 5px;
   border-radius: 3px;
}
.renewal::after {
   content: "renewal";
   font-size: .75rem;
   background: #e85f05;
   color: #fff;
   padding: 4px;
   margin-left: 5px;
   border-radius: 3px;
}
/*=======================================
ページトップへ
=======================================*/
#topbutton {
   /* ▼ボタンの表示位置を画面の右下に固定 */
   position: fixed; /* ←表示場所を固定 */
   bottom: 18px;   /* ←下端からの距離 */
   right: 2px;    /* ←右端からの距離 */
   width: 6em;     /* ←横幅 */

   /* ▼最初は非表示にしておく*/
   display: none; 

   /* ▼配色・配置・文字の装飾など */
   background-color: #976a02; /* ←背景色 */
   opacity: 0.75;        /* ←透明度 */
   border-radius: 15px;  /* ←角丸の半径 */
   text-align: center;  /* ←文字の位置 */
   font-size: 100%;     /* ←文字サイズ */
   font-weight: bold;   /* ←文字の太さ */
   margin: 10 20 10 0px;          /* ←外側の余白 */
   padding: 10 20 10 0px;       /* ←内側の余白 */
}
#topbutton a {
   /* ▼リンクの装飾 */
   color: white;          /* ←文字色 */
   text-decoration: none; /* ←下線なし */
}
#topbutton a:hover {
   /* ▼マウスが載ったときの装飾 */
   color: #fef502;              /* ←文字色 */
   text-decoration: underline; /* ←下線あり */
}
/*=======================================
中メニュー
=======================================*/
ul#menu2 { 
　 width:787px; height:50px; 
    margin:0px 0px; 
}
ul#menu2 li {
    list-style-type:none;
    display:inline;
    float:left;
}
ul#menu2 li a {
    background-color: #427f00;
    color:#feeb81;
    text-shadow: -1px -1px 1px #ccc, 1px 1px 1px #333;   /* テキストに影をつける */
    display:block;
    width:130px; height:35px;
    padding:5px 0px 5px 0px;
    text-align:center;
    text-decoration:none;
    font-size:110%;
    text-shadow: -1px -1px 1px #333, 1px 1px 1px #333;
    background-image:url(images/image_button4.png);
    background-repeat:no-repeat;
}
ul#menu2 li a:hover {
    background-color:#254600;
    background-image:url(images/image_button4_on.png);
}
/* -- ドロップダウン-- */
ul#menu2 ul a { 
    color:#ffffff;
    font-style: italic;
    background-color:#600c00;
    background-image:url(images/image_button2_on.png);           
}

ul#menu2 ul  { 
    display: none;
    margin: 0px;
    padding: 0px;
    position: absolute;
       
}
ul#menu2 li:hover ul {   
    display: block;    
}
ul#menu2 ul li { 
    width: 160px;
    float: none;
}
/* =======================================================
 *   フッター
 * ======================================================= */
div#footer {
    clear:both;
    width:1000px; height:100px;
    margin 0;
    background-image:url("images/footerimage.png");
    padding:20px 0px 0px 0px;
    text-align:center;
    font-size: 13px;
    color:#ffffff;
}
