@charset "UTF-8";

/*@media screen and (min-width: 641px)and (max-width: 1059px){*/
@media screen and (min-width: 701px) and (max-width: 1059px){
/*@media screen and (min-width: 701px){*/
img.w100{ width: auto; max-width: 100%; height: auto;}
.pc_none { display: none;}
#wrapper{ width: 94%;}

/* -----------------------------------------------------------------------------
 Header
----------------------------------------------------------------------------- */
header{ padding: 25px 20px 5px;}
.logo{  /*width: 40%; height: auto;*/ float: left;}
.logo img{ width: auto; max-width: 100%; height: auto;}


#navi{ text-align:right; padding-top: 40px;}
#navi li{ display:inline; border-right: 1px solid #323232; padding: 0 10px 0 5px;}
#navi li:last-child{ border-right: none;}


/* -----------------------------------------------------------------------------
 nav
----------------------------------------------------------------------------- */

#navi{ white-space: nowrap; overflow:hidden;}

/* -----------------------------------------------------------------------------
 Contents
----------------------------------------------------------------------------- */



/* TOP */

.top #contents{ padding: 0 80px;}

.top .news{ width: 60%; float: left; 
-webkit-box-shadow: 1px 2px 3px 0px rgba(80, 80, 80, 0.4);
-moz-box-shadow:    1px 2px 3px 0px rgba(80, 80, 80, 0.4);
box-shadow:         1px 2px 3px 0px rgba(80, 80, 80, 0.4);}
.top .news h2{ border: 1px solid #A3967B; border-radius: 6px 6px 0 0; color: #fff; text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5); padding: 5px 5px;
font-size: 125%; letter-spacing: 1px;}
.top .news ul{ padding: 15px 20px 15px;}
.top .news li{ border-bottom: 1px solid #78643C; padding: 10px 0;}
.top .news li span{ display:run-in; width: 100%;}
.top .news .more{ text-align: right; padding: 0 20px 15px 0;}
.top .news .more a{ color: #956464;}


.top .bn{ padding: 100px 0 0;}
.top .bn ul{ margin-right: -30px; margin-top: 25px; padding: 0 0 0 3%;}
.top .bn li{ float: left; margin-right: 30px; margin-bottom: 30px; width: 25%;}
.top .bn li img{ width: 100%; min-width: 100%; height: auto;}











/* -----------------------------------------------------------------------------
 Aside
----------------------------------------------------------------------------- */
aside{ width: 30%; float: left; border-right: 1px solid #78643C; border-bottom: 1px solid #78643C; border-top: 1px solid #78643C;
-webkit-box-shadow: 2px 2px 6px 0px rgba(76, 78, 76, 0.68);
-moz-box-shadow:    2px 2px 6px 0px rgba(76, 78, 76, 0.68);
box-shadow:         2px 2px 6px 0px rgba(76, 78, 76, 0.68);
-webkit-border-radius: 0 10px 10px 0px;
-moz-border-radius: 0 10px 10px 0px;
-ms-border-radius: 0 10px 10px 0px;
-o-border-radius: 0 10px 10px 0px;
border-radius: 0 10px 10px 0px;
}
aside .side{ background: #F39800; padding: 8px 15px; color: #fff; font-size: 110%; font-weight: bold; letter-spacing: 2px;
-webkit-border-radius: 0 10px 0 0;
-moz-border-radius: 0 10px 0 0;
-ms-border-radius: 0 10px 0 0;
-o-border-radius: 0 10px 0 0;
border-radius: 0 10px 0 0;
}
aside ul{ padding: 15px 20px 5px;}
aside ul li{ margin-bottom: 15px;}
aside ul li a{ text-decoration:underline !important;}
aside ul li a:hover{ text-decoration: none!important;}
aside li ul{ margin-top: 5px; padding: 0 20px;}
aside li li{ margin-bottom: 5px;  text-indent:-10px; padding-left: 10px;}
aside li:before{ content: '▶'; font-size: 60%; vertical-align:middle; margin-right: 2px;}
aside .title{ color: #036EB8; font-size: 110%; border-bottom: 1px solid #dedac4; letter-spacing: 1px; padding: 15px 10px 5px; margin:0 15px;}
aside .current a{ color: #036EB8 !important; text-decoration:none !important;}
aside li li:before{ content: '└'; margin-right: 5px;}






/* -----------------------------------------------------------------------------
 Sub
----------------------------------------------------------------------------- */
/* Common */
.sub #contents{ margin-top: 30px;}
#contentbox{ width: 60%; float: left; margin-left: 30px;}
.sub .cat{ background: #5f7f66; border-bottom: 8px solid #31442e; padding: 15px 15px; color: #fff; font-size: 125%; letter-spacing: 2px;
-webkit-border-radius: 8px 8px 0 0;
-moz-border-radius: 8px 8px 0 0;
-ms-border-radius: 8px 8px 0 0;
-o-border-radius: 8px 8px 0 0;
border-radius: 8px 8px 0 0;
margin-bottom: 25px;
}
.sub .cat strong{ background: url(/shared/img/title_icon.gif) no-repeat left; padding: 3px 0 5px 25px; vertical-align:middle;}
.sub .pagetitle{ background: #F5F0E4; border-bottom: 1px solid #036EB8; padding: 5px 15px; color: #3E3A39; font-size: 120%; letter-spacing: 2px; margin-bottom: 20px;}


/* History*/
table.style01 th,table.style01 td{ vertical-align:middle;}
table.style01 th{display:block; float: left; padding: 15px 15px 0 0;}
table.style01 td.month{ display:block; padding: 15px 0 0 0;}
table.style01 td.text{ width: 100%; display:block; border-bottom: 1px dashed #2EA7E0; padding: 0 0 5px 0;}



/* -----------------------------------------------------------------------------
 Footer
----------------------------------------------------------------------------- */
footer{ margin-top: 100px; text-align:center; padding-bottom: 50px;}
footer address{ margin-top: 5px;}

}



/* -----------------------------------------------------------------------------
 パン・ごはんの紹介
----------------------------------------------------------------------------- */
@media screen and (max-width: 785px){
/* Kondate */
.kondate .block{ margin-right: -30px;}
.kondate .block li{ width: 40%; margin-right: 30px; float: left;}

}
@media screen and (max-width: 350px){
/* Kondate */
.kondate .block{ margin-right: 0;}
.kondate .block li{ width: 100%; margin-right: 0;}

}

/* -----------------------------------------------------------------------------
 
----------------------------------------------------------------------------- */