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

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

  min-width: auto;

}
	
.fb_copy_inner{
    min-width: 114rem;

  }
	
.grid figure {

	min-width: auto;

}
	
.cafe_store{

	height: 60vh;
}

	
/* 会社概要 */


.companyinfo{
	width:90%;
	margin:10% auto ;
}

.companyinfo h2{

	font-size: 3.0rem;
	font-weight: 500;
	
	letter-spacing: 5px;
	
	width: 100%;

}



.companyinfo h2 small{

  width: 21%;
 font-weight:800;
	font-size:1.2rem; 
	
	margin-left: 30px;

}


.companyinfo div img{
	display: inline-block;
	width: 45%;
	vertical-align: top;
	margin-top: 0px;
}

.companyinfo div{
	vertical-align: top;
	width: 100%;
}

.companyinfo div:nth-of-type(2){
margin-top: 40px;
	width: 100%;
	margin-left: 0px;
	
}
.companyinfo table{
	width: 100%;

border-spacing:0px 15px ; 
	margin-top:20px;
	
	font-size: 1.6rem;
	line-height: 22px;
}


.companyinfo table th{
	width: 21%;


	letter-spacing: 8px;
padding-right: 10px; 
	padding-bottom: 3px;

	
}

.companyinfo table td{

	padding-bottom: 3px;
}

	
.iframe-wrapper_sp {
	display: inline-block!important;
}
	
	
.iframe-wrapper_pc {
display: none!important;
}
	
.iframe-wrapper_company {

	margin-top: 0!important;
	width: 48%!important;
  padding-bottom: 53%;
  height: 0;
margin-left:20px;
}
	

.iframe-wrapper_company iframe {
  
  top: 0px;
  left: 0;
  width:100%;
  height:100%;
}
	
	

/* 法人営業 */




.busuness h4{

	font-size: 4.0rem;
	

}


}

@media screen and (max-width: 1024px){
	
	
	.cafe_store{

	height: auto;
}
	
	

/* フッター */
footer{
	width: 100%;
	
	padding:20px 50px;
flex-direction:column;
gap:15px 0; 
}


footer div{
width:auto;
	gap:0 30px;
}

footer h2{
font-size:1.9rem; 
margin-bottom: 15px;
}

footer h3{
font-size:1.8rem; 

}

footer address{

font-size:1.6rem; 
line-height: 150%;
}

footer h4{
line-height:150%;
font-weight:600;
}




footer  ul.footer_links{
	justify-content: center;
	font-size: 1.6rem;
	letter-spacing: 2px;
	
	gap:0 60px;
}



footer ul.footer_links li::after{

 top: 50%;
   left:140%;

width:1px;
height:70%;

}





footer small{
margin: 0px 0 0 0;
font-size: 1.3rem;

}


.iframe-wrapper{

    padding-top:40%;
  
}
	
.food_list{
padding:25% 0 0 0;
}	

	
}

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

	 scroll-padding-top:90px;
}
	
	header {

  min-width: 89rem;

}
	
.fb_copy_inner{
    min-width: 85rem;

  }
	
	
	/* 新着情報 */

.info{
	width:100%;
	margin:3% auto 30px ;
	
}


.info ul{
	width: 75%;
	
margin: 0 auto 0 18%;
}

.info ul li{
	
	padding: 20px 0px;

}

.info ul a li{

transition-duration: 0.7s;
	
}



.info ul li span{

	font-weight:800;
	font-size:1.2rem; 
	margin-left: 10px;
}
	
	.info ul li p{
display: block;
		width: 80%;
	font-size:1.6rem; 
	margin-left: 10px;
		line-height: 22px;
}

.info ul li h3{

	font-weight:800;
	font-size:1.5rem; 
	
	margin-left: 10px;

}

.info  h4{

	font-weight:800;
	font-size:1.8rem; 

}




.info ul li span::before{

	width:80px;
	height: 80px;

		left:-120%;top:-60%;
}




.info ul li::after,.info h4:after{

	
	width:8px;height:8px;
	right:1%;top:50%;
	margin-top:-4px;
	
}
.info ul li:hover::after{

	right:0.8%;top:50%;
	transition-duration: 0.7s;
}



.info ul li::before,.info h4:before{
width:12px;
	
	right:1.2%;
	top:50%;
	transition-duration: 0.7s;
}

.info ul li:hover::before{
width:16px;
	right:1.0%;
	
}

.info h4:after{
transition-duration: 0.7s;
	right:-25%;top:50%;
	
	
}
.info h4:before{
transition-duration: 0.7s;
	right:-20%;
	top:50%;
}


.info h4:hover::after{

	right:-28%;top:50%;
	
	
}
.info h4:hover::before{
width:16px;
	right:-23%;
	top:50%;
}

	
	
/* auショップ */

.store{
	width:90%;
	

}

.store h2{

	font-size: 3.0rem;
	font-weight: 500;

	letter-spacing: 5px;
	width: 100%;
}

.store h2 small{

	font-weight:800;
	font-size:1.2rem; 

	margin-left: 30px;
}

.store  h3{

font-size: 2.2rem;
font-weight: 600;

letter-spacing: 4px;
}


.store h3 img{
	margin-top: 10px;
width: 30%;
}
.store div{

	width: 30%;
	
}

.store div:nth-of-type(2){

	width: 65%;
	
}





.store ul.au_store{
width: 100%;

}
.store ul.au_store li{

	width: 49%;
	
	margin-bottom: 15px;
	
}
.store ul.au_store li a{
	width:100%;
	height: 140px;

	
}

.store ul.au_store li img{
	width:100%;
	transition-duration: 0.7s;
}

.store ul.au_store li:hover img{
opacity: 0.6;
  transition-duration: 0.7s;
}

.store ul.au_store li span{

	margin-top: 5px;
	font-size: 1.4rem;
	letter-spacing: 1px;
	font-weight:500;
	
}
	
	
	
	
div.au_info{
	width: 100%;
	
}



	div.au_info span img{
	
	width: 80%!important;

}
	
div.au_info span{
	
	width: 48%!important;

	margin: 0 0 100px 0;
}
	
	div.au_info span ul{

		width: 90%!important;
}

	div.au_info span li{
font-size: 1.6rem;
		width: 100%!important;
}

	
	/*  飲食店 */

	
.grid figure figcaption {
	padding: 2em;

	font-size: 0.9em;
	
}
	
figure.effect-bubba figcaption::before,
figure.effect-bubba figcaption::after {
	
	top: 10px;
	right: 10px;
	bottom: 10px;
	left: 10px;
	
}
	
	figure.effect-bubba figcaption::before {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: scale(0,1);
	transform: scale(0,1);
	top: 10px;
	right: 10px;
	bottom: 10px;
	left: 10px;
}
	
	figure.effect-bubba p {
	padding: 10px 2.5em;

}
	
	
	
/* 店舗紹介 */

.shoplist{
	width:90%;
	margin:5% auto ;

}
	
	.food_list{
	padding:15% 0 0 0;
}	

.cafe_store h2.foodtitile{

	font-size: 3.0rem;

}



.cafe_store h2.foodtitile small{
 
  width: 17%;
 font-weight:800;
	font-size:1.2rem; 
	
	margin-left: 30px;

}

.shoplist div{
margin:1% auto 5% auto;
	

}


.shoplist div h3{

	font-size: 2.2rem;
	font-weight: 600;
	letter-spacing: 4px;
	margin-bottom: 30px;
	
}



.shoplist  h4{

	font-weight: 600;
	font-size: 6.5rem;


}

.shoplist div span{
	

	width: 100%;

}

.shoplist div span:nth-of-type(2){
margin-left: 0%;
	margin-bottom: 5%;
}


.shoplist div span ul{
font-size: 1.6rem;


}

.shoplist div span li{
line-height: 24px;
	margin-bottom: 15px;
letter-spacing: 2px;
	
	padding-bottom: 3px;

}


.shoplist div span li::before{

	font-weight: 600;
	margin-right: 10px;
}


.shoplist div span ul.cafe li img{
width: 3%;
	
	margin-right: 30px;
}

.iframe-wrapper {

  padding-bottom: 40%;

}

.slider-nav figure{
	margin-right: 10px;
}
	
.companyinfo{
	
	margin:13% auto ;
}
	
	
.companyinfo h2 small{

  width: 23%;
 font-weight:800;
	font-size:1.2rem; 
	
	margin-left: 30px;

}

	

/* フッター */
footer{
	width: 100%;
	
	padding:20px 50px;
flex-direction:column;
gap:15px 0; 
}


footer div{
width:auto;
	gap:0 30px;
}

footer h2{
font-size:1.9rem; 
margin-bottom: 15px;
}

footer h3{
font-size:1.8rem; 
	width: 100%;
margin-bottom:10px;
}

footer address{

font-size:1.6rem; 
line-height: 150%;
}

footer h4{
line-height:150%;
font-weight:600;
}




footer  ul.footer_links{
	justify-content: center;
	font-size: 1.6rem;
	letter-spacing: 2px;
	
	gap:0 60px;
}



footer ul.footer_links li::after{

 top: 50%;
   left:140%;

width:1px;
height:70%;

}





footer small{
margin: 0px 0 0 0;
font-size: 1.3rem;

}

	

/* 採用情報 */


.recruit{
	width:90%;
	margin:20% auto ;

}

.recruit h2{

	font-size: 3.0rem;
	font-weight: 500;
	letter-spacing: 5px;
	
	width: 100%;

}



.recruit h2 small{

  width: 21%;
 font-weight:800;
	font-size:1.2rem; 
	
	margin-left: 30px;

}



.recruit  h3{

	font-size: 4.0rem;

	width: 100%;
	line-height: 120%;
margin-top: 30px;
}

.recruit  p{
	width: 90%;
line-height: 25px;
letter-spacing: 2px;
	margin: 30px auto 50px auto;
	font-size: 1.9rem;
	
}
	
		.recruit  p br{
		display: none;
	}

.recruit div h4{

	font-weight: 500;
	font-size: 2.0rem;
letter-spacing: 5px;
padding:0px 10px;

	margin: 0;
	
	top: -4%;
	left: 20px;
}

.recruit h5{

	font-weight:600;
	font-size: 2.5rem;
letter-spacing: 7px;
	width: 100%;

	margin-top: 5%;
}

.recruit h5::after{

	width:80%;
	height:10px;
	bottom:5px;
left: 50%;
  
}

.recruit div{

	width: 90%;
	margin:70px auto 50px auto;
	
}

.recruit div:nth-of-type(2){

	width: 90%;
	margin:50px auto;

	

}
.recruit table{
width:95%;

border-spacing:0px 20px ; 
	margin:20px auto;

	font-size: 1.6rem;
	line-height: 22px;
	
}

.recruit div:nth-of-type(2) table{
 
	margin:20px auto;


}

.recruit table th{
		width: 23%;

	letter-spacing: 3px;
padding-right: 10px; 
	padding-bottom: 5px;
	
	
}


.recruit div:nth-of-type(2) table th{
	width: 250px!important;
}
.recruit table td{
	width: 82%;

	padding-bottom: 3px;
}

.recruit div:nth-of-type(2) table td{
	width:80%;
}

	
	
/* お問い合わせ */


.faq{
	width:90%;
	margin:20% auto ;
	font-size: 1.4rem!important;

}

.faq h2{

	font-size: 3.0rem;
	font-weight: 500;

	letter-spacing: 5px;
	
	width: 100%;

}



.faq h2 small{
 
  width: 21%;
 font-weight:800;
	font-size:1.2rem; 
	
	margin-left: 30px;

}



.col-form-label{
	max-width:15%!important;

}

.form-control{
	
	font-size:1.4rem!important;
}

	
	

/* 法人営業 */

.busuness{
	width:90%;
	margin:15% auto ;

}

.busuness h2{

	font-size: 3.0rem;
	font-weight: 500;
	
	letter-spacing: 5px;
}



.busuness h2 small{

  width: 17%;
 font-weight:800;
	font-size:1.4rem; 
	
	margin-left: 30px;

}






.busuness h4{

	font-size: 3.0rem;
	line-height: 120%;

margin: 5% 0%;
}


.busuness div{
	width: 100%;
margin: 3% auto;
	
}


.busuness p{
font-size: 2.0rem;
	
	width: 100%;
	
	line-height: 200%;
}

	
}

@media screen and (max-width: 600px){
	
.iframe-wrapper{

    padding-top:100%;
  
}	
	
}
	

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

	 scroll-padding-top:70px;
}
	header {

  min-width: 89rem;

}
	
.fb_copy_inner{
    min-width: 10rem;

  }
	
/* 新着情報 */

.info{
	width:100%;
	margin:3% auto 30px ;
	
}


.info ul{
	width:90%;
	
margin: 0 auto 0 auto;
}

.info ul li{
	
	padding: 10px 0px;

}





.info ul li span{

	font-weight:800;
	font-size:1.2rem; 
	margin-left: 10px;
}
	
	.info ul li p{

		width: 80%;
	font-size:1.4rem; 
	margin-left: 10px;
		line-height: 22px;
}

.info ul li h3{

	font-weight:800;
	font-size:1.3rem; 
	
	margin-left: 10px;

}

.info  h4{

	font-weight:800;
	font-size:1.8rem; 

}




.info ul li span::before{
display: none;
}


/* auショップ */

.store{
	width:90%;
	

}

.store h2{

	font-size: 2.0rem;
	font-weight: 500;

}

.store h2 small{


	font-size:1.0rem; 

	margin-left: 10px;
}

.store h3{

font-size: 1.8rem;
font-weight: 600;
margin-top: 20px;
letter-spacing: 4px;
}


.store h3 img{
	
	margin-top: 0px;
width: 20%;
}
.store div{
display: block;
	width: 100%;
	
}

.store div:nth-of-type(2){

	width: 100%;
	
}





.store ul.au_store{
width: 100%;
margin-top: 30px;
}
.store ul.au_store li{

	width: 49%;
	
	margin-bottom: 15px;
	
}
.store ul.au_store li a{
	width:100%;
	height: 100px;

	
}

.store ul.au_store li img{
	width:100%;
	transition-duration: 0.7s;
}

.store ul.au_store li:hover img{
opacity: 0.6;
  transition-duration: 0.7s;
}

.store ul.au_store li span{

	margin-top: 5px;
	font-size: 1.4rem;
	letter-spacing: 1px;
	font-weight:500;
	
}
	
	div.au_info span img{
	
	width: 80%!important;

}
	
div.au_info span{
	
	width: 100%!important;

	margin: 0 0 30px 0;
}
	
		
div.au_info span:first-of-type{
	
order: 2;
}
	
	div.au_info span:nth-of-type(2){
	
order: 1;
}
	
	
	div.au_info span ul{
margin: auto;

}

	div.au_info span li{
		
font-size: 1.2rem;
		width: 100%!important;
}
	
div.au_info span h5{
	font-size:1.4rem!important;	
margin:20px auto ;

}
/*  飲食店 */
		
.grid figure {
max-width: 220px;
	min-width: 150px;
	width: 48%;

}
	

	
	
.grid figure figcaption {
	padding: 2em;

	font-size: 0.7em;
	
}

	figure.effect-bubba h2 {
	padding-top: 40%;
	
}
	
	
	figure:nth-of-type(2).effect-bubba h2,figure:nth-of-type(4).effect-bubba h2 {
	padding-top: 33%;
	
}
	
	figure.effect-bubba p {
	padding: 10px 2.5em;

}
	
	
	

/* フッター */
footer{
	width: 100%;
	
	padding:20px 50px;
flex-direction:column;
gap:15px 0; 
}


footer div{
width:auto;
	gap:20px 0;
}

footer h2{
font-size:1.9rem; 
margin-bottom: 15px;
}

footer h3{
font-size:2.0rem; 
	width: 100%;
margin-bottom:0px;
}

footer address{

font-size:1.4rem; 
line-height: 150%;
}

footer h4{
line-height:130%;
font-weight:600;

font-size:1.6rem; 
}




footer  ul.footer_links{
	justify-content: center;
	font-size: 1.0rem;
	letter-spacing: 1px;
	
	gap:0 30px;
}



footer ul.footer_links li::after{

 top: 50%;
   left:120%;

width:1px;
height:70%;

}





footer small{
margin: 0px 0 0 0;
font-size: 1.0rem;

}

	
	
/* 店舗紹介 */

.food_list{
	padding:50% 0 0 0;
}	
.cafe_store{
	margin:13% auto 0% auto;

}
	
.cafe_store h2.foodtitile{

	font-size: 2.0rem;

}



.cafe_store h2.foodtitile small{
 
  width: 35%;
 font-weight:800;
	font-size:0.9rem; 

	margin-left: 10px;

}

.shoplist div{
margin:1% auto 5% auto;
	text-align: center;

}


.shoplist div h3{

	font-size: 1.3rem;

	letter-spacing:2px;
	margin-bottom: 10px;
	text-align: left;
	padding-left: 10px;
}



.shoplist  h4{
line-height: 40px;
	font-size: 3.0rem;
	margin-bottom: 10px;

}

.shoplist div span{


	width:90%;

}

.shoplist div span:nth-of-type(2){
margin-left: 0%;
	margin-bottom: 5%;
}


.shoplist div span ul{
font-size: 1.2rem;


}

.shoplist div span li{
line-height: 20px;
	margin-bottom: 15px;
letter-spacing: 1px;
	
	padding-bottom: 3px;

}
.shoplist_br{
display: block;
}

.shoplist div span li::before{

	font-weight: 600;
	margin-right:10px;
}


.shoplist div span ul.cafe li img{
width: 7%;
	
	margin-right: 30px;
}

.iframe-wrapper {

  padding-bottom: 0%;

}

.slider-nav figure{
	margin-right: 10px;
}
	
	
	
/* 会社概要 */


.companyinfo{
	width:90%;
	margin:20% auto ;
}

.companyinfo h2{

	font-size: 2.0rem;
	font-weight: 500;
	
	letter-spacing: 5px;
	
	width: 100%;

}



.companyinfo h2 small{

  width: 42%;

	letter-spacing: 3px;
	font-size:1.0rem; 
	
	margin-left:10px;

}


.companyinfo div img{
	display: inline-block;
	width: 100%;
	vertical-align: top;
	margin-top: 20px;
}

.companyinfo div{
	
	width: 100%;
}

.companyinfo div:nth-of-type(2){

	width: 100%;
	margin-left: 0px;
	
}
.companyinfo table{
	width: 100%;

border-spacing:0px 15px ; 
	margin-top:20px;
	
	font-size: 1.2rem;
	line-height: 22px;
}


.companyinfo table th{
	width: 30%;


	letter-spacing:5px;
padding-right: 10px; 
	padding-bottom: 3px;

	
}

.companyinfo table td{

	padding-bottom: 3px;
}

.iframe-wrapper_company {
  margin-top: 20px!important;
	width: 100%!important;
  padding-bottom: 50%;
  height: 0;
margin-left:0px;
}

.iframe-wrapper_company iframe {
  
  top: 0;
  left: 0;
  width:100%;
  height:100%;
}
	
	
	
/* 採用情報 */


.recruit{
	width:90%;
	margin:20% auto ;

}

.recruit h2{

	font-size: 2.0rem;


}



.recruit h2 small{

  width: 25%;
 
	font-size:1.0rem; 
	
	margin-left: 10px;

}



.recruit  h3{

	font-size: 2.4rem;


margin-top: 30px;
}

.recruit  p{
	width: 90%;
line-height: 20px;
letter-spacing:0px;
	margin: 30px auto 50px auto;
	font-size: 1.2rem;
text-align: left;
}


.recruit div h4{

	font-size: 1.5rem;
letter-spacing: 2px;
padding:0px 10px;

	
	top: -2%;
	left: 20px;
}

.recruit h5{
	font-size: 2.0rem;
letter-spacing: 5px;	margin-top: 5%;
}

.recruit h5::after{

	width:80%;
	height:7px;
	bottom:5px;

  
}

.recruit div{
	

	width: 90%;
	margin:70px auto 50px auto;
	
}

.recruit div:nth-of-type(2){
	

	
	margin:50px auto;

	

}
.recruit table{
width:100%;

border-spacing:0px 20px ; 
	margin:20px auto;

	font-size: 1.4rem;
	line-height: 22px;
	
}

.recruit div:nth-of-type(2) table{

	margin:0px auto;

}

.recruit table th{
		width: 95%;
display: block;
	letter-spacing: 3px;
margin: auto;
text-align: left;
	border: none;
	background-color:#878787;
	padding: 0px 0px 0px 10px;
	color: #fff;
	margin-bottom: 3px;
}


.recruit div:nth-of-type(2) table th{
width: 95%!important;
	

	
}
	
	
	
	
.recruit table td{
	width:95%;
	margin: auto;
display: block;
	border: none;
	padding: 0px 5px;
}

.recruit div:nth-of-type(2) table td{
	width: 95%!important;
	margin: auto;
}

	
		
.recruit .iframe-wrapper{

    padding-top:270%!important;
  
}

	
/* お問い合わせ */


.faq{
	width:90%;
	margin:20% auto ;
	font-size: 1.4rem!important;

}

.faq h2{

	font-size: 2.0rem;
	font-weight: 500;

	letter-spacing: 5px;
	
	width: 100%;

}



.faq h2 small{
 
  width: 30%;

	font-size:1.0rem; 
	
	margin-left: 10px;

}



.col-form-label{
	max-width:100%!important;

}

	
	
	

/* 法人営業 */

.busuness{
	width:90%;
	margin:18% auto ;

}

.busuness h2{

	font-size: 2.0rem;
	font-weight: 500;
	
	letter-spacing: 5px;
}



.busuness h2 small{

  width: 35%;
	font-size:1.0rem; 
	
	margin-left: 30px;

}






.busuness h4{

	font-size: 2.3rem;
	line-height: 120%;

margin: 5% 0%;
}


.busuness div{
	width: 100%;
margin: 3% auto;
	
}


.busuness p{
font-size: 1.5rem;
	
	width: 100%;
	
	line-height: 200%;
}
	
}







@media screen and (max-width: 394px){
	 
		
.grid figure {
max-width: 220px;
	min-width: 100px;

}
	



.busuness h4{

	font-size:1.7rem!important;
	
}

/* フッター */



footer div{
	gap:20px 0;
}



footer h3{
font-size:2.0rem; 
	width: 100%;
}

footer address{

font-size:1.2rem; 
line-height: 150%;
}





footer  ul.footer_links{
	font-size: 1.0rem;
	letter-spacing: 0px;
	
	gap:0 30px;
}



footer ul.footer_links li::after{

 top: 50%;
   left:130%;

width:1px;
height:70%;

}





footer small{
margin: 0px 0 0 0;
font-size: 1.0rem;

}

}



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

.grid figure figcaption {

	font-size: 0.6em;

}

	

.recruit .iframe-wrapper{

    padding-top:330%!important;
  
}
}