@charset "utf-8";

/***********************************
  HOKKAISOKEN
  www/about/style.css
***********************************/

@import "/common/css/base.css";
@import "/common/css/shadowbox.css";


/*==================================
  Main Layout
==================================*/

div#contents div#contents-box {margin:30px 20px 0;}
div#contents div#contents-box h3 {padding-bottom:10px;}
div#contents div#contents-box p.styleA {margin:0 5px 25px;}
div#contents div#contents-box p.styleB {margin:0 5px;}

div#contents div#reason-box {margin:5px 5px 30px; background:#fff url(./images/photo02_01.jpg) top right no-repeat; min-height:180px;}
div#contents div#reason-box ul {list-style:none; margin:15px 0 0 5px;}
div#contents div#reason-box ul li {background:url(/common/images/lm01.gif) left no-repeat; padding-left:12px; margin-bottom:5px;}

div#contents div.box {margin:0 5px 30px; border:1px solid #c6d9a0; padding:1px;}
div#contents div.box div.box-inner {background:#e8efd8; padding:5px 5px 10px;}
div#contents div.box div.box-inner dt {width:200px; float:left;}
div#contents div.box div.box-inner dd {padding:7px 20px 0 220px; line-height:1.5;}
div#contents div.box div.box-inner dd p {margin:3px 0 0 250px; background:url(/common/images/lm00.gif) left no-repeat; padding-left:12px;}
div#contents div.box div.box-inner h3 {padding:5px 0 10px 10px;}
div#contents div.box div.box-inner ul {list-style:none; margin:0 15px;}
div#contents div.box div.box-inner li {margin-bottom:10px;}
div#contents div.box div.box-inner li p {margin:5px 0 0 10px;}

div#contents dl#typeB {margin:5px;}
div#contents dl#typeB dt {width:260px; float:right;}
div#contents dl#typeB dd {line-height:1.5; padding-right:280px;}
div#contents dl#typeB dd p {margin-top:15px; background:url(/common/images/lm01.gif) left no-repeat; padding-left:12px;}

div#contents ul#lesson {list-style:none; padding:5px 0 10px;}
div#contents ul#lesson li {margin-bottom:20px;}
div#contents ul#lesson li h4 {margin-bottom:10px;}
div#contents ul#lesson li dt {width:110px; float:left;}
div#contents ul#lesson li dd {padding-left:125px; line-height:1.5;}
div#contents ul#lesson li dd p {margin-top:15px; background:url(/common/images/lm01.gif) left no-repeat; padding-left:12px;}

div#contents dl.typeC dt {width:240px; float:right; padding-bottom:30px;}
div#contents dl.typeC dd {width:370px; float:left; padding-bottom:30px;}
div#contents dl.typeC dd p {padding:0 10px 0 5px;}

div#contents div#loNavi div.inquiry-box {margin-top:30px; border:1px solid #ccc; padding:15px 0 15px 105px;}
div#contents div#loNavi div.inquiry-box dt {width:200px; float:left;}
div#contents div#loNavi div.inquiry-box dd {padding-left:217px;}
div#contents div#loNavi div.inquiry-box dd p a {display:block;}
div#contents div#loNavi div.inquiry-box dd p a:hover {background:transparent;}
div#contents div#loNavi div.inquiry-box dd p a:hover img{visibility:hidden;}
div#contents div#loNavi div.inquiry-box dd p {width:170px; height:35px; overflow:hidden; background:url(./images/btn_inquiry_ov.gif);}

/*----tab----*/
div#loNavi {margin-top:20px;}
div#loNavi .ui-tabs-hide {display: none;}
div#loNavi .ui-tabs-panel {clear:left;}
div#loNavi .ui-tabs-selected img{visibility:hidden;}
div#loNavi ul#tab {list-style:none; height:35px;}
div#loNavi ul#tab li {float:left;}
div#loNavi ul#tab li a {display:block;}
div#loNavi ul#tab li a:hover {background:transparent;}
div#loNavi ul#tab li a:hover img{visibility:hidden;}
div#loNavi li.tab01{background:url(./images/tab01_ov.png) no-repeat;}
div#loNavi li.tab02{background:url(./images/tab02_ov.png) no-repeat;}
div#loNavi li.tab03{background:url(./images/tab03_ov.png) no-repeat;}
div#loNavi li.tab04{background:url(./images/tab04_ov.png) no-repeat;}
div#loNavi div#lo01,div#loNavi div#lo02,div#loNavi div#lo03,div#loNavi div#lo04 {padding-top:20px;}

/*----shadowbox----*/
div#contents div#loNavi ul.images {list-style:none; padding-bottom:20px;}
div#contents div#loNavi ul.images li {width:294px; float:left;}
div#contents div#loNavi ul.images li.none {float:right;}
div#contents div#loNavi ul.images li dt a {display:block;}
div#contents div#loNavi ul.images li dt a:hover {background:transparent;}
div#contents div#loNavi ul.images li dt a:hover img{visibility:hidden;}
div#contents div#loNavi ul.images li dt#image05-01 {width:294px; height:204px; background:url(./images/image05_01_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-02 {width:294px; height:204px; background:url(./images/image05_02_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-03 {width:294px; height:180px; background:url(./images/image05_03_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-04 {width:294px; height:180px; background:url(./images/image05_04_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-05 {width:294px; height:204px; background:url(./images/image05_05_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-06 {width:294px; height:204px; background:url(./images/image05_06_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-07 {width:294px; height:204px; background:url(./images/image05_07_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-08 {width:294px; height:204px; background:url(./images/image05_08_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-09 {width:294px; height:204px; background:url(./images/image05_09_ov.gif);}
div#contents div#loNavi ul.images li dt#image05-10 {width:294px; height:204px; background:url(./images/image05_10_ov.gif);}
div#contents div#loNavi ul.images li dd {font-size:10px; margin:7px 0 0 5px;}


/*==================================
  Side Layout
==================================*/

div#side div#menu-box {padding:20px 0;}
div#side div#menu-box ul {list-style:none;}
div#side div#menu-box ul li {height:32px; overflow:hidden; font-size:0; line-height:0;}
div#side div#menu-box ul li a {display:block;}
div#side div#menu-box ul li a:hover {background-color:transparent;}
div#side div#menu-box ul li a:hover img {visibility:hidden;}
div#side div#menu-box ul li#menu01 {background:url(./images/menu01_ov.gif);}
div#side div#menu-box ul li#menu02 {background:url(./images/menu02_ov.gif);}
div#side div#menu-box ul li#menu03 {background:url(./images/menu03_ov.gif);}
div#side div#menu-box ul li#menu04 {background:url(./images/menu04_ov.gif);}
div#side div#menu-box ul li#menu05 {background:url(./images/menu05_ov.gif);}