@charset "UTF-8";
/*
Theme Name:そばの城
Description:そばの城オリジナルテーマ
*/

/*******************************
初期化
********************************/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent;}
*, *::before, *::after {-webkit-box-sizing: border-box; box-sizing: border-box;}
html {font-size: 62.5%; width: 100%;}
body {
  font-family: YakuHanMP, "Shippori Mincho", serif;
  color: #221815;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
	font-feature-settings: "palt";
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: #fff;
  overflow-x: hidden;
}
img {max-width: 100%; height: auto; vertical-align: top;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ul, ol {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}
input {border: 1px solid #888; padding: 2px;}
button {appearance: none; -moz-appearance: none; -webkit-appearance: none; border: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
a {vertical-align: baseline; text-decoration: none; color: #1967d2;}
a:link, a:visited, a:active {color: #093b80; text-decoration: none;}
a:hover {text-decoration: underline;}
ins {background-color: #ff9; color: #000; text-decoration: none;}
h1, h2, h3, h4, h5 {margin: 0; padding: 0;}
h2{font-size: 2.5vw; line-height: 1.5;}
.pc {display: block;}
.sp,
.br-sp{display: none;}
.font-bold{font-weight: bold;}

/*******************************
変数
********************************/
:root{
	--color_main: #f0df99;
	--color_sub: #fd666f;
	--font_size_basic: 1.458vw;
}

/*******************************
ボタン
********************************/
a,
input[type="submit"],
.smf-action .smf-button-control__control{transition: 0.3s;}
a:hover,
input[type="submit"]:hover,
.smf-action .smf-button-control__control:hover{text-decoration: none; opacity: 0.7;}
a.btn,
input[type="submit"].btn,
.smf-action .smf-button-control__control{display: inline-block; background-color: var(--color_sub); width: 19.01vw; border-radius: 5.208vw; padding: 1.667vw 2em 1.927vw 2.292vw; color: #fff; font-size: var(--font_size_basic); text-align: center; line-height: 1; letter-spacing: 0.05em; position: relative;}
a.btn::after,
.smf-action .smf-button-control__control::after{content: ""; background: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/btn_arrow02.png') no-repeat; background-size: 100%; width: 0.625vw; height: 1.302vw; position: absolute; top: 50%; right: 1.927vw; transform: translatey(-50%);}


/*******************************
トップページ
********************************/
.top__fv{width: 100%; background-color: var(--color_main); padding-top: 0.729vw; position: relative;}
.top__fv video{width: 100%; aspect-ratio: 1 / 0.48; object-fit: cover;}
.top__fv-sns{width: 19.01%; background-color: #fff; border-radius: 9999px 0 0 9999px; padding: 0.5em 0 1em; font-size: 1.25vw; text-align: center; position: absolute; top: 1.71875vw; right: 0;}
.top__fv-sns ul{display: flex; justify-content: center; gap: 1.40625vw; margin-top: 0.15625vw;}
.top__fv-sns ul li{width: 4.0625vw;}
.top__fv-title{background-color: rgba(0, 0, 0, 0.5); padding: 1.8% 0.9%; position: absolute; top: 11.09375vw; right: 2.96875vw;}
.top__fv-title h1{font-size: 2.5vw; line-height: 1.54; letter-spacing: 0.12em; writing-mode: vertical-rl; color: #fff; font-weight: 900;}
.top__fv-icon{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.top__fv-icon > img{height: 12.45vw;}
.top__fv-icon a{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -33%);}
.top__fv-icon a img{height: 6.927vw;}
.header-menu{width: 100%; background-color: var(--color_main); padding: 0.573vw;}
.header-menu ul{display: flex; justify-content: center; gap: 1.40625vw;}
.header-menu ul li a{width: 7.34375vw; height: 7.34375vw; background-color: rgba(255, 255, 255, 0.5); display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 1.979vw; text-align: center; font-size: 1.25vw; color: #000; font-weight: bold;}
.header-menu ul li a img{height: 3.75vw; margin-bottom: 0.15625vw;}
.header-menu ul li a .font-mini{font-size: 1.042vw;}
.header-menu ul li.current a{color: var(--color_sub);}

.top__sec01{background: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/bg_ig.png') no-repeat; background-size: cover; width: 100%; padding: 3.125vw; text-align: center;}
.top__sec01 h2{margin-bottom: 0.25em; line-height: 1.2;}
.top__sec01 h2 img{display: block; width: 4.010vw; margin: 0 auto 1.146vw;}
.top__sec01 .title-sub{font-size: var(--font_size_basic); font-weight: 900; color: var(--color_sub);}
.top__sec01-ig{width: 100%; max-width: 89.948vw; margin: 1.083vw auto;}
.top__sec01-ig #sbi_images{gap: 1.875vw !important;}
.top__sec01-ig img{border-radius: 2.604vw;}
.top__sec01-ig #sb_instagram .sbi_photo{height: auto !important;}
.top__sec01-ig #sb_instagram .sbi_photo img{width: 100%;height: auto;aspect-ratio: 400 / 444;}
.top__sec01-btn{margin-top: 2.083vw;}
.top__sec01 a.btn{background-color: var(--color_main); color: #000;}
.top__sec01 a.btn::after{background-image: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/btn_arrow01.png');}

.top__contents{background: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/bg_top_contents.jpg') no-repeat; background-size: cover; width: 100%; padding: 6.771vw 0 7.083vw 0;}
.top__headline{font-size: 6.71875vw; font-family: YakuHanJP, "Noto Sans JP", sans-serif; font-weight: 900; text-align: center; line-height: 1; color: var(--color_main); position: absolute; top: -2.083vw; left: 50%; transform: translatex(-50%);}
.top__headline img{display: block; width: 4.271vw; margin: 0 auto 0.417vw;}
.top__headline .text{opacity: 0.66;}
.top__contents h2,
.top__sec05 h2,
.page h2{width: 32.292vw; border-bottom: 0.15625vw solid var(--color_main); padding-bottom: 0.25em; margin: 0 auto 0.75em; color: var(--color_sub); text-align: center; line-height: 1; letter-spacing: -0.05em;}

.top__sec02{width: 94.79vw; background-color: #fff; border-radius: 0 15.625vw 15.625vw 0; margin: 0 auto 6.875vw 0; padding: 10.417vw 0 5.208vw; position: relative; font-size: var(--font_size_basic); text-align: center;}
.flex-first{display: flex; margin: 2.083vw 0 4.0625vw;}
.flex-first .img{width: 50%; padding-right: 2.34375vw;}
.flex-first .text{width: 50%; padding: 0 8.49vw 0 5.104vw; text-align: left;}
.top__sec02-inner{width: 86%; max-width: 81.458vw; margin: 0 9% 0 5%;}
.top__sec02 .flex-menu{width: 100%; display: flex; gap: 2%; margin: 1em 0;}
.top__sec02 .flex-menu .box{width: 23%; font-size: 1.5625vw;}
.top__sec02 .flex-menu .box p{text-align: left;}
.top__sec02 .flex-menu .box .price{display: block; text-align: right;}
.top__sec02 .menu-att{margin: 0 3em 4em 0; text-align: right;}
.top__sec02 .flex-menu.experience{gap: 10%;}
.top__sec02 .flex-menu.experience .box{width: 45%;}
.top__sec02 .sobauchi{text-align: left;}
.top__sec02 .sobauchi .name{color: var(--color_sub);}
.top__sec02-btn{margin: 5% auto 10%;}
.secret-box{width: 100%; display: flex; gap: 5%; margin: 5% 0;}
.secret-box .video{width: 40%;}
.secret-box .img{width: 34%; text-align: left;}
.secret-box .video video{width: 100%; border-radius: 2.604vw;}
.secret-box .text{width: 55%; text-align: left;}
.secret-box .text h3{font-size: 1.178em; color: var(--color_sub); font-weight: 500;}
.business__sec02 .secret-box{align-items: center;}
.business__sec02 .secret-box .text{width: 66%; text-align: left; font-size: 1.302vw; line-height: 1.4;}

/*** 追加分 ***/
.flex-first .img img{width: 100%; object-fit: cover; aspect-ratio: 307 / 224; border-radius: 0 35px 35px 0;}
.top__sec02 .flex-menu .box img{width: 100%; object-fit: cover; aspect-ratio: 255 / 209; border-radius: 35px;}
/**************/


.top__sec03{width: 94.79vw; background-color: #fff; border-radius: 15.625vw 0 0 15.625vw; margin: 0 0 6.875vw auto; padding: 10.417vw 0 5.208vw; position: relative; font-size: var(--font_size_basic); text-align: center;}
.top__sec03 .flex-first{flex-direction: row-reverse; align-items: center;}
.top__sec03 .flex-first .img{padding: 0 0 0 2.34375vw;}
.top__sec03 .flex-first .text{padding: 0 5.104vw 0 8.49vw;}
.top__sec03 .shop-img{display: block; width: 8.698vw; margin: 0 auto 2em;}
.top__sec03-inner{width: 77%; max-width: 72.708vw; margin: 0 14% 0 9%;}
.flex-souvenir{width: 100%; display: flex; justify-content: center; gap: 2%; margin: 5% auto;}
.flex-souvenir .box{width: 31%;}
.top__sec03-inner h3{font-size: 1.178em; color: var(--color_sub); font-weight: 500;}
.top__sec03-btn{margin: 5% auto;}

.top__sec04{width: 94.79vw; background-color: #fff; border-radius: 0 15.625vw 15.625vw 0; margin: 0 auto 6.875vw 0; padding: 10.417vw 0 5.208vw; position: relative; font-size: var(--font_size_basic); text-align: center;}
.top__sec04 .flex-first .img{padding-right: 0.9375vw;}
.top__sec04 .flex-first .img img{aspect-ratio: 942 / 541;}
.top__sec04 .flex-first .text{padding: 0 2.8125vw;}
.top__sec04 .flex-first .text p{margin-bottom: 1em; line-height: 1.6;}
.top__sec04 .info-name{display: block; color: var(--color_sub);}
.top__sec04-inner{width: 77%; max-width: 72.708vw; margin: 0 9% 0 14%;}
.top__sec04-btn{margin: 1em auto 3em;}
.top__sec04-btn a.btn{padding-left: 0.5em; letter-spacing: 0;}
h2.history-headline,
h3.history-headline{width: 17.708vw; border-bottom: none; font-size: 2.34375vw; position: relative;}
h2.history-headline::before,
h2.history-headline::after,
h3.history-headline::before,
h3.history-headline::after{content: ""; width: 10%; height: 0.104vw; background-color: var(--color_sub); position: absolute; top: 50%; transform: translateY(-50%);}
h2.history-headline::before,
h3.history-headline::before{left: -10%;}
h2.history-headline::after,
h3.history-headline::after{right: -10%;}
.top__sec04 .history-box{width: 100%; display: flex; margin-bottom: 2%;}
.top__sec04 .history-box.rev{flex-direction: row-reverse;}
.top__sec04 .history-box .img{width: 50%; padding-right: 10%;}
.top__sec04 .history-box.rev .img{padding: 0 0 0 10%;}
.top__sec04 .history-box .text{width: 50%; text-align: left;}
.top__sec04 .history-box .text h3{margin-bottom: 0.25em; font-size: 1.178em; color: var(--color_sub); font-weight: 500;}

.top__sec05{width: 100%; background-color: #fff; margin: 0 auto 6.875vw; padding: 10.417vw 0 5.208vw; position: relative; font-size: var(--font_size_basic); text-align: center;}
.top__sec05-inner{width: 77%; max-width: 72.708vw; margin: 0 auto;}
.top__sec05 .map{width: 100%; margin: 2% auto;}
.top__sec05 .map iframe{width: 100%; height: 100%; aspect-ratio: 1396 / 440; object-fit: cover;}
.top__sec05 .flex-access{display: flex; position: relative;}
.top__sec05 .flex-access .box{width: 50%;}
.top__sec05 .flex-access .box h3{width: 11.979vw; margin: 0 auto 0.25em; color: var(--color_sub); font-weight: 500;}
.top__sec05 .flex-access .box p{margin-bottom: 1em;}
.top__sec05-btn{position: absolute; bottom: -10%; left: 49%; transform: translateX(-50%);}

/*******************************
フッター
********************************/
footer{background-color: var(--color_main); position: relative;}
footer::before{content: ""; background: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/footer_img01.png') no-repeat; background-size: 100%; width: 8.229vw; height: 8.59375vw; position: absolute; top: -8.49375vw; left: 13.5%;}
.footer__inner{width: 77%; max-width: 72.708vw; margin: 0 auto; padding: 2% 0;}
ul.footer__menu{display: flex; gap: 1.71875vw; margin-bottom: 2%; font-size: 1.40625vw;}
ul.footer__menu a{color: #1c1b1f;}
ul.footer__menu li:hover a{border-bottom: 0.104vw solid var(--color_sub); color: var(--color_sub);}
ul.footer__sns{display: flex; justify-content: center; gap: 0.833vw; margin-bottom: 2%;}
ul.footer__sns li{width: 2.396vw;}
ul.footer__banner{display: flex; justify-content: space-between; margin-bottom: 2%;}
ul.footer__banner li{width: 23.4%;}
footer .copyright{text-align: center; font-size: 1.302vw;}

.return-top {position: fixed; right: 5.2vw; bottom: 5.2vw; cursor: pointer; z-index: 999;}
.return-top img{width: 5.78125vw;}

/*******************************
固定ページ共通
********************************/
.page{font-size: var(--font_size_basic);}
.page h1{font-size: 2.5vw;}
.page .common h1{margin-bottom: 1em; text-align: center;}
.page .eyecatch{margin: 1% auto;}

.page .header-menu{display: flex; gap: 1.25vw; align-items: center; padding: 1.25vw 1.667vw;}
.page .header-menu .logo{width: 8.698vw; margin-right: 1.875vw;}
.page .header-menu ul{gap: 1.146vw;}
.page .header-menu ul li a{width: 5.9375vw; height: 5.9375vw; font-size: 1.019vw;}
.page .header-menu ul li a img{height: 2.96875vw;}
.page .header-menu ul li.current a img{filter: brightness(0) saturate(100%) invert(46%) sepia(17%) saturate(1675%) hue-rotate(307deg) brightness(113%) contrast(113%);}
.page .header-menu ul li a .font-mini{font-size: 0.83em;}
.page .header-menu ul.list-sns li a{display: block;width: 100%;height: 100%;background: transparent;}
.page .header-menu ul.list-sns li a img{height: 100%;}

.page__inner{width: 72%; max-width: 72.708vw; margin: 0 auto;}
.common .page__inner{padding: 150px 0 350px;}

/*******************************
事業者様専用ページ
********************************/
.business__sec01{background: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/bg_b_sec01.png') no-repeat; background-size: cover; width: 100%; padding: 3.125vw 0 5.208vw; text-align: center;}

.business__sec02{background-color: #fff; width: 100%; padding: 10.417vw 0 5.208vw; position: relative; font-size: var(--font_size_basic); text-align: center;}
.business__sec02 .flex-menu{width: 90%; display: flex; gap: 1%; margin: 2% auto;}
.business__sec02 .flex-menu .box{width: 24%; font-size: 0.9375vw; text-align: left; letter-spacing: -0.05em;}
.business__sec02 .flex-menu .box .info{display: flex; justify-content: space-between; align-items: center;}
.business__sec02 .flex-menu .box .name{font-size: 1.5em; color: var(--color_sub);}
.business__sec02 .att-box{background-color: #f4e9c0; width: 100%; border-radius: 2.604vw; padding: 5% 10% 5% 20%; margin-bottom: 8%; font-size: 1.3078125vw; text-align: left;}

.business__sec03{background: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/bg_b_sec03.png') no-repeat; background-size: cover; width: 100%; padding: 5.46875vw 0 13.958vw; text-align: center;}
.business__sec03 p + p{margin-top: 1em;}
.business__sec03 p + h2{margin-top: 5.208vw;}
.business__sec03 .tou{width: 52.083vw; margin: 0 auto; text-align: left; letter-spacing: -0.05em;}
.business__sec03 .tou ul li{padding-left: 1em; position: relative;}
.business__sec03 .tou ul li::before{content: "*"; font-size: 1.5em; position: absolute; top: -0.1em; left: 0;}
.business__sec03-btn{margin: 15% auto 10%;}
h2.ct-headline{width: 100%; margin-bottom: 0.1em;}
table.company-table{width: 100%; border-top: 0.104vw solid var(--color_main);}
table.company-table th,
table.company-table td{width: 50%; border-bottom: 0.104vw solid var(--color_main); padding: 0.5em; font-weight: 400;}

/*******************************
お問い合わせ
********************************/
.contact__list{margin: 5% 0;}
.contact__list ul{display: flex; gap: 2%;}
.contact__list ul li{width: 31%; text-align: center;}

.wp-block-contact-form-7-contact-form-selector{margin-top: 3.646vw;}
.page .wp-block-contact-form-7-contact-form-selector h2{display: inline-block; width: 100%; border: none; margin-bottom: 0.5em; font-size: 2.083vw; letter-spacing: 0.05em; color: #221815; font-family: YakuHanJP, "Noto Sans JP", sans-serif; text-align: left;}
.wp-block-contact-form-7-contact-form-selector p,
.wp-block-contact-form-7-contact-form-selector hr{margin-bottom: 1.5em;}
.wp-block-contact-form-7-contact-form-selector ul{margin: 0 0 1.5em 1.5em; list-style-type: disc;}
.wp-block-contact-form-7-contact-form-selector ul li p{margin-bottom: 0;}
.cf7__box{margin-bottom: 50px;}
.cf7__box-name p{margin-bottom: 0.25em;}
.cf7__box-name .req{padding-left: 0.25em; font-size: 0.8em; color: #c40000;}
.cf7__box-item input,
.cf7__box-item textarea{width: 100%; padding: 0.5em; font-size: var(--font_size_basic);}
.cf7__box-item select{padding: 0.5em;font-size: var(--font_size_basic);}
.cf7__box-item select option{font-size: 0.6em;}
.cf7__box-item input[type="radio"]{width: 0.8em; height: 0.8em;}
table.cf7__box-item th{width: 17%; padding-right: 1%; text-align: left; font-weight: 400;}
table.cf7__box-item td{width: 83%%; padding-bottom: 0.5em;}
table.cf7__box-item th p,
table.cf7__box-item td p{margin-bottom: 0;}
table.cf7__box-item.order th{width: 42%;}
table.cf7__box-item.order td{width: 58;}
table.cf7__box-item.order td p{display: flex; align-items: center; gap: 1%;}
.cf7__box-item.number input{width: 20%;}
.cf7__box-acceptance-text{margin: 100px 0 10px; font-size: 0.8em;}
.cf7__box-acceptance{text-align: center;}
.cf7__btn{margin-top: 50px; text-align: center;}
.cf7__btn input[type="submit"]{font-size: var(--font_size_basic);}

.smf-form p{margin-bottom: 1em;}
.smf-form hr{margin: 2em 0;}
.smf-form ul{margin: 0 0 1.5em 1.5em; list-style: disc;}
.smf-form--letter .smf-item{margin-bottom: 1em;}
.smf-form--letter .smf-item__col--label{display: flex; align-items: center; gap: 0.25em;}
.smf-form--letter .smf-item__description{font-size: var(--font_size_basic); color: #fd666f;}
.smf-form .smf-text-control__control,
.smf-form .smf-textarea-control__control{padding: 0.75em; font-size:  var(--font_size_basic);}
.smf-form .wp-block-columns p{margin-bottom: 0;}
.smf-form .smf-select-control__control{padding: 0.75em 1em 0.75em 0.75em;font-size: var(--font_size_basic);}
.smf-form .smf-select-control__control option{font-size: 1.4em;}
.smf-form .smf-checkbox-control{align-items: center;}
.smf-form .smf-checkbox-control__control{width: var(--font_size_basic); height: var(--font_size_basic);}
.smf-action .smf-button-control__control{background-image: none; border: none; font-size:  var(--font_size_basic);}

.smf-label:has(input[name="your-pp[]"]),
div[data-name="your-pp"] .smf-error-messages{text-align: center;}

form[data-screen="input"] .only-confirm,
form[data-screen="back"] .only-confirm{display: none;}

form[data-screen="confirm"] .smf-item__col--label{font-weight: bold;}
form[data-screen="confirm"] .only-input{display: none;}
form[data-screen="confirm"] .smf-action{margin-top: 3em;}
form[data-screen="confirm"] .smf-action button[data-action="back"]{background-color: #838383;}
form[data-screen="confirm"] .wp-block-column{flex-basis: 0 !important;}
form[data-screen="confirm"] .number-flex .wp-block-column{flex-grow: 0 !important;}

.page:has(form[data-screen="confirm"]) h1,
.page:has(form[data-screen="complete"]) h1{display: none;}
.page form[data-screen="complete"] h2{width: 100%; display: inline-block; padding: 2em 0 1.5em; margin: 0; color: #221815; border: none; font-weight: 400;}

/*******************************
ハンバーガー
********************************/
.nav-toggle,
.global-nav{display: none;}

@media screen and (max-width: 480px) {
	.nav-toggle {
		display: block;
		width: 9.333vw;
		height: 9.333vw;
		background-color: rgba(0, 0, 0, 0.62);
		cursor: pointer;
		position: fixed;
		top: 2.933vw;
		right: 2.933vw;
		z-index: 1001;
	}

	.nav-toggle span {
		display: block;
		height: 0.533vw;
		width: 5.6vw;
		background: #fff;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		transition: .3s;
	}

	.nav-toggle span:nth-child(1) {
		top: 2.667vw;
	}

	.nav-toggle span:nth-child(2) {
		top: 4.533vw;
	}

	.nav-toggle span:nth-child(3) {
		top: 6.4vw;
	}

	/* ナビゲーション（初期は非表示） */
	.global-nav {
		display: block;
		position: fixed;
		top: -100svh;
		width: 100%;
		height: 100svh;
		background: var(--color_main);
		transition: .3s;
		z-index: 1000;
	}

	.global-nav ul {
		display: flex;
		flex-wrap: wrap;
		gap: 8px 2%;
		padding: 15% 10%;
		list-style: none;
		text-align: center;
	}
	.global-nav ul li{width: 31%;}
	.global-nav ul li a{width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.5); display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 1.867vw; text-align: center; font-size: 3.467vw; color: #000; font-weight: bold;}
	.global-nav ul li a img{height: 30%; margin-bottom: 1.333vw;}
	.global-nav ul li a .font-mini{font-size: 1em;}
	.global-nav ul li.current a{color: var(--color_sub);}

	/* 開いた時の動き */
	.nav-open .global-nav {
		top: 0;
	}

	/* メニュー開いたら×に変形 */
	.nav-open .nav-toggle span:nth-child(1) {
		transform: translate(-2.667vw,1.866vw) rotate(45deg);
	}

	.nav-open .nav-toggle span:nth-child(2) {
		opacity: 0;
	}

	.nav-open .nav-toggle span:nth-child(3) {
		transform: translate(-2.667vw,-1.866vw) rotate(-45deg);
	}
	
	.page .nav-toggle{top: 2vw; right: 2vw;}
}


/*******************************
フェード関係
********************************/
.fade-up{opacity: 0; transform: translateY(1.5625vw); transition: opacity 0.8s ease, transform 0.8s ease;}
.fade-up.is-inview{opacity: 1; transform: translateY(0);}
.fade-up.is-inview.delay{transition-delay: 1s;}

.top__fv-icon.fade-up,
.top__headline.fade-up,
.top__sec05-btn.fade-up{transform: translate(-50%,1.5625vw);}
.top__fv-icon.fade-up.is-inview,
.top__headline.fade-up.is-inview,
.top__sec05-btn.fade-up.is-inview{transform: translate(-50%,0);}

.fade-in{opacity: 0; transition: opacity 0.8s ease, transform 0.8s ease;}
.fade-in.is-inview{opacity: 1;}

/*******************************
レスポンシブ
********************************/
@media screen and (min-width: 1921px) {
	h2{font-size: 48px;}
	:root{
		--font_size_basic: 28px;
	}
	a.btn{width: 365px; border-radius: 100px; padding: 32px 2em 33px 44px;}
	a.btn::after{width: 12px; height: 25px; right: 37px;}
	.top__fv{padding-top: 14px;}
	.top__fv video{height: 935px; aspect-ratio: auto;}
	.top__fv-sns{width: 365px; font-size: 24px; top: 33px;}
	.top__fv-sns ul{gap: 27px; margin-top: 8px;}
	.top__fv-sns ul li{width: 78px;}
	.top__fv-title{top: 213px; right: 57px;}
	.top__fv-title h1{font-size: 48px;}
	.top__fv-icon > img{height: 239px;}
	.top__fv-icon a img{height: 133px;}
	.header-menu{padding: 11px;}
	.header-menu ul{gap: 27px;}
	.header-menu ul li a{width: 141px; height: 141px; border-radius: 38px; font-size: 24px;}
	.header-menu ul li a img{height: 72px; margin-bottom: 5px;}
	.header-menu ul li a .font-mini{font-size: 0.83em;}
	.top__sec01{padding: 60px;}
	.top__sec01 h2 img{width: 77px; margin: 0 auto 32px;}
	.top__sec01-ig{max-width: 1727px; margin: 40px auto;}
	.top__sec01-ig #sbi_images{gap: 36px !important;}
	.top__sec01-ig img{border-radius: 50px;}
	.top__sec01-btn{margin-top: 40px;}
	.top__contents{padding: 130px 0 136px 0;}
	.top__headline{font-size: 129px; top: -41px;}
	.top__headline img{width: 82px; margin: 0 auto 18px;}
	.top__contents h2,
	.top__sec05 h2,
	.page h2{width: 620px; border-width: 5px;}
	.top__sec02{border-radius: 0 300px 300px 0; margin: 0 auto 132px 0; padding: 200px 0 100px;}
	.flex-first{max-width: 1658px; display: flex; margin: 40px auto 78px;}
	.flex-first .img{padding-right: 45px;}
	.flex-first .img img{width: 100%;}
	.flex-first .text{width: 50%; max-width: 700px; padding: 0 0 0 98px;}
	.top__sec02-inner{max-width: 1564px; margin: 0 auto;}
	.top__sec02 .flex-menu .box{font-size: 30px;}
	.secret-box .video video{border-radius: 50px;}
	.secret-box .text h3{font-size: 33px;}
	.business__sec02 .secret-box .text{font-size: 25px;}
	.top__sec03{border-radius: 300px 0 0 300px; margin: 0 0 130px auto; padding: 206px 0 100px;}
	.top__sec03 .flex-first .img{padding: 0 0 0 97px;}
	.top__sec03 .flex-first .text{padding: 0;}
	.top__sec03 .shop-img{width: 167px;}
	.top__sec03-inner{max-width: 1396px; margin: 0 auto;}
	.top__sec04{border-radius: 0 300px 300px 0; margin: 0 auto 132px 0; padding: 200px 0 125px;}
	.top__sec04 .flex-first .img{padding-right: 18px;}
	.top__sec04 .flex-first .text{max-width: 100%; padding: 0 0 0 52px;}
	.top__sec04-inner{max-width: 1396px; margin: 0 auto;}
	h2.history-headline,
	h3.history-headline{width: 365px; font-size: 45px;}
	h2.history-headline::before,
	h2.history-headline::after,
	h3.history-headline::before,
	h3.history-headline::after{height: 3px;}
	.top__sec05{margin: 0 auto; padding: 200px 0 163px;}
	.top__sec05-inner{max-width: 1396px;}
	.top__sec05 .flex-access .box h3{width: 278px;}
	footer::before{display: none;}
	.footer__inner{max-width: 1396px; padding: 40px 0; position: relative;}
	.footer__inner::before{content: ""; background: url('https://sobanoshiro.co.jp/wp-content/themes/sobanoshiro/assets/img/footer_img01.png') no-repeat; background-size: 100%; width: 158px; max-width: 1396px; height: 165px; position: absolute; top: -165px; left: 0;}
	ul.footer__menu{gap: 33px; font-size: 27px;}
	ul.footer__menu li.current a{border-width: 2px;}
	ul.footer__sns{gap: 16px;}
	ul.footer__sns li{width: 46px;}
	footer .copyright{font-size: 25px;}
	.return-top {right: 100px; bottom: 100px;}
	.return-top img{width: 111px;}
	
	.smf-form .smf-select-control__control option{font-size: 1em;}
}
@media screen and (max-width: 1024px) {
	.top__sec02 .flex-menu{flex-wrap: wrap; gap: 1.71875vw; justify-content: space-between;}
	.top__sec02 .flex-menu .box{width: 48%;}
	.top__sec02 .flex-menu .box img{width: 100%;}
	.top__sec02 .flex-menu .box p{display: flex; justify-content: space-between; padding: 0.521vw 0.78125vw 0;}
	.top__sec02 .menu-att{margin: 0 0 4em; text-align: left;}
	
	.business__sec02 .flex-menu{flex-wrap: wrap; justify-content: center; gap: 1.953125vw 2%;}
	.business__sec02 .flex-menu .box{width: 31%; font-size: var(--font_size_basic);}
	.business__sec02 .att-box{padding: 5% 10%;}
	
	.common .page__inner{padding: 8vw 0 12vw;}
}
@media screen and (max-width: 480px) {
	:root{
	--font_size_basic: 3.2vw;
	}
	
	body{overflow-x: hidden;}
	
	.br-pc{display: none;}
	.br-sp{display: inline;}
	
	h2{font-size: 5.333vw;}
	a.btn,
	input[type="submit"].btn,
	.smf-action .smf-button-control__control{width: 44vw; padding: 1.1em 2em 1.25em 1.25em; border-radius: 13.333vw;}
	a.btn::after,
	input[type="submit"].btn::after,
	.smf-action .smf-button-control__control::after{width: 1.333vw; height: 2.933vw; right: 4.533vw;}
	
	.top__fv video{display: block; aspect-ratio: 1 / 0.8;}
	.top__fv-sns{display: none;}
	.header-menu{display: none;}

	.top__fv-title h1{font-size: 4vw;}
	.top__fv-icon > img{height: 20.8vw;}
	.top__fv-icon a img{height: 9.467vw;}

	.top__sec01{padding: 8vw 13.333vw;}
	.top__sec01 h2 img{width: 10vw;}
	.top__sec01 .title-sub{font-size: 4vw;}
	.top__sec01 a.btn{font-size: 4vw;}

	.top__contents{padding: 13.333vw 0;}
	.top__headline{font-size: 10.667vw; top: -4.8vw;}
	.top__headline img{width: 9.8667vw; margin: 0 auto;}
	.top__contents h2,
	.top__sec05 h2, .page h2{width: 73.333vw; border-width: 0.4vw;}
	
	.top__sec02{width: 100%; border-radius: 0 15.6vw 15.6vw 0; margin: 0 0 13.333vw; padding: 18.667vw 0 10.667vw;}
	.top__sec02 > p{width: 90.4%; margin-right: auto; margin-left: auto;}
	.flex-first{flex-direction: column-reverse; margin: 2.933vw 0 9.333vw;}
	.flex-first .text{width: 90.4%; padding: 0; margin: 0 auto 5.333vw;}
	.flex-first .text img{margin-bottom: 1.333vw;}
	.flex-first .img{width: 100%; padding-right: 4.8vw;}
	.top__sec02-inner{width: 90.4%; max-width: 100%; margin: 0 auto;}
	.top__sec02 .flex-menu{gap: 5.333vw 2%;}
	.top__sec02 .flex-menu .box{font-size: 4vw;}
	.top__sec02 .flex-menu .box p{flex-direction: column;}
	.top__sec02 .flex-menu .box .price{font-size: 0.9em;}
	.top__sec02 .flex-menu.experience{flex-direction: column; gap: 3.467vw;}
	.top__sec02 .flex-menu.experience .box{width: 100%;}
	.secret-box{flex-direction: column;}
	.secret-box .video{width: 100%;}
	.secret-box .text{width: 100%;}
	
	.top__sec03{width: 100%; border-radius: 15.6vw 0 0 15.6vw; margin: 0 0 13.333vw; padding: 18.667vw 0 8vw;}
	.top__sec03 .flex-first{flex-direction: column-reverse;}
	.top__sec03 .flex-first .img{padding-left: 4.8%;}
	.top__sec03 .flex-first .text{padding: 0;}
	.top__sec03 .shop-img{width: 15.333vw; margin-bottom: 4.8vw !important;}
	.top__sec03-inner{width: 90.6%; max-width: 100%; margin: 0 auto;}
	.flex-souvenir{justify-content: space-between;}
	
	.top__sec04{width: 100%; border-radius: 0 15.6vw 15.6vw 0; margin: 0; padding: 18.667vw 0 10.667vw;}
	.top__sec04 > p{width: 90.6%; margin: 0 auto;}
	.top__sec04 .flex-first{flex-direction: column;}
	.top__sec04 .flex-first .img{padding-right: 4.8%; margin-bottom: 4.4vw;}
	.top__sec04 .flex-first .text{width: 90.6%; padding: 0; margin: 0 auto;}
	.top__sec04-inner{width: 90.6%; max-width: 100%; margin: 0 auto;}
	h2.history-headline,
	h3.history-headline{width: 37.867vw; font-size: 4.667vw;}
	h2.history-headline::before,
	h2.history-headline::after,
	h3.history-headline::before,
	h3.history-headline::after{width: 1em; height: 0.267vw;}
	h2.history-headline::before,
	h3.history-headline::before{left: 0em;}
	h2.history-headline::after,
	h3.history-headline::after{right: 0;}
	.top__sec04 .history-box{margin-bottom: 4.267vw;}
	.top__sec04 .history-box,
	.top__sec04 .history-box.rev{flex-direction: column-reverse;}
	.top__sec04 .history-box .img{width: 100%; padding: 0;}
	.top__sec04 .history-box.rev .img{padding: 0;}
	.top__sec04 .history-box .text{width: 100%; margin-bottom: 2.133vw;}
	
	.top__sec05{padding: 18.4vw 0 33.867vw; margin: 0;}
	.top__sec05-inner{width: 90.6%; max-width: 100%; margin: 0 auto;}
	.top__sec05 .map iframe{aspect-ratio: 340 / 150;}
	.top__sec05 .flex-access{flex-direction: column;}
	.top__sec05 .flex-access .box{width: 100%;}
	.top__sec05 .flex-access .box h3{width: 100px; font-size: 4vw;}
	.top__sec05-btn{left: 50%;}
	
	footer::before{width: 15.467vw; height: 16.133vw; top: -16.133vw; left: 4.8%;}
	.footer__inner{width: 90.6%; max-width: 100%; margin: 0 auto; padding: 5.333vw 0;}
	ul.footer__menu{flex-wrap: wrap; gap: 3.6vw 2%; font-size: 3.6vw;}
	ul.footer__menu li{width: 31%;}
	ul.footer__sns{gap: 3.466vw; margin-bottom: 5.333vw;}
	ul.footer__sns li{width: 9.733vw;}
	ul.footer__banner{flex-wrap: wrap; justify-content: space-around; gap: 2.667vw 8.667vw; margin-bottom: 5.067vw;}
	ul.footer__banner li{width: 36.533vw;}
	footer .copyright{font-size: 3.333vw;}
	.return-top{right: 4.8%; bottom: 4.8%;}
	.return-top img{width: 8.933vw;}
	
	.page .header-menu{justify-content: space-between; padding: 1.867vw 13.6vw 1.867vw 3.733vw;}
	.page .header-menu .logo{width: 16.533vw; margin-right: 2.667vw;}
	.page .header-menu ul:nth-child(2){display: none;}
	.page .header-menu ul{width: 35.733vw; gap: 3.333vw;}
	.page h1{margin-bottom: 0.5em; font-size: 5.333vw;}
	.business__sec01{padding: 8.4vw 0;}
	.page__inner{width: 90.6%; max-width: 100%; margin: 0 auto;}
	.page .eyecatch{margin: 0 0 4.267vw;}
	.business__sec02{padding: 24vw 0 13.333vw;}
	.business__sec02 h2{font-size: 6.4vw;}
	.business__sec02 .flex-menu{gap: 4vw 2%; justify-content: space-between; margin: 4vw auto;}
	.business__sec02 .flex-menu .box{width: 48%;}
	.business__sec02 .flex-menu .box .name{font-size: 1.25em;}
	.business__sec02 .att-box{background-color: #fffbec; width: 100vw; margin: 0 calc(50% - 50vw) 9.867vw; border-radius: 0; padding: 5% 4.6%; font-size: var(--font_size_basic);}
	.business__sec02 .att-box p{margin-bottom: 1em;}
	.business__sec02 .secret-box .img{width: 100%; margin-bottom: 4vw;}
	.business__sec02 .secret-box .text{width: 100%; font-size: var(--font_size_basic);}
	.business__sec03{padding: 10.667vw 0 23.333vw;}
	.business__sec03 p + h2{margin-top: 18.667vw;}
	.business__sec03 .tou{width: 100%;}
	h2.ct-headline{width: 100%; border-width: 0.267vw;}
	table.company-table,
	table.company-table th,
	table.company-table td{border-width: 0.267vw;}
	
	.common .page__inner{padding: 13.333vw 0 21.333vw;}
	.contact__list ul{flex-direction: column; gap: 3vw 0;}
	.contact__list ul li{width: 100%;}
	.smf-form .smf-select-control__control option{font-size: 1em;}
	.smf-item__controls > .wp-block-columns{gap: 1em;}
	.smf-item__controls .wp-block-columns + .wp-block-columns{margin-top: 1em;}
	.smf-action .smf-button-control__control{width: 42vw; margin: 0;}
	.smf-action .smf-button-control+.smf-button-control{margin-left: 0;}
	
	/*** 追加分 ***/
	.nav-toggle{width: 35px; height: 35px; top: 10px; right: 12px;}
	.nav-toggle span{width: 21px; height: 2px;}
	.nav-toggle span:nth-child(1){top: 10px;}
	.nav-toggle span:nth-child(2){top: 17px;}
	.nav-toggle span:nth-child(3){top: 24px;}
	.top__fv{padding-top: 3px;}
	.top__fv-title{top: 60px; right: 12px;}
	.return-top{right: 18px; bottom: 18px;}
	.return-top img{width: 33px;}
	/**************/
}