@charset "utf-8";
/* CSS Document */
@media screen and (max-width:500px) {
.sp-none02 {display: none;}
.indent_content {padding: 30px 16px;}
.page_thumb {display: none;}
.content {padding: 16px;}
.page_title p {font-size: 5vw; padding-bottom: 10px;}
.indent_content02 {margin-top: 30px;}

/*header*/
	header .sp_box {display: flex; align-items: center; position: fixed; top: 0; left: 0; width: 100%; height: 60px; background: #e07e20; padding: 16px; box-sizing: border-box; line-height: 1; z-index: 100;}
	header .sp_box .txt01 {font-size: 4.5vw; margin-bottom: 0;}
	header .sp_box .txt02 {font-size: 3.5vw; margin-top: 2%;}
	.front_main_box {margin-top: 60px;}
	.front_main_box .txt02 {bottom: 20px;}
	header .front_contact {display: none;}
	.global_nav_bg {display: none;}
	.swiper-slide img {height: 100%; background-size: cover; object-fit: cover; object-position: top center; position: absolute; min-width: inherit; left: inherit; margin: inherit;}
	.swiper-container {height: 100%;}
	

/*ハンバーガー*/	
	#nav-toggle {
  position: fixed;
  top: 6px;
  right: 5%;
width: auto;
  cursor: pointer;
  font-size: 2.5vw;
color: #fff;
}
#nav-toggle .nav_bar{
	width:25px;
	height:20px;
	margin-top:10px;
	}	
#nav-toggle > div {
  position: relative;
  width: 100%;
}
#nav-toggle span {
  width: 100%;
  height: 2px;
  left: 0;
  display: block;
  background: #000;
  position: absolute;
  transition: transform 0.3s ease-in-out, top 0.5s ease;
  /* #nav-toggle close */
}
#nav-toggle span:nth-child(1) {
  top: 0;
}
#nav-toggle span:nth-child(2) {
  top: 9px;
  width: 100%;
}
#nav-toggle span:nth-child(3) {
  top: 18px;
  width: 100%;
}

.open #nav-toggle span:nth-child(1) {
  top: 10px;
  transform: rotate(45deg);
background-color: #fff;
}
.open #nav-toggle span:nth-child(2) {
  top: 10px;
  width: 0;
  left: 50%;
background-color: #fff;
}
.open #nav-toggle span:nth-child(3) {
  top: 10px;
  transform: rotate(-45deg);
background-color: #fff;
}

/* z-index */
#nav-toggle {
  z-index: 1000;
top: 10px;
}

#container {
  z-index: 900;
}

#gloval-nav nav {
  z-index: 999;
}

#gloval-nav {
  background: url("img/sp/hum_bg.jpg")top center no-repeat;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 990;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 3.5vw;
  padding-left: 0;
  transform: translateX(-100%);
  transition: transform .7s cubic-bezier(0.215, 0.61, 0.355, 1);
}
#gloval-nav .logo{
		width: 45%; 
		margin:0 auto;
}
#gloval-nav .bg02{
	width: 20%; 
	position:absolute;
	right:20px;
	bottom:30px;	
}	


.open #gloval-nav {
  transform: translateX(0);
}

#gloval-nav a {
  display: inline-block;
  text-decoration: none;
  padding: 3% 0;
  transition: color 0.6s ease;
}
	

	
#gloval-nav ul {
  list-style: none;
padding: 0 16px;
letter-spacing: 3px;
}
#gloval-nav ul li {
  position: relative;
  width: 100%;
  border-bottom: 1px dashed #fff;
color: #fff;
}

.nav-bg {
  opacity: 0;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
  transition: all 1s ease;
}
.nav-bg.active {
  opacity: 1;
}
#pop_banner {
padding: 0;
z-index: 50;
background: none;
width: 100%;
border: none;
bottom: 0;
position: fixed;
}
	.pan {padding: 20px 16px 0; margin-top: 60px;}
	.page_title {font-size: 4.5vw; margin-top: 30px;}
	.min_page_title {font-size: 3.5vw; margin: 10px auto 30px;}


/*header*/
	header .head_nav {display:none;}
	header .head_nav02 {display:none;}
	header h2 img {width:55%; padding: 5px 0px 5px 10px ;}
	header {background:#fff; position:fixed; top:0; height: 60px;}
	.front_main_box .logo {width:45%;}
	.front_main_box .food05 {position:absolute; right:10px; top:20px; width:15%s;}
	.front_contact_box {display:none;}
	.front_main_box {background: url(img/sp/main_bg.jpg)center bottom no-repeat; position:relative; background-size: cover;}
	.front_main_box .item01 {bottom:-35px; width: 60%;}
	.front_main_box .item02 {bottom: 15px; max-width: 500px; left: -45px;}
	.front_main_box .item03 {left: 10px; width: 90%; margin: 0; bottom: 235px;}
	.front_main_box .food {position:absolute; top: 20px; left: 0;}
	.front_main_box.inview .food {animation-delay: 1.6s;}
	.front_main_box .icon {position: absolute; bottom: 0; width: 90%; left: 0; right: 0; margin: auto;}
	.front_main_box.inview .logo {transition-delay: 2.4s;}
	.front_main_box.inview .icon {transition-delay: 2s; animation-delay: 2s}
/*index*/
	#index .box01 h2::after {display:none;}
	#index .box01 .inner {padding-right:0;}
	#index .box01 h2 p {font-size:7vw;}
	#index .inner .gifu {position: absolute; width: 60%; right: 0; left: 0; margin: auto; top: 0;}
	#index .box01 .txt_box p {writing-mode: vertical-rl; font-size:3.5vw; marign-right:0;}
	#index .box01 .inner {writing-mode: inherit;}
	#index .box01 .f_text {writing-mode: vertical-rl;}
	#index .box01 .icon06 {right: 0; bottom: 0; width: 20%; top: 0; margin: auto;}
	#index .box01 .icon04 {top: -20px; bottom: inherit; width: 17%; left: inherit; right: 5%;}
	#index .box01 .icon03 {left: inherit; right: 0; width: 20%; bottom: -30px;}
	#index .box01 .icon05 {right: inherit; bottom: 0; top: inherit; width: 20%;}
	#index .box01 .icon02 {left: 0; top: -10%; width: 17%;}
	#index .box01 h2 {margin-left:10%; z-index:10;}	
	#index .box01 .txt_boxs {display:flex;}
	#index .box01 .sp-txt_boxs {display:none;}
	#index .box01 .txt_box p {font-size:3vw; margin-right:0;}
	#index .box01 .txt_box {margin-right:0;}
	#index .box01 .f_text:nth-child(2),#index .box01 .f_text:nth-child(3) {margin-top:50px;}
	#index .box01 .f_text {transition-delay: .4s;}
	#index .box01 .f_text:nth-child(3) {transition-delay: .1s;}
	#index .box01 .btn {font-size: 4vw; width: 100%; height: auto; padding: 15px 0; background-size: 1.5%; margin-top: 30px;}
	#index .box02 h2::before,#index .box02 h2::after {display:none;}
	#index .box02 h2 { font-size: 5vw; margin-bottom: 0;}
	#index .box02 ul {flex-wrap:wrap; padding:0 16px;}
	#index .box02 .title_box {padding: 15px 0; margin-bottom: 30px;}
	#index .box02 li {margin-right: 4%; width: 48%; display: block;}
	#index .box02 li:nth-child(2n) {margin-right:0;}
	#index .box02 li:nth-of-type(1)::after,#index .box02 li:nth-of-type(2)::after,#index .box02 li:nth-of-type(3)::after,#index .box02 li:nth-of-type(4)::after {display:none;}
	#index .box02 li:nth-child(n + 3) {margin-top: 20px;}
	#index .box02 li p {font-size: 4vw;}
	#index .box02 li a {font-size: 3vw;}
	#index .box02 ul::before {botrtom:-25px;}
	#index .box02 {padding-bottom: 30px;}
	#index .box02 .coming_box {font-size: 3.5vw;}
	#index .box03 h2 {display:block; font-size: 6vw; text-align: center;}
	#index .box03 h2::before,#index .box03 h2::after {display: none;}
	#index .box03 .min {font-size: 3.5vw; margin: 10px auto 14px;}
	#index .box03 .inner::before,#index .box03 .inner::after {display:none;}
	#index .box03 .sp_img {margin-bottom: 30px;} 
	#index .box03 .inner {display:block;}
	#index .box03 .btn {width:100%; font-size: 3.5vw; height:60px;}
	#index .box03 .btn .icon_box {height: 100%; width: 20%;}
	#index .box03 .btn .icon_box img {width: 80%;}
	#index .box03 .btn:nth-of-type(2) {margin-top: 10px;}
	#index .box03 .inner .arrow {width: 10%;}
	#index .c_img {display: none;}
	#index .box06 h2::before, #index .box06 h2::after {display:none;}
	#index .box06 h2 {margin-bottom: 30px; font-size: 6vw;}
	#index .box06 .inner {display:block; text-align:center; padding: 20px 0;}
	#index .box06 .inner img {margin: auto; width: 50%;}
	#index .box06 .inner .contact {text-align:center; font-size: 3.5vw;}
	#index .box06 .inner th, #index .box06 .inner td {font-size: 3.5vw;}
	#index .box06 .inner th {vertical-align: middle;}
	#index .box06 .inner .address {line-height: 1.7;}
	#index .box06 .inner table {margin: auto;}
	#index .box06 .inner .contact p {margin-top: 20px;}
	#index .box06 .inner table .last {line-height: 1.5;}
	#index .box06 .inner td {padding-left: 5%; line-height:1.5;}
	#index .box06 iframe {height:200px;}
	#index .box07 h2 {font-size: 5vw; margin-bottom: 30px;}
	#index .box07 a {width: 48%; font-size: 3.5vw; height: 45px; border: 2px solid #fff; border-radius: 5%;}
	#index .box07 .link {flex-wrap:wrap;}
	#index .box07 a span {height: 100%; width: 30%; order-right: 2px solid #fff;}
	#index .box07 a span img {width: 55%;}
	#index .box07 a:nth-of-type(n + 3) {margin-top: 4%;}
/*about*/	
	#about .main {padding: 20px 16px;}
	#about .main .big {font-size: 5vw;}
	#about .main::after {display: none;}
	#about .main .txt01 {font-size: 3.5vw; margin: 14px 0; line-height: 2;}
	#about .main .txt02 {font-size: 3.8vw;}
	#about .box01 {padding-top: 30px;}
	#about .box01 h2 p {font-size: 5vw; border-bottom: 3px solid #0d6e2f;}
	#about .box01 .inner::before {display: none;}
	#about .box01 .inner {display:block; margin-top: 30px; padding: inherit; padding: 30px 16px 24px; margin-bottom: 30px;}
	#about .box01 .inner img {margin-bottom: 10px;}
	#about .box01 .inner p {font-size: 3.5vw; line-height: 2.3;}
	#about .box01 .img_box {flex-wrap: wrap; padding: 0 16px;}
	#about .box01 .img_box img {width: 48%; margin-right: 4%;}
	#about .box01 .img_box img:nth-child(2) {margin-right: 0;}
	#about .box01 .img_box img:nth-child(3) {margin-top: 4%;}
	#about .box01 .sp_txt {font-size: 4vw; line-height: 1.7; margin-top: 26px;}
	#about .box01 .icon02 {margin:10px auto 24px; width:calc(100% - 32px);}
	#about .box02 h2 {font-size: 5vw; margin-bottom: 10px;}
	#about .box02 .title_box {padding: 30px 0;}
	#about .box02 h2::before,#about .box02 h2::after {display: none;}
	#about .box02 .title_box p {font-size: 4vw;}
	#about .link_box {display:none;}
	#about .con01 .icon_text p {font-size: 4vw; padding: 5px 10px;}
	#about .box02 h3 {font-size: 5vw; margin: 20px auto 20px;}
	#about .con01 .inner {display: block; padding: 0 16px;}
	#about .con01 .img01 {margin-right: 0; margin-bottom: 10px;}
	#about .con01 p {font-size: 3.5vw; line-height: 2.3;}
	#about .con01 .bnr {height: 180px; margin-top: 30px;}
	#about .con01 .bnr p:nth-of-type(1) {font-size: 3.5vw; padding: 5px 10px;}
	#about .con01 .bnr p:nth-of-type(2) {font-size: 4.5vw;}
	#about .con01 .bnr::before,#about .con01 .bnr::after {display: none;}
	#about .con01 .bnr img {width: 70%;}
	#about .box02 {padding: 50px 0 0;}
	#about .e_bnr {padding-top: 16px;}
	#about .e_bnr .big {font-size: 6vw; line-height: 1.5;}
	#about .e_bnr .txt01 {font-size: 3vw; margin: 14px 0 20px; line-height: 2.3;}
	#about .e_bnr .txt02 {font-size: 4vw; padding: 10px 0;}
	#about .e_bnr::after,#about .e_bnr::before {display: none;}
	
/*merit*/
	#merit .main .over {padding: 26px 16px 0;}
	#merit .main .over p {padding-left: 10px; font-size: 5vw;}
	#merit .main .over .con {display: block; margin-top: 0;}
	#merit .main .over .gifu {display: none;}
	#merit .main .over .con img:nth-child(1) {width: 90%;}
	#merit .main .under p:nth-child(2)::after {height: 1px;}
	#merit .main .under img {display: none;}
	#merit .main .under {padding: 10px 16px; height: inherit;}
	#merit .main .under p:nth-child(1) {font-size: 3.5vw; line-height: 1;}
	#merit .main .under p:nth-child(2) {font-size: 5vw; line-height: 1; margin-top: 5px;}
	#merit .box01 {padding: 20px 16px; height: inherit;}
	#merit .box01 p:nth-child(1) {font-size: 5vw; line-height: 1.7; text-align: center;}
	#merit .box01 p:nth-child(2) {margin-top: 10px; font-size: 3.5vw;}
	#merit .box02 {padding: 20px 16px;}
	#merit .box02 p:nth-child(1) {font-size: 5vw;}
	#merit .box02 p:nth-child(2) {font-size: 3.5vw; margin: 16px 0 20px;}
	#merit .box02 h2 {font-size: 6vw; line-height: 1.5;}
	#merit .box03 .boxs {padding: 0 16px; display: block;}
	#merit .box03 .box .over {padding: 20px 0;}
	#merit .box03 .box .over p:nth-child(1){font-size: 4vw;}
	#merit .box03 .box .over p:nth-child(2) {font-size: 6vw;}
	#merit .box03 .box .u_txt01 {font-size: 3.5vw;}
	#merit .box03 .box .u_txt02 {font-size: 7vw;}
	#merit .box03 .box2 .over,#merit .box03 .box3 .over {height: inherit;}
	#merit .box03 .box {margin: auto; margin-bottom: 42px; width: 90%;}
	#merit .box03 .con {padding:inherit;}
	#merit .box03 .title {height: 50px;}
	#merit .box03 .title p:nth-child(1) {font-size: 6vw; width: 15%; height: 100%;}
	#merit .box03 .title p:nth-child(2) {margin-left: 3%; font-size: 4vw;}
	#merit .box03 h3::after {display:none;}
	#merit .box03 .inner {display: block; padding: 0 16px;}
	#merit .box03 h3 {margin: 20px auto; font-size: 5vw; line-height: 1.5;}
	#merit .box03 .inner p {font-size: 3.5vw; line-height: 2.3;}
	#merit .box03 .inner img {margin-right: 0; margin-bottom: 10px;}
	#merit .box03 .inner02 img {margin-left: 0;}
	#merit .box03 .banner p:nth-child(1) {font-size: 3.5vw;}
	#merit .box03 .banner p:nth-child(2) {font-size: 5vw; line-height: 1.5;}
	#merit .box03 .banner {height: inherit; padding: 30px 16px; margin-top: 26px;}
	#merit .box03 .banner .img02 {width: 12%; bottom: 5%; right: 3%;}
	#merit .box03 .banner .img01 {width: 11%; left: 3%; top: 65%;}
	#merit .box04 {height: inherit; background-size: cover; padding: 10% 5%;}
	#merit .box04 .txt {padding: 20px 0; border: 3px solid #000;}
	#merit .box04 .txt p:nth-child(1) {font-size: 3.5vw; line-height: 1.5;}
	#merit .box04 .txt p:nth-child(2) {font-size: 3.5vw; line-height: 1.5; margin: 10px 0;}
	#merit .box04 .txt p:nth-child(3) {font-size: 6vw;}
	
		
/*company*/
	#company th, #company td {display: block; padding: 15px; font-size: 4vw; text-align: center;}
	#company th {width: inherit;}
	#company .address,#company .content {line-height: 1.5;}
	#company .sitemap .link_box {margin-top: 30px; padding: 0 16px;}
	#company .sitemap .link_box a,#company .sitemap .link_box a:nth-child(3n) {font-size: 3vw; width: 48%; padding: 12px 0; background: none; margin-right: 4%; padding-left: 2%;}
	#company .sitemap .link_box a:nth-child(2n) {margin-right: 0;}
	#company .sitemap .link_box a:nth-child(n + 3),#company .sitemap .link_box a:nth-child(n + 4) {margin-top: 4%;}
	#company .privacy p {font-size: 3.5vw; line-height: 2; padding: 0 16px; margin-top: 25px;}
	
	
/*contact*/
	#contact .txt p:nth-child(1) {font-size: 3.5vw; line-height: 1.7;}
	#contact .txt a span {font-size: 5vw;}
	#contact .txt a {font-size: 4vw;}
	#contact .txt a::before, #contact .txt a::after {height: 1px;}
	#contact .form .title {height: 50px;}
	#contact .form .title p:nth-child(1) {font-size: 5vw; padding-left: 16px; word-break: keep-all;}
	#contact .form .title::after {width: 40%;}
	#contact .form .title02 {margin-top: 30px; font-size: 5vw;}
	#contact .form img {display: none;}
	#contact_form {width: 100%;}
	#contact_form tr th, #contact_form tr td {display:block;}
	#contact_form tr th {width: 100%;}
	#contact .form_btn {width: calc(100% - 32px); font-size: 4vw; height: inherit; padding: 10px 0; margin: 0px auto 30px;}
	#contact .thanks p {padding: 0 16px; margin-top: 30px;}
	
/*contact_banner*/
	#contact_banner .title_box {padding: 15px 0; margin-bottom: 30px;}
	#contact_banner h2::after,#contact_banner h2::before {display: none;}
	#contact_banner .min p {display: none;}
	#contact_banner h2{font-size: 5vw; margin-bottom: 0;}
	#contact_banner ul {flex-wrap:wrap; padding:0 16px;}
	#contact_banner li {margin-right: 4%; width: 48%; display: block;}
	#contact_banner li:nth-child(2n) {margin-right:0;}
	#contact_banner li:nth-of-type(1)::after,#contact_banner li:nth-of-type(2)::after,#contact_banner li:nth-of-type(3)::after,#contact_banner li:nth-of-type(4)::after {display:none;}
	#contact_banner li:nth-child(n + 3) {margin-top: 20px;}
	#contact_banner li p {font-size: 4vw;}
	#contact_banner li a {font-size: 3vw;}
	#contact_banner {padding-bottom: 30px;}
	#contact_banner .min span {idsplay:none;}
	#contact_banner ul::before {bottom: -25px;}
	
/*footer*/	
	footer {padding:inherit; padding-top: 50px;}
	footer img {width: 70%;}
	footer .copyright {margin-top: 50px; font-size: 3vw; padding: 5px 0;}
	.sp_pop_inner {display: flex; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 100;}
	.sp_pop_inner a {width: 50%;}
	
	
	
	
/*sitemap*/
#sitemap li {font-size: 4vw; line-height: 2;}
	
	
	
	
	
}
@media screen and (max-width:350px) {
header h1 {display: none;}
}


