@charset "UTF-8";

/* **********************************************************************
 *
 *       Title:   ペットヘルパー2級養成講座
 *       Updated: 2010.09.10
 *       Notes:   Hand-crafted by WebLab Corporation in Tokyo.
 *
 * **********************************************************************
 */


/* IE用印刷設定CSS ###################### */

@media print{

body {
_zoom: 67%; /*WinIE only */
}


#top-a {_zoom: 95%; /*WinIE only */
}
}


* {
       margin: 0;
       padding: 0;
       }

body {
       background: #fff url(../img/head_bg.gif) 0 0 repeat-x;   /* 背景の色が設定できます */
       color: #333;
       font:13px 'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
       text-align: center;
       *font-size:small;
       *font:x-small;
       }
/* hide from Mac IE \*/
* html body             { font-family: 'ＭＳ Ｐゴシック',Arial, Helvetica, sans-serif; }
*:first-child+html body { font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; }
/* */

table {
       font-size:inherit;
       font:100%;
       }

hr.hide  { display: none; }
a:link   { color  : #3366cc; }
a:hover, a:active { color: #3366cc; text-decoration:none;}

.csschange {
       width: 100%;
       background: #f1f1f1;
       text-align: center;
       padding:5px 0;
       font-size: 300%;
       }

span.texts { font-size: xx-small; line-height: 1.2; }
html>body span.texts { font-size: x-small; }

span.textn { font-size: x-small; line-height: 1.5; }
html>body span.textn { font-size: small; }

span.textl { font-size: small; line-height: 1.5; }
html>body span.textl { font-size: medium; }

table.nbr,
table.tbr table.nbr {
       border-top: none;
       border-left: none;
       border-collapse: collapse;
       }

table.nbr th,
table.tbr table.nbr th {
       padding: 0;
       border-right: none;
       border-bottom: none;
       background: none;
       color: #333;
       font-size: 100%;
       line-height: 1.5;
       }

table.nbr td,
table.tbr table.nbr td {
       padding: 0;
       border-right: none;
       border-bottom: none;
       color: #333;
       font-size: 100%;
       line-height: 1.5;
       }

table.tbr,
table.nbr table.tbr {
       border-top: 1px solid #c4aa5c;
       border-left: 1px solid #c4aa5c;
       border-collapse: collapse;
       }

table.tbr th,
table.nbr table.tbr th {
       padding: 10px;
       border-right: 1px solid #c4aa5c;
       border-bottom: 1px solid #c4aa5c;
       background: #fff8c4;
       color: #333;
       font-size: 100%;
       line-height: 1.5;
       }

table.tbr td,
table.nbr table.tbr td {
       padding: 10px;
       border-right: 1px solid #c4aa5c;
       border-bottom: 1px solid #c4aa5c;
       color: #333;
       font-size: 100%;
       line-height: 1.5;
       }

th.nbr {
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

td.nbr {
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

th.tbr {
       padding: 10px;
       border-right: 1px solid #c4aa5c;
       border-bottom: 1px solid #c4aa5c;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

td.tbr {
       padding: 10px;
       border-right: 1px solid #c4aa5c;
       border-bottom: 1px solid #c4aa5c;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

blockquote {
       clear: both;
       margin: 0;
       padding: 10px;
       border: 1px solid #cfcfcf;
       background: #f3f3f3;
       font-size: 100%;
       line-height: 1.4;
       text-align: left;
       }

form dt{
       font-size: 100%;
       font-weight: bold;
       line-height: 1.4;
       }

form dd{
       margin: 0 0 5px 0;
       font-size: 100%;
       line-height: 1.4;
       }

img { border: 0; }

.clear:after {
        content                : "."; 
        display                : block; 
        height                : 0; 
        clear                : both; 
        visibility        : hidden;
        }
.clear {display: inline-block;}

/* Hides from IE-mac \*/
* html .clear {height: 0%;}
.clear {display: block;}
/* End hide from IE-mac */



/* 全体のレイアウト設定 ###################### */

#wrapper {
       width: 950px;
       margin-left:auto;
       margin-right:auto;
       background:#fff;
       }

#header {
       width: 950px;
       height: 87px;
       background:#fff;                 /* 　ヘッダーの背景色が設定できます */
       }

#headnav {
       float: left;
       width: 950px;
       margin: 0px;
       }

#main {
       float: left;
       width: 730px;
       padding: 27px 30px 0px 0px;
       }
html>body div#main { width: 700px; }

#un_right {
       float: right;
       width: 220px;
       margin: 27px 0 0 0;
       }


#nav {
       float: left;
       width: 220px;
       margin: 0px 0px 20px 0px;
       padding: 0px 0px 0px 0px;
       text-align: left;
       }

#footerinfo_bg {
       background: #fff598;
       border-top: 1px solid #f1d96a;
       clear:both;
       }

#footerinfo {
       width: 950px;
       margin-left:auto;
       margin-right:auto;
       padding: 12px 0px 12px 0px;
       background: #fff598;
       text-align: left;
       clear:both;
       }

#footer_bg {
       background: #e6dbba url(../img/foot_bg.gif) 0 0 repeat-x;
       clear:both;
       }

#footer {
       width: 950px;
       margin-left:auto;
       margin-right:auto;
       padding: 0px 0px 50px 0px;
       background: #e6dbba;
       text-align: left;
       clear:both;
       }

/* header部分のスタイル設定 ###################### */

#head_l {
       float: left;
       width: 670px;
       }

#head_r {
       float: right;
       width: 275px;
       padding: 4px 0 0 0;
       }

#header h1 {
       width: 670px;
       margin: 0px 0px 0px 0px;
       padding: 10px 0px 15px 0px;
       color: #333;   /* ヘッダーの大見出しの文字色が設定できます */
       font-size: 77%;
       font-weight: normal;
       line-height: 100%;
       text-align: left;
       }

#header a:link            { color: #000; text-decoration:none;} /* ヘッダーの大見出しの文字色が設定できます */
#header a:visited         { color: #000; text-decoration:none;} /* ヘッダーの大見出しの文字色が設定できます */
#header a:hover, a:active { color: #000; text-decoration:none;} /* ヘッダーの大見出しの文字色が設定できます */



/* #header h2 {
       float: left;
       width: 526px;
       margin: 0px 0px 0px 0px;
       padding: 0px 0px 0 0px;
       text-align: left;
       }*/


#header h2 {
        float: left;
        width:408px;
        height:29px;
        padding: 0px;
        text-align: left;
}



#head_l h2 a {
        display: block;
        float: left;
        width:408px;
        height:29px;
        background:url(../../img/logo.gif) 0 0 no-repeat;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        padding: 0px;
        text-align: left;
}

.sp_h_btn { display:none; }


/* TOPページ用のレイアウト設定 ################### */

#top-a {
       float: left;
       margin: 27px 0px 0px 0px;
       padding: 0px 30px 20px 0px;
       width: 730px;
       text-align: left;
       }
html>body div#top-a { width: 700px; }

#top-b {
       float: right;
       margin: 27px 0px 20px 0px;
       padding: 0px 0px 0px 0px;
       width: 220px;
       background:#fff;
       text-align: left;
       }

#top-a-contents {
       margin: 0;
       padding-bottom: 3px;
       text-align: left;
       }

.top-a-block {
       clear:both;
       margin-bottom: 30px;
       }

.top-a-block a:visited { color: #3366cc; }

.top-a-block h4 {
       margin: 0px 0px 15px 0px;
       padding: 0;
       }

.top-a-block p {
       margin: 0;
       padding: 0;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.top-a-block ul {
       margin: 5px 0px 5px 10px;
       padding: 0px 0px 0px 10px;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.top-a-block ol {
       margin: 5px 0px 5px 15px;
       padding: 0px 0px 0px 20px;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.top-b-block {
       clear:both;
       margin-bottom: 17px;
       }

.top-b-block a:visited { color: #3366cc; }

.top-b-block h4 {
       margin: 0px 0px 10px 0px;
       padding: 0px;
       font-size: 100%;
       color: #000;                   /* [トップページ]　右エリアの見出しの文字色が設定できます */
       }

.top-b-block p {
       margin: 0;
       padding: 0;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.top-b-block ul {
       margin: 5px 0px 5px 10px;
       padding: 0px 0px 0px 10px;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.top-b-block ol {
       margin: 5px 0px 5px 15px;
       padding: 0px 0px 0px 20px;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }


/* main部分設定 ###################################  */

#contents-title {
       width: 700px;
       text-align: left;
       }

#directry {
       width: 520px;
       padding: 0px 0px 0px 2px;
       font-size: 77%;
       color: #666;
       }

#directry a:visited { color: #3366cc; }

#contents-title h3 {
       width: 700px;
       margin: 0;
       padding: 15px 0 10px 0px;
       font-size: 182%;
       font-weight: bold;
       line-height: 1.3;
       color: #333;
       background: url(../img/h3_line.gif) 0 bottom no-repeat;
       }
html>body #contents-title h3 {padding: 15px 0 7px 0px;}

#contents-title h3 span {
       margin: 0;
       padding: 5px 0 0px 40px;
       background: url(../img/ico_h3.gif) 0 3px no-repeat;
       }
html>body #contents-title h3 span { padding: 0px 0 5px 40px; }

#info-contents-title {
       width: 700px;
       text-align: left;
       }

#contents {
       margin: 0px;
       padding: 18px 0px 0px 0px;
       text-align: left;
       }

.photo-r {
       float:right;
       margin: 0px 0 15px 15px;
       font-size: 77%;
       line-height: 1.3;
       color: #333;
       }

.photo-l {
       float:left;
       margin: 0px 15px 15px 0;
       font-size: 77%;
       line-height: 1.3;
       color: #333;
       }

.photo-c {
       margin: 3px auto 15px auto;
       font-size: 77%;
       line-height: 1.3;
       color: #333;
       }

.photo-r img, .photo-l img, .photo-c img {
       margin-bottom: 3px;
       }

.block {
       clear:both;
       margin-bottom: 30px;
       }

.block a:visited { color: #3366cc; }

.block h4 {
       margin: 0px 0px 15px 0px;
       padding: 3px 0px 3px 17px;
       font-size: 123.1%;
       color: #311e0f;                   /* [下ページ]　本文の見出しの文字色が設定できます */
       background: url(../img/h4_bullet.gif) 0 0 no-repeat;
       }

.block p {
       margin: 0;
       padding: 0;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.block ul {
       margin: 5px 0px 5px 10px;
       padding: 0px 0px 0px 10px;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.block ol {
       margin: 5px 0px 5px 15px;
       padding: 0px 0px 0px 20px;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       }

.pagetopset {
       margin: 0px;
       padding: 20px 0px 17px 0px;
       font-size: 77%;
       text-align:right;
       clear:both;
       }

a.pagetop {
       text-align: left;
       }

a.pagetop:link   { color: #919191;text-decoration: none; }
a.pagetop:visited,
a.pagetop:active { color: #919191;text-decoration: none; }
a.pagetop:hover  { color: #919191;text-decoration: underline; }


/* headnav部分設定 #############################  */

#menu {
        list-style-type: none;
        }

#menu li {
        display: inline;
        list-style-type: none;
        }

#menu a {
        float: left;
        padding-top: 48px;
        height: 0px !important;
        height /**/ : 48px;
        overflow: hidden;
        }

#menu a:hover, #menu a:active, #menu a.selected {
        background-position        : 0 -48px;
        }

/*++++++++++++++++ nav button set ++++++++++++++++*/
.nav01 a { width: 86px; background: url(../img/nav01.gif) top left no-repeat; }
.nav02 a { width: 158px; background: url(../img/nav02.gif) top left no-repeat; }
.nav03 a { width: 184px; background: url(../img/nav03.gif) top left no-repeat; }
.nav04 a { width: 100px; background: url(../img/nav04.gif) top left no-repeat; }
.nav05 a { width: 113px; background: url(../img/nav05.gif) top left no-repeat; }
.nav06 a { width: 99px; background: url(../img/nav06.gif) top left no-repeat; }
.nav07 a { width: 77px; background: url(../img/nav07.gif) top left no-repeat; }
.nav08 a { width: 133px; background: url(../img/nav08.gif) top left no-repeat; }




/* nav部分設定 
======================================================= */

#submenu {
       float:left;
       margin: 0;
       padding: 0;
       list-style: none;
       border-top: 1px solid #dcdcdc;
       }

*/#submenu a { color: #000; }   [下ページ]　左メニューボタンの文字色が設定できます */

#submenu ul {
       margin: 0;
       padding: 0;
       }   /* リストを隙間なくならべる */

/* subbutton set */

.subbutton {
       float:left;
       margin: 0;
       padding: 0;
       width: 220px;
       font-size: 100%;
       line-height: 130%;
       text-align: left;
       border-bottom: 1px solid #dcdcdc;
       }

.subbutton a {
       margin: 0;
       padding: 5px 0 5px 15px;
       text-decoration: none;
       display: block;
       background: #fffee8 url(../img/menu_arrow.gif) no-repeat 7px 0.8em;
       color: #333;
       }
/* hide from Mac IE \*/
* html .subbutton a { width:199px; }
*:first-child+html .subbutton a { background-position: 7px 0.7em; padding-top:5px; }
/* */

.subbutton a:active  { background: #fff url(../img/menu_arrow.gif) no-repeat 7px 0.8em; color: #311e0f; }
.subbutton a:hover   { background: #fff url(../img/menu_arrow.gif) no-repeat 7px 0.8em; color: #311e0f;  padding: 5px 0 5px 15px; }
.subbutton a.subselected        { background: #fff url(../img/menu_arrow.gif) no-repeat 7px 0.8em; color: #311e0f; }
.subbutton a.subselected:active { background: #fff url(../img/menu_arrow.gif) no-repeat 7px 0.8em; color: #311e0f; }
.subbutton a.subselected:hover  { background: #fff url(../img/menu_arrow.gif) no-repeat 7px 0.8em; color: #311e0f;  }
*:first-child+html .subbutton a.subselected:hover { background-position: 7px 0.7em;  }
#submenu a.subnolink { background-color: #fffee8; color: #333; }

/* localbutton set */

.localmenu {
       margin: 0;
       padding: 0;
       list-style: none;
       }

.localbutton {
       float:left;
       list-style: none;
       margin: 0;
       padding: 0;
       width: 220px;
       font-size: 100%;
       line-height: 130%;
       text-align: left;
       border-top: 1px solid #dcdcdc;
       }

.localbutton a {
       margin: 0;
       padding: 5px 0 5px 30px;
       text-decoration: none;
       display: block;
       background: #fff url(../img/menu_arrow.gif) no-repeat 21px 0.8em;
       color: #311e0f;
       }
/* hide from Mac IE \*/
* html .localbutton a { width:199px; }
*:first-child+html .localbutton a { background-position: 21px 0.7em; padding-top:5px; }
/* */

.localbutton a:active  { background: #f78200 url(../img/menu_arrow2.gif) no-repeat 21px 0.8em; color: #fff; }
.localbutton a:hover   { background: #f78200 url(../img/menu_arrow2.gif) no-repeat 21px 0.8em; color: #fff; padding: 5px 0 5px 30px; }
.localbutton a.localselected        { background: #f78200 url(../img/menu_arrow2.gif) no-repeat 21px 0.8em; font-weight:bold; color: #fff; }
.localbutton a.localselected:active { background: #f78200 url(../img/menu_arrow2.gif) no-repeat 21px 0.8em; font-weight:bold; color: #fff; }
.localbutton a.localselected:hover  { background: #f78200 url(../img/menu_arrow2.gif) no-repeat 21px 0.8em; font-weight:bold; color: #fff;  padding: 5px 0 5px 30px; }
*:first-child+html .localbutton a.localselected:hover  { background-position: 21px 0.7em;  }
#submenu a.localnolink { background-color : #fff; color: #311e0f; }





/* footer部分設定 ################################# */

#footer-gnav {
       width: 950px;
       margin: 0 auto;
       padding: 9px 0px 5px 0px;
       clear: both;
       height: 31px;
       text-align: center;
       background: #dcc79b;   /* フッターメニューの背景色が設定できます */
       }
html>body #footer-gnav {height: 21px;padding: 5px 0px 5px 0px;}
:first-child+html #footer-gnav { height: 21px; padding: 5px 0px 5px 0px; }

#footer-gnav ul {
       background: url(../img/fnav_line.gif) repeat-y 0 0;
       list-style-type: none;
       display:inline;
       padding: 0 0 0 10px;
       text-align: center;
       }

#footer-gnav li {
       display: inline;
       background: url(../img/fnav_line.gif) repeat-y right 0;
       padding: 0 5px 0 0;
       margin: 0px 10px 0px 0px;
       color: #666;
       }
html>body #footer-gnav li {padding: 0 10px 0 0;margin: 0px 5px 0px 0px;}

#footer-gnav a {
       font-size: 93%;
       line-height: 1;
       text-decoration: none;
       color: #62553c;
       }

#footer-gnav a:active, #footer-gnav a:hover {
       text-decoration: underline;
       color: #62553c;
       }

#footer-gnav a.footnolink {
       text-decoration: none;
       color: #999;      /* フッターの「リンクなし」文字色が設定できます */
       }

#footer-nav {
       float: left;
       margin: 0;
       padding: 7px 0px 5px 0px;
       width: 950px;
       height: 31px;
       clear: both;
       }
html>body #footer-nav { height: 21px; }

#footer-nav ul {
       float: left;
       list-style: none;
       }

#footer-nav li {
       display: inline;
       background: url(../img/footer-arrow.gif) no-repeat 0px 50%;
       margin: 0px 10px 0px 0px;
       padding: 0px 0px 0px 7px;
       }


#footer-nav a {
       font-size: 77%;
       line-height: 1;
       text-decoration: none;
       color: #443b1f;
       }

#footer-nav a:active, #footer-nav a:hover {
       text-decoration: underline;
       color: #443b1f;   /* フッターの「リンクあり」（マウスオンの状態）文字色が設定できます */
       }

#footer-nav a.footnolink {
       text-decoration: none;
       color: #999;      /* フッターの「リンクなし」文字色が設定できます */
       }

#copyright {
       float: right;
       width: 327px;
       padding: 5px 0 0 0;
       }

address {
       float: left;
       width: 580px;
       margin: 0;
       padding: 0px 0px 0px 0px;
       font-size: 100%;
       line-height: 1;
       font-style: normal;
       color: #443b1f;      /* コピーライトの文字色が設定できます */
       text-align: left;
       }
html>body address { width: 570px; }

#powered {
       float: right;
       width: 149px;
       margin: 0;
       padding: 0px 0px 0px 0px;
       }


/* topics部分のスタイル設定 ###################### */

.topics {
       margin: 0;
       padding: 0;
       }

.topics ul, .topics ol {
       margin: 0px 0px 0px 0px;
       padding: 0;
       font-size: 100%;
       line-height: 1.5;
       color: #333;
       list-style:none;
       }

.topics li {
       border-bottom:1px dotted #999;
       margin: 5px 0px 0px 0px;
       padding: 0px 0px 5px 0px;
       }

.topicsblock {
       margin: 0;
       padding: 0;
       background: url(../img/top_topic_bg.gif) 0 0 no-repeat;  /*トピックスのタイトルの背景色が設定できます */
       height:38px;
       }

.topicsblockleft {
       float:left;
       height:38px;
       width:402px;
       }

.topicsblockright {
       float:right;
       height:38px;
       width:80px;
       }

.topicsblockleft h3, .topicsblockleft h4 {
       border-left: none;
       margin: 0;
       padding: 12px 0px 0px 10px;
       font-size: 100%;
       line-height:100%;
       color: #333;  /*トピックスのタイトルの文字色が設定できます */
       }
html>body div.topicsblockleft h3, div.topicsblockleft h4 { padding-top: 12px; }

.infolistset {
       margin: 0;
       padding: 11px 0px 0px 0px;
       font-size: 77%;
       float:left;
       }

a.infolist {
       margin: 0;
       padding: 0px 0px 0px 8px;
       background: url(../img/infolist_arrow.gif) 0px 0.4em no-repeat;
       }

.inforss {
       margin: 0;
       padding: 11px 10px 0px 0px;
       float:right;
       }

.top-a-block .topicsblockleft { width:400px; }
.top-b-block .topicsblockleft { width:135px; }

/* お知らせ一覧ページ送り部分のスタイル設定 ###################### */

ul.pager {
        margin: 0;
        padding: 0;
        text-align: center;
        font-size: 12px;
}
ul.pager li {
        list-style: none;
        display: inline;
        margin: 0;
        padding: 0;
}
ul.pager li strong {
        display: -moz-inline-box; /* firefox2 対応 */
        display: inline-block;
        padding: 0.25em 0.4em;
        background-color: #999;
        border: 1px #999 solid;
        color: #fff;
}
ul.pager li a {
        display: -moz-inline-box; /* firefox2 対応 */
        display: inline-block;
        padding: 0.25em 0.4em;
        border: 1px #ccc solid;
        text-decoration: none;
}
ul.pager li a:link,
ul.pager li a:visited {
        border-color: #ccc;
        color: #333;
}
ul.pager li a:hover,
ul.pager li a:active {
        border-color: #999;
        background-color: #999;
        color: #fff;
}


/* sitemapページのスタイル設定 ###################### */

.block_sm {
       clear:both;
       margin-bottom: 10px;
       border-bottom: 1px dotted #b4b4b4;
       padding: 0 0 10px 0;
       }

.block_sm a:visited { color: #3366cc; }

#contents .sitemap {
       margin: 0px 0px 0px 0px;
       padding: 0px 0px 0px 10px;
       font-size: 100%;
       color: #000;
       border: 0;
       background: url(../img/topics_arrow.gif) no-repeat 0px 6px;
       }

#contents .sitemap_ul {
       margin: 3px 0 0 23px;
       padding: 0;
       border: 0;
       list-style: none;
       }

#contents .sitemap_ul li {
       padding: 2px 0 2px 17px;
       margin: 0;
       border: 0;
       font-size: 100%;
       text-align: left;
       background: url(../img/sitemap_arrow.gif) no-repeat 0px 5px;
       }

.sitemap_ul li ul {
       margin: 3px 0 0px 13px;
       padding: 0;
       list-style: none;
       }

.sitemap_ul li ul li {
       padding-left: 17px;
       margin: 0;
       text-align: left;
       background: url(../img/sitemap_arrow.gif) no-repeat 0px 5px;
       }

/* dvc_switch
=================== */

.dvc_switch {
    text-align: center;
    width: 25%;
    margin: 10px auto 10px;
    padding: 6px 15px;
    background: #b3b1a8;
    -webkit-border-radius: 15px;
       -moz-border-radius: 15px;
            border-radius: 15px;
}

.dvc_switch a {
    background: url(../img/sp/ico_pc.gif) no-repeat 0 50%;
    -webkit-background-size: 14px 13px;
       -moz-background-size: 14px 13px;
         -o-background-size: 14px 13px;
            background-size: 14px 13px;
        -ms-background-size: 14px 13px;
}

.dvc_switch a:link,
.dvc_switch a:visited,
.dvc_switch a:hover {
    color: #fff;
    text-decoration: none;
}

#btnPC {
    display: none;
}

/* margin設定 ###################### */

.top05 { margin-top: 5px; }
.top10 { margin-top: 10px; }
.top15 { margin-top: 15px; }
.top20 { margin-top: 20px; }
.top30 { margin-top: 30px; }
.top50 { margin-top: 50px; }

.btm05 { margin-bottom: 5px; }
.btm10 { margin-bottom: 10px; }
.btm15 { margin-bottom: 15px; }
.btm20 { margin-bottom: 20px; }
.btm30 { margin-bottom: 30px; }
.btm50 { margin-bottom: 50px; }