@charset "utf-8";
/*----------------------------------------------------
Reset Layout
----------------------------------------------------*/
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
}
main,article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary{ 
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
/* change colours to suit your needs */
ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}
/* change colours to suit your needs */
mark {
background-color:#ff9;
color:#000; 
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
}
/* change border colour to suit your needs */
hr {
display:block;
height:1px;
border:0;   
border-top:1px solid #ccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
}
/*----------------------------------------------------
Default Layout
----------------------------------------------------*/
html{
overflow-y:scroll;
font-size:62.5%;
}
body{
width:100%;
margin:0;
padding:0;
color:#000;
font-family:Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
line-height:1.6;
letter-spacing:0.125em;
font-size:16px;
font-size:1.6rem;
}
/* --- link --- */
a{
color:#603813;
outline:none;
text-decoration:none;
}
a:link{
color:#603813;
}
a:visited{
color:#603813;
}
a:hover{
color:#d23131;
text-decoration:underline;
}
a:active{
color:#d23131;
text-decoration:underline;
}
a:focus{
color:#d23131;
text-decoration:underline;
}
h1,h2,h3,h4,h5,h6{
margin:0 0 0.5em;
}
p{
margin:0 0 1em;
text-align:left;
}
ul{
margin:0 0 1em;
padding:0;
list-style-position:inside;
}
/*----------------------------------------------------
General Layout
----------------------------------------------------*/
/* --- clear fix --- */
.cf{zoom:1;}
.cf:before,.cf:after{content:""; display:table;}
.cf:after{clear:both;}
.clear{clear:both;}
.img-l,.img-r{
float:none;
margin:0 auto 0.5em;
text-align:center;
}
.layout-l{
text-align:left;
}
.layout-c{
text-align:center;
}
.layout-r{
text-align:right;
}
.txt-small{
font-size:12px;
font-size:1.2rem;
}
.txt-large{
font-size:20px;
font-size:2.0rem;
}
.btn{
text-align:center;
}
#page a:hover img,
#page a:active img,
#page a:focus img{
opacity:0.8;
filter:alpha(opacity=80);
-o-opacity:0.8;
-ms-filter:"alpha(opacity=80)";
-moz-opacity:0.8;
-webkit-opacity:0.8;
transition:opacity .2s linear;
-o-transition:opacity .2s linear;
-ms-transition:opacity .2s linear;
-moz-transition:opacity .2s linear;
-webkit-transition:opacity .2s linear;
}

img {
width:auto; /* IE8 */
}
img {
max-width:100%;
height:auto;
}
/* list */
#main ul{
margin:0 1em 1em 2em;
}
#main ul li{
clear:both;
list-style:disc outside;
padding-left:0.2em;
margin-bottom:0.5em;
}
#main ol{
margin:0 1em 1em 2.2em;
}
#main ol li{
margin-bottom:0.5em;
}
#main ol ul{
margin:0 1em 20px;
}
/* table */
#main table{
margin:0 0 2em;
width:100%;
border:1px solid #c69c6d;
}
#main th,#main td{
padding: 0.5em;
border:1px solid #c69c6d;
}
#main th p,#main td p{
margin:0;
}
#main th{
font-weight:normal;
background:#f6e5d1;
}
#main dl{
clear:both;
width:100%;
}
#main dl dt{
float:left;
clear:both;
width:35%;
margin-bottom:1em;
}
#main dl dd{
width:60%;
border-left:1px solid #c69c6d;
margin:1em 35%;
padding-left:5%;
word-wrap:break-word;
}
/* arrow */
.arrow a{
display:inline-block;
}
#top .arrow a,#top .arrow a:link,#top .arrow a:visited{
background:url("/images/arrow.png") no-repeat 0.1em center;
padding-left:1.0em;
}
#top .arrow a:hover,#top .arrow a:active,#top .arrow a:focus{
background:url("/images/arrow-on.png") no-repeat 0.1em center;
padding-left:1.0em;
}
/* btn-arrow */
.btn-arrow a {
border:2px solid #c69c6d;
border-radius: 4px;
display:inline-block;
padding: 0.2em 0.5em 0.3em;
font-size:14px;
font-size:1.4rem;
}
.btn-arrow a, .btn-arrow a:link, .btn-arrow a:visited {
background: url("/images/arrow.png") no-repeat 0.5em center;
padding-left:1.2em;
}
.btn-arrow a:hover, .btn-arrow a:active, .btn-arrow a:focus {
background: url("/images/arrow-on.png") no-repeat 0.5em center;
padding-left:1.2em;
border:2px solid #e86868;
}
time{
font-size:14px;
font-size:1.4rem;
letter-spacing:normal;
}
/*----------------------------------------------------
Base Layout スマホ
----------------------------------------------------*/
#top #page{
border-top:none;
}
#page{
border-top:10px solid #c69c6d;
}
#top #contents-wrap{
width:100%;
background:url(/images/top-contents-bg.jpg) no-repeat center bottom;
background-size:100% auto;
overflow:hidden;
}
#contents-wrap{
width:100%;
background:url(/images/contents-bg.jpg) repeat-y center top;
background-size:100% auto;
overflow:hidden;
}
#top header{
margin:0;
padding:0 2%;
overflow:hidden;
height:auto;
}
header{
margin:0;
padding:0 2%;
height:100px;
overflow:hidden;
}
#contents{
clear:both;
width:96%;
margin:1.5em auto 1em;
}
#main{
width:100%;
}
section{
margin:0 0 1em;
}
aside#side{
width:100%;
}
footer{
width:100%;
clear:both;
background:#c69c6d;
text-align:center;
padding:1em 0;
}
/*----------------------------------------------------
各要素のデザイン、レイアウト
----------------------------------------------------*/
#top header h1{
float:left;
width:70%;
position:absolute;
top:0.5em;
left:0.5em;
z-index:100;
}
header h1{
position:absolute;
top:1.2em;
left:0.5em;
z-index:100;
}
header .tagline{
width:100%;
text-align:center;
position:absolute;
top:100px;
}
/* unav */
ul#unav{
position:absolute;
top:160px;
right:1em;
margin-left:0.5em;
}
ul#unav li{
list-style:none;
display:inline-block;
letter-spacing:normal;
margin-bottom:0.5em;
}
/* スライドショー */
#slideshow-wrap{
position:relative;
}
#slideshow-wrap .tagline{
width:100%;
text-align:center;
position:absolute;
top:150px;
}
#slideshow-wrap .tagline img{
width:90%;
}
#slideshow {
position:relative;
width:100%;
height:292px;
font-size:0;
}
#slideshow li {
position:absolute;
height:292px;
margin:0;
padding:0;
background-position:center top;
background-repeat:no-repeat;
list-style:none;
}

#main{
margin:0 0 1em;
}
#main h1{
font-size:20px;
font-size:2.0rem;
}
#main h2{
border-left:1px solid #754c24;
line-height:normal;
margin:1em 0;
padding:0.2em 0 0 0.5em;
font-size:20px;
font-size:2.0rem;
color:#c69c6d;
}
#main h2 img{
margin-left:-0.5em;
}
#main h3{
border-bottom:1px dashed #754c24;
padding:0 0.1em 0.5em;
}
aside#side{
border-radius:10px;
background:rgba(255, 255, 255, 0.8);
box-shadow: 0px 0px 10px rgba(96, 56, 19, 0.5);
-moz-box-shadow: 0px 0px 10px rgba(96, 56, 19, 0.5);
-webkit-box-shadow: 0px 0px 10px rgba(96, 56, 19, 0.5);
}
#sidebar{
padding:1em 1em 0 1em;
text-align:center;
}
#sidebar img{
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
}
aside#side ul li{
list-style:none;
margin-bottom:0.5em;
}
footer h2,footer p{
text-align:center;
padding:0 1em;
color:#603813;
}
small{
color:#000;
font-size:10px;
font-size:1.0rem;
letter-spacing:normal;
}
#top #main section{
overflow:inherit;
}
#main section{
position:relative;
padding:2em 1em;
background:rgba(255, 255, 255, 0.8);
border-radius:10px;
box-shadow: 0px 0px 10px rgba(96, 56, 19, 0.5);
-moz-box-shadow: 1px 1px rgba(96, 56, 19, 0.5);
-webkit-box-shadow: 1px 1px 10px rgba(96, 56, 19, 0.5);
overflow:hidden;
}

/* お知らせ */
#main .news h2{
margin:0 2.5em;
border-left:none;
}
#main .news .nasu{
position:absolute;
top:-1.5%;
left:-1.5%;
}
#main .news .ichiran{
text-align:right;
}
#main .news ul{
margin:0;
padding:0.1em 0 0 0;
background:url(/images/dot.png) repeat-x 0 0;
}
#main .news ul li{
line-height:normal;
list-style:none;
margin:0.5em 0;
background:url(/images/dot.png) repeat-x 0 bottom;
}
#main .news ul li p{
margin:0 0 0.5em;
padding:0 0 1em;
}
p.category{
display:inline-block;
background:#2b9332;
color:#fff;
font-size:14px;
font-size:1.4rem;
padding:0 1em 0.1em;
margin:0 0.5em 0 0;
}
/* topicpath */
ul#topicpath li{
display:inline-block;
background:none;
padding:0 0 0 1.5em;
font-size:14px;
font-size:1.4rem;
background:url("/images/topicpath.png") no-repeat left center;
}
ul#topicpath{
margin-bottom:1.5em;
line-height:1;
}
ul#topicpath li.home{
padding:0;
background:none;
}
#topicpath .home a,#topicpath .home a:link,#topicpath .home a:visited{
padding-left:1.5em;
background:url("/images/home.png") no-repeat left center;
}
#topicpath .home a:hover,#topicpath .home a:active,#topicpath .home a:focus{
padding-left:1.5em;
background:url("/images/home-on.png") no-repeat left center;
}
/* pagelink */
#main ul.pagelink{
margin:0 0 2.3em;
letter-spacing: -.40em; /* 隙間を削除 */
text-align:center;
}
#main ul.pagelink li{
display:inline-block;
box-sizing:border-box;
padding:0 0.5em;
border-right:2px solid #603813;
letter-spacing:0.125em; /* 文字間を通常に戻す */
line-height:normal;
font-size:14px;
font-size:1.4rem;
font-weight:bold;
}
#main ul.pagelink li:first-child{
border-left:2px solid #603813;
}
/* pagetop */
.pagetop{
clear:both;
text-align:center;
margin:1.5em auto 1em;
}
/* ページ分割 */
#pagelist{
padding:0 0 20px;
width:100%;
height:30px;
margin:20px auto;
text-align:center;
}
#pagelist a,#pagelist span{
display:inline-block;
line-height:1.6;
letter-spacing:0;
height:30px;
border-radius:30px;
}
a.link_page{
width:30px;
height:30px;
background:#f8dbbb;
}
span.current_page{
background:#603813;
color:#fff;
width:30px;
height:30px;
}
.link_page,.current_page{
margin-left:-5px;
}
.link_before,.pages_number{
margin-right:5px;
}
.topname img{
vertical-align:middle;
margin-left:1em;
}
/* gmap */
.gmap {
position: relative;
padding-bottom: 50%;
padding-top: 1em;
height: 0;
overflow: hidden;
margin:0 1em 1.5em;
} 
.gmap iframe,
.gmapr object,
.gmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height:100%;
}

/*----------------------------------------------------
Media Queriesによる切り替え
----------------------------------------------------*/
/* --- タブレット --- */
@media screen and (min-width: 481px) {
#top #contents-wrap{
width:100%;
background:url(/images/top-contents-bg.jpg) no-repeat center bottom;
background-size:100% auto;
overflow:hidden;
}
#contents-wrap{
width:100%;
background:url(/images/contents-bg.jpg) repeat-y center top;
background-size:100% auto;
overflow:hidden;
}
#top header h1{
float:none;
width:100%;
position:static;
text-align:center;
margin:50px auto 30px;
}
header{
height:auto;
}
header h1{
position:static;
}
header .tagline{
width:100%;
text-align:center;
position:static;
}
/* unav */
ul#unav{
position:absolute;
top:1em;
right:0.5em;
}
/* スライドショー */
#slideshow-wrap{
width:100%;
height:292px;
position:relative;
}
#slideshow-wrap .tagline{
width:100%;
margin:-40px auto;
text-align:center;
}
#slideshow-wrap .tagline img{
width:500px;
}
/* #gnav */
nav#gnav{
width:100%;
height:auto;
margin:0 auto;
}
nav#gnav ul{
background:none;
}
nav#gnav ul li{
float:left;
width:20%;
height:auto;
}
nav#gnav ul li a img{
display:block;
width:100%;
height:auto;
}
nav#gnav ul li a span{/* テキストメニュー非表示 */
display:none;
}
/* お知らせ */
#top #main .news h2{
margin:0 3em 1em;
border-left:none;
padding:0;
}
#main .news .ichiran{
position:absolute;
top:30px;
right:20px;
}
#main .news ul{
margin:0 1.1em;
padding:0.1em 0 0 0;
background:url(/images/dot.png) repeat-x 0 0;
}
#main .news ul li{
line-height:normal;
list-style:none;
margin:0.5em 0;
background:url(/images/dot.png) repeat-x 0 bottom;
}
/* pagelink */
#main ul.pagelink li{
padding:0 2em;
}
.img-l{
float:left;
margin:0 20px 10px 0;
}
.img-r{
float:right;
margin:0 0 10px 20px;
}
}

/* --- PC --- */
@media screen and (min-width: 961px) {
#page{
width:100%;
margin:0;
padding:0;
}
#top #contents-wrap{
width:100%;
background:url(/images/top-contents-bg.jpg) no-repeat center bottom;
background-size:auto auto;
overflow:hidden;
}
#contents-wrap{
width:100%;
background:url(/images/contents-bg.jpg) repeat-y center top;
background-size:auto auto;
overflow:hidden;
}
.inner{
position:relative;
width:960px;
margin:0 auto;
}
#top header h1{
margin:80px auto 30px;
}
header h1{
margin:5px auto 10px;
}
/* unav */
ul#unav{
position:absolute;
top:5px;
right:0;
}
ul#unav li{
list-style:none;
display:inline-block;
}
/* #gnav */
nav#gnav{
width:780px;
height:198px;
margin-bottom:20px;
}
nav#gnav ul{
width:780px;
height:198px;
background:url(/images/gnav.jpg) no-repeat 0 0;
}
nav#gnav ul li{
float:left;
width:156px;
height:198px;
}
nav#gnav ul li a{
display:block;
width:156px;
height:198px;
}
nav#gnav ul li a:hover img,
nav#gnav ul li a:active img{
opacity:0;
filter:alpha(opacity=0);
-o-opacity:0;
-ms-filter:"alpha(opacity=0)";
-moz-opacity:0;
-webkit-opacity:0;
transition:opacity 0.1s linear;
-o-transition:opacity 0.1s linear;
-ms-transition:opacity 0.1s linear;
-moz-transition:opacity 0.1s linear;
-webkit-transition:opacity 0.1s linear;
}
nav#gnav ul li.on a img{
width:0;
height:0;
}
#contents{
width:960px;
margin:30px auto 0;
padding:0;
}
#top #main{
float:left;
width:620px;
padding:0;
margin:0 20px 20px 0;
}
#main{
float:none;
width:960px;
padding:0;
margin:0 0 40px 0;
}
#top #main section{
padding:2em 1.1em;
}
#main section{
padding:2em 2.2em;
}
#main section.news ul li{
display:table;
margin:0;
padding:1em 0;
width:100%;
}
#main section.news ul li time{
display:table-cell;
vertical-align:middle;
width:18%;
}
#main section.news ul li p{
display:table-cell;
margin:0;
padding:0;
}
aside#side{
float:left;
width:300px;
margin:0 0 2em;
padding:0.5em 0 0 0;
}
/* pagetop */
.pagetop{
bottom:10px;
right:10px;
position:fixed;
z-index:10;
line-height:0;
}
/* pagelink */
#main ul.pagelink li{
padding:0 2em;
}
#main ol.message{
margin-left:313px;
}

}
/* --- Retina Display 対応 --- */
@media (-webkit-min-device-pixel-ratio: 2),
       (min-resolution: 2dppx){
#top .arrow a,#top .arrow a:link,#top .arrow a:visited,
.arrow a,.arrow a:link,.arrow a:visited,
.btn-arrow a, .btn-arrow a:link, .btn-arrow a:visited{
background:url("/images/arrow@2x.png") no-repeat 0.5em center;
padding-left:1.2em;
background-size:5px 10px;
}
}