/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
object,embed{vertical-align:top;}
legend{display:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
img,abbr,acronym,fieldset{border:0;}

html{background-color: #000;}

body{
	font-family: "Meiryo", "メイリオ", "ＭＳ Ｐゴシック", sans-serif;
	-webkit-text-size-adjust: 100%;
	line-height: 1.8;
	font-size: 100%;
	color: #212121;
	background-color: #eee;
}



/* 小さい画面用の設定-------------- */
@media (max-width:767px){
	body {
		font-size:90%;
	}

}
/* -------------end------------- */


ol, ul{
    list-style:none;
}
fieldset, img{
     border:0;
}

caption, th{
    text-align: left;
}
address, caption, cite, code, dfn, em, strong, th, var{
    font-style: normal; 
    font-weight: normal;
}

hr{
	display:none;
}

html {
	margin-bottom:1px;
	height:100%;
}

* {
    box-sizing: border-box;
}

/* line style　------------------------------*/
/* -----------------------------------------*/

a img{
	border-style:none;
}

a:hover img {
	
	opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

/* link style ------------------------------*/
/* -----------------------------------------*/
a:link {
	color: #212121;
	text-decoration: none;	
}
a:visited {  color: #212121;
	text-decoration: none;	}

a:hover {
	color: #ccc;
	text-decoration: none;
}
a:active {
	color: #ccc;
	text-decoration: none; 
}

.link_line{
	text-decoration: underline;
}

img, video, object {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	border: none;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}


a:active, a:focus,input:active, input:focus{outline:0;}



img{
	width: 100%;
	height: auto;
}

iframe {
    vertical-align: bottom;
}
/* ====================================================
header
==================================================== */
.header_outside{
    width: 100%;
    background-color: black;
    text-align: center;
    background-image: url(../img/title_bg.jpg);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 30px;
}



.header{max-width: 1000px;
margin-left: auto;
margin-right: auto;
padding: 30px;

	
}


.header_outside_kasou{
	width: 100%;
	text-align: center;
	background-image: url(../img/title_bg.jpg);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: cover;
	margin-bottom: 30px;
}

.header_kasou{max-width: 1000px;
margin-left: auto;
margin-right: auto;
padding: 30px;
	
}


.h1_img{max-width: 561px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;}


.header_kasou > .h1_img{
margin-bottom: 0px;}

.header_kasou > .h1_img img{width: 400px;
}

	.header_list{
text-align: left;
}

.header_list li:first-child img{width: 200px;}



.tokoutken{font-size: 150%;
font-weight: bold;
	color: #f5bc36;
}

.h2_txt{color: #fff;
font-size: 110%;
line-height: 1.6;
text-shadow: -2px 2px 0 rgba(0,0,0,0.8);}

.dmc_logo{
	width: 8%;
	max-width: 100px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 5px;
}

/* 大きい画面用の設定-------------- */
@media (min-width:768px){
	.header_list{display: flex;

align-items:center;
justify-content: center;}

.header_list li:first-child{margin-left: -20px;}

.header_list li:last-child{margin-left: 20px;}
}
/* -------------end------------- */


/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.header_outside{
	margin-bottom: 20px;
}
.header{
padding: 20px;
	}
	
	
.header_list{
padding-left: 10px;
padding-right: 10px;
	}
	
.header_list li:first-child{display: flex;
justify-content: center;}
	
	
.h2_txt{
font-size: 100%;
}
	
.dmc_logo{
	width: 12%;
	
}


}
/* -------------end------------- */

/* ====================================================
drawer-menu
==================================================== */

.drawer-menu li{
    height: 50px;
	line-height: 50px;
    border-bottom: 1px solid #CCCCCC;
}

.drawer-menu li::before{
   font-family: 'FontAwesome';
  content: "\f054";
	margin-left: 10px;
	margin-right: 10px;

}



/* ====================================================
content
==================================================== */

.content{max-width: 1000px;
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px;}

.title_bar{
    background-color: #000;
    color: #fff;
    padding-top: 5px;
    padding-right: 5px;
    padding-left: 15px;
    padding-bottom: 5px;
    font-size: 120%;
    margin-bottom: 20px;
    border-left: 6px solid #ccc;
}

.title_bar a{
color: #fff;
}

.loupe_icon::before{font-family: 'FontAwesome';
  content: "\f002";
	margin-left: 10px;
	margin-right: 10px;}

.osusume_icon::before{font-family: 'FontAwesome';
  content: "\f087";
	margin-left: 10px;
	margin-right: 10px;}

.map_icon::before{font-family: 'FontAwesome';
  content: "\f041";
	margin-left: 10px;
	margin-right: 10px;}


/* search_list-------------- */
.search_list{
display: flex;
flex-wrap: wrap;
	justify-content: flex-start;
	margin-left: -2%;
	margin-bottom: 30px;


}

.search_list li{
width: 18%;
height: auto;
position: relative;
background-color: #ccc;
	 margin-left: 2%;
	margin-bottom: 20px;
	font-size: 130%;
	
	

}

.search_list li:first-child{
background-color:#D7A4B6;
}

.search_list li:nth-child(2){
background-color:#D9BA97;
}

.search_list li:nth-child(3){
background-color:#AAC09B;
}

.search_list li:nth-child(4){
background-color:#91B8AC;
}

.search_list li:nth-child(5){
background-color:#91AFBB;
}

.search_list li:nth-child(6){
background-color:#9191AD;
}

.search_list li:nth-child(7){
background-color:#A997B0;
}

.search_list li:nth-child(8){
background-color:#C09EB3;
}

.search_list li:nth-child(9){
background-color:#D8AFA7;
}

.search_list li:nth-child(10){
background-color:#D9C69B;
}

.search_list li:nth-child(11){
background-color:#D7A4B6;
}

.search_list li:nth-child(12){
background-color:#D9BA97;
}

.search_list li:nth-child(13){
background-color:#AAC09B;
}

.search_list li:nth-child(14){
background-color:#91B8AC;
}

.search_list li:nth-child(15){
background-color:#91AFBB;
}

.search_list li:nth-child(16){
background-color:#9191AD;
}

.search_list li:nth-child(17){
background-color:#A997B0;
}

.search_list li:nth-child(18){
background-color:#C09EB3;
}

.search_list li:nth-child(19){
background-color:#D8AFA7;
}

.search_list li:nth-child(20){
background-color:#D9C69B;
}




.search_list li :before {
content: "";
display: block;
padding-top: 100%;
}

.search_list li span{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    padding: 0px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    border-radius: 6px;
	-moz-box-shadow: 2px 2px 5px #666;
    -webkit-box-shadow: 2px 2px 5px #666;
    
    box-shadow: 2px 2px 5px #666;
	
	
	line-height: 1.2;
font-weight: bold;
	
    
	
}

.hvr-sweep-to-bottom:before{background-color: #ccc!important;}




/* osusume_list-------------- */
.osusume_list{
display: flex;
flex-wrap: wrap;
	justify-content: flex-start;
	margin-left: -2%;
	margin-bottom: 30px;
}

.osusume_list li{
width: 18%;
height: auto;
position: relative;
	 margin-left: 2%;
	margin-bottom: 20px;

}

.search_list li :before {
content: "";
display: block;
padding-top: 100%;
}

.search_list li span{

    padding: 10px;
    
	font-size: 100%;
}




.osusume_list li span{
display: block;
/*position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;*/
text-align: center;
padding: 0px;
	margin-top: 5px;
/*box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
	display: flex;
  justify-content: center;
  align-items: center;*/
	z-index: 9999;
	line-height: 1.2;
}



.area_map{margin-bottom: 50px;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
	
.content{
padding-left: 10px;
padding-right: 10px;}
	
.title_bar{
   
    padding-top: 5px;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 5px;
	margin-bottom: 10px;
    border-left: 3px solid #ccc;
    
}
	
	
.search_list{
display: flex;
flex-wrap: wrap;
	justify-content: flex-start;
	margin-left: -2%;
	margin-bottom: 15px;


}

.search_list li{
width: 31%;
height: auto;
position: relative;
background-color: #ccc;
	 margin-left: 2%;
	margin-bottom: 15px;

}
	
.osusume_list{
display: flex;
flex-wrap: wrap;
	justify-content: flex-start;
	margin-left: -2%;
	margin-bottom: 15px;
}

.osusume_list li{
width: 31%;
height: auto;
position: relative;
	 margin-left: 2%;
	margin-bottom: 15px;

}
	
	.area_map{margin-bottom: 30px;}

}
/* -------------end------------- */





/* ====================================================
　pagetop
==================================================== */

.pagetop {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 15px;
}
.pagetop a {
    display: block;
    background-color: #ccc;
    text-align: center;
    color: #222;
    font-size: 12px;
    text-decoration: none;
    padding: 5px 10px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}
.pagetop a:hover {
    display: block;
    background-color: #666;
    text-align: center;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    padding:5px 10px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}


/* ====================================================
　footer
==================================================== */
.footer_outside{width: 100%;
background-color: black;
color: #fff;
}

.footer{max-width: 1040px;
margin-left: auto;
margin-right: auto;
text-align: center;
	padding-top: 30px;
	padding-bottom: 10px;
}

/* 大きい画面用の設定-------------- */
@media (min-width:768px){
	.footer_list{display: flex;
justify-content: space-between;
text-align: left;
max-width: 960px;
margin-left: auto;
margin-right: auto;}

.footer_list li:first-child{width: 40%;}

.footer_list li:last-child{width: 40%;}
}
/* -------------end------------- */
/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.footer_list{width: 90%;
margin-left: auto;
margin-right: auto;
	text-align: left;}
	
	.footer_list li{margin-bottom: 20px;}
	

}
/* -------------end------------- */




address{font-size: 80%;}

/* ボタンのスタイル */
.button {
	font-size: 110%;
	font-weight: bold;
	width: 100%;
    height: 60px;
    border-radius: 5px;
    text-align: center;
	
display: flex;
align-items: center;
justify-content: center;
	color: #fef4e9;
	border: solid 1px #da7c0c;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
	background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20')
}

.button a{
   
color: #fff;}


/* マウスオーバー時のカラー */
.button:hover {
   background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
	background: -moz-linear-gradient(top,  #f88e11,  #f06015);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
} 

.button:active {
	color: #fcd3a5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
	background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

/* リンク領域のスタイル */
.button-a {
    display: block;
    text-align: center;
	
	
}


/* マウスホバー時のカラー*/
.button-a:hover {
    color: #fff;
}

/* 大きい画面用の設定-------------- */
@media (min-width:768px){
	.footer_dl dt {
	clear: left;
	float: left;
	width: 8em;
}

.footer_dl dd {
	padding-left: 8em;
	line-height: 1.4;
	
}

}
/* -------------end------------- */
/* 小さい画面用の設定-------------- */
@media (max-width:767px){
		.footer_dl {
	text-align: center;
}

}
/* -------------end------------- */


.footer_c_name{font-size: 110%;
font-weight: bold;}

.footer_c_name a{color: #fff;
text-decoration:none;}


/* ボタンのスタイル */
.button2 {
	font-size: 100%;
	width: 100%;
    height: 40px;
    border-radius: 5px;
    text-align: center;
	
display: flex;
align-items: center;
justify-content: center;
	color: #ccc;
	border: solid 1px #333;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#999));
	background: -moz-linear-gradient(top,  #ccc,  #999);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ccc', endColorstr='#999')
}

.button2 a{color: #000;}


/* マウスオーバー時のカラー */
.button2:hover {
	 background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc));
	background: -moz-linear-gradient(top,  #eee,  #ccc);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#eee', endColorstr='#ccc');
   
} 

/* リンク領域のスタイル */
.button2-a {
    display: block;
    text-align: center;
	
	
}


/* ====================================================
一覧
==================================================== */

.ichiran_list li{
    margin-bottom: 30px;
    border: 1px solid #CCCCCC;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
	background-color: #fff;
}

/* 大きい画面用の設定-------------- */
@media (min-width:768px){
	.ichiran_list{display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.ichiran_list li{
    width: 32%;
    
}
	
.ichiran_list::after{
  content:"";
  display: block;
  width:32%;
}
}
/* -------------end------------- */

.ichiran_flex_box div:first-child{margin-bottom: 10px;}

.ichiran_erea_genre{margin-bottom: 10px;
font-size: 90%;}

.ichiran_erea_genre span{margin-right: 5px;
padding: 3px;
background-color: #666;
color: #fff;}


.ichiran_shop_name{
	border-bottom: 1px solid #CCCCCC;
	margin-bottom: 10px;
	font-size: 120%;
	font-weight: bold;
	
}


/* タブレット画面用の設定-------------- */
@media  (min-width: 481px) and (max-width: 767px){
.ichiran_list{display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
	
	.ichiran_list li{
    width: 49%;
   
}

}
/* -------------end------------- */

/* 小さい画面用の設定-------------- */
@media (max-width:480px){

.ichiran_list li{
    width: 100%;
   
}

}
/* -------------end------------- */

/* ====================================================
詳細
==================================================== */
/* wp枠 */
.wp_side_area{
font-size: 90%;
}



	
/* 大きい画面用の設定-------------- */
@media (min-width:768px){
	.wp_flex_wrap{
	display: flex;
}
	.wp_main_area{
	flex: 3;
	padding-right: 40px;
}

.wp_side_area{
	flex: 1;
	}
}
/* -------------end------------- */

/* 小さい画面用の設定-------------- */
@media (max-width:767px){

	
	.wp_main_area{
		margin-bottom: 30px;
}

}
/* -------------end------------- */








/* サイドバー */

.widgettitle{

	display:inline-block;
	font-size:110%;
	width:100%;
	
	margin-bottom: 7px;
	background-color: #efefef;
	padding: 5px;
	box-sizing: border-box;
}


.wp_side_area li li	{
	margin-bottom: 5px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #333;

	
}

.wp_side_area li li a	{text-decoration: none;}

.wp_side_area li li a:before {
	font-family:'FontAwesome';
  content:'\f054';
	padding-right: 10px;
	padding-left: 5px;
	font-size: 80%;
	
	}	

.wp_side_area ul li.widget	{margin-bottom: 50px}



.shosai_txt{margin-bottom: 20px;}

.shosai_img{margin-bottom: 20px;}


.shosai_dl  {
	margin-bottom: 50px;
}




.shosai_dl dt {
clear: left;
	float: left;
	width: 13em;
}

.shosai_dl dt:before {
	font-family: 'FontAwesome';
  content: "\f111";
margin-right: 5px;
	color: #ccc;
}

.shosai_dl dd {
	padding-left: 14em;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #CCC;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
	.shosai_dl  {
	margin-bottom: 30px;
		margin-left: 10px;
		padding-right: 10px;
}
	
.shosai_dl dt {display: block;
	width: 100%;}

.shosai_dl dd {
	padding-left: 0em;

}

}
/* -------------end------------- */

.coupon_naiyo{
    background-color: #bf0000;
    color: #fff;
    padding-top: 10px;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.coupon_title{
    text-align: center;
    border-bottom: 1px solid #FFFFFF;
	margin-bottom: 10px;
	padding-bottom: 5px;
}

.coupon_title:before {
  font-family: 'FontAwesome';
  content: "\f02b";
	font-size: 150%;
	margin-right: 10px;

}

.coupon_txt{font-size: 110%;
font-weight: bold;}

.coupon_bikou{font-size: 80%;}

/* ====================================================
　フォーム
==================================================== */
.contact_title {
     text-align: center;
	font-size: 180%;
	margin-bottom: 20px;
}
 
.contact_title span{
     position: relative;
     display: inline-block;
     padding: 0 0.5em;
}
      
.contact_title span::before, 
.contact_title span::after{
     position: absolute;
     top: 50%;
     content: '';
     width: 1.5em;
     height: 1px;
     background-color: black;
}
 
.contact_title span::before {left: 100%;}
.contact_title span::after { right: 100%;}

.contact_lead{text-align: center;}










/* ====================================================
　改行位置
==================================================== */
@media print, screen and (min-width: 768px) {
br.sp { display: none; }
br.pc { display: inline; }
}
@media screen and (max-width: 767px) {
br.sp { display: inline; }
br.pc { display: none; }
}


	 
	 


/* PC向けレイアウトの指定：961px以上では固定レイアウト */
.miniimage { display: none; }  /* miniを非表示 */
.bigimage  { display: block; 
line-height: 0px;} /* bigを表示 */
	
@media only screen and (max-width: 768px) {
.miniimage {
	display: block;
	line-height: 0px;
} /* miniを表示 */
.bigimage  { display: none; }   /* bigを非表示 */
}


/*  PCのみに表示するメニュー*/
.only_smt { display: none; }  /* miniを非表示 */
.only_pc  { display: block; 
} /* bigを表示 */
	
/*  スマホのみに表示するメニュー*/
@media only screen and (max-width: 768px) {
.only_smt {
	display: block;
	
} /* miniを表示 */
.only_pc  { display: none; }   /* bigを非表示 */
}

#pageTop{
	
	position:fixed;
	bottom:20px;
	right:20px;
	}