@charset "UTF-8";
/* CSS Document */
body {
  background-color: #111;
}
.hero_image_cafe {
	background-image:url("../images/01_cafe/cafe_top_pc.jpg");
  width: 100%;
	height: calc(100vh - 50px);
  background-size: cover;
	background-position:bottom;
}
.hero_image_cafe_filter{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	background-color: rgba(0,0,0,0.30);
	 height: calc(100vh - 50px);
	  width: 100%;
	
}
.hero_image_cafe h2{
font-family: futura-pt,sans-serif;
font-style: normal;
	font-size: 6.0rem;
	letter-spacing: 1.3em;
	font-weight: 100;
	padding-left: 1.3em;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
.br_pc_none{
		display: none;
	}
@media(max-width:599px){
	.hero_image_cafe h2{
		font-size: 3.5rem;
	}
	.hero_image_cafe {
	background-image:url("../images/01_cafe/cafe_top_sp.jpg");
  width: 100%;
	height: calc(100vh - 50px);
  background-size: cover;
	background-position:center;
}
	.br_sp_block{
		display: block;
	}
	
}
@media(min-width:600px) and (max-width:1024px){
	.hero_image_cafe h2{
		font-size: 5rem;
	}
	.hero_image_cafe {
	background-image:url("../images/01_cafe/cafe_top_ta.jpg");
  width: 100%;
	height: calc(100vh - 50px);
  background-size: cover;
	background-position:center;
}
	
}


.section_concept h3 {
  font-size: 2.6rem;
  text-align: left;
  font-weight: 100;
  letter-spacing: 1.5rem;
  margin: 60px 0 40px;
}
.section_concept p {
		font-size: 1.8rem;
		 line-height: 4rem;
		margin-bottom: 70px;
	text-align: left;
	width: 555px;
	}
.section_concept__img{
	width: 100%;

}
@media(max-width:599px){
	.section_concept h3 {
	font-size: 1.8rem;
font-weight: 300;
letter-spacing: 0.2rem;
margin: 50px 0 30px;
	}	
	.section_concept p {
	line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
	}

}
@media(min-width:600px) and (max-width:1024px){
	.section_concept h3 {
		font-size: 2.3rem;
		font-weight: 600;
		  letter-spacing: 0.7rem;
	}	
	.section_concept p {
  text-align: left;
  font-size: 1.6rem;
  width: 100%;
  line-height: 3rem;
  font-weight: 100;
  margin-bottom: 80px;
}
	.br_ta_none{
		display: none;
	}
	
}




/*コーヒー----------------------------------------------------------------------------------------------------------------------------------------*/
.section_coffee{
	display: flex;
	margin: 100px 0 ;
}

.coffee_img__pc{
  width: 50%;
  height: 50%;
}
.coffee_img__ta,.coffee_img__sp{
	display: none;
}


.section_coffee h4 {
  font-size: 2.4rem;
  text-align: left;
  font-weight: 100;
margin: 0px 0 40px 40px;
	line-height: 3.2rem;
}
.section_coffee p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 555px;
  line-height: 4rem;
  font-weight: 100;
 padding: 0 40px 0px 40px;
}

@media(max-width:599px){
	.section_coffee{
	display: block;
	margin: 100px 0 ;
}
	.coffee_img__sp{
		display: block;
  width: 100%;
}
.coffee_img__ta,.coffee_img__pc{
	display: none;
}
	.section_concept__img{
		display: none;
	}
	.section_coffee h4 {
	font-size: 1.8rem;
font-weight: 300;
letter-spacing: 0.2rem;
margin: 50px 0 30px;
	}
	.section_coffee p {

 padding: 0 ;
		
		line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
}	
}
@media(min-width:600px) and (max-width:1024px){
	.coffee_img__pc,.coffee_img__sp{
		display: none;
	}
	.coffee_img__ta{
		display: block;
		width:100%;
		margin: 0 auto;
	}
	.section_coffee{
	display: block;
	margin: 100px 0 ;
}
	.section_coffee h4 {
		font-weight: 600;
margin:  40px 0 40px 0 ;
		font-size: 2rem;
	}
		.section_coffee p {
			max-width: 820px;
line-height: 3rem;
 padding: 0 ;
}	
	.br_sp_none,.br_ta_none{
		display: none;
	}
	
}

/*jbsoft----------------------------------------------------------------------------------------------------------------------------------------*/
.section_jb_soft{
	display: flex;
	flex-flow: row-reverse;
	margin: 100px 0 ;
}
.jb_soft_img__pc {
  width: 50%;
  height: 50%;
}
.section_jb_soft h4 {
  font-size: 2.4rem;
  text-align: left;
  font-weight: 100;
margin: 0px 0 40px 40px;
}
.section_jb_soft p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 555px;
  line-height: 4rem;
  font-weight: 100;
	 padding: 0 40px 0px 40px;
}
.jb_soft_img__ta,.jb_soft_img__sp{
	display: none;
}
@media(max-width:599px){
	.section_jb_soft{
	display: block;
	margin: 100px 0 ;
}
	.jb_soft_img__sp{
		display: block;
  width: 100%;
}
.jb_soft_img__ta,.jb_soft_img__pc{
	display: none;
}
			.section_jb_soft h4 {
	font-size: 1.8rem;
font-weight: 300;
letter-spacing: 0.2rem;
margin: 50px 0 30px;
	}
	.section_jb_soft p {

 padding: 0 ;
		
		line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
}	
	
	
	
	
	
	
}
@media(min-width:600px) and (max-width:1024px){
	.jb_soft_img__pc,.jb_soft_img__sp{
		display: none;
	}
	.jb_soft_img__ta{
		display: block;
		width:100%;
		margin: 0 auto;
	}
	.section_jb_soft{
	display: block;
	margin: 100px 0 ;
}
	.section_jb_soft h4 {
		font-weight: 600;
margin:  40px 0 40px 0 ;
		font-size: 2rem;
	}
		.section_jb_soft p {
			max-width: 820px;
line-height: 3rem;
 padding: 0 ;
}	
	.br_sp_none,.br_ta_none{
		display: none;
	}
	
}

/*seasonal----------------------------------------------------------------------------------------------------------------------------------------*/
.section_seasonal{
	display: flex;
	margin: 100px 0 ;
}
.seasonal_img__pc {
  width: 50%;
  height: 50%;
}
.section_seasonal h4 {
  font-size: 2.4rem;
  text-align: left;
  font-weight: 100;
margin: 0px 0 40px 40px;
}
.section_seasonal p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 555px;
  line-height: 4rem;
  font-weight: 100;
	 padding: 0 40px 0px 40px;
}
.seasonal_img__ta,.seasonal_img__sp{
	display: none;
}
@media(max-width:599px){
	.section_seasonal{
	display: block;
	margin: 100px 0 ;
}
	.seasonal_img__sp{
		display: block;
  width: 100%;
}
.seasonal_img__ta,.seasonal_img__pc{
	display: none;
}
		.section_seasonal h4 {
	font-size: 1.8rem;
font-weight: 300;
letter-spacing: 0.2rem;
margin: 50px 0 30px;
	}
	.section_seasonal p {

 padding: 0 ;
		
		line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
}	
}
@media(min-width:600px) and (max-width:1024px){
	.seasonal_img__pc,.seasonal_img__sp{
		display: none;
	}
	.seasonal_img__ta{
		display: block;
		width:100%;
		margin: 0 auto;
	}
	.section_seasonal{
	display: block;
	margin: 100px 0 ;
}
	.section_seasonal h4 {
		font-weight: 600;
margin:  40px 0 40px 0 ;
		font-size: 2rem;
	}
		.section_seasonal p {
			max-width: 820px;
line-height: 3rem;
 padding: 0 ;
}	
	.br_sp_none,.br_ta_none{
		display: none;
	}
	
}	
/*cake----------------------------------------------------------------------------------------------------------------------------------------*/
.section_cake{
	display: flex;
	flex-flow: row-reverse;
}
.cake_img__pc {
  width: 50%;
  height: 50%;
}
.section_cake h4 {
  font-size: 2.4rem;
  text-align: left;
  font-weight: 100;
margin: 0px 0 40px 40px;
}
.section_cake p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 555px;
  line-height: 4rem;
  font-weight: 100;
	 padding: 0 40px 0px 40px;
}
.cake_img__ta,.cake_img__sp{
	display: none;
}
@media(max-width:599px){
	.section_cake{
	display: block;
	margin: 100px 0 ;
}
	.cake_img__sp{
		display: block;
  width: 100%;
}
.cake_img__ta,.cake_img__pc{
	display: none;
}
		.section_cake h4 {
	font-size: 1.8rem;
font-weight: 300;
letter-spacing: 0.2rem;
margin: 50px 0 30px;
	}
	.section_cake p {

 padding: 0 ;
		
		line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
}	
}
@media(min-width:600px) and (max-width:1024px){
	.cake_img__pc,.cake_img__sp{
		display: none;
	}
	.cake_img__ta{
		display: block;
		width:100%;
		margin: 0 auto;
	}
	.section_cake{
	display: block;
	margin: 100px 0 ;
}
	.section_cake h4 {
		font-weight: 600;
margin:  40px 0 40px 0 ;
		font-size: 2rem;
	}
		.section_cake p {
			max-width: 820px;
line-height: 3rem;
 padding: 0 ;
}	
	.br_sp_none,.br_ta_none{
		display: none;
	}
	
}

/*craf_tbeer----------------------------------------------------------------------------------------------------------------------------------------*/
.section_craft_beer{
	display: flex;
	margin: 100px 0 ;
}
.beer_img__pc {
  width: 50%;
  height: 50%;
}
.section_craft_beer h4 {
  font-size: 2.4rem;
  text-align: left;
  font-weight: 100;
margin: 0px 0 40px 40px;
}
.section_craft_beer p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 555px;
  line-height: 4rem;
  font-weight: 100;
	 padding: 0 40px 0px 40px;
}
.beer_img__ta,.beer_img__sp{
	display: none;
}
.concept_bottom_img{
	width: 100%;
}
@media(max-width:599px){
	.section_craft_beer{
	display: block;
	margin: 100px 0 ;
}
	.beer_img__sp{
		display: block;
  width: 100%;
}
.beer_img__ta,.beer_img__pc{
	display: none;
}
			.section_craft_beer h4 {
	font-size: 1.8rem;
font-weight: 300;

margin: 50px 0 30px;
	}
	.section_craft_beer p {

 padding: 0 ;
		
		line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
}	
	.concept_bottom_img{
		display: none;
	}
}
@media(min-width:600px) and (max-width:1024px){
	.beer_img__pc,.beer_img__sp{
		display: none;
	}
	.beer_img__ta{
		display: block;
		width:100%;
		margin: 0 auto;
	}
	.section_craft_beer{
	display: block;
	margin: 100px 0 ;
}
	.section_craft_beer h4 {
		font-weight: 600;
margin:  40px 0 40px 0 ;
		font-size: 2rem;
	}
		.section_craft_beer p {
			max-width: 820px;
line-height: 3rem;
 padding: 0 ;
}	
	.br_sp_none,.br_ta_none{
		display: none;
	}
	
}
/*物販---------------------------------------------------------------------------------------------------------------------------------------------------*/
.section_product h4{
	 font-size: 2.4rem;
  text-align: left;
  font-weight: 100;
margin: 40px 0 40px 40px;
}
.section_product p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 555px;
  line-height: 4rem;
  font-weight: 100;
	 padding: 0 40px 40px 40px;
}
.section_product{
	display: flex;
	flex-flow: row-reverse;
	margin: 100px 0 100px 0;
}

.section_product_text{
	width:555px;
}
.section_product_img{
	width:555px;
}
.section_product_img_01,.section_product_img_02{
	margin: 40px 0 ;
	width: 555px;
}
.section_product_img_01{
	padding-right: 90px;
}
.section_product_img_02{
	padding-left: 90px;
}
.section_product_img_ta,.section_product_img_sp{
	display: none;
}


@media(max-width:599px){
	.section_product{
	display: block;
	margin: 100px 0 100px 0;
}
	.section_product_img_01{
		display: none;
	}
	.section_product_img_02{
		width: 100%;
		padding: 0;
		margin: 0;
	}
.section_product_img{
	width:100%;
}
	.section_product_text{
	width:100%;
}

	
	
		.section_product h4 {
	font-size: 1.8rem;
			  text-align: left;
font-weight: 300;
letter-spacing: 0.2rem;
margin: 50px 0 30px;
	}
	.section_product p {

 padding: 0 ;
		
		line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
}	
	
	
	
	
	
	
	
	
	
	.section_product_img_ta,.section_product_img_02{
	display: none;
}
	.section_product_img_sp{
		display: block;
		width: 100%;
	}
	
	
}

@media(min-width:600px) and (max-width:1024px){
		.section_product{
	display: block;
	margin: 100px 0 100px 0;
}	
	.section_product_img{
		display: none;
	}
	.section_product_img_ta{
		display: block;
		width: 100%;
	}
	.section_product p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 820px;
  line-height: 3rem;
  font-weight: 100;
	 padding: 0 ;
}
	.br_ta_none,.section_product_img_02,.section_product_img_sp{
		display: none;
	}
	.section_product_text{
	width:100%;
}
		.section_product h4{
	 font-size: 2rem;
  text-align: left;
  font-weight: 600;
margin: 40px 0 40px 0px;
}
	
	
	
	
	
	
}



/*空間作り---------------------------------------------------------------------------------------------------------------------------------------------------*/
.section_space h4{
	 font-size: 2.4rem;
  text-align: left;
  font-weight: 100;
margin: 40px 0 40px 0px;
	padding: 0 0px 0px 40px;
}
.section_space p {
  font-size: 1.6rem;
  text-align: left;
  max-width: 555px;
  line-height: 4rem;
  font-weight: 100;
	 padding: 0 40px 0px 40px;
}
.section_space{
	display: flex;
	flex-flow: row-reverse;
}
.section_space img {
	width: 555px;
}
.section_space_text{
	width:555px;
}
.section_space_ta,.section_space_sp{
	display: none;
	
}
@media(max-width:599px){
	.section_space{
	display: block;
}
.section_space h4 {
	font-size: 1.8rem;
			  text-align: left;
font-weight: 300;
letter-spacing: 0.2rem;
margin: 50px 0 30px;
	padding: 0;
	}
	.section_space p {

 padding: 0 ;
		
		line-height:2.5rem!important;
font-size:1.4rem;
 font-weight: 100;
		margin-bottom: 50px;
		 text-align: left;
		  width:100%;
}		
.section_space img {
	width: 100%;
}
.section_space_text{
	width:100%;
}	
	.section_space_sp{
	display: none;
	
}
	.section_space_sp{
		display: block;
		width:100%;
	}
}

@media(min-width:600px) and (max-width:1024px){
	.section_space_ta{
		display: block;
		width: 100%;
	}
	.section_space_sp{
		display: none;
	}
	.section_space{
		display: block;
	}
	.section_space_text{
		width:100%;
	}
	.section_space img {
	width: 100%;
}
	.section_space h4{
	 font-size: 2rem;
  text-align: left;
margin: 40px 0 40px 0px;
	padding: 0;
	font-weight: 600;
}
	.section_space p {
  font-size: 1.6rem;
  text-align: left;
  max-width:100%;
  line-height: 3rem;
  font-weight: 100;
	padding: 0;
}
	.br_ta_none{
		display: none;
	}	
}


/*アテンション------------------------------------------------------------------------------------------------------------------------------------------------*/
.section_attention h3{
font-family: futura-pt,sans-serif;
font-style: normal;
	font-size: 2rem;
	text-align: center;
	font-weight: 600;
	letter-spacing: 1.5rem;
	margin: 100px 0 80px 0;
}
.section_attention ul{
	display: flex;
	flex-wrap: wrap;
	list-style: none;
}
.section_attention li{
	width: 370px;
	text-align: left;
	margin-bottom: 40px;
	padding-left: 60px;
}
.section_attention h5 {
	font-size: 2rem;
	margin-bottom: 20px;
}
.section_attention p {
	margin-bottom: 10px;
	line-height: 4rem;
	padding: 0 20px;
}
.section_attention img{
	width: 50%;
}
@media(max-width:599px){
	.section_attention h3{
 font-size: 2rem;
 text-align: center;
font-weight: 600;
letter-spacing: 1.5rem;
margin: 40px 0 40px 0;
padding-left: 1.5rem;
}
	.section_attention ul{
	display: block;
}
	.section_attention p {
	margin-bottom: 0px;
	line-height: 2.2rem;
	padding: 0 30px;
		font-size: 1.4rem;
}
	.section_attention li{
	padding-left: 0px;
}
	.section_attention h5 {
font-size: 1.8rem;
font-weight: 300;
letter-spacing: 0.2rem;
margin-bottom: 20px;
}
	.section_attention li{
	width: 100%;
}
}
@media(min-width:600px) and (max-width:1024px){
	.section_attention li{
	width: 100%;
	text-align: left;
	margin-bottom: 40px;
	padding-left: 180px;
}
	.section_attention h3{
font-family: futura-pt,sans-serif;
font-style: normal;
	font-size: 2rem;
	text-align: center;
	font-weight: 600;
	letter-spacing: 1.2rem;
	margin: 100px 0 80px 0;
}
	
	
	
}
/*スタッフ紹介------------------------------------------------------------------------------------------------------------------------------------------------*/
.section_staff h3{
font-family: futura-pt,sans-serif;
font-style: normal;
	font-size: 2rem;
	text-align: center;
	font-weight: 600;
	letter-spacing: 1.5rem;
	margin: 100px 0;
}
.staff_introduction{
	display: flex;
}
.staff_introduction__left{
	width: 555px;
}
.staff_img__pc{
	width: 65%;
}
.staff_img__ta,.staff_img__sp{
	display: none;
}
.staff_introduction__left p{
	font-size: 2.2rem;
	letter-spacing: 1.5rem;
	margin-top: 15px;
	
}
.staff_introduction__right{
	width: 555px;
}
.biography,.coment{
	text-align: left;
}
.biography h5,.coment h5{
	font-size: 1.6rem;
font-family: futura-pt,sans-serif;
font-style: normal;
	letter-spacing: 1.5rem;
	margin-bottom: 15px;
}
.coment{
	margin-top: 50px;
}
.coment p,.biography p{
	line-height: 4rem;
}
@media(max-width:599px){
	.staff_introduction{
	display: block;
}
	.staff_img__pc{
		display: none;
	}
	.staff_img__sp{
		display: block;
		width: 100%;
	}
	.staff_introduction__left,.staff_introduction__right{
	width: 100%;
}
	.staff_introduction__left p{
	font-size: 1.6rem;
	letter-spacing: 1.5rem;
	margin:15px 0 40px 0;
		text-align: right;
	
}
	.section_staff h3{
font-family: futura-pt,sans-serif;
font-style: normal;
	font-size: 2rem;
	text-align: center;
	font-weight: 600;
	letter-spacing: 0.5rem;

		
	

margin: 40px 0 40px 0;
padding-left: 0.5rem;
}
	
	.coment p,.biography p{
	line-height:2.2rem;
font-size:1.4rem;
 font-weight: 100;
}
}
	@media(min-width:600px) and (max-width:1024px){
		.staff_introduction{
	display: block;
}
		.staff_img__pc,.staff_img__sp{
			display: none;
		}
		.staff_img__ta{
			display: block;
			width: 100%;
		}
		.staff_introduction__left{
	width: 100%;
}
		.section_staff h3{
font-family: futura-pt,sans-serif;
font-style: normal;
	font-size: 2rem;
	text-align: center;
	font-weight: 600;
	letter-spacing: 1.2rem;
	margin: 100px 0 80px 0;
}
		.staff_introduction__left p{
	font-size: 1.8rem;
	letter-spacing: 1.5rem;
	margin: 15px 0 40px 0;
			text-align: right;
	
}
		.staff_introduction__right{
	width: 100%;
}
		.coment p,.biography p{
	line-height: 3rem;
}
	}