@charset "UTF-8";

/* ==============================================
	ハロウィン2024の特集ページ
============================================== */

.bg_navy {background: #00153e;}

.bg_purple {background: #73489C;}

.bg_orange {background: #F8B689;}
.bg_orange h3,
.bg_orange p,
.bg_orange li,
.bg_orange .product_name,
.bg_orange .tax { color: #843C0C !important;}

.bg_white {background:#fff;}
.bg_white h3,
.bg_white p,
.bg_white li,
.bg_white .product_name,
.bg_white .tax { color: #843C0C !important;}
.bg_white_ h3,
.bg_white_ p,
.bg_white_ li,
.bg_white_ .product_name,
.bg_white_ .tax { color: #843C0C !important;}



.pc {display: block !important;}
.sp {display: none !important;}
/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	.pc {display: none !important;}
	.sp {display: block !important;}
}

.txt22 {font-size: 22px;}

.w460 {max-width: 460px;}

.w100 {width:100%;height: auto;}
h2 img {width:100%;height: auto;}

/*-------------------------------------------------
.lineupInner
---------------------------------------------------*/
.lineupInner {margin: 0 10px;padding: 0 0 10px 0;line-height: 180%;}
.lineupInner:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.lineupInner h2 {font-size: 20px;font-weight: normal; color:#000;}
.lineupInner p {font-size: 16px;line-height: 180%; color:#000;}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	.lineupInner {/*width: 100%;margin: 0 auto;*/}
	.lineupInner img {width: 100%; margin:0;}
	.lineupInner img.h-img,
	.lineupInner img.limited,
	.lineupInner img.Lacte38,
	.lineupInner img.selection
	{width: auto;}
}

/*-------------------------------------------------
#フォント
---------------------------------------------------*/
#season {font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic" ,sans-serif;color:#000;}
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }
/*-------------------------------------------------
#見出し
---------------------------------------------------*/
#main h2 {padding: 0;/*margin: 0 10px;padding: 20px;font-size: 200%;*/text-align: center;background: none !important;}

#main h3 {font-size: 150%; text-align: center; line-height: 160%; color: #000;}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	}

/*----------------------------------------------------------------------
.2カラム　３カラムの設定
----------------------------------------------------------------------*/

ul.two_column {margin: 0;padding: 0;}
ul.two_column:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
ul.two_column li {width: 48%;float: left;margin: 0 1% 20px 1%;text-align: center;list-style-type: none;font-size: 16px;color: #fff;}
ul.two_column li:nth-child(odd) {clear: both;}


ul.three_column {margin: 0;padding: 0;}
ul.three_column:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
ul.three_column li {width: 31%;float: left;margin: 0 1% 20px 1%;text-align: center;list-style-type: none;font-size: 16px;color: #fff;}

ul.two_column li img,
ul.three_column li img {height: auto;margin: 0 0 10px 0; }

.shopIcon {margin: 5px 0 0 0 !important;width: 40px !important;height: 40px !important;}

.borderbox {margin: 10px; padding: 10px 5px;border: solid 2px #557EC0;}
.borderbox p,.borderbox ul,.borderbox ol {margin-bottom: 0;}
.borderbox h3 {margin: 0 0 10px 0;text-align: left;}


.borderlinkbtn a {display: block;border: solid  1px #A9814D;padding:10px;max-width: 400px;margin:0 auto; text-decoration: underline; color: #A9814D;}

.pc_center_sp_left {text-align: center;}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {

	ul.two_column li {width: 42%;float: left;margin: 0 4%;padding: 0 0 20px 0;height: auto !important;}
	ul.two_column li img {width: 90%;height: auto;}

	ul.two_column li img.shopIcon {width: auto;height: auto;}
	
	.borderlinkbtn a {max-width: 280px;}

	.pc_center_sp_left {text-align: left;}
	
}

/*----------------------------------------------------------------------
 .sp_main_visual
----------------------------------------------------------------------*/
.sp_main_visual{
}
/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
}

/*----------------------------------------------------------------------
 .note
----------------------------------------------------------------------*/
.note p.note_img{
	margin: 0 auto;
	padding: 0;
	text-align: center;
	background: #996633;
}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	.note p.note_img{
		width: 100%;
		float: none;
	}
}


.mainTitleTxt {
	margin-top: 30px;
	font-size: 280%;
	text-align: center;
	color: #ed6a41;
	font-weight: bold;
}
/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	.mainTitleTxt {
		font-size: 200%;
	}
}

/*----------------------------------------------------------------------
 .menulist
----------------------------------------------------------------------*/
.menulist {
	font-weight: bold;
	margin: 0 auto;
	padding: 30px 0;
	background-color: #73489C;
}

.menulist p.menutitle {
	font-size: 150%;
	margin-bottom: 30px;
	text-align: center;
	color: #fff;
	background: #000;
	padding: 15px 0;
	}

.menulist ul {margin: 0 auto;max-width: 730px}
.menulist ul:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.menulist li {
	width: 31.3%;
	float: left;
	margin: 0 1% 10px 1%;
	list-style-type: none;
	border-radius: 10px;
	text-align: center;
	font-size: 16px;
	}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
		.menulist li {width: 45%; margin-left: 3%; }
}

/*----------------------------------------------------------------------
----------------------------------------------------------------------*/
.item_box {
	margin: 75px auto;
}

p.item_box {color: #fff;}
.product_name {color: #fff; font-weight: bold;}
.price {color: red; font-weight: bold; font-size: 20px;}
.tax {color: #fff; font-weight: normal; font-size: smaller;}
.detail {color: #fff; font-weight: lighter;}
.detail_tl {color: #fff; font-weight: lighter; text-align: left!important;}
/*.free img {width: 51px !important;  height: 30px !important; margin-bottom: 0px !important;}*/


.bg_purple .price {color: #ff2727;text-shadow: 1px 1px 10px #3c0075;font-size: 22px;}
.bg_orange .price {font-size: 22px;}



.saleoff {
	display: block;
	width: 510px;
	line-height: 1.5em;
	margin: 0 auto;
	padding: 10px;
	color: #fff !important;
	xfont-size: 13px;
	background: #557EC0;
	border-radius: 0px;
	font-weight: normal;
}

.shop {
	display: inline-block;
	max-width: 500px;
	line-height: 1.5em;
	margin: 0 auto;
	padding: 10px;
	background: #fff;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	font-weight: bold;
}

.orderBtn {
	display: block;
	width: 50%;
	line-height: 1em;
	margin: 0 auto;
	padding: 20px 10px;
	color: #FFF !important;
	font-size: 16px;
	background: #ed6a41;
	border-radius: 5px;
	font-weight: bold;
}

.orderBtn_soldout {
	display: block;
	width: 50%;
	line-height: 1em;
	margin: 0 auto;
	padding: 20px 10px;
	color: #FFF !important;
	font-size: 14px;
	background: #B50005;
	border-radius: 5px;
	font-weight: normal;
}

.linkBtn {
	display: block;
	width: 60%;
	line-height: 3em;
	margin: 0 auto;
	padding: 5px 10px;
	color: #FFF !important;
	font-size: 14px;
	background: #442c26;
	border-radius: 5px;
	font-weight: normal;
}

.orderBtn span, .linkBtn span {
	background: url("../../../../../../images/lineup/fathersday/arrow_02.png") no-repeat left center;
	padding-left: 10px;
}

.anc {
    display: block;
	padding-top: 100px;
	margin-top: -100px;
}

@media screen and (max-width: 767px) {
	.saleoff,.shop {
		width: 90%;
		padding: 20px 5px;
	}
	.orderBtn {
		width: 90%;
		padding: 20px 5px;
	}
	.linkBtn {
		width: 90%;
		padding: 5px;
	}
}


/*----------------------------------------------------------------------
.free_table_area
----------------------------------------------------------------------*/
.free_table_area {
	background-color:#7CABDC;
	margin-bottom: 50px;
	padding-bottom: 20px;
}
.free_table_area table {
	color: #000;
	border-top: solid 1px #3E4298;
	border-bottom: solid 1px #3E4298;
	width: 90%; 
	margin: 0 auto; 
	background:#fff;
}

.free_table_area table th {
	padding: 8px 5px;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	background: #3E4298;
	color: #fff;
	border-right: solid 1px #3E4298;
}

.free_table_area table td {
	padding: 8px 5px;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	border-top: solid 1px #3E4298;
	border-right: solid 1px #3E4298;
}

.free_table_area table th:last-child,
.free_table_area table td:last-child {
	border-right: none;
}
/*----------------------------------------------------------------------
ポイント制度
----------------------------------------------------------------------*/
h2#point_h2 {
	color: #1b8962;
	background: none;
	border: none;
	padding: auto 0;
	margin: auto  0;
	font-weight: bold;
}

.pointBtn {
	display: block;
	width: 270px;
	margin: 0 auto;
	padding: 10px 15px;
	color: #FFF !important;
	font-size: 14px;
	background: #1b8962;
	border-radius: 5px;
}

.pointBtn span {
	background: url("../../../../../../images/lineup/fathersday/arrow_02.png") no-repeat left center;
	padding-left: 20px;
}

/*----------------------------------------------------------------------
ラッピングについて
----------------------------------------------------------------------*/
#wrap_area {
	padding: 0;
	background: #F9D3E3;
	color: #000;
}

#wrap_area h2 {
	color: #000;
	background: #203764;
	font-weight: bold;
	padding-top: 25px !important;
}

#wrap_area p
{
	color: #000;
	font-weight: 100;
	width:  93%;
	margin:30px auto 0px;
}

@media screen and (max-width: 1100px) {
	#wrap_area p
	{
		width:  81%;
	}
}
	
@media screen and (max-width: 767px) {

	#wrap_area img {
	width: 100%;
	height: auto;
	max-width: 400px;
	}

	#wrap_area p
	{
		width:  91%;
	}
}

/* #pagetop ------------------------ */
p#pagetop{position: fixed;bottom: 20px;right: 20px;font-size: 10px;z-index:500;opacity: 0.8;}
* html p#pagetop{text-align:right;margin-right:20px;margin-bottom:20px;}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	p#pagetop img{width:50px;height:50px;}
}

/* ----------------------------------------
	base style
---------------------------------------- */
/* common module --------------------- */
/*width*/
.w5p{width:5%;}
.w10p{width:10%;}
.w15p{width:15%;}
.w20p{width:20%;}
.w25p{width:25%;}
.w30p{width:30%;}
.w35p{width:35%;}
.w40p{width:40%;}
.w45p{width:45%;}
.w50p{width:50%;}
.w55p{width:55%;}
.w60p{width:60%;}
.w65p{width:65%;}
.w70p{width:70%;}
.w75p{width:75%;}
.w80p{width:80%;}
.w85p{width:85%;}
.w90p{width:90%;}
.w95p{width:95%;}

/*text-align setting*/
.tc{ text-align:center !important;}
.tl{ text-align:left !important;}
.tr{ text-align:right !important;}

/*border setting
.b1 {border: 1px solid #ccc;}*/

/*font setting*/
.bold {font-weight:bold;}
.red {color:#C00;}
.blue {color:#557EC0;}
.white {color:#fff;}
.txt12 {font-size: 12px !important;}
.txt14 {font-size: 14px !important;}
.txt15 {font-size: 15px !important;}

.addTxt {border: solid 2px #ed6a41;margin-bottom: 30px;padding: 10px;line-height: 150%;margin: 0 10px;text-align: center;background: #FFF;}

/*float setting*/
.fl{ float:left;}
.fr{ float:right;}
.clear{clear:both;}
.clearfix{	zoom:1;}
.clearfix:after{
    content:".";
    display: block;
    height:0px;
    clear:both;
    visibility:hidden;
}

/*margin-setteing*/
.mt30 {margin-top: 30px !important;}
.mb0 {margin-bottom: 0 !important;}
.mb10 {margin-bottom: 10px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb100 {margin-bottom: 100px !important;}

/*border-setteing*/
.bb1 {border-bottom: 1px solid #666;}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	.description {display: block;text-align: left !important;}
	.addTxt {padding: 5px 3px;font-size: 14px !important;}
}

/*-------------------------------------------------
	.note
---------------------------------------------------*/
.note {overflow:hidden;}

.note dt,
.note dd {
	margin-top:5px;
}

.note dt {
	clear:both;
	float:left;
}

.note dd {margin-left:2em;}
.note.single dd {margin-left:1.2em;}
.note dd.space {margin-top:1em;}

/*-------------------------------------------------
	.clearFix
---------------------------------------------------*/
.clearFix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearFix {display:inline-block;}
/*Hides from IE-mac \*/
* html .clearFix {height: 1%;}
.clearFix {display: block;}
/*End hide from IE-mac */
/* IE7 */
*:first-child+html .clearFix {height: 1%;}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
}

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

.two_column li {display: block;position: relative;}
.free {display: block;position: absolute; top: 10px;left: 60px;width: 60px;height: 35px;}
.free img {width: 100%;height: auto;}

/* ---------- SP ---------- */
@media screen and (max-width: 767px) {
	.free {left: 5px;}
}