@charset "utf-8";
/**
 * まんのう公園 さぬきの里山動物植物図鑑
 * mystyle.css
 *
 * @version 2013-10-21
 * @author  ohguma@c-rcs.jp
 */

/*----reset.css-------------------------------------------------------*/
/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 2.8.1
*/
/* reset */
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}
/* font */
/*
body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
*/
body{font:arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}


/*----gs960.css------------------------------------------------------*/
/*
    Variable Grid System.
    Learn more ~ http://www.spry-soft.com/grids/
    Based on 960 Grid System - http://960.gs/

    Licensed under GPL and MIT.
*/

/*
  Forces backgrounds to span full width,
  even if there is horizontal scrolling.
  Increase this if your layout is wider.

  Note: IE6 works fine without this fix.
*/
body{min-width:960px}.container_12{margin-left:auto;margin-right:auto;width:960px}.alpha{margin-left:0 !important}.omega{margin-right:0 !important}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12{display:inline;float:left;position:relative;margin-left:5.0px;margin-right:5.0px}.container_12 .grid_1{width:70px}.container_12 .grid_2{width:150px}.container_12 .grid_3{width:230px}.container_12 .grid_4{width:310px}.container_12 .grid_5{width:390px}.container_12 .grid_6{width:470px}.container_12 .grid_7{width:550px}.container_12 .grid_8{width:630px}.container_12 .grid_9{width:710px}.container_12 .grid_10{width:790px}.container_12 .grid_11{width:870px}.container_12 .grid_12{width:950px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_3{padding-left:240px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_6{padding-left:480px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_9{padding-left:720px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_3{padding-right:240px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_6{padding-right:480px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_9{padding-right:720px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_12 .push_1{left:80px}.container_12 .push_2{left:160px}.container_12 .push_3{left:240px}.container_12 .push_4{left:320px}.container_12 .push_5{left:400px}.container_12 .push_6{left:480px}.container_12 .push_7{left:560px}.container_12 .push_8{left:640px}.container_12 .push_9{left:720px}.container_12 .push_10{left:800px}.container_12 .push_11{left:880px}.container_12 .pull_1{right:80px}.container_12 .pull_2{right:160px}.container_12 .pull_3{right:240px}.container_12 .pull_4{right:320px}.container_12 .pull_5{right:400px}.container_12 .pull_6{right:480px}.container_12 .pull_7{right:560px}.container_12 .pull_8{right:640px}.container_12 .pull_9{right:720px}.container_12 .pull_10{right:800px}.container_12 .pull_11{right:880px}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}



/*-------------------------------------------------------------------*/
/* mystyle
/*-------------------------------------------------------------------*/
/* 共通部分
/*-------------------------------------------------------------------*/
body, input, select, textarea {
    font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}
p {margin-top:0.5em}

.c {text-align:center}
.r {text-align:right}
.vm {vertical-align:middle}

.small {font-size:smaller}
.mb {margin-bottom:10px}

.cake-sql-log {
    background:#ccc;
    color:#666;
}
a:link {color: #418d00}
a:visited {color: #418d00}
a:hover {color: #493f0b}

/*-------------------------------------------------------------------*/
/* 一般公開 共通 _Common_
/*-------------------------------------------------------------------*/
html {
    background: #cde855;
}
#header {
    padding:4px;
    background:#dedbb5;
    border-bottom:solid 2px #f5f6d4;
}

#content {
    border-top:solid 2px #dedbb5;
    padding-top:10px;
    padding-bottom:10px;
    background:#f5f6d4;
    border-bottom:solid 2px #cde855;
}

#footer {
    border-top:solid 2px #f5f6d4;
    padding-top:10px;
    color: #493F0B;
    text-align:center;
    font-size:smaller;
    background:#cde855;
}


/*======== common_title エレメント内 ========*/
#common_title {
    position: relative;
    margin: 0 auto 5px;
    padding:5px 10px;
    border: 3px solid #493F0B;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius:10px;
    background: #85DB18;                                                                     /* non-CSS3 */
    background: -webkit-gradient(linear, left top, left bottom, from(#85DB18), to(#F5F6D4)); /* old webkit */
    background: -webkit-linear-gradient(#85DB18, #F5F6D4);                                   /* new webkit */
    background: -moz-linear-gradient(top, #85DB18, #F5F6D4);                                 /* gecko */
    background: -ms-linear-gradient(#85DB18, #F5F6D4);
    background: linear-gradient(to bottom, #85DB18, #F5F6D4);                                /* CSS3 */
    -pie-background: linear-gradient(#85DB18, #F5F6D4);                                      /* PIE */
    behavior: url(/zukan/css/PIE.htc);
}
#common_title .common_sub_title {
    margin:0;
    color : #333;
    font-size:small;
}
#common_title a.gotop {
    color: #fff;
    text-decoration: none;
    font-size:160%;
    font-weight:bold;
}
#common_title a.gotop:link {
    color: #fff;
}
#common_title a.gotop:visited {
    color: #fff;
}
#common_title img.gotop {
    float:right;
}
#common_title_message {
    font-size:small;
    margin-left:13px;
    margin-bottom:0;
}

/*======== リンクボタン風 ========*/
.btn {
    position: relative;
    margin-top:0;
    margin-right:2px;
    margin-bottom:2px;
    padding:2px 14px 2px 4px;
    color:#fff;
    text-decoration: none;
    border:1px solid #493F0B;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius:5px 5px 5px 5px;
    background : #418d00 url(../img/arrow_r_w.gif) no-repeat right 0.2em ;
    box-shadow:#666 2px 2px 4px;
    opacity:0.9;
    behavior: url(/zukan/css/PIE.htc);
}
.btn:link {
    color:#fff;
}
.btn:visited {
    color:#fff;
}
.btn:hover {
    margin-top:2px;
    margin-right:0;
    margin-bottom:0;
    color:#f60;
    background      : #85db18 url(../img/arrow_r_o.gif) no-repeat right 0.2em;
    text-shadow:0px 0px 2px #666;
}
/* 右矢印なし (btn と同時指定)*/
.btnback {
    background-image:none;
    padding:2px 4px 2px 4px;
}
.btnbac:hover {
    background-image:none;
}
/* 改行ありボタン用 */
.btn2line {
    position: relative;
    display:block;
    float:left;
    margin-top:5px;
    margin-right:2px;
    margin-bottom:2px;
    padding:2px 16px 2px 4px;
    color:#fff;
    text-decoration: none;
    background:#418d00 url(../img/arrow_r_w.gif) no-repeat right 0.8em;
    border:1px solid #493F0B;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius:5px 5px 5px 5px;
    box-shadow:2px 2px 4px #666;
    line-height:1.2;
    opacity:0.9;
    behavior: url(/zukan/css/PIE.htc);
}
.btn2line:link {
    color:#fff;
}
.btn2line:visited {
    color:#fff;
}
.btn2line:hover {
    margin-top:2px;
    margin-right:0;
    margin-bottom:0;
    color:#f60;
    background:#85db18 url(../img/arrow_r_o.gif) no-repeat right 0.8em;
    text-shadow:0px 0px 2px #666;
}

/*======== 写真風フレーム(with frame) ========*/
.wf10 {
    border : solid 10px #fff;
}
.wf5 {
    border : solid 5px #fff;
}

.wf5selected {
    border : solid 5px #f00;
}

/*======== スライドショー ========*/
#header_slider {
   text-align:center;
   height: 190px;
 }
/* スライドショー：写真ごとのタイトル
#header_slider .caption_photo {
    position: absolute;
    top :   96px;
    right : 40px;
    padding:2px;*/
}
/* スライドショー：写真ごとの領域 */
#header_slider div.simple {
    position: absolute;
    top :   0;
    left :   0;
    height: 190px;
    width:  390px;
}
/* スライドショー */
#header_slider div.photoframe {
    margin-left:80px;
    padding:5px;
    background:#fff;
    width:220px;
    height:180px;
    font-size:10px;
    line-height:1;
    text-align:left;
}
#header_slider div.photoframe img {
    margin-bottom:4px;
}
.jquery-slider-pages {
    bottom:none;
    top: 172px;
    right: 0px;
}
.jquery-slider-page {
    background:#999;
}
.jquery-slider-page-current {
    background:#696;
}

/*-------------------------------------------------------------------*/
/* 一般公開 トップページ Home
/*-------------------------------------------------------------------*/

/* 動物のページ、植物のページ（見出し）*/
#home .home-list-header {
    position: relative;
    margin:0 auto 0.5em;
    font-weight:bold;
    font-size:1.4em;
    text-align:center;
    border:solid 2px #418d00;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius:10px 10px 10px 10px;
    background: #85DB18;                                                                     /* non-CSS3 */
    background: -webkit-gradient(linear, left top, left bottom, from(#F5F6D4), to(#85DB18)); /* old webki */
    background: -webkit-linear-gradient(#F5F6D4, #85DB18);                                   /* new webki */
    background: -moz-linear-gradient(top, #85DB18, #F5F6D4);                                 /* gecko */
    background: linear-gradient(to bottom, #F5F6D4, #85DB18);                                /* CSS3 */
    -pie-background: linear-gradient(#F5F6D4, #85DB18);                                      /* PIE */
    behavior: url(/zukan/css/PIE.htc);
}

/* 区分毎表示 */
#home .home-list-cell {
    background:#fff url(../img/home-list-cel_bg.gif) no-repeat center top;
    font-weight:bold;
    font-size:1.1em;
    margin-left:2em;
    width:160px;
    padding:10px;
    margin-bottom:10px;
    text-align:center;
    border:solid 1px #493f0b;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius:10px 10px 10px 10px;                              /* PIE */
    behavior: url(/zukan/css/PIE.htc);
}
#home .home-list-cell img {
    vertical-align:bottom;
}


/*-------------------------------------------------------------------*/
/* 一般公開 一覧 List
/*-------------------------------------------------------------------*/

/* 見出し */
#list .page_header {
    position: relative;
    margin:0 auto 0.5em;
    font-weight:bold;
    font-size:1.4em;
    text-align:center;
    border:solid 2px #418d00;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius:10px 10px 10px 10px;
    background: #85DB18;                                                                     /* non-CSS3 */
    background: -webkit-gradient(linear, left top, left bottom, from(#F5F6D4), to(#85DB18)); /* old webki */
    background: -webkit-linear-gradient(#F5F6D4, #85DB18);                                   /* new webki */
    background: -moz-linear-gradient(top, #85DB18, #F5F6D4);                                 /* gecko */
    background: linear-gradient(to bottom, #F5F6D4, #85DB18);                                /* CSS3 */
    -pie-background: linear-gradient(#F5F6D4, #85DB18);                                      /* PIE */
    behavior: url(/zukan/css/PIE.htc);
}
#list .page_header_sub {
    font-size:smaller;
    padding-top : 0.6em;
}

/* 一覧ヘッダー*/
#list .row_header {
    border-top:solid 2px #493F0B;
    border-bottom:solid 2px #493F0B;
    background : #85DB18;
    font-weight:bold;
    color : #fff;
}
/* 一覧ヘッダーのページング用リンク */
#list .row_header a {
    color : #fff;
    text-decoration: none;
}
#list .row_header a:after {
    content: ' ：';
}
#list .row_header a.asc:after {
    content: ' ▼';
}
#list .row_header a.desc:after {
    content: ' ▲';
}

/* 一覧データの基本設定 */
#list .row_data {
    border-bottom:solid 1px #493F0B;
    padding-top:4px;
    padding-bottom:4px;
    background : #fff;
}
/* 一覧データの縞模様 */
#list .row_data_alt {
    background : #dedbb5;
}
/* 一覧データ中の画像 */
#list .row_data img {
    vertical-align:middle;
    float:left;
}
/* 一覧データ中のリンク設定 */
#list .row_data a.btn {
    display:block;
    float:right;
}
#list .row_data a.btn2line {
    float:right;
}

/*======== ページング ========*/
#list .paginator {
    text-align:center;
    margin: 1em auto;
}
/* ページ番号間隔 */
#list .paginator span{
    margin:0 0.5em;
}
/* 現在のページ番号 */
#list .paginator .current{
    font-weight : bold;
    color : #418d00;
    font-size:120%;
}
/* 前・後 */
#list .paginator .btn{
    background-image:none;
    padding-right: 4px;
}
/* 前・後 不可時 */
#list .paginator .disabled{
    color: #999;
}

/*======== 検索フォーム ========*/
#list .search_form {
    padding:10px 0;
    background:#dedbb5;
    margin-bottom:1em;
}

/*= 以上 =*/