@charset "utf-8";
/*
ページごとの設定や、位置調整、テキスト装飾などで使用する汎用的なものとを記述します。

接頭辞はUtilityの頭文字を取って【u_】とします。

clearfixのみ、例外的に接頭辞をつけてません。

↓↓↓↓↓↓コメントアウト表記サンプル Comment out sample ↓↓↓↓↓↓
/*----------------------------------------------
	大くくりコメントアウト large part
---------------------------------------------*/

/*  中くくりコメントアウト middle part
------------------------------------- */

/* 小くくりコメントアウト small part */
/*
↑↑↑↑↑↑コメントアウト表記サンプル Comment out sample ↑↑↑↑↑↑
*/
.u_bold { font-weight: bold; }
.u_normal { font-weight: normal; }

.u_pc_tab_view { display: block; }
.u_tab_sp_view { display: none; }
.u_sp_view { display: none; }

.u_full { width: 100%; }
.u_my { margin-top: 1em;  margin-bottom: 1em; }
.u_mt2 { margin-top: 2em; }
.u_mb1{ margin-bottom: 1em;}
.u_pr0 { padding-right: 0!important; }
.u_pb0 { padding-bottom: 0!important; }
.u_pl0 { padding-left: 0!important; }

.u_nowrap { white-space: nowrap; }

@media screen and (max-width: 896px) {
	.u_sp_view { display: block; }
	.u_pc_view { display: none!important; }
	.u_tab_sp_view { display: block; }
}
@media screen and (max-width: 480px) {
	.u_pc_tab_view { display: none; }
}
.u_ALcenter { text-align: center; }
.u_ALright { text-align: right; }
.u_ALleft { text-align: left; }
.u_ALcenter_pc { text-align: center; }
.u_ALright_pc { text-align: right; }
.u_ALleft_pc { text-align: left; }
@media screen and (max-width: 896px) {
	.u_ALcenter_pc { text-align: inherit; }
	.u_ALright_pc { text-align: inherit; }
	.u_ALleft_pc { text-align: inherit; }
	.u_ALcenter_sp { text-align: center; }
	.u_ALright_sp { text-align: right; }
	.u_ALleft_sp { text-align: left; }
}
/*----------------------------------------------
	#top
---------------------------------------------*/
#top {
	/* background-color: #f6f6f6; */
}
/*  .u_bg_slider
------------------------------------- */
.u_bg_slider {
	position: relative;
	width: 100%;
  margin: 0 auto;
  background: url("../images/bg_01.png");
	background-size: contain;
	background-position: top center;
  background-repeat: no-repeat;
  text-align: center;
  transition: all .2s ease;
	overflow: hidden;
}
/* @media screen and (max-width: 1280px) {
	.u_bg_slider {
		background-size: cover;
	}
} */
/* バナーが1行の場合 */
.u_bg_slider.is_1row {
	height: 1300px;
	margin-bottom: -940px;
}
.u_bg_slider.is_1row .slick-dots { bottom: 934px; }
@media screen and (max-width: 1280px) {
	.u_bg_slider.is_1row {
		height: 55vw;
		margin-bottom: -27vw;
	}
	.u_bg_slider.is_1row .slick-dots { bottom: 26vw; }
}
/* バナーが2行の場合 */
.u_bg_slider.is_2row {
	height: 1570px;
	margin-bottom: -1210px;
}
.u_bg_slider.is_2row .slick-dots { bottom: 1204px; }
/* @media screen and (max-width: 1280px) {
	.u_bg_slider.is_2row {
		height: 76vw;
		margin-bottom: -48vw;
	}
	.u_bg_slider.is_2row .slick-dots { bottom: 47vw; }
} */
/* バナーが3行の場合 */
.u_bg_slider.is_3row {
	height: 1840px;
	margin-bottom: -1480px;
}
.u_bg_slider.is_3row .slick-dots { bottom: 1474px; }
/* @media screen and (max-width: 1280px) {
	.u_bg_slider.is_3row {
		height: 97vw;
		margin-bottom: -69vw;
	}
	.u_bg_slider.is_3row .slick-dots { bottom: 68vw; }
} */
/* バナーが4行の場合 */
.u_bg_slider.is_4row {
	height: 2110px;
	margin-bottom: -1750px;
}
.u_bg_slider.is_4row .slick-dots { bottom: 1744px; }
/* @media screen and (max-width: 1280px) {
	.u_bg_slider.is_4row {
		height: 118vw;
		margin-bottom: -90vw;
	}
	.u_bg_slider.is_4row .slick-dots { bottom: 89vw; }
} */
.u_bg_slider .slick-track {
	line-height: 0;
}
.u_bg_slider .u_bg_image.is_slide_sp {
	display: none;
}
.u_bg_slider .slick-slide img {
	width: 100%;
	max-width: 1260px;
	margin: auto;
}
.u_bg_slider .slick-arrow {
	position: absolute;
	top: 180px;
	z-index: 1;
	width: 14px;
	height: 14px;
	background: none;
	border: none;
	border-bottom: 4px solid #333;
	font-size: 0;
	outline: none;
	cursor: pointer;
	transition: all .2s ease;
}
@media screen and (max-width: 1280px) {
	.u_bg_slider .slick-arrow {
		top: 14vw;
	}
}
.u_bg_slider .slick-prev {
	transform: rotate(45deg);
	left: calc(50vw - 610px);
	border-left: 4px solid #333;
}
.u_bg_slider .slick-prev:hover {
	opacity: .5;
}
.u_bg_slider .slick-next {
	transform: rotate(-45deg);
	right: calc(50vw - 610px);
	border-right: 4px solid #333;
}
.u_bg_slider .slick-next:hover {
	opacity: .5;
}
.u_bg_slider .slick-dots {
	position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
.u_bg_slider .slick-dots li {
	display: inline-block;
}
.u_bg_slider .slick-dots li button {
	display: block;
	width: 12px;
	height: 12px;
	margin: 0 5px;
	border: 2px solid #e3e3e3;
	border-radius: 50px;
	background: #fff;
	font-size: 0;
	outline: none;
}
.u_bg_slider .slick-dots li.slick-active button {
	background: #333;
}
/*  .u_pickup_block
------------------------------------- */
.u_pickup_block {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-right: -0.5%;
	margin-left: -0.5%;
}
/* mod 20200925 .u_pickup_box { margin: 0 1% 2% 1%; } */
.u_pickup_box { margin: 0 0.5% 1% 0.5%; border: 3px solid #fff;}
.u_pickup_box.is_1 { width: 24%; }
.u_pickup_box.is_2 { width: 49%; }
.u_pickup_box.is_3 { width: 74%; }
.u_pickup_box.is_4 { width: 99%; }
.u_pickup_ph > img { width: 100%; }
@media screen and (max-width: 896px) {
}
@media screen and (max-width: 480px) {
	.u_pickup_box.is_1 { width: 49%; }
	.u_pickup_box.is_2 { width: 99%; }
	.u_pickup_box.is_3 { width: 99%; }
	/* .u_pickup_box { width: 100%!important; } */
}
@media screen and (max-width: 320px) {
	.u_pickup_box:not(:nth-last-child(-n+1)) {
		margin: 0 0 10px;
	}
}

@media screen and (min-width: 896px) and (max-width: 1280px) {
	/*  .u_bg_slider
	------------------------------------- */
	.u_bg_slider .slick-prev {
		left: 30px;
	}
	.u_bg_slider .slick-next {
		right: 30px;
	}
}
@media screen and (max-width: 896px) {
	/*  .u_bg_slider
	------------------------------------- */
	.u_bg_slider {
		height: inherit!important;
		max-height: inherit!important;
		margin-bottom: 0!important;
	}
	.u_bg_slider .u_bg_image.is_slide_pc {
		display: none;
	}
	.u_bg_slider .u_bg_image.is_slide_sp {
		display: block;
		width: 100%;
	}
	.u_bg_slider .slick-dots {
    bottom: 30px!important;
	}
}

/*----------------------------------------------
	.u_reset_button（button要素をリセット）
---------------------------------------------*/
.u_reset_button {
	border: 0;
  appearance: none;
	background: none;
}

/*----------------------------------------------
	.u_indent（左に1em分アキ）
---------------------------------------------*/
.u_indent {
	padding-left: 1em;
}

/*----------------------------------------------
	.ADD
---------------------------------------------*/
#confirm .l_wrap.has_narrow{
	max-width: 1000px;
}
#confirm .c_order_flow {
  display: flex;
  margin-bottom: 16px;
  justify-content: center;
  align-items: center;
}
#confirm .c_order_flow > li.c_order_flow_arrow {
  padding: 0 20px;
}
#confirm .l_left_conts.has_narrow {
  width: calc(100% - 354px);
}
#confirm .l_right_conts.has_narrow {
  width: 315px;
}
#confirm .c_prod_price.is_md > span {
  line-height: 1.6;
}
#confirm .c_cart_check_prod {
  padding-right: 15px;
}
@media screen and (max-width: 896px) {
	#confirm .l_left_conts.has_narrow {
	  width: 100%;
	}
	#confirm .l_right_conts.has_narrow {
    width: 100%;
	}
}

/*----------------------------------------------
	.clearfix
---------------------------------------------*/
.clearfix:after {
    content:"";
    display:block;
    clear:both;
}