@charset "utf-8";
/* CSS Document */




/*==================================
	loading
==================================*/
#loader-bg { position: fixed; z-index: 1000; min-width: 1200px; width: 100%; height: 100%; top: 0px; left: 0px; background: url(../img/top/loading_img.jpg) no-repeat center center; background-size: cover;}
#loading { position: absolute; left: 0; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
#loading .loading_logo { text-align: center;}
#main-contents{ position: relative; width: 100%; height: 100%; z-index: 500;}
@media screen and (max-width: 750px) {
#loader-bg { min-width: 100%;}
#loading .loading_logo img { width: 160px;}
}
#main-contents { display: none;}

/*==================================
	top
==================================*/
/* top_mv */
#top_mv { width: 100%; height: 100%; position: relative; z-index: 200; background: url(../img/top/mv_bg.jpg) no-repeat center center; background-size: cover; text-align: center;}
#top_mv .mv_logo { position: absolute; left: 0; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
#top_mv .mv_scroll { left: 0; right: 0; bottom: 20px; position: absolute; margin: 0 auto;}
#top_mv .mv_scroll a { padding: 0; margin: 0 auto;}
#top_mv .mv_scroll a:before{ left: -1px; width: 30px; height: 30px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(135deg); transform: rotate(135deg); top: -18px;}
@media screen and (min-width: 751px) {
#top_mv {}
#top_mv .mv_scroll a { width: 45px; height: 30px;}
}
@media screen and (max-width: 750px) {
#top_mv { width: 100%; height: 63%; }
#top_mv .mv_logo img { width: 180px;}
#top_mv .mv_scroll a { width: 45px; height: 30px;}
}

/* top_sec01 : なごしのお菓子スライダー*/
#top_sec01 { text-align: center;}
#top_sec01 .top_slider .flame { display: none; position: absolute; background: url(../img/top/sec01_frame.png) no-repeat; z-index: 50;}
#top_sec01 .top_slider .slider{ width: 100%;}
#top_sec01 .top_slider .slider img { height: auto; width: 100%;}
#top_sec01 .txt { line-height: 2.5;}

@media screen and (min-width: 992px) {
#top_sec01 { margin-top: 120px;}
#top_sec01 .top_slider { position: relative; width: 1000px; margin: 0 auto 70px auto;}
#top_sec01 .top_slider .flame { width: 1000px; height: 602px;}
#top_sec01 .top_slider .slider{ margin: 100px auto;}
#top_sec01 .top_slider .arr_prev,
#top_sec01 .top_slider .arr_next { width: 34px; height: 34px; border-top: 2px solid #c9c9c9; position: absolute; top: 320px; cursor: pointer;}
#top_sec01 .top_slider .arr_prev { border-left: 2px solid #c9c9c9; transform: rotate(-45deg); left: -80px;}
#top_sec01 .top_slider .arr_next { border-right: 2px solid #c9c9c9; transform: rotate(45deg); right: -80px;}
#top_sec01 .txt { font-size: 20px; margin-bottom: 60px;}
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
#top_sec01 { margin-top: 120px;}
#top_sec01 .top_slider { position: relative; width: 80%; margin: 0 auto 70px auto;}
#top_sec01 .top_slider .flame { width: 100%; height: 602px;}
#top_sec01 .top_slider .slider{ margin: 100px auto;}
#top_sec01 .top_slider .arr_prev,
#top_sec01 .top_slider .arr_next { width: 50px; height: 50px; border-top: 2px solid #c9c9c9; position: absolute; top: 50%; cursor: pointer;}
#top_sec01 .top_slider .arr_prev { border-left: 2px solid #c9c9c9; transform: rotate(-45deg); left: -50px;}
#top_sec01 .top_slider .arr_next { border-right: 2px solid #c9c9c9; transform: rotate(45deg); right: -50px;}
#top_sec01 .txt { font-size: 20px; margin-bottom: 60px;}
}
@media screen and (max-width: 750px) {
#top_sec01 { margin-top: 80px;}
#top_sec01 .top_slider { position: relative; width: 100%; margin: 0 auto 40px auto;}
#top_sec01 .top_slider .flame { width: 100%; padding-top: 60%; background-size: cover;}
#top_sec01 .top_slider .arr_prev,
#top_sec01 .top_slider .arr_next { width: 12px; height: 12px; border-top: 2px solid #c9c9c9; position: absolute; top: 50%; cursor: pointer; z-index: 70;}
#top_sec01 .top_slider .arr_prev { border-left: 1px solid #c9c9c9; transform: rotate(-45deg); left: -3%;}
#top_sec01 .top_slider .arr_next { border-right: 1px solid #c9c9c9; transform: rotate(45deg); right: -3%;}
#top_sec01 .txt { font-size: 87%; margin-bottom: 40px;}
}

/* top_sec02 : フローティング写真 */
/* top_sec02 : 写真スライド */
#top_sec02 {}
#top_sec02 .top_slider02 { position: relative; }
#top_sec02 .top_slider02 .slider02 img { height: auto; width: 100%; object-fit: cover; max-height: 600px; }
@media screen and (min-width: 992px) {
	#top_sec02 { margin: 130px auto 140px auto; }
	#top_sec02 .top_slider02 .arr_prev,
	#top_sec02 .top_slider02 .arr_next { width: 20px; height: 20px; border-top: 2px solid #c9c9c9; position: absolute; top: 50%; cursor: pointer; z-index: 70;}
	#top_sec02 .top_slider02 .arr_prev { border-left: 2px solid #c9c9c9; transform: rotate(-45deg); left: 3%;}
	#top_sec02 .top_slider02 .arr_next { border-right: 2px solid #c9c9c9; transform: rotate(45deg); right: 3%;}
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
	#top_sec02 { margin: 100px auto; }
	#top_sec02 .top_slider02 .arr_prev,
	#top_sec02 .top_slider02 .arr_next { width: 20px; height: 20px; border-top: 2px solid #c9c9c9; position: absolute; top: 50%; cursor: pointer; z-index: 70;}
	#top_sec02 .top_slider02 .arr_prev { border-left: 2px solid #c9c9c9; transform: rotate(-45deg); left: 3%;}
	#top_sec02 .top_slider02 .arr_next { border-right: 2px solid #c9c9c9; transform: rotate(45deg); right: 3%;}
}
@media screen and (max-width: 750px) {
	#top_sec02 { margin: 50px auto;}
	#top_sec02 .top_slider02 .arr_prev,
	#top_sec02 .top_slider02 .arr_next { width: 20px; height: 20px; border-top: 2px solid #c9c9c9; position: absolute; top: 50%; cursor: pointer; z-index: 70;}
	#top_sec02 .top_slider02 .arr_prev { border-left: 2px solid #c9c9c9; transform: rotate(-45deg); left: 3%;}
	#top_sec02 .top_slider02 .arr_next { border-right: 2px solid #c9c9c9; transform: rotate(45deg); right: 3%;}
}

/* top_sec03 : お知らせ */
#top_sec03 {margin-top:3rem;}
#top_sec03 .list li { border-bottom:  solid 1px #ddd; padding-bottom: 25px; margin-bottom: 25px;}
#top_sec03 .list li a { display: block; line-height: 1.5;}
#top_sec03 .list li a:hover { color: #ed4e4e; opacity:1;}

@media screen and (min-width: 992px) {
#top_sec03 { margin-bottom: 130px;}
#top_sec03 .list { width: 850px; margin: 0 auto 80px auto;}
#top_sec03 .list li { display: flex;}
#top_sec03 .list li a { display: flex;}
#top_sec03 .list li .date { width: 125px;}
#top_sec03 .list li .txt { width: 725px;}
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
#top_sec03 { margin-bottom: 130px;}
#top_sec03 .list { width: 100%; margin: 0 auto 80px auto;}
#top_sec03 .list li { display: flex;}
#top_sec03 .list li a { display: flex;}
#top_sec03 .list li .date { width: 125px;}
#top_sec03 .list li .txt { width: 725px;}
}
@media screen and (max-width: 750px) {
#top_sec03 { margin-bottom: 80px;}
#top_sec03 .list { width: 100%; margin: 0 auto 30px auto; font-size: 90%;}
#top_sec03 .list li { display: block;}
#top_sec03 .list li a { display: block;}
#top_sec03 .list li .date { width: 30%;}
#top_sec03 .list li .txt { width: auto;}
}

/* top_sec04 : アクセント写真 */
#top_sec04 {}
@media screen and (min-width: 751px) {
#top_sec04 { margin-bottom: 120px; height: 420px; background: url(../img/top/sec04_img.jpg) no-repeat center center; background-attachment: scroll; background-size: auto; background-attachment: fixed; background-size: cover;}
}
@media screen and (max-width: 750px) {
#top_sec04 { margin-bottom: 80px; padding-top: 70%; background: url(../img/top/sec04_img_sp.jpg) no-repeat center center;background-size: cover;}
}

/*top_sec06 : なごしについて*/
#top_sec06 { text-align: center; }
#top_sec06 .txt { line-height: 2.5;}
#top_sec06 .link a { border: solid 1px #a6a6a6; color: #a6a6a6; padding: 10px 50px; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-weight: lighter; letter-spacing: 0.1em; display: block; text-align: center; margin: 0 auto; }

@media screen and (min-width: 992px) {
#top_sec06 .txt { font-size: 20px; margin-bottom: 40px;}
#top_sec06 .link { font-size: 13px; margin-top: 10px;}
#top_sec06 .link a { width: 15%; }
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
#top_sec06 .txt { font-size: 20px; margin-bottom: 40px;}
#top_sec06 .link { font-size: 13px; margin-top: 10px;}
#top_sec06 .link a { width: 30%; }
}
@media screen and (max-width: 750px) {
#top_sec06 .txt { font-size: 87%; margin-bottom: 20px;}
#top_sec06 .link { font-size: 70%; margin-top: 10px;}
#top_sec06 .link a { width: 55%; }
}


/* top_sec05 : 店舗紹介 */
#top_sec05 { }
#top_sec05 .store_list .img { margin-bottom: 25px;}
#top_sec05 .store_list .add .notes { display: block;}
#top_sec05 .store_list .info { display: flex; flex-wrap: wrap; line-height: 1.5;}
#top_sec05 .store_list .info dt,
#top_sec05 .store_list .info dd { margin-bottom: 5px;}
#top_sec05 .store_list .link a { border: solid 1px #a6a6a6; color: #a6a6a6; padding: 10px 50px; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-weight: lighter; letter-spacing: 0.1em; display: block; width: 50%; text-align: center; }
#top_sec05 .store_list .map a:after { content: ""; background: url(../img/icon_blank.png) no-repeat; width: 10px; height: 10px; margin-left: 8px; display: inline-block;}

@media screen and (min-width: 992px) {
#top_sec05 {}
#top_sec05 { padding-top: 100px;}
#top_sec05 .store_list { display: flex; width: 1000px; margin: 0 auto;}
#top_sec05 .store_list li { width: 310px; margin-left: 35px;}
#top_sec05 .store_list li:first-child { margin-left:0;}
#top_sec05 .store_list .name { font-size: 22px; margin-bottom: 15px;}
#top_sec05 .store_list .add { font-size: 15px;}
#top_sec05 .store_list .add .notes { font-size: 12px; margin-top: 5px;}
#top_sec05 .store_list .info { font-size: 15px; margin-top: 15px;}
#top_sec05 .store_list .info dt { width: 65px;}
#top_sec05 .store_list .info dd { width: 245px;}
#top_sec05 .store_list .link { font-size: 13px; margin-top: 10px;}
#top_sec05 .store_list .link.desc { margin-top: 30px;}
}

@media screen and ((min-width: 751px) and (max-width: 991px)) {
#top_sec05 {}
#top_sec05 { padding-top: 100px;}
#top_sec05 .store_list { display: flex; width: 100%; margin: 0 auto;}
#top_sec05 .store_list li { width: 30%; margin-left: 35px;}
#top_sec05 .store_list li:first-child { margin-left:0;}
#top_sec05 .store_list li img { width: 100%;}
#top_sec05 .store_list .name { font-size: 22px; margin-bottom: 15px;}
#top_sec05 .store_list .add { font-size: 15px;}
#top_sec05 .store_list .add .notes { font-size: 12px; margin-top: 5px;}
#top_sec05 .store_list .info { font-size: 15px; margin-top: 15px; height: auto !important;}
#top_sec05 .store_list .info dt { width: 65px;}
#top_sec05 .store_list .info dd { width: 245px;}
#top_sec05 .store_list .link { font-size: 13px; margin-top: 10px;}
#top_sec05 .store_list .link.desc { margin-top: 30px;}
#top_sec05 .store_list .link a { width: 80%; }
}

@media screen and (max-width: 750px) {
#top_sec05 {}
#top_sec05 { padding-top: 80px;}
#top_sec05 .store_list { display: block; width: 100%; margin: auto;}
#top_sec05 .store_list li { margin-bottom: 40px;}
#top_sec05 .store_list li:last-child { margin-bottom: 0;}
#top_sec05 .store_list .img { text-align: center; background: #eee;}
#top_sec05 .store_list .img img { width: 100%; height: auto; max-width: 310px; text-align: center;}
#top_sec05 .store_list .name { font-size: 110%; margin-bottom: 10px;}
#top_sec05 .store_list .add { font-size: 80%;}
#top_sec05 .store_list .add .notes { font-size: 70%; margin-top: 5px;}
#top_sec05 .store_list .info { font-size: 80%; margin-top: 10px;}
#top_sec05 .store_list .info dt { width: 30%;}
#top_sec05 .store_list .info dd { width: 70%;}
#top_sec05 .store_list .link { font-size: 70%; margin-top: 10px;}
#top_sec05 .store_list .link.desc { margin-top: 15px;}
}


/*top_sec07 : よくいただくご質問*/
#top_sec07 .link { text-align: center; }
#top_sec07 .link a { border: solid 1px #a6a6a6; color: #a6a6a6; padding: 10px 50px; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-weight: lighter; letter-spacing: 0.1em; display: block; text-align: center; margin: 0 auto; }

@media screen and (min-width: 992px) {
#top_sec07 { padding-top: 100px;}
#top_sec07 .faq { width: 1000px; margin: 0 auto; }
#top_sec07 .link { font-size: 13px; margin-top: 10px;}
#top_sec07 .link a { width: 20%; }
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
#top_sec07 { padding-top: 100px;}
#top_sec07 .faq { width: 100%; margin: auto; }
#top_sec07 .link { font-size: 13px; margin-top: 10px;}
#top_sec07 .link a { width: 30%; }
}
@media screen and (max-width: 750px) {
#top_sec07 { padding-top: 80px;}
#top_sec07 .faq { width: 100%; margin: auto; }
#top_sec07 .link { font-size: 70%; margin-top: 10px;}
#top_sec07 .link a { width: 55%; }
}


/*スタッフ募集バナー*/
.recruit { display: block; }
.recruit img { width: 100%; }
@media screen and (min-width: 992px) {
.recruit { margin: 6rem 6rem 3rem; }
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
.recruit { margin: 4rem 2rem 0; }
}
@media screen and (max-width: 750px) {
.recruit { margin: 3rem 0 0; }
}


/* お試しセットバナー */
.otameshi { display: block;}
.otameshi img { width: 100%; }
@media screen and (min-width: 992px) {
.otameshi { margin: 0 1rem 3rem; }
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
.otameshi { margin: 0 1rem 0; }
}
@media screen and (max-width: 750px) {
.otameshi { margin: 0; }
}

/* トップページ上方バナー */
#top_banner .banner_area { margin: 3rem auto; }
#top_banner .banner_upper_item { text-align: center; }
@media screen and (min-width: 992px) {
#top_banner .banner_area { width: 80%; }
#top_banner .banner_upper_item { margin: 0 20px 20px 20px; }
}
@media screen and ((min-width: 751px) and (max-width: 991px)) {
#top_banner .banner_area { width: 90%; }
#top_banner .banner_upper_item { width: 22%; margin: 0 8px 20px 8px; }
}
@media screen and (max-width: 750px) {
#top_banner .banner_upper_item { width: 30%; margin: 0 5px 6px 5px; }
}

/* 商品一覧 */
@media screen and ((min-width: 751px) and (max-width: 991px)) {
.product_listbox ul .listitem:nth-child(odd) { margin-left: 0;}	
}
