@charset "utf-8";

#application .inner {
	width: 1000px;
	margin: 0 auto;
}

.tac {
	text-align: center;
}

.small {
	font-size: 15px;
	font-weight: normal;
}

.w100 {
	width: 100%;
	box-sizing: border-box;
}

.mb02 {
	margin-bottom: 20px;
}

span.red {
	color: #e60012;
	font-weight: bold;
}

span.bold {
	font-weight: bold;
}

.contents01 {
	padding-top: 0;
}

.contents01Left {
	width: 55%;
}

.contents01Left p {
	line-height: 1.8;
    font-size: 1.3em;
}

.contents01Right {
	width: 40%;
}

.contents02 {
	margin-bottom: 80px;
	position: relative;
}

.contents02 h2 {
	margin-bottom: 0;
}


.contents02 h3 {
	width: 150px;
	line-height: 2;
	text-align: center;
	font-weight: bold;
	position: relative;
	background-color: yellow;
	border: 3px solid black;
	padding: 8px;
	display: inline-block;
	color: #000;
	border-radius: unset;
}

.contents02 h3::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 10px;
	width: 100%;
	height: 100%;
	background-color: black;
	z-index: -1;
}


.contents02 .contents02Box {
    padding: 2rem;
	border: #38b270 3px solid;
	background-image: 
	linear-gradient(to right, #e2f1e4 1px, transparent 1px),
	linear-gradient(to bottom, #e2f1e4 1px, transparent 1px);
	background-size: 20px 20px;	
	
}

.contents02 p {
	width: 100%;
	padding-left: 1em;
	box-sizing: border-box;
	line-height: 1.6;
}

.contents02 figure img {
	width: 100%;
}


.contents02Left {
	width: 55%;
	padding-right: 20px;
	box-sizing: border-box;
}

.contents02 .contents02Left {
	padding-right: 4rem;
	z-index: 10;
}

.contents02Right {
	width: 45%;
}

.contents02 .contents02Right {
	z-index: 10;
}




.contents02 p.note {
	text-align: right;
}

.contents03 {
	margin-bottom: 80px;
}

.contents03 dl {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 50px;
	align-items: flex-start;
	border: #38b270 3px solid;
    padding: 2rem 2rem 0 2rem;
    background-image: linear-gradient(to right, #e2f1e4 1px, transparent 1px), linear-gradient(to bottom, #e2f1e4 1px, transparent 1px);
    background-size: 20px 20px;
}
	

.contents03 dl dt {
	width: 15%;
	font-size: 1.5em;
	font-weight: bold;
	background: linear-gradient(transparent 60%, #ff6 60%);
	box-sizing: border-box;
	margin-bottom: 20px;
	text-align: center;
}

.contents03 dl dd {
	width: 85%;
	box-sizing: border-box;
	font-size: 1.5em;
	line-height: 22px;
	padding: 11px 0 0 20px;
	margin-bottom: 20px;
}

.contents03 dl dt.dtlast {
	padding-top: 9px;
}

.contents03 dl dd.ddlast {
	font-size: 1em;
	font-weight: normal;
}

.contents03 .faxmail {
	padding: 20px 50px;
    background-color: #ffffff;
    border-radius: 10px;
}

.contents03 .pdfLink {
	margin: 0 auto;
    text-align: center;
    padding: 10px 0;
}

.contents03 .pdfLink a {
	text-align: center;
    font-size: 18px;
    padding-left: 20px;
    background: url(../images/pdf_icon.gif) 0 -0.2em no-repeat;
    text-decoration: underline;
}

.contents03Left p,
.contents03Right p{
	text-align: center;
	font-size: 1.5em;
	font-weight: bold;
}

.contents03Left p a,
.contents03Right p a {
	font-size: 1.65em;
}

.applicationTitle {
	margin-bottom: 2em;
}

.applicationTitle h1 {
	text-align: center;
	font-size: 20px;
}

.applicationTitle .pdfLink {
	margin: 0 auto;
    text-align: center;
}

.applicationTitle .pdfLink a {
	text-align: center;
    font-size: 18px;
    padding-left: 20px;
    background: url(../images/pdf_icon.gif) 0 -0.2em no-repeat;
    text-decoration: underline;
}

.applicationTitle a.anjoBtn {
    background-color: #db0020;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 340px;
    height: 58px;
    font-size: 1.5rem;
    margin: 5rem auto;
    border-radius: 5rem;
	font-weight: bold;
}

.applicationTitle a.anjoBtn:hover {
	background-color: #333;
	transition: .3s;
}

#application table tr th {
	font-weight: bold;
}

#application table tr th em {
	background-color: #FF9D00;
	padding: 3px 10px;
	margin-right: 8px;
	color: #fff;
	font-size: 0.9em;
	font-weight: normal;
}

#application table tr th span {
	font-weight: normal;
}

#application table tr td.style01 {
	padding: 10px 0 10px 10px;
	font-size: 1.1em;
	box-sizing: border-box;
}

#application table tr td.style02 {
	border-bottom: 1px solid #ccc;
	padding: 0 10px 10px 10px;
	margin-bottom: 10px;
	font-size: 1.1em;
	box-sizing: border-box;
}

#application table tr td.style03 {
	padding: 0 0 0 10px; 
	font-size: 1.1em;
	box-sizing: border-box;
}

#application table tr td.style03 span.red{
    color: #CC0000;
    font-weight: bold;
}

#application table tr td.pt10 {
	padding-top: 10px;
}

#application table tr td.genre span {
	font-weight: bold;
    font-weight: bold;
    padding-left: 0.5em;
    vertical-align: middle;
}

#application table tr td.genre span.indent {
	font-weight: normal;
}

#application table tr td .qr {
	margin-top: -10px;
	padding-left: 1em;
}

#application table tr td .photo {
	margin-bottom: 1em;
}

#application table tr td .photo p span {
	color: #CC0000;
	font-weight: bold;
}

#application table tr td .favor p {
	padding-left:1em;
	text-indent:-1em;
}

#application table tr.vegetable {
	background-color: #f5f5f5;
	padding: 20px;
	border-radius: 10px;
	box-sizing: border-box;
}

#application .formmailBtn {
	padding-top: 30px;
	margin-bottom: 150px;
}

#application .formmailBtn p {
	text-align: center;
}

#application .formmailBtn p.note {
	padding-top: 20px;
	font-size: 0.9em;
}

#application .formmailBtn p .btn {
    width: 100%;
    max-width: 350px;
    height: 60px;
    margin: 50px auto 0;
    padding: 0 0 0 1em;
    background-color: #ffeb00;
    background-size: 8px 11px;
    text-decoration: none;
    border-radius: 30px;
    border: none;
    box-sizing: border-box;
    display: inline-block;
    line-height: 1em;
    transition: .3s;
    cursor: pointer;
    -webkit-appearance: none;
    appearance:none;
    color: #222 !important;
}

#application .formmailBtn p .btn:hover {
	background-color: #ff9d00;
}

#application .layout {
	margin-bottom: 50px;
}

#application .layout .discription {
	padding: 20px;
}

#application .layout .discription ol li {
	font-size: 1.2em;
	line-height: 2em;

}

#application .layout .discription ol li span.number {
	padding-right: 0.5em;
	font-weight: bold;
	
}

#application .layout .discription ol li span.markar {
	background:linear-gradient(transparent 60%, #ff6 60%);
}

.formmailCheck {
	background-color: #ffffff;
    padding: 20px 40px;
    border-radius: 10px;
}

.formmailCheck h3 {
    font-weight: bold;
    padding-bottom: 1rem;
    color: #38b270;
}

.formmailCheck ul {
	font-size: 0.9em;
}

.formmailCheck ul li {
	padding-left: 1em;
	padding-bottom: .6em;
	text-indent: -1em;
}

.formmailCheck ul li::before {
	content: "";
	display: inline-block;
	width: .65em;
    height: .65em;
    margin-right: .35em;
	border-radius: 50%;
	background-color: #38b270;
	vertical-align: middle;
	position: relative;
	top: -.1em;
	text-indent: 0;
}

.formmailCheck ul li.red {
	color:#f26b4f;
}

.formmailCheck ul li.red::before {
	content: none;
}

.formmailCheck p {
	text-align: center;
}

@media screen and (min-width:1025px){
	br.brsp {
		display: none;
	}
}

@media screen and (max-width:1024px){
	.contents01Right figure img {
		width: 100%;
	}

	#application .p01 {
		padding: 10px;
		box-sizing: border-box;
	}
}

@media screen and (max-width:960px){
	.contents02Box {
		display: block;
	}

	.contents02Left {
		width: 100%;
	}

	.contents02Right {
		width: 100%;
		padding-top: 1em;
	}

	.contents02Right h3	{
		padding-top: 4px;
	}

	.contents02Right figure {
		text-align: center;
	}

	.contents02Right figure img {
		width: 60%;
	}

	.contents03 dl {
		display: block;
	}

	.contents03 dl dt {
		margin-bottom: 8px;
	}

	.contents03 dl dd {
		width: 100%;
		padding: 0 0 20px 20px;
		line-height: 1.4;
	}

	.contents03 .faxmail .flex {
		display: block;
	}

	#application .inner {
		padding: 0 10px;
		width: 100%;
		box-sizing: border-box;
	}

	#application .layout figure img {
		width: 100%;
	}
}

@media screen and (max-width:780px){
	br.brpc {
		display: none;
	}

	.mb02  {
		margin-bottom: 10px;
	}

	.contents01 {
		margin-bottom: 50px;
	}

	.contents02Left {
		padding-right: 0;
	}

	.contents03 dl dd.ddlast {
		font-size: 18px;
		line-height: 1.6em;
	}

	#application .applicationTitle h1 {
		text-align: left;
		font-size: 1.1rem;
	}

	#application .genre input {
		padding-left:1em;
		text-indent:-1em;
	}

	#application .layout .discription ol li {
		padding-left:1em;
		text-indent:-1.5em;
	}
}
@media screen and (min-width:481px){
	br.brsp02 {
		display: none;
	}
}

@media screen and (max-width:480px){
	.contents01Left p {
		font-size: 1.1em;
	}
	.w97 {
		width: 30%;
	}
	
	br.brpc02 {
		display: none;
	}

	.contents01 .flex {
		display: block;
	}

	.contents01Left {
		width: 100%;
		margin-bottom: 1em;
	}

	.contents02 .contents02Box {
		padding: 1rem;
	}

	.contents02 .contents02Left {
		padding-right: 0;
		margin-bottom: 2rem;
	}

	.contents01Right {
		width: 100%;
	}

	.contents02 .contents02Left ,
	.contents02 .contents02Right  {
		position: relative;
	}

	.contents02 .contents02Left p,
	.contents02 .contents02Right p {
		margin-top: 1rem;
	}

	.contents02 h3 {
		padding-top: 4px;
	}

	.contents02Right figure img {
		width: 100%;
	}

	.contents02 p.note {
		text-align: center;
	}

	.contents03 {
		margin-bottom: 40px;
	}

	.contents03 dl {
		padding: 2rem 1rem 0;
	}

	.contents03 dl dt {
		width: 35%;
	}

	.contents03 .faxmail {
		padding: 20px 10px;
	}

	.contents03 .faxmail h5 {
		line-height: 1.2em;
	}

	.contents03Left p,
	.contents03Right p{
		font-size: 1.4em;
	}

	.contents03Left p a,
	.contents03Right p a {
		font-size: 1em;
	}

	.contents03 .pdfLink {
		line-height: 1.4em;
		padding: 20px 0;
	}

	#application .mb01 {
		margin-bottom: 5px;
	}

	#application table tr td .qr input.qrOther {
		width: 100%;
	}

	#application .layout .discription ol li {
		font-size: 1em;
	}

	#application table tr td.genre span.indent {
		padding-left:1em;
		display: block;
		font-weight: normal;
	}
}

.applicationBasic .comp a{
    width: 100%;
    max-width: 350px;
    height: 60px;
    margin: 0 auto;
    padding: 1.5em 0 0 0;
    background-color: #ffeb00;
    background-size: 8px 11px;
    text-decoration: none;
    border-radius: 30px;
    border: none;
    box-sizing: border-box;
    display: inline-block;
    line-height: 1em;
    transition: .3s;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    color: #222 !important;
}

.applicationBasic .comp a:hover {
	background-color: #ff9d00;
}

/* ==========================================================
   フォーム入力欄デザイン変更（2026/09）
   ・必須バッジを角丸（ピル型）に
   ・入力欄を淡いグレー枠＋角丸に
   ・フォーカス時にグリーンの枠を表示
   ========================================================== */

/* 項目名 */
#application table tr th {
	margin-bottom: 10px;
	font-size: 16px;
	line-height: 1.6;
}

/* 必須バッジ */
#application table tr th em {
	display: inline-block;
	padding: 5px 10px;
	margin-right: 10px;
	background-color: #f26b4f;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	line-height: 1;
	border-radius: 999px;
	vertical-align: middle;
	position: relative;
	top: -1px;
}

/* 任意バッジ（使う場合は <em class="nini">任意</em>） */
#application table tr th em.nini {
	background-color: #d9d9d9;
}

/* 入力欄 */
#application input[type="text"],
#application input[type="tel"],
#application input[type="email"],
#application textarea,
#application select {
	padding: 12px 16px;
	border: 2px solid #e3e6ea;
	border-radius: 8px;
	background-color: #fff;
	color: #262626;
	font-size: 16px;
	line-height: 1.5;
	box-sizing: border-box;
	box-shadow: none;
	transition: border-color .2s, box-shadow .2s;
}

#application input[type="text"],
#application input[type="tel"],
#application input[type="email"],
#application textarea {
	-webkit-appearance: none;
	appearance: none;
}

/* プレースホルダー */
#application input::placeholder,
#application textarea::placeholder {
	color: #c4c8cc;
	opacity: 1;
}

/* フォーカス時 */
#application input[type="text"]:focus,
#application input[type="tel"]:focus,
#application input[type="email"]:focus,
#application textarea:focus,
#application select:focus {
	outline: none;
	border-color: #38b270;
	box-shadow: 0 0 0 3px rgba(56, 178, 112, .15);
}

@media screen and (max-width:1024px){
	#application input.p01,
	#application textarea.p01 {
		padding: 12px 14px;
	}
}



.contents04 {
	margin-bottom: 80px;
}

.contents04 figure {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 50px;
	align-items: flex-start;
	border: #38b270 3px solid;
    padding: 2rem 1rem ;
    /*background-image: linear-gradient(to right, #e2f1e4 1px, transparent 1px), linear-gradient(to bottom, #e2f1e4 1px, transparent 1px);
    background-size: 20px 20px;*/
}

.contents04 figure img {
	width: 100%;
}

.contents04 figure picture {
	display: block;
	width: 100%;
}

@media screen and (max-width:780px){
	/* スマホ用縦型画像（幅750px）を引き伸ばさない */
	.contents04 figure picture img {
		display: block;
		max-width: 750px;
		margin: 0 auto;
	}
}


.sns-checkbox-group {
  display: flex;
  flex-direction: column;
  gap: 8px; /* 行間の調整 */
}

.checkbox-item {
  display: grid;
  grid-template-columns: 100px 1fr; /* 120pxは「Webサイト」などの文字幅に合わせて調整 */
  align-items: center;
}

/* ==========================================================
   チェックボックス・ラジオボタン・ボタン デザイン変更（2026/09）
   ・選択肢をカード型ラベルに（文字部分クリックでも選択可）
   ・選択時カラー #38b270
   ・送信系ボタンをグリーンのピル型に
   ========================================================== */

/* --- 選択肢ラベル --- */
#application label.choice {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 5px 12px 5px 0;
	padding: 9px 16px 9px 12px;
	border-radius: 8px;
	color: #262626;
	font-size: 16px;
	line-height: 1.4;
	cursor: pointer;
	box-sizing: border-box;
	vertical-align: middle;
	transition: border-color .2s, background-color .2s, color .2s;
	-webkit-tap-highlight-color: transparent;
}

#application label.choice:hover {
	border-color: #9fd8b8;
	background-color: #f6fbf8;
}

/* 選択中 */
#application label.choice:has(input:checked) {
	border-color: #38b270;
	color: #1f7a49;
	font-weight: bold;
}

/* 業種欄：既存の span 余白を解除 */
#application table tr td.genre label.choice span {
	padding-left: 0;
	font-weight: bold;
}

/* --- チェックボックス / ラジオ本体 --- */
#application input[type="checkbox"],
#application input[type="radio"] {
	-webkit-appearance: none;
	appearance: none;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	margin: 0;
	padding: 0;
	text-indent: 0;
	border: 2px solid #c4c8cc;
	background-color: #fff;
	background-position: center;
	background-repeat: no-repeat;
	cursor: pointer;
	vertical-align: middle;
	box-sizing: border-box;
	transition: border-color .2s, background-color .2s, box-shadow .2s;
}

#application input[type="checkbox"] {
	border-radius: 6px;
}

#application input[type="radio"] {
	border-radius: 50%;
}

#application input[type="checkbox"]:hover,
#application input[type="radio"]:hover {
	border-color: #38b270;
}

/* チェック時 */
#application input[type="checkbox"]:checked {
	border-color: #38b270;
	background-color: #38b270;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-6.5' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-size: 16px 16px;
}

#application input[type="radio"]:checked {
	border-color: #38b270;
	background-color: #38b270;
	box-shadow: inset 0 0 0 4px #fff;
}

/* キーボード操作時のフォーカス */
#application input[type="checkbox"]:focus-visible,
#application input[type="radio"]:focus-visible {
	outline: 3px solid rgba(56, 178, 112, .35);
	outline-offset: 2px;
}

/* --- Webサイト・SNS欄 --- */
.checkbox-item .sns-input {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
}

.checkbox-item .sns-input label.choice {
	margin: 0;
}

.checkbox-item .sns-input input[type="text"] {
	flex: 1;
	min-width: 200px;
}

.checkbox-item .sns-input-label {
	font-size: 15px;
	white-space: nowrap;
}

/* --- 確認事項チェック --- */
#application label.choice-confirm {
	margin: 10px 0 0;
	padding: 14px 28px 14px 20px;
	font-size: 17px;
	font-weight: bold;
}

#application label.choice-confirm input[type="checkbox"] {
	width: 26px;
	height: 26px;
}

#application label.choice-confirm input[type="checkbox"]:checked {
	background-size: 18px 18px;
}

/* --- 送信系ボタン --- */
#application .formmailBtn p .btn {
	max-width: 360px;
	height: 64px;
	margin: 50px 8px 0;
	padding: 0 3em;
	background-color: #38b270;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5l4.5 4.5L6 12.5' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 22px center;
	background-size: 16px 16px;
	border-radius: 999px;
	box-shadow: 0 4px 0 #2a8756;
	color: #fff !important;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: .05em;
	transition: background-color .2s, transform .15s, box-shadow .15s;
}

#application .formmailBtn p .btn:hover {
	background-color: #2f9e62;
	transform: translateY(2px);
	box-shadow: 0 2px 0 #2a8756;
}

#application .formmailBtn p .btn:active {
	transform: translateY(4px);
	box-shadow: none;
}

#application .formmailBtn p .btn:focus-visible {
	outline: 3px solid rgba(56, 178, 112, .35);
	outline-offset: 3px;
}

/* 戻るボタン（確認画面） */
#application .formmailBtn p .btn.btnBack {
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M10 3.5L5.5 8l4.5 4.5' fill='none' stroke='%23888' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: left 22px center;
	border: 2px solid #d0d4d8;
	box-shadow: 0 4px 0 #d0d4d8;
	color: #555 !important;
}

#application .formmailBtn p .btn.btnBack:hover {
	background-color: #f5f6f7;
	box-shadow: 0 2px 0 #d0d4d8;
}

#application .formmailBtn p .btn.btnBack:active {
	box-shadow: none;
}

/* 住所自動入力ボタン */
#application #postal_btn {
	height: 48px;
	margin-left: 8px;
	padding: 0 18px;
	border: 2px solid #38b270;
	border-radius: 8px;
	background-color: #fff;
	color: #38b270;
	font-size: 15px;
	font-weight: bold;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	vertical-align: middle;
	transition: background-color .2s, color .2s;
}

#application #postal_btn:hover {
	background-color: #38b270;
	color: #fff;
}

/* 完了画面の「TOPへ戻る」ボタン */
.applicationBasic .comp a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	background-color: #38b270;
	box-shadow: 0 4px 0 #2a8756;
	border-radius: 999px;
	color: #fff !important;
	font-weight: bold;
	transition: background-color .2s, transform .15s, box-shadow .15s;
}

.applicationBasic .comp a:hover {
	background-color: #2f9e62;
	transform: translateY(2px);
	box-shadow: 0 2px 0 #2a8756;
}

@media screen and (max-width:780px){
	#application .formmailBtn p .btn {
		margin: 30px 0 0;
	}

	#application .formmailBtn p .btn + .btn {
		margin-top: 20px;
	}
}

@media screen and (max-width:480px){
	#application label.choice {
		margin: 4px 8px 4px 0;
		padding: 8px 12px 8px 10px;
		font-size: 15px;
	}

	#application #postal_btn {
		margin: 8px 0 0;
	}

	.checkbox-item .sns-input input[type="text"] {
		min-width: 0;
		width: 100%;
		flex-basis: 100%;
	}
}


/* ==========================================================
   ファイル選択ボタン デザイン変更（2026/09）
   ========================================================== */
#application input[type="file"] {
	display: inline-block;
	width: 100%;
	max-width: 460px;
	margin: 0 12px 10px 0;
	padding: 8px;
	border: 2px dashed #cfd5da;
	border-radius: 10px;
	background-color: #fff;
	color: #8a9096;
	font-size: 14px;
	line-height: 1.4;
	box-sizing: border-box;
	vertical-align: middle;
	cursor: pointer;
	transition: border-color .2s, background-color .2s;
}

#application input[type="file"]:hover {
	border-color: #38b270;
	background-color: #f6fbf8;
}

#application input[type="file"]:focus-visible {
	outline: 3px solid rgba(56, 178, 112, .35);
	outline-offset: 2px;
}

/* 「ファイルを選択」ボタン部分 */
#application input[type="file"]::file-selector-button {
	margin-right: 14px;
	padding: 10px 20px 10px 40px;
	border: none;
	border-radius: 999px;
	background-color: #38b270;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='M21 16l-5-5-8 8'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 14px center;
	background-size: 18px 18px;
	color: #fff;
	font-family: inherit;
	font-size: 15px;
	font-weight: bold;
	cursor: pointer;
	transition: background-color .2s;
}

#application input[type="file"]:hover::file-selector-button {
	background-color: #2f9e62;
}

@media screen and (max-width:480px){
	#application input[type="file"] {
		max-width: none;
		margin-right: 0;
		font-size: 13px;
	}

	#application input[type="file"]::file-selector-button {
		padding: 9px 16px 9px 36px;
		background-position: left 12px center;
		font-size: 14px;
	}
}


/* ==========================================================
   掲載写真について：右側にサンプル画像（2026/09）
   ========================================================== */
#application .photoBox {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 30px;
}

#application .photoBox .photoBoxLeft {
	flex: 1;
	min-width: 0;
}

#application .photoBox .photoBoxRight {
	flex-shrink: 0;
	width: 220px;
	margin: 0 0 0 auto;
}

#application .photoBox .photoBoxRight img {
	display: block;
	width: 100%;
	height: auto;
}

@media screen and (max-width:780px){
	#application .photoBox {
		flex-direction: column;
		gap: 20px;
	}

	#application .photoBox .photoBoxRight {
		width: 60%;
		max-width: 260px;
		margin: 0 auto;
	}
}


/* ==========================================================
   ページトップへ戻るボタン（2026/09）
   ・300pxスクロールで右側からふわっと表示
   ========================================================== */
.pageTop {
	position: fixed;
	right: 30px;
	bottom: 30px;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background-color: #38b270;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
	text-decoration: none;
	opacity: 0;
	visibility: hidden;
	transform: translateX(100px);
	transition: opacity .5s ease, transform .5s cubic-bezier(.22, 1, .36, 1), visibility .5s, background-color .2s;
}

.pageTop.is-show {
	opacity: 1;
	visibility: visible;
	transform: translateX(0);
}

.pageTop:hover {
	background-color: #2f9e62;
}

.pageTop:focus-visible {
	outline: 3px solid rgba(56, 178, 112, .35);
	outline-offset: 3px;
}

/* ▲ */
.pageTop .pageTopArrow {
	display: block;
	width: 0;
	height: 0;
	margin-top: -4px;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 14px solid #fff;
	transition: transform .2s;
}

.pageTop:hover .pageTopArrow {
	transform: translateY(-3px);
}

@media screen and (max-width:480px){
	.pageTop {
		right: 15px;
		bottom: 15px;
		width: 50px;
		height: 50px;
	}

	.pageTop .pageTopArrow {
		border-left-width: 8px;
		border-right-width: 8px;
		border-bottom-width: 12px;
	}
}


/* ==========================================================
   バランスの良いメニュー：メニュー名入力欄を幅いっぱいに（2026/10）
   ========================================================== */
#application .balanceMenu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

#application .balanceMenu .balanceMenuLabel {
	margin-right: 8px;
	white-space: nowrap;
}

#application .balanceMenu .balanceMenuInput {
	flex: 1;
	min-width: 240px;
	width: auto;
}

@media screen and (max-width:480px){
	#application .balanceMenu .balanceMenuLabel {
		width: 100%;
		margin: 10px 0 6px;
	}

	#application .balanceMenu .balanceMenuInput {
		flex-basis: 100%;
		min-width: 0;
	}
}


/* ==========================================================
   ラベル＋入力欄を横並びにし、入力欄を残り幅いっぱいに（2026/10）
   対象：定休日「その他」、駐車場「備考」、QRコード決済「その他」
   ========================================================== */
#application .inlineField {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 8px;
}

#application .inlineField .inlineFieldLabel {
	margin-right: 8px;
	white-space: nowrap;
}

#application .inlineField .inlineFieldInput {
	flex: 1;
	min-width: 240px;
	width: auto;
}

@media screen and (max-width:480px){
	#application .inlineField .inlineFieldInput {
		flex-basis: 100%;
		min-width: 0;
		margin-top: 6px;
	}
}
