@charset "utf-8";
/* CSS Document */

@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700,900|Noto+Serif+SC|Open+Sans:800");
@import url('https://use.fontawesome.com/releases/v5.0.9/css/all.css');





/* 共通 */

a,
a:hover {
  text-decoration: none;
}

section {
	padding-top:1rem;
	}

	
main {
	text-align:left;
	padding-top:2rem;
	}

.bk_gray {
    background-color: #F8F9F9;
	padding-bottom:1rem;
}

.bk_bge {
	background:rgba(238,221,204,0.5);
	padding:1rem 0;
	}


/*　見出し　*/

#gunma h3 {
	/*display:inline-block;*/
	font-size:1.25rem;
	font-weight:bold;
	font-family:"Open Sans",sans-serif;
	text-align:center;
	letter-spacing:0.2rem;
	margin-bottom:2rem;
	margin-left:auto;
	margin-right:auto;
	}
	
.border-ttl {
    background-image: url(../img/top/img_border.png) repeat-x left bottom; 
    background-size: auto 2px;
    line-height: 1.4;
    padding-bottom: .5em;
    margin-top: .75em;
    margin-bottom: .5em;
}

.ttl01 {
	font-size:1.25rem;
	font-weight:bold;
	font-family:"Open Sans",sans-serif;
}
	
.h3_top {
    /*margin:30px auto;*/
    font-size:  1.5em;       
    position:  relative;    
    font-weight:  normal;   
    display:  inline-block; 
    background-color: #fff; 
    margin-left: 20px;      
    padding: 0 10px;  
	color:#003333;
	text-align:center;    
}
	
.h3-wrap {
    position: relative;     
    margin-bottom:15px;     
}
.h3-wrap:before {
    content:  '';           
    background-color: #003333; 
    display:  block;       
    position:  absolute;    
    left:  0;              
    width:  100%;          
    height:  1px;           
    top: 0;                 
    bottom:  0;            
    margin:  auto;
	text-align:center;          
}	
	

.if_cap01 {
	color:#0090BF;
	font-weight:bold;
	text-align:center;
	margin:0.5rem auto;	
	}
	
.if_cap01a {
	font-weight:bold;
	text-align:center;
	margin-bottom:1rem;
	font-size:1.5rem;
	}
.if_cap02 {
	font-weight:bold;
	text-align:center;
	margin-bottom:1rem;
	margin-top:5rem;
	font-size:2rem;
	}
	
#chumon h4 {
	margin:2rem 0 1rem;
	text-align:center
	}
	
	
#shop h4 {
	font-weight:bold;
	font-family:"Open Sans",sans-serif;
	margin:2rem 0;
	text-align:center;
	font-size:1.25rem;
	}
	
#top-lineup h4{
	color:rgba(0,65,54,1);
	font-size:1rem;
	}
	
.line {
	border:2px solid #888;
	width:5%;
	margin:0 auto;
	}
	
.line02 {
	border:2px solid #888;
	width:10%;
	margin:2rem auto;
	}
	



/*　サブメニュー　*/

.slugMenu{
	/*background:rgba(0,65,54,1);*/
	font-size:11px;
	}
	
.slugMenu ul{
	max-width:1000px;
	margin-left:auto;
	margin-right:auto;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-around;
	-webkit-justify-content: space-around; /* Safari */	
}

.slugMenu ul li {
	width:16.5%
	}
	
.slugMenu ul li a{
	display:block;
	padding:1.25rem 0;
	background:#004136;
	color:#fff;
	text-align:center;
	line-height:1.2;
	border-right:1px solid #fff;
}

.slugMenu ul li a.blog {
	background:#009345;
	}
	
/*.slugMenu ul li a.blog:before {
	content: "\f2d2";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color:#fff;
	padding-right:5px;
}*/

.slugMenu ul li a.l_line{
	border-left:1px solid #fff;
}


.slugMenu ul li a:hover,
.slugMenu ul li.active a{
	background:#377C6F;
}

.slugMenu ul li a.blog:hover {
	background:#69a745;
	}




/* ボタン */

.more a {
	display:block;
	border:1px solid #333;
	padding:0.5rem 1rem;
	}
	
.more a: {
	display:block;
	background:rgba(0,0,0,0.3);
	}
	
.shiryo-nav a:after {
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	padding-left:10px;
}

.address:before {
	content: "\f3c5";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right:10px;
	}

.access:before {
	content: "\f239";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right:10px;
	}

.mail:before {
	content: "\f0e0";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right:10px;
	}
	
.time:before {
	content: "\f017";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	margin-right:10px;
	}
	

.tel {
	font-family: 'PT Serif', serif;
	background: url(../img/common/free2.gif) no-repeat left center;
	background-size: 30px 18px;
	font-size:220%;
	margin: 0 auto;
	padding-left:40px;
	}
	
ul.entry{
	margin:1em 0;
	}

ul.entry li a{
	display:block;
	max-width:500px;
	padding:1.75em;
	}
	
ul.entry li a:after {
	padding-left:20px;
	content: "\f105";
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
}

ul.entry02{
	margin:0.5rem auto;
	}

ul.entry02 li a{
	display:block;
	max-width:500px;
	padding:1rem 0.75rem;
	text-align:center;
	}
	
ul.entry02 li a:after {
	padding-left:20px;
	content: "\f105";
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
}

a.bg-color01 {
	background: #60010b;
	background: -moz-linear-gradient(left, #60010b 0%, #8f0222 48%, #5b0009 100%);
	background: -webkit-linear-gradient(left, #60010b 0%,#8f0222 48%,#5b0009 100%);
	background: linear-gradient(to right, #60010b 0%,#8f0222 48%,#5b0009 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#60010b', endColorstr='#5b0009',GradientType=1 );
	color:#FFFFFF;
	}
	
a:hover.bg-color01 {
	background:#823a3a;
	}

a.bg-color02 {
	background: #424242;
	background: -moz-linear-gradient(left, #424242 0%, #6b6b6b 49%, #444444 100%);
	background: -webkit-linear-gradient(left, #424242 0%,#6b6b6b 49%,#444444 100%);
	background: linear-gradient(to right, #424242 0%,#6b6b6b 49%,#444444 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#424242', endColorstr='#444444',GradientType=1 );
	color:#FFFFFF;
	}
	
a:hover.bg-color02 {
	background:#777373;
	}
	
.lnp_btn a{
	display:block;
	margin:0.5rem 0;
	padding:0.5rem 1rem;
	background:#004136;
	color:#fff;
	text-align:left;
	}
	
.lnp_btn a:hover{
	background:#377C6F;
	}
	
.lnp_btn a:before {
	padding-right:10px;
	content: "\f105";
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
}

/* more */

.more-wrap {
	margin: auto 0 0!important;
	text-align: center!important;
}

.more {
    background: #FFF;
    border: #666 solid 1px;
    font-size: 15px;
    padding-bottom: 2px;
    display: inline-block;
    padding: 0 40px;
    border-radius: 2px;
    position: relative;
	margin-top: 1em;
	margin-bottom: 1em;
}
.more:hover {
	background: #666;
	border: #666 solid 1px;
    color: #FFF;
	text-decoration: none;
}
.more span {
	display: inline-block;
	position: relative;
	padding: 6px 1em 6px 0;
}

.more span::before{
    content: "";
    border-top: #666 solid 2px;
    border-left: #666 solid 2px;
    height: 8px;
    width: 8px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    transform: rotate(135deg);
}
.more:hover span::before{
    border-color: #FFF;
}


.more02 {
    background: #666;
    border: #666 solid 1px;
    font-size: 15px;
    padding-bottom: 2px;
    display: inline-block;
    padding: 0 40px;
    border-radius: 2px;
    position: relative;
	margin-top: 1em;
	color:#FFFFFF;
}

.more02:hover {
	background: #ccc;
	border: #666 solid 1px;
    color: #FFF;
	text-decoration: none;
	color:#666;
}

.more02 span {
	display: inline-block;
	position: relative;
	padding: 6px 1em 6px 0;
}

.more02 span::before {
    content: "";
    border-top: #fff solid 2px;
    border-left: #fff solid 2px;
    height: 8px;
    width: 8px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    transform: rotate(135deg);
}
.more02:hover span::before {
    border-color: #666;
}

.more03 a {
	display:block;
	padding:1rem;
	background:#009345;
	color:#fff;
	text-align:center;
	font-size:1.25rem;
	letter-spacing:0.2em;
	margin-top:10px;
	font-weight:bold;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	box-shadow: 3px 3px 5px #999;
    -webkit-box-shadow: 3px 3px 5px #999;
    -moz-box-shadow: 3px 3px 5px #999;
	border:3px solid #fff;
	
	}

.more03 a:after {
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	padding-left:10px;
}

.more03 a:before {
	content: "\f2d2";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	padding-right:10px;
}
	
.more03 a:hover {
	background:#69a745;
	}
	
	
	
/* top
----------------------------------------------*/

.if01{
	border:1px solid #0090BF;
	padding:1rem 2rem;
	text-align:center;
	margin:2rem 0;
	}

.if01a{
	margin:2rem 0.5rem;
	text-align:left;
	}
	
.if01b{
	border:1px solid #ccc;
	padding:1rem 1rem;
	margin:1rem 0;
	max-width: 530px;
	margin-left: auto;
	margin-right: auto;
	}
	
.info {
	margin:2rem auto;
	border:1px solid #030;
	padding:1rem;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url(http://www.sample.com/PIE/PIE.htc); /* IE用 */
	text-align:center;
	}

.info .if-cao {
	font-size:1.25rem;
	font-weight:bold;
	color:#003300;
}


#info2 {
	/*background-color: #F0E9E9;*/
	margin:1rem auto;
	padding:1rem;
	behavior: url(http://www.sample.com/PIE/PIE.htc); /* IE用 */
	text-align:center;
	}

/* top-lineup
----------------------------------------------*/
	
.ln01{
	padding:1rem;
	border: 1px solid #003333;
	background:#fff;
	margin-bottom:2em;
	}
	
.lineCap {
	color:#003333;
	}
	
.lineCap02 {
	background:rgba(0,51,51,0.8);
	color: #fff;
	font-size:0.7em;
	width:10em;
	text-align:center;
	margin-right: 2px;
	padding: 0 1em;
	}
	
.lineCap03 {
	background:rgba(0,51,51,0.2);
	color: rgba(0,51,51,0.8);
	font-size:0.75em;
	width:10em;
	letter-spacing: 0.1em;
	text-align:center;
	margin-right: 2px;
	}
	
/* chumon 
----------------------------------------------*/

#chumon .fx3-one {
	border:1px solid #ccc;
	padding:1rem;
	margin-top:1rem;
	}
	

	

/* gallery 
----------------------------------------------*/

#gallery li{
	position:relative;
	}
	
#gallery li p{
	position: absolute;
	right:10px;
	bottom:5px;
	font-weight:bold;
	text-shadow:2px 2px 2px #ffffff;
	
	}
	
.wideslider ul {
	position:relative;
}


	
	
/* shop
----------------------------------------------*/


	
.cafe ul li {
	border-bottom:1px dotted #ccc;
	padding-bottom:2px;
	margin-bottom:10px;
	}


.profile-cap02 {
	color: #333333;
	padding-left: 10px;
	padding-top:10px;
	border-bottom: 1px dotted #999999;
	border-left: 5px solid #004136;
	margin-bottom:10px;
	}
	
.carNavi {
	padding:10px 20px;
	background-color: #7A542D;
	color: #FFFFFF;
	text-align: center;
	font-size: 14px;
	}


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

/*　共通　*/
main {
	padding-top:5rem;
	}

.bk_gray {
    background-color: #F8F9F9;
	padding-bottom:4rem;
}

.bk_gray {
    background-color: #F8F9F9;
	padding-bottom:4rem;
}

/*　見出し　*/

#gunma h3 {
	font-size:2rem;
	width:55%;
	}
	
#chumon h4 {
	font-size:1.25rem;
	}
	
	
#shop h4 {
	font-size:1.25rem;
	}
	
#top-lineup h4{
	font-size:1.15rem;
	margin:1rem 0;
	}
	
.line {
	margin:3rem auto;
	}
	
.ttl01 {
	font-size:2rem;
	letter-spacing:0.2rem;
}
	


/* パンくず */

#breadclumbs {
	text-align: left;
	padding: 20px 0 0;
    border-bottom: 1px solid #d8d8d8;
}
#breadclumbs ol li {
	display: inline;
	list-style-type: none;
	color: #666;
	font-size: 80%;
	line-height: 1;
}
#breadclumbs ol li a{
	color: #004136;
}

#breadclumbs ol li a:hover{
	text-decoration:underline;
}

#breadclumbs ol li:before {
	content: "　/　";
	color: #afafaf;
}
#breadclumbs ol li:first-child:before {
	content:"";
}

/*　メニュー　*/

/*.slugMenu ul li {
	width:20%;
	}*/
	
.slugMenu{
	background:rgba(0,65,54,1);
	font-size:16px;
	}

/* ボタン　*/

.more02 span {
	padding: 2em 3em;
}

.frame {
	height:250px;
	}
}