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

/* PARTS */

/*-----------------------*/
/*-----------------------*/
/* SVG
/*-----------------------*/
/* burger */
.burger-icon {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-miterlimit: 10;
}
.burger-close-icon {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-miterlimit: 10;
}
/* arrow */
.arrow--style {
	display: block;
	fill: currentColor;
	width: var(--txt-md--ie);
	width: var(--txt-md);
}
/*-----------------------*/
/* パーツ
/*-----------------------*/
/*---------------*/
/* テキスト設定 */
.txt {
	font-size: var(--txt-reg);
	line-height: var(--line-height-md);
	text-align: justify;
}
/*headline*/
.headline {
	font-size: var(--txt-xl);
	font-weight: var(--bold);
	line-height: var(--line-height-sm);
	color: var(--color-main);
}
/*subhead*/
.h2__txt-wrapper{
	width: 100%;
	text-align: center;
}
.h2__txt-wrapper h2{
	padding-bottom: 0.5em;
	padding-left: calc(20rem/16);
}
.h2__txt-wrapper p{
	margin-top: 1em;
	padding-left: 1em;
	padding-left: calc(20rem/16);
	text-align: center;
}
.search-btn__wrapper{
	margin-top: calc(20rem/16);
	padding-bottom: calc(20rem/16);

	width: 100%;

	display: flex;
	justify-content: center;
	align-items: center;
}
/*subhead配色*/
/* マスタ */
#master_headline.h2__txt-wrapper h2{
	border-bottom: solid 3px var(--color-master);
}
#master_headline.search__form .search-btn__wrapper{
	border-bottom: solid 3px var(--color-master);
}
/* データ */
#data_headline.h2__txt-wrapper h2{
	border-bottom: solid 3px var(--color-data);
}
#data_headline.search__form .search-btn__wrapper{
	border-bottom: solid 3px var(--color-data);
}

/* テキストリンク */
.txtLink {
	color: var(--color-link);
	text-decoration: underline;
	/* transition: color 0.2s ease-in-out, text-decoration 0.2s ease-in-out; */
}
.txtLink.txtLink-hover {
	color: var(--color-link--hover);
}



/* ================================== */
/*　button　*/
/* ================================== */
/* ===================== */
/*　ログイン＆ログアウト　*
/* ===================== */
.login-btn__main {
	width: 120px;
	height: 40px;
	border-radius: 4px;
	border: solid 1px #999;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #e5e5e5;
	/* transition: background-color 0.2s ease-in; */
}
.login-btn__main:hover {
	cursor: pointer;
	background-color: #f5f5f5;
}
.logout-btn__main {
	width: 100px;
	height: 28px;
	border-radius: 4px;
	border: solid 1px #999;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #e5e5e5;
	/* transition: background-color 0.2s ease-in; */
}
.logout-btn__main:hover {
	cursor: pointer;
	background-color: #f5f5f5;
}
/* ===================== */
/*　メインメニュー　*/
/* ===================== */
/* ログイン --------------*/
.login-btn__wrapper{
	margin-top: 2em;

	display: flex;
	justify-content: center;
}
.login-btn__default {
	width: 140px;
	height: 32px;
	border-radius: 4px;
	border: solid 1px #5d5d5d;
	background-color: #e5e5e5;

	/* transition: background-color 0.1s ease-in; */
}
.login-btn__default:hover {
	cursor: pointer;
	background-color: #f5f5f5;
}
/* メニューボタン */
.menu__inner ul li>a{
	width: 100%;
	height: 48px;
	border-radius: 4px;

	display: flex;
	justify-content: center;
	align-items: center;

	color: var(--color-white);
	font-size: calc(18rem/16);
}
.menu__inner .data-btn{
	background-color: var(--color-data);
	border: solid 1px var(--color-data);
}
.menu__inner .master-btn{
	background-color: var(--color-master);
	border: solid 1px var(--color-master);
}
/* ホバー*/
.menu__inner .data-btn:hover{
	color: var(--color-data);
	background-color: var(--color-white);
}
.menu__inner .master-btn:hover{
	color: var(--color-master);
	background-color: var(--color-white);
}
/* ===================== */
/*　検索　*/
/* ===================== */
.search-btn__search {
	width: 140px;
	height: 40px;
	border-radius: 4px;
	border: solid 1px var(--color-bk-strong);
	background-color: #ffa500;

	/* transition: background-color 0.1s ease-in; */
}
.search-btn__search:hover {
	cursor: pointer;
	background-color: #fcd933;
}
/* ===================== */
/*　編集　*/
/* ===================== */
.regi-grid-btn__search {
	font-size: 13px;
	padding: 7px 16px;
	border-radius: 4px;
	background-color: #e5e5e5;
	border: solid 1px var(--color-bk-strong);
	color: var(--color-bk-strong);
	overflow: hidden;
	/* text-overflow: ellipsis; */

	display: flex;
	justify-content: center;
	align-items: center;

	margin: 0 auto;
	
	/* transition: background-color 0.1s ease-in; */
}
.regi-grid-btn__search:hover {
	cursor: pointer;
	background-color: #fff;
}
/* ===================== */
/*　全削除　*/
/* ===================== */
.alldel-btn__search{
	font-size: 13px;
	padding: 5px 10px;
	border-radius: 4px;
	background-color: #e5e5e5;
	border: solid 1px var(--color-bk-strong);
	color: var(--color-bk-strong);
	overflow: hidden;

	display: flex;
	justify-content: center;
	align-items: center;

	margin-left: auto;
}
.alldel-btn__search:hover{
	cursor: pointer;
	background-color: #ff7d7d;
}
/* ===================== */
/*　削除　*/
/* ===================== */
.del-grid-btn__search {
	font-size: 13px;
	padding: 5px 10px;
	border-radius: 4px;
	background-color: #e5e5e5;
	border: solid 1px var(--color-bk-strong);
	color: var(--color-bk-strong);
	overflow: hidden;

	display: flex;
	justify-content: center;
	align-items: center;

	margin: 0 auto;
	
	/* transition: background-color 0.1s ease-in; */
}
.del-grid-btn__search:hover {
	cursor: pointer;
	background-color: #ff7d7d;
}

/* ===================== */
/*　新規登録　*/
/* ===================== */
.add-btn__search {
	display: flex;
	justify-content: center;
	align-items: center;

	width: 140px;
	height: 40px;
	border: solid 1px var(--color-bk-strong);
	border-radius: 4px;
	background-color: #507cd1;
	color: #fff;

	/* transition: background-color 0.1s ease-in; */
}
.add-btn__search.-ml{
	margin-left: 1em;
}
.add-btn__search:hover {
	cursor: pointer;
	background-color: #6194ff;
}

/* ===================== */
/*　登録　*/
/* ===================== */
.regi-btn__edit {
	width: 180px;
	height: 40px;
	border-radius: 4px;
	border: solid 1px var(--color-bk-strong);
	background-color: #fa8072;

	/* transition: background-color 0.1s ease-in; */
}
.regi-btn__edit:hover {
	cursor: pointer;
	background-color: #ffadad;
}

/* ===================== */
/*　戻る　*/
/* ===================== */
.back-btn__wrapper{
	margin-top: 3em;
	display: flex;
	justify-content: center;
}
.back-btn {
	color: var(--color-bk-strong);
	border: solid 1px var(--color-main);
	padding: 0.3em 3em;

	position: relative;

	transition: 
	color 0.4s var(--easeInOutSine),
	background-color 0.4s var(--easeInOutSine);
}
.back-btn > svg{
	position: absolute;
	top: 50%;
	left: 13px;
	transform: translateY(-50%);

	width: 24px;
	fill: var(--color-main);

	transition: fill 0.4s ease-in-out;
}
.back-btn:hover {
	cursor: pointer;
	color: var(--color-white);
	background-color: var(--color-main);
}
.back-btn:hover > svg{
	fill: var(--color-white)
}

/* ===================== */
/*　csv_excel入出力　*/
/* ===================== */
.output-btn__csv {
	width: 140px;
	height: 32px;
	border-radius: 4px;

	background-color: #006581;
	color: #fff;
	/* transition: background-color 0.1s ease-in; */
}
.output-btn__csv:hover {
	cursor: pointer;
	background-color: #0091ac;
}
.input-btn__csv {
	width: 140px;
	height: 32px;
	border-radius: 4px;

	background-color: #006581;
	color: #fff;

	/* transition: background-color 0.1s ease-in; */
}
.input-btn__csv:hover {
	cursor: pointer;
	background-color: #0091ac;
}

.output-btn__excel {
	width: 140px;
	height: 32px;
	border-radius: 4px;
	background-color: #007511;
	color: #fff;
	/* transition: background-color 0.1s ease-in; */
}

.output-btn__excel:hover {
	cursor: pointer;
	background-color: #00a12b;
}

.input-btn__excel {
	width: 140px;
	height: 32px;
	border-radius: 4px;
	background-color: #007511;
	color: #fff;
	/* transition: background-color 0.1s ease-in; */
}

.input-btn__excel:hover {
	cursor: pointer;
	background-color: #00a12b;
}

/* ===================== */
/*　PDF出力　*/
/* ===================== */
.output-btn__edit {
	width: 140px;
	height: 32px;
	border-radius: 4px;
	background-color: #a9dae1;

	/* transition: background-color 0.1s ease-in; */
}
.output-btn__edit:hover {
	cursor: pointer;
	background-color: #97f5f5;
}
/* ===================== */
/*　枠線 検索ボタン　*/
/* ===================== */
.rice-search__btn{
	margin-top: 2em;
	margin-left: auto;
	margin-right: auto;

	color:var(--color-bk-strong);
	font-size: var(--txt-reg);
    border: solid 1px var(--color-main);

	display:inline-block;
	width: 240px;
	height: 40px;

	transition: 
	background-color 0.4s ease-in-out,
	color 0.4s ease-in-out;

	position: relative;
}
.rice-search__btn svg{
	position: absolute;
	top: 50%;
	right: 16px;
	transform: translateY(-50%);

	width: 24px;
	fill: var(--color-main);

	transition: fill 0.4s ease-in-out;
}
.rice-search__btn:hover{
	background-color: var(--color-main);
	color: var(--color-white);
}
.rice-search__btn:hover svg{
	fill: var(--color-white)
}
/*-----------------------*/
/* エラーメッセージ
/*-----------------------*/
/*---------------*/
/* テキスト設定 */
/* エラーメッセージ固定領域 */
.error-msg {
	width: 100%;
	
	padding: 0.8em;
    color: red;
    font-size: var(--txt-sm);
	text-align: center;
}
/* @keyframes fadeIn {
  0%, 100% { opacity: 0; }
  50% { opacity: 1; }
} */
/*-----------------------*/
/* リンクエリア
/*-----------------------*/
/*---------------*/
/* ボタン設定 */
/* コンテナ */
.back-link__wrapper{
	margin-top: calc(40rem/16);
	padding-bottom: calc(40rem/16);
	width: 100%;
}
/* h3 */
/* コンテナ */
.h3__txt-wrapper{
	text-align: center;
}
/* テキスト */
.h3__txt-wrapper h3{
	font-size: var(--txt-md);
	font-family: "Noto Serif JP", serif;
    font-weight: 600;
}
.h3__txt-wrapper p{
	font-size: var(--txt-reg);
}
/* 線 */
.h3__txt-wrapper .headline-border{
	margin-top: 0.3em;
	margin-bottom: 0.3em;
}
/* リスト */
.back-link__wrapper ul{
	margin-top: 1em;
	width: 100%;

	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.8em;
}
.back-link__wrapper .h3__txt-wrapper p{
	font-size: var(--txt-sm);
}
/* アイテム */
/* アリモト企業ロゴ */
.back-link__wrapper ul li.arimoto-logo__item{
	width: 160px;
}
/* いっぷく半月庵ロゴ */
.back-link__wrapper ul li.hangetsuan-logo__item{
	width: 100px;
}
.back-link__wrapper ul li > a{
	display: block;
	width: 100%;
	height: 100%;
	transition: opacity 0.4s var(--easeInOutSine);
}
.back-link__wrapper ul li > a > img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.back-link__wrapper ul li > a:hover{
	opacity: 0.7;
}



/*-------------------------------*/

/* Tablet iPad Pro */

/*------------------------------*/
@media (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait),
       (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: landscape) {
	/* ===================== */
	/*　検索結果戻る　*/
	/* ===================== */
	.back-btn__wrapper{
		margin-top: 2em;
	}
	.back-btn {
		height: 40px;
	}
} /*Tablet END*/



/*-------------------------------*/

/* Tablet 768px */

/*------------------------------*/
@media(max-width:768px){
	/* ===================== */
	/*　検索結果戻る　*/
	/* ===================== */
	.back-btn__wrapper{
		margin-top: 2em;
	}
	.back-btn {
		height: 40px;
	}
}



/*-------------------------------*/

/* Smartphone 559px */

/*------------------------------*/
@media (max-width: 559px) {
	.rice-search__btn {
		width: 100%;
		height: 48px;            
		font-size: var(--txt-md);
	}
	/*-----------------------*/
	/* リンクエリア
	/*-----------------------*/
	/*---------------*/
	/* ボタン設定 */
	/* コンテナ */
	.back-link__wrapper{
		margin-top: 0;
		padding: 1em;
		background-color: var(--color-bg);

		position: fixed;
		bottom:	0;
		z-index: 99;
	}
	/* h3 */
	/* ヘディング */
	.link-heading h3{
		padding-bottom: 0.3em;
		font-family: "Noto Serif JP", serif;
		font-weight: 600;
	}
	/* こちらもご覧ください */
	.link-heading p{
		margin-top: 0.5em;
		font-size: var(--txt-sm);
		line-height: 1.2;
	}
	/* リスト */
	.back-link__wrapper ul{
		margin-top: 0;

		display: flex;
		justify-content: center;
		align-items: center;
		gap: 1em;
	}
	/* アイテム */
	.back-link__wrapper ul li.arimoto-logo__item{
		width: 140px;
	}
	.back-link__wrapper ul li.hangetsuan-logo__item{
		width: 64px;
	}
	/* ===================== */
	/*　検索結果戻る　*/
	/* ===================== */
	.back-btn__wrapper{
		margin-top: 2em;
	}
	.back-btn {
		width: 100%;
		height: 48px;
	}
} /*Smartphone END*/
