@charset "UTF-8";

@media screen and (min-width: 768px) {
	/* general */
	.sfg__title_h2_suffix {
    display: inline;
    font-size: 18px;
    line-height: 1.555555555555556;
	}

	/* ====================== コンテンツヘッダ ====================== */
	.sfg__header {
		width: 1024px;
		margin: 0 auto;
		padding: 0 0 6px;
	}
	.sfg__lead {
		margin: 12px 30px 0 24px;
	}
	.date {
		font-size: 14px;
		line-height: 1.714285714285714;
	}
	
	/* =========================== 検索 =========================== */
	
	/* ------「ご利用方法と注意事項」SPアコーディオン ------ */
	.notice {
		margin: 0;
		padding: 39px 0 48px;
	}
	.notice_main_wrap {
		width: 1024px;
		margin: 0 auto;
	}
	.notice_main {
		height: auto !important;
		overflow: visible;
		margin: 22px 24px 0;
		font-size: 16px;
		line-height: 1.75;
	}
	.notice_wrap {
		padding: 41px 60px 42px;
	}
	.notice_inner {
		margin: 0;
		padding: 0;
	}
	.notice_title {
		margin: 0 0 1px;
		font-size: 22px;
		line-height: 1.727272727272727;
	}
	.notice_subtitle {
		margin: 25px 0 -5px;
		font-size: 18px;
		line-height: 2.111111111111111;
	}
	.notice_txt {
		margin: 0;
		letter-spacing: 0.04em;
	}
	
	/* 続きを読む・閉じるボタン */
	.notice_btn {
		display: none;
	}
	
	/* ------ アレルギー物質選択 ------ */
	.alg_search {
		width: 976px;
		margin: 0 auto;
		padding: 0 24px;
	}
	.alg_search_title {
		margin: 65px 0 0;
		padding: 0 0 0 60px;
		font-size: 28px;
		letter-spacing: 0.13em;
	}
	_:lang(x)::-ms-backdrop, .alg_search_title {
		margin: 71px 0 -6px;
	}
	.alg_search_title:first-child {
		margin: 64px 0 0;
		letter-spacing: 0.07em;
	}
	_:lang(x)::-ms-backdrop, .alg_search_title:first-child {
		margin: 70px 0 -6px;
	}

	.alg_search_title_sub {
		font-size: 18px;
	}
	.alg_search_num {
		top: -4px;
		width: 45px;
		height: 44px;
		background-size: 45px 44px;
	}
	_:lang(x)::-ms-backdrop, .alg_search_num {
		top: -10px;
	}
	
	/* アレルゲン選択 */
	.select_alg {
		margin: 22px 0 0 70px;
	}
	.select_alg li {
		width: 106px;
		height: 55px;
		margin: 16px 0 0 16px;
	}
	.select_alg li:nth-child(4n + 1) {
		margin: 16px 0 0 16px;
	}
	.select_alg li:nth-child(7) {
		margin-right: 0;
	}
	.select_alg li:nth-child(7) ~ li:nth-child(4n) {
		margin-left: 16px;
	}
	.select_alg li:nth-child(7) ~ li:nth-child(4n + 1) {
		margin-left: 16px;
	}
	.select_alg li:nth-child(7n + 1),
	.select_alg li:nth-child(7) ~ li:nth-child(7n + 1) {
		margin-left: 0;
	}
	.select_alg label {
		height: 51px;
		border-radius: 6px;
		font-size: 16px;
		line-height: 1.125;
	}
	_:lang(x)::-ms-backdrop, .select_alg label {
		height: 43px;
		padding: 8px 0 0;
	}
	.select_alg label small {
		font-size: 14px;
	}
	
	/* 検索したい条件を選択 */
	.cond {
		margin: 37px 73px 0;
	}
	.cond li {
		width: 400px;
		height: 90px;
		margin: 0 0 0 30px;
		padding: 0;
	}
	.cond li:first-child {
		margin: 0;
	}
	.cond label {
		height: 90px;
		padding: 2px 0 0 2px;
		border-radius: 6px;
		font-size: 20px;
		line-height: 1.5;
		letter-spacing: 0.08em;
		transition: opacity 0.3s ease;
	}
	_:lang(x)::-ms-backdrop, .cond label {
		padding: 12px 0 0 2px;
	}
	.cond label:hover {
		opacity: 0.8;
	}
	.cond span {
		display: inline;
	}
	.cond span.cond_ruby:after {
    top: -0.55em;
	}

	/* ========================= 検索結果 ========================= */
	
	.result_wrap {
		width: 936px;
		margin: 14px auto 0;
		padding: 36px 42px 0;
		border: 2px solid #dcd8d1;
		border-radius: 4px;
	}

	/* ------検索結果 ------*/
	/* 〜を原材料として使用している・いない商品 */
	.cond_detail {
		width: 860px;
		margin: 0;
		padding: 0;
		border: none;
		font-size: 20px;
		line-height: 1.6;
	}
	
	/* 条件として指定したアレルゲンのリスト */
	.alg_slct {
		margin: 0 0 10px;
		font-size: 28px;
		line-height: 1.5;
	}
	.alg_slct li {
    margin-right: 3px;
	}
	.new_search_wrap {
		display: none;
	}
	
	/* その下の注釈 */
	.cond_annot {
		margin: 21px 0 0;
	}
	
	/* ------ 商品カテゴリ毎のSP用ナビゲーション ------ */
	.nav_cat {
		display: none;
	}
	
	/* ------ 検索結果の商品リスト ------ */
	.result {
		margin: 37px 0 0;
		padding: 6px 0 27px;
		border-top: 2px solid #dcd8d1;
	}
	.crsctm .result {
		margin: 0;
		padding: 0 0 27px;
		border-top: none;
	}
	.result dt {
		margin: 24px 0 0;
		padding: 19px 0 0 21px;
		font-size: 28px;
		letter-spacing: 0.12em;
	}
	_:lang(x)::-ms-backdrop, .result dt {
		margin-bottom: -6px;
		padding: 25px 0 0 21px;
	}
	.result dt:first-child {
		margin: 24px 0 0;
	}
	.crsctm .result dt:first-child {
		margin: 26px 0 0;
	}
	.result dt:before {
		left: 6px;
		top: calc(50% + 9px);
		width: 6px;
		height: 25px;
	}
	_:lang(x)::-ms-backdrop, .result dt:before {
		top: calc(50% + 7px);
	}
	.result dd {
		margin: 0;
		padding: 0 7px 46px;
		font-size: 12px;
		line-height: 1.25;
	}
	.no_match {
		margin: -1px 0 -4px;
		padding: 37px 0 0;
		font-size: 20px;
		line-height: 1.4;
		letter-spacing: 0.12em;
	}
	
	/* 各商品カテゴリ毎の商品リスト */
	.result_inner {
		margin: 0;
		padding: 8px 0 0;
	}
	.result_inner li {
		float: left;
		width: 122px;
		margin: 18px 0 0 38px;
		border-bottom: none;
	}
	.crsctm .result_inner li:first-child,
	.crsctm .result_inner li {
    border-top: none;
    border-bottom: none;
	}
	.result_inner li:nth-child(6n+1) {
		clear: both;
		margin: 18px 0 0;
	}
	.result_inner li:first-child {
		border-top: none;
	}
	.ly-wrp-main .result_inner a {
		display: block;
		padding: 0;
		background: transparent none;
		color: #3f3f3f;
		font-size: 12px;
		line-height: 1.32;
	}
	.result_inner figure {
		position: relative;
		z-index: 1;
		display: block;
		height: 79px;
	}
	.result_inner img {
		z-index: 3;
		display: block;
		max-width: 100%;
		border-radius: 4px;
		height: auto;
		max-height: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	.result_inner figure:after {
		content: '';
		position: absolute;
		z-index: 2;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		border: 2px solid #dcd8d1;
		border-radius: 4px;
		height: 83px;
		margin: -2px;
		margin-top: -6px;
		background: #fff;
	}
	.item_name {
		display: block;
		margin: 7px 0 0;
		letter-spacing: 0.07em;
	}
	
	/* ------ 検索結果：交差混入がある商品 ------ */
	.crsctm {
		margin: 0 -42px;
		padding: 40px 42px 0;
	}
	.crsctm h2 {
		margin: 0;
		padding: 0 7px;
		font-size: 23px;
		line-height: 1.695652173913043;
	}
	.crsctm h2 em {
		font-size: 23px;
		line-height: 1.695652173913043;
	}
	
	/* ------ 検索結果下の注釈 ------ */
	.crsctm_bottom {
		width: 976px;
		margin: 20px auto 0;
		padding: 0
	}
		
	/* ===================== エラーメッセージ ===================== */
	
	/* ------ 該当する商品がない場合のエラーメッセージ ------ */
	.error_message {
		width: 1024px;
		margin: 47px auto -26px;
	}
	.error_message p {
		font-size: 18px;
		text-align: center;
	}
	
	/* ====================== フォームボタン ====================== */
	
	/* ------ 検索実行ボタン ------ */
	.form_submit {
		margin: 72px auto 0;
		padding: 42px 0 44px;
	}
	.form_submit.form_search_again {
    margin: 72px 0 78px;
    padding: 42px 0 44px;
	}
	.form_submit button,
	.form_submit input[type="submit"] {
		width: 460px;
		height: 96px;
		margin: 0 auto;
		padding: 2px 0 0 2px;
		font-size: 22px;
		background-size: 14px;
		background-position: right 25px center;
		transition: all 0.3s ease;
		letter-spacing: 0.1em;
	}
	_:lang(x)::-ms-backdrop, .form_submit button,
	_:lang(x)::-ms-backdrop, .form_submit input[type="submit"] {
		padding: 10px 0 0 2px;
	}
	.form_submit button:hover,
	.form_submit input[type="submit"]:hover {
		background-color: #c01900;
		background-image: url(./img/arrow_white.svg);
		color: #fff;
	}
	
	/* ==================== エラー時モーダル ==================== */
	#modal {
		background: rgba(0, 0, 0, 0.5) none;
	}
	.modal_inner {
		width: 840px;
		margin: 0 auto;
		padding: 0;
	}
	.modal_contents {
		width: 630px;
		margin: 262px auto 0;
		padding: 39px 0 34px;
		border-radius: 16px;
	}
	.modal_contents h2 {
		font-size: 22px;
		line-height: 1.7142857;
	}
	.modal_contents p {
		margin: 7px 0 0;
		font-size: 18px;
		line-height: 1.7333333;
	}
	.modal_contents a {
		width: 176px;
		height: 40px;
		margin: 28px auto 0;
		border-radius: 10px;
		font-size: 18px;
		line-height: 40px;
	}
	.modal_contents i {
		width: 14px;
		height: 16px;
		margin: 0 5px 0 0;
		background: transparent url(./img/bg_modal_btn_pc.png) left top no-repeat;
		-webkit-background-size: 14px 14px;
		background-size: 14px 14px;
	}
}