@charset "utf-8";

/*メディアクエリ設定（※widthが767以下の場合にcssを適用する）*/

@media screen and (max-width:768px){

body{
background:#fff;
width:100%;
height:100%;}

#wrapper{
background-color:#FFFFFF;
width:100%;
margin:0 auto;
overflow:hidden;
}
#contents{
width:90%;
margin:0 auto;}
p{
font-size:15px;
text-align:justify;
margin:0 7.5%;}

/*----------------------------------
ヘッダーエリアの設定
----------------------------------*/


/*ヘッダーコンテンツの領域を100パーセントに設定*/

#header{
width:100%;
}	
/*メインロゴ*/
#header h1{
width:190px;
margin:0 auto 0 auto;
padding-top:10px;
}

/*スタッフ募集とお問い合わせ*/
ul#sub_nav {
position:absolute;
top:0;
right:10px;
display:table;
}
ul#sub_nav li a {
font-size:14px;
letter-spacing:0.1em;
width:100px;
padding:5px 10px 5px 0px;
text-align:right;
border-radius:0 0 5px 5px;
}
ul#sub_nav li img{
position:absolute;
top:6px;
right:80px;
width:16px;
height:16px;
}

/*ヘッダーのコンテンツ領域のフローと解除（sitemapの領域確保）*/
#header:after{
visibility:hidden;
height:0;
display:block;
font-size:0;
content:"";
clear:both;
}

/*----------------------------------
グローバルナビゲーションの設定
----------------------------------*/
#menu-box{
width:100%;
border-bottom:none;}
#menu li{
width: 100%;
overflow:hidden;
}
#menu-box ul{
width:100%;
}
#menu-box ul li{
display:block;
width:100%;
height:24px;
font-size:15px;
text-align:center;
letter-spacing:0.1em;
background:#785C4D;
border-top:solid 0.2px #C6B9AA;
padding-top:5px;
float:left;
}
#menu-box ul li:first-child{
border-top:none;
}
#menu-box ul li a{
display:block;
color:#fff;}
#menu-box ul li a span {
display:none;
}
/*レスポンシブメニュー用設定*/
#menu-box #toggle p#menu_moji{
font-size:17px;
font-family: 'Libre Baskerville', serif;
letter-spacing:0.2em;}
#toggle{
display: block;
position: relative;
width: 100%;
background: #AF8E77;
}
#toggle a{
display: block;
padding: 8px 0 6px;
color: #fff;
text-align: center;
text-decoration: none;
}
#toggle:before{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 20px;
margin-top: -10px;
background: #fff;
}
#toggle a:before, #toggle a:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 4px;
background: #AF8E77;
}
#toggle a:before{
margin-top: -6px;
}
#toggle a:after{
margin-top: 2px;
}


/*----------------------------------
トップ画面
----------------------------------*/
#main_img{
width:100%; /* 画像の横幅に合わせて記述 */
/*height:100%; /* 画像の高さに合わせて記述 */
z-index:20;
}
/*----------------------------------
インフォメーションとバナーボックス
----------------------------------*/
#infoBannerBox{
width:90%;
margin:0 auto;
}
/*インフォメーション*/
#information{
margin-top:5px;
width:100%;
}
#information h3{
text-align:center;}
/*バックナンバー*/
#information p#backNumber{
width:90%;
margin-right:0;
}

/*バナー*/
#bannerBox,#bannerBox1{
width:100%;
padding-top:15px;
}
#bannerBox img{
	width:100%;}

/*タイトル部分共通*/

h2 {
width:234px;
height:70px;
display:block;
font-size:14px;
text-align:center;
margin:0 auto;
}
h2 span{
width:100%;
display:block;
font-size:14px;
text-align:center;}

/*Aboutus*/
p.center{
text-align:center;
margin:0 5%;
text-align:justify;
}
#about_img img{
width:100%;
float:none;
}
/*パンへのこだわり*/
#kodawari h3{
width:200px;
margin:25px auto 20px auto;
font-size:25px;
text-align:center;
border-bottom:solid 2px #6A3906;}
.box1 img{
width:95%;
float:none;
text-align:center;
margin:0 2.5%;}
.box1 p{
font-size:15px;
line-height:1.8em;
text-align:justify;}

/*タブ メニュー*/
li.select2{
line-height:1.2em;}
h2#wine{
padding-right:15px;
margin:0 0 0 50px !important;}
#menuArea .tab,
#wineArea .tab2
{overflow:hidden;
width:95%;
height:40px;
display:table;}
#menuArea .tab li,
#wineArea .tab2 li{
display:table-cell;
width:30%;
text-align:center;
}
#menuArea .tab li span,
#wineArea .tab2 li span
{
font-size:10px;
}
.itemBox img{
width:95%;
margin:0 2.5% 10px 2.5%;
}
.itemBox h4{
text-align:center;
margin-bottom:5px;}

/*カフェ*/
img#cafespace{
width:95%;
margin:0 2.5% 10px 2.5%;
float:left;}
.inBox{
padding-bottom:30px;}
.inBox p#coffe img{
float:left;
margin-left:0px;
margin-right:5px;
width:40%;
}
.inBox #coffe_cap{
float:left;
width:55%;}
.inBox #coffe_cap h5{
margin-left:-7px;}

/*モーニングランチ共通*/
#cafeArea .box2{
width:90%;
margin:15px auto;
float:none;
}
#cafeArea .box2_sentence h5{
padding:0 0 0 0;}.box2 > img{
width:50%;
hight:50%;
float:right;}
#cafeArea .box2_sentence{
width:47%;
float:left;
}
p.cap{
margin:0 0 0 0;}
/*モーニング*/
h3#morning{
height:34.3px;
}h3#morning img {
width:100px;
padding:0px;
}
/*ランチ*/
h3#lunch img {
width:75px;
}
.box2_sentence h3 {
text-align:center;
}
.box2_sentence h5 {
text-align:center;
padding-bottom:20px;

}

/*アクセス*/
h2#access img{
width:113px;
margin-top:50px;
}
#accessArea .box1{
margin-top:50px;
width:100%;
}
#accessArea.box1_right{
width:399px;
float:left;
}
.box1_right img{
width:208px;
margin-right:205px;
margin-top:-20px;}
.box1_right p{
line-height:1.6em;
font-size:13px;
margin-left:5%;
}
.box1_right img{
margin-top:-15px;
margin-left:17px;}
.box1_right h5{
font-size:16px;
margin-left:4.8%;
margin-bottom:0px;}
/*アクセスグーグルマップ*/
.ggmap{
display:none;
}
/*マップ*/
.map{
width:90%;
margin:5px auto 0 auto;}
.map p{font-size:11px;
text-align:center;
margin:0px auto 5px auto !important;
color:#686868;}
/*姉妹店*/
#othershopArea{
width:95%;
margin:0 auto;
}
.box_othershop{
width:100%;
margin:0 auto 20px auto;}
.box_othershop img{
width:45%;
height:45%;
}
.box_othershop .textBox{
width:50%;
}
.box_othershop .textBox h5{
margin-top:-5px;}
.box_othershop .textBox h5 a{
margin-left:0;}
.box_othershop .textBox p{
text-align:left;
margin-left:0;
line-height:1.3em;
margin-top:0px;}
a.taragi{
letter-spacing:-0.05em;}

/*フッター*/
footer{
background:#DFD5CE;
overflow:hidden;}
#footerBox{
width:90%;
margin:5px auto 0 auto;
}
footer #footerNab li{
display:none;}

#footerBox #footerId{
width:auto;
float:none;
}
#footerId p.name{
display:block;
padding-top:8px;}
#footerId p{
display:block;
text-align:center;
line-height:1.4em !important;
}
#footerBox #footerId p{
font-size:14px;}
p#copy small{
width:100%;
font-size:8px;
margin:0 0 12px 0;}

p#page-top{
width:40px;
bottom:0;
right:0;
}


/*カフェメニュー*/
#cafecontents{
width:90%;
margin:0 auto;}
#cafemenuArea{
width:100%;
margin:0 auto;}
.cafeBox{
width:100%;}
div.cafeBox_sentence{
width:100%;
float:none;
}
div.cafeBox_sentence p{
text-align:justify;
}
p.cafemenuCap{
margin:0 0;}
.cafeBox_img{
width:100%;
float:none;}
.cafeBox_img img{
width:100%;
}

/*ワインリスト*/
div.winebox_img,
div.cheesebox_img{
float:none;
margin:0 auto;
}

div.winebox_sentence,
div.cheesebox_sentence{
width:100%;
float:none;
height:auto;
}
/*ニュースページ*/
.newsBox{
width:100%;
margin:0 auto;}
div#newstitleBox{
width:100%;}
.newsBox_sentence{
	width:100%;
	margin:0;}
p.newsCap_small{
margin:0 0;}
h3.newstitle{
font-size:20px;}
.backnumberBox,
.newsBox{float:none;}
#tugi{
	width:100%;
	margin-top:10px;
	}
#back{
width:50%;}
#next{
width:50%;}
p.mainimage{
margin:0 0;}
p.mainimage img{
	width:100%;}
h3.newstitle,
.newsBox_sentence p.cafemenuCap
{width:100%;}
div.newsBox_sentence{
width:100%;}
p.toBackNumber{
display:none;
}
h2#newspage{
	width:100%;}
.backnumberBox{
	float:none;
	width:100%;
	margin:0 auto;
	text-align:center;
}
.backnumberBox p{
	text-align:center;
	line-height:1.4em;
	margin-bottom:30pt;}
p.date{
	width:100%;
	margin:0;}
/*コンタクトページ	*/
p.formTitle{
margin-top:20px;}
.contactBox_mailfoam,
.contactBox_sentence{
width:100%;
float:none}
input , textarea{
width:85%;}
contactBox,
p.attention,
.honbun,
.honbun p{
width:100%;}
.contactBox{
width:90%;
height:auto;
margin-bottom:50px;}
.honbun{
display:inline;
text-align:center;
font-size:14px;}
h3.telfax{
	font-size:22px;
	height:25px;}

.contactBox,.uketsuke{
	text-align:center;}
.contactBox_mailfoam{
padding:0;}
p.attention span{
	text-align:center;}
p.attention{
	margin-bottom:20px;}
/*.contactBox_mailfoam{
padding:10px;}
p.formTitle{
	line-height:17px;}
#wrapper{width:100%;
	}
#contents .contactcontents{
	margin-bottom:50px;}
input#yourSubmit{
	margin-bottom:15px;}
.contactBox_mailfoam p{
margin:0;}
input , textarea{
	display:block;
	width:99%;}*/

}