/* @use 'variables' as *;*/
/*----------------------------------------
    top page
------------------------------------------*/
.h_outer {margin-bottom: clamp(20px, 4vw, 60px);}
.h_outer .sec_h {color: var(--c_theme_color);text-align: center;position: relative;font-size: 26px;line-height: 1.2em;padding-bottom: 26px;font-weight: 500;}
.h_outer .sec_h:after {position: absolute;content: attr(data-heading) "";font-size: 0.6em;line-height: 1em;color: #ccc;left: 50%;transform: translateX(-50%);bottom: 0;}

@media screen and (max-width: 835px) {
	.h_outer .sec_h{ font-size: 20px; padding-bottom: 1em;}
	.h_outer .sec_h:after {bottom: 0px;}
}
.section_wrap:not(:last-of-type) {margin-bottom: clamp(60px, 8vw, 140px);}

/* fv
------------------------------------------*/
#fv {position: relative;padding-top: 8vw;margin-bottom: 5vw;}
#fv .fv_inner {display: flex;width: 95%;margin: 0 auto;justify-content: center;gap: 0;align-items: center;position: relative;z-index: 3;}
#fv .fv_inner  img {width: 100%;}
#fv .fv_inner .logo {width: 55%;}
#fv .fv_inner .text_block {width: 45%;position: relative;padding: 0 4%;}
#fv .fv_inner .text_block .text img {width: 100%;}

@media screen and (max-width: 835px) {
	#fv {padding-top: 25vw;margin-bottom: 10vw;}
  	#fv .fv_inner { display: block; width: 100%; overflow: hidden;}
  	#fv .fv_inner .logo {width: 110%; margin-left: -4%;}
  	#fv .fv_inner .text_block {width: 100%; padding: 0; margin-top: -8vw;}
}
#news .news_wrap ul {margin-bottom: 2em;}
#news .cmn_btn_outer {text-align: right;}
#news .single_wrap .cmn_btn_outer {text-align: center;}

#lead{ text-align: center;font-size: min(2vw,20px); line-height: 2em; width: 90%; margin: 0 auto 12vw;
	h2{ font-weight: bold; margin-bottom: 1em; color: var(--c_theme_color); font-size: min(4vw,40px);}
}

@media screen and (max-width: 835px) {
	#lead{ font-size:3.6vw; line-height: 2em;  margin: 0 auto 12vw;
		h2{  font-size:5.5vw;}
	}
}

#about {position: relative;}
#about .ob {position: absolute;}
#about .ob img {width: 100%;}
#about .ob.ob01 {top: -40px;left: 0;width: min(28%, 210px);}
#about .ob.ob02 {right: 0;bottom: -100px;width: min(34%, 280px);}
#about .about_wrap {display: flex;gap: clamp(20px, 2vw, 40px);align-items: flex-start;position: relative;z-index: 3;}
#about .about_wrap .about_block {width: 60%;}
#about .about_wrap .map {width: 40%; aspect-ratio: 1/1; line-height: 0;}
#about .about_wrap .map .gmap{   position: relative; width: 100%; padding-top:75%; height: 0;}
#about .about_wrap .map .gmap iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#about .about_block {border: 1px solid var(--c_theme_color);padding: 4% ;font-weight: 500;}
#about .about_block dl {display: flex;font-size: 18px;line-height: 1.5em;gap: clamp(10px, 3vw, 30px); margin-bottom: 1.25em; padding-bottom: 1.25em; border-bottom: 1px solid #aaa;}
/*
#about .about_block dl:last-of-type {margin-bottom: 0em; padding-bottom: 0; border-bottom: none;}
*/
#about .about_block dl dt {color: var(--c_theme_color);width:3.5em;}
#about .about_block dl dd {width: calc(100% - 6em);}
#about .about_block dl dd a{ color: var(--c_theme_color);}

@media screen and (max-width: 835px) {
	#news{ margin-bottom: 5em;}
	#news .news_wrap ul{ margin-bottom: 1em;}

	#news .h_outer{ margin-bottom: 0.5em;}
	
	#about .about_wrap {flex-wrap: wrap;}
  	#about .about_wrap .about_block {width: 100%;}
  	#about .about_wrap .map {width: 100%;}
  	#about .about_block {padding: 24px 16px;}
  	#about .about_block dl {flex-wrap: wrap;gap: 5px;margin-bottom: 1em; padding-bottom: 1em; font-size: 16px;}
  	#about .about_block dl dt {width: 100%;}
  	#about .about_block dl dd {width: 100%;}

	#about .ob.ob02{ bottom: -60px;}
}

#shop { background-color: #d8c391; padding: clamp(50px, 5vw, 100px) 0; position: relative; overflow: hidden; background-image: url(../images/bg/bg_parts.webp); background-size: 100%;}

/*#shop:before{ display: block; content: ""; background: url(../images/bg/shop_bg.webp) no-repeat center;background-size: cover; position: fixed; height: 100%; width: 100%; top: 0; left: 0;}
*/
#shop .shop {margin-bottom: 5%;}
#shop .h_outer .sec_h{ color:var(--c_theme_color2);}
#shop .h_outer .sec_h:after{ color: #333;}


.shop {text-align: center;display: grid;grid-template-columns: 100%;grid-template-rows: -webkit-max-content;grid-template-rows: max-content; color: #000;}
.shop .img {aspect-ratio: 1/1;background: #fff;margin-bottom: 3%;}
.shop .img img {width: 100%;height: 100%;-o-object-fit: contain;object-fit: cover;}
.shop .name {font-size: 18px;line-height: 1.5em;margin-bottom: 0.5em;color: var(--c_theme_color2);font-weight: bold;}
.shop .area {font-size: 14px;line-height: 1.5em;margin-bottom: 0;}
.shop .text {font-size: 18px;line-height: 1.5em;margin-bottom: 0.75em;}
.shop .link_btn {border: 1px solid #000;padding: clamp(10px, 2vw, 16px) 16px;text-align: center;position: relative;display: block;font-size:16px;line-height: 1.5em;align-self: end;justify-self: end;width: 100%; color: #000;}
.shop .link_btn:before {position: absolute;content: "";background: var(--c_theme_color2);width: 6px;height: 12px;top: 53%;transform: translateY(-50%);right: clamp(14px, 2vw, 20px);-webkit-clip-path: polygon(0 0, 0% 100%, 100% 50%);clip-path: polygon(0 0, 0% 100%, 100% 50%);}

.official_btn {background: var(--c_theme_color2);color: #fff;position: relative;display: block;border-radius: 100vmax;padding: 24px;font-size: clamp(18px, 2vw, 26px);text-align: center;line-height: 1.3em;max-width: 640px;width: 90%;margin: 0 auto;}
.official_btn .icon {position: absolute;top: 50%;left: 40px;transform: translateY(-50%);width: 60px;}


@media screen and (max-width: 835px) {
	.official_btn { padding:18px 0 ;
	 .icon{ width:40px ;}
	}
}

footer {padding: 60px 0;text-align: center;position: relative;border-top: 1px solid var(--c_theme_color);}
footer .f_text {font-size: clamp(14px, 2vw, 18px);line-height: 1.7em;}

#in_shop {padding-top: 160px;margin-bottom: 100px;}
#in_shop .main_block {display: flex;gap: 40px;margin-bottom: 50px;}
#in_shop .main_block .img {background: #fff;aspect-ratio: 1/1;width: calc(50% - 40px); border: 1px solid #ccc;}
#in_shop .main_block .img img {width: 100%;height: 100%;-o-object-fit: contain;object-fit: cover;}
#in_shop .main_block .text_block {width: 50%;}
#in_shop .main_block .text_block .shop_name {font-size: clamp(24px, 4vw, 38px);line-height: 1.3em;color: var(--c_theme_color);font-weight: 600;margin-bottom: 50px;}
#in_shop .menu_block .menu .img {background: #fff;aspect-ratio: 1/1;margin-bottom: 10px;}
#in_shop .menu_block .menu .img img {width: 100%;height: 100%;-o-object-fit: contain;object-fit: contain;}
#in_shop .menu_block .menu .name {font-size: 20px;line-height: 1.4em;color: var(--c_theme_color);font-weight: 600;margin-bottom: 10px;}

#in_shop .text_block h2{ color: var(--c_theme_color); font-weight: bold; font-size:18px; line-height: 1.7em; margin-bottom: 0.5em;}
#in_shop .text_block .url ul{ display: flex; padding-top: 2em;}
#in_shop .text_block .url li{ width: 50px; margin-right: 0.5em;}

.backbtn a{ display: block;background-color: #fff; padding: 1em; color: #000;width: min(90%,320px); margin: 3em auto 0; text-align: center;}

@media screen and (max-width: 835px) {
  #in_shop {padding-top: 80px;}
  #in_shop .main_block {flex-direction: column;margin-bottom: 60px;}
  #in_shop .main_block .img {width: 100%;}
  #in_shop .main_block .text_block {width: 100%;}
	
	#shop .shop{ margin-bottom: 10%;  display: block;}
}

.free_txt {text-align: left;    margin-bottom: 10vw;}
.free_txt p {margin-bottom: 1.5em}
.free_txt h1 {font-weight: bold;background-color:var(--c_theme_color);color: var(--c_theme_color);padding: 0.5em 1em;margin: 2em 0 1em;font-size: 20px;line-height: 1.5em}
.free_txt .h_outer .sec_h{ padding-bottom: 0;}
.free_txt h3 {font-weight: bold;border-left: 3px solid var(--c_theme_color);padding: 0.5em 1em;margin: 2em 0 1em;font-size: 18px;line-height: 1.5em; color: var(--c_theme_color);}
.free_txt blockquote {border: 1px solid #ccc;padding: 1.5em 2em}


@media screen and (max-width: 835px) {
	.free_txt { font-size: 14px; line-height: 1.7em;;}
}