@charset "utf-8";

/*
-----------------------------------------------------------------
 コールドストーンクリーマリージャパン　Cold Stone Creamery Japan
 menu.css
 created : 2010.05.20
 last modified : 2013.01.21
 商品メニューカテゴリーの設定
-----------------------------------------------------------------
*/


/*
==============================================================

	Menu

==============================================================
*/

.category-menu {}

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

 メニュートップ
------------------------------------------------------*/

.menuTop .mainColumn {
	padding: 30px 0 0 0;
}
.menuTop .mainColumn .topImage {
	width: 100%;
	margin: 0 auto 26px auto;
	text-align: center;
}

/* トップメニュー */
.menuTop #sect01 dl {
	width: 722px;
	margin: 0 0 15px 0;
	zoom: 1;
}
.menuTop #sect01 dl:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}
.menuTop #sect01 dl dt {
	float: left;
	width: 345px;
	margin: 0 12px 0 0;
}
.menuTop #sect01 dl dd {
	float: left;
	width: 362px;
}
.menuTop #sect01 dl dt a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}


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

 メニューページレイアウト
------------------------------------------------------*/

/* ■menuHead
----------------------------------------------------- */
.category-menu .menuHead {
	margin-bottom: 0;
}
.category-menu .menuHead h3 {
	margin-bottom: 10px;
}
.category-menu .menuHead .txtTtl {
	font-size: 115%;
}
.category-menu .menuHead .txtTtl span {
	margin-right: 5px;
	margin-left: 2px;
	font-size: 154%;/* 20px相当 */
	font-family: 
		Arial,
		Helvetica,
		"ヒラギノ角ゴ Pro W3",
		"Hiragino Kaku Gothic Pro",
		"HiraKakuPro-W3",
		"メイリオ", 
		"Meiryo",
		Osaka,
		"ＭＳ Ｐゴシック",
		"MS PGothic",
		Sans-Serif;
}

/* オーダーの仕方フロー */
.category-menu .menuHead ol.howToOrder {
	margin: 0 auto 15px auto;
}
.category-menu .menuHead ol.howToOrder li {
	margin: 0 0 5px 0;
}
.category-menu .menuHead ol.howToOrder li img {
	vertical-align: bottom;
}

/* ■アイスクリームの種類ナビ■ */
.category-menu .navIcecream {
	position: relative;
	margin: 0 0 15px 0;
	/zoom: 1;
}
.category-menu .navIcecream:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}
.category-menu .navIcecream ul {
	width: 470px;
	padding: 4px 0;
	text-align: center;
}
.category-menu .navIcecream ul.upper {
	border-bottom: 1px solid #cebfa8;
}
.category-menu .navIcecream ul li {
	display: -moz-inline-box;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	
	padding: 0 5px 0 5px;
	margin: 0 0 0 0;
	border-right: 1px solid #b3aea1;
	line-height: 14px;
}
.category-menu .navIcecream ul li.lastChild {
	padding-right: 0;
	margin-right: 0;
	border-right: none;
}
.category-menu .navIcecream ul li img {
	vertical-align: bottom;
}

/* トップへ */
.category-menu .navIcecream .creationsTop {
	position: absolute;
	right: 0;
	bottom: 0;
}


/* ■menuBody
----------------------------------------------------- */
.category-menu .menuBody {
}


/* ■menuFoot
----------------------------------------------------- */
.category-menu .menuFoot {
	width: 722px;
	padding: 35px 36px 0 36px;
	background: url(../img/content/bg_border-dotted.gif) repeat-x left top;
}
.category-menu .menuFoot .takeOut {
	margin: 0 0 8px 0;
}
.category-menu .menuFoot .allergy {
	margin: 0 0 8px 0;
}



/*----------------------------------------------------
 ■□■
 Cold Stone Creations　コールドストーンクリエーション
------------------------------------------------------*/
.category-menu {}

.category-menu .menuBody {
	width: 722px;
	padding-top: 25px;
	padding-right: 36px;
	padding-left: 36px;
}
.category-menu .menuBody h4 {
	margin-bottom: 20px;
}

/* トップのアイス一覧
----------------------------------------- */
/*  
	【20110419】組み替え
======================================*/
.menu-creations ul.lineup_creations {
	width: 722px;
	zoom: 1;
}
.menu-creations ul.lineup_creations:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}
.menu-creations ul.lineup_creations li {
	float: left;
	width: 143px;
	height: 126px;
	margin: 0 -1px -1px 0;
	border: 1px solid #d4c7b2;
	_position: relative;
}
.menu-creations ul.lineup_creations li img {
	vertical-align: bottom;
}
.menu-creations ul.lineup_creations li a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
}


/* ▼アイスごと背景画像指定 */
.menu-creations .sweetcream {
	background: url(/menu/img/original_creations/bg_sweet-cream.gif) no-repeat left top;}
.menu-creations .yogurttaste {
	background: url(/menu/img/original_creations/bg_yogurt-taste.gif) no-repeat left top;}
.menu-creations .whitepeach {
	background: url(/menu/img/original_creations/bg_white-peach.gif) no-repeat left top;}
.menu-creations .greentea {
	background: url(/menu/img/original_creations/bg_green-tea.gif) no-repeat left top;}
.menu-creations .banana {
	background: url(/menu/img/original_creations/bg_banana.gif) no-repeat left top;}
.menu-creations .mint {
	background: url(/menu/img/original_creations/bg_mint.gif) no-repeat left top;}
.menu-creations .mango {
	background: url(/menu/img/original_creations/bg_mango.gif) no-repeat left top;}
.menu-creations .cheesecake {
	background: url(/menu/img/original_creations/bg_cheesecake.gif) no-repeat left top;}
.menu-creations .frenchvanilla {
	background: url(/menu/img/original_creations/bg_french-vanilla.gif) no-repeat left top;}
.menu-creations .strawberry {
	background: url(/menu/img/original_creations/bg_strawberry.gif) no-repeat left top;}
.menu-creations .chocolate {
	background: url(/menu/img/original_creations/bg_chocolate.gif) no-repeat left top;}
.menu-creations .coffee {
	background: url(/menu/img/original_creations/bg_coffee.gif) no-repeat left top;}
.menu-creations .maple {
	background: url(/menu/img/original_creations/bg_maple.gif) no-repeat left top;}
.menu-creations .custard {
	background: url(/menu/img/original_creations/bg_custard.gif) no-repeat left top;}


/*  .cscBox
	▼アイス紹介ひとつ分
----------------------------------------------------------- */
.category-menu .menuBody .cscBox {
	width: 722px;
	margin: 0 0 10px 0;
	/zoom: 1;
}
.category-menu .menuBody .cscBox:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}

/* ▼写真 */
.category-menu .menuBody .cscBox .cscPhoto {
	float: left;
	max-width: 320px;
	margin: 3px 18px 0 0;
}
.category-menu .menuBody .cscBox .cscPhoto img {
	max-width: 320px;
	/*height: 200px;*/
	border: 1px solid #e1dbcb;
	vertical-align: bottom;
}
.category-menu .menuBody .cscBox .cscPhoto img:first-child {
	margin-bottom: 5px;
}
.category-menu .menuBody .cscBox .cscPhoto .supplementary_note {
	padding: 3px 2px;
	color: #aa0002;
	font-size: 83%;
	text-align: right;
}
.category-menu .menuBody .cscBox .cscPhoto .supplementary_note02 {
	padding: 3px 2px;
	color: #aa0002;
	font-size: 83%;
	text-align: left;
}

.category-menu .menuBody .cscBox .cscPhoto .supplementary_note03 {
	padding: 3px 2px;
	color: #aa0002;
	font-size: 60%;
	text-align: left;
}

/* アイスケーキ */
.menu-IceCreamCake .menuBody .cscBox .cscPhoto img {
	width: 360px;
	/*height: 247px;*/
	border: 1px solid #e1dbcb;
}

/* ▼説明 */
.category-menu .menuBody .cscBox .cscInfo {
	display: block;
	overflow: hidden;
	/zoom: 1;
}
/* 販売終了文【20121226追加】 */
.category-menu .menuBody .cscBox .cscInfo .msg_endOfSale {
	margin: 0 0 1em 0;
	color: #c00;
	font-size: 115%;
	font-weight: bold;
}
.category-menu .menuBody .cscBox .cscInfo .msg_endOfSale span {
}

.category-menu .menuBody .cscBox .cscInfo h5 {
	margin: 0 0 13px 0;
	line-height: 1.4;
}
.category-menu .menuBody .cscBox .cscInfo h5 span {
	display: block;
	font-size: 122%;
	font-family:Arial, Helvetica, sans-serif;
}

.category-menu .menuBody .cscBox .cscInfo .description {
	margin: 0 0 1em 0;
}
.category-menu .menuBody .cscBox .cscInfo ul.material {
	margin: 0 0 15px 0;
}
.category-menu .menuBody .cscBox .cscInfo ul.material li {
	list-style: disc outside;
	margin: 0 0 4px 20px;
	line-height: 1.4;
}

/* ▼tweetアイコンなど【2010.12.16追加】 */
.category-menu .menuBody .cscBox .cscInfo .tweetIcon {
	margin: -4px 0 5px 0;
	/zoom: 1;
}
.category-menu .menuBody .cscBox .cscInfo .tweetIcon:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}
.category-menu .menuBody .cscBox .cscInfo .tweetIcon li {
	float: left;
	margin: 0 5px 0 0;
}
/* Likeボタン（ページに１つ） */
.category-menu .menuBody .snsbtn {
	position: relative;
}
.category-menu .menuBody .snsbtn .inner {
	position: absolute;
	top: -73px;
	right: 0px;
	text-align: right;
}


/*----------------------------------------------------
 ■□■
 Create Your Own　クリエイト ユア オウン
------------------------------------------------------*/
.menu-YourOwn {}

.menu-YourOwn .menuBody {}
.menu-YourOwn .menuBody h4,
.menu-YourOwn .menuBody h5 {
	margin-bottom: 8px;
}
.menu-YourOwn .menuBody .sideLeft {
	float: left;
	width: 400px;
}
.menu-YourOwn .menuBody .sideRight {
	float: right;
	width: 300px;
}

/* ▼共通 */
.menu-YourOwn .menuBody .lineup_yourown table {
	border: 1px solid #cebfa8;
	background: #ffffff;
}
.menu-YourOwn .menuBody .sideLeft table { width: 396px;}
.menu-YourOwn .menuBody .sideRight table { width: 296px;}

.menu-YourOwn .menuBody .lineup_yourown table th {
	border: 1px solid #cebfa8;
	white-space: nowrap;
}
.menu-YourOwn .menuBody .lineup_yourown table td {
	border: 1px solid #cebfa8;
	background: #ffffff;
}
.menu-YourOwn .menuBody .lineup_yourown table th h6 {
	font-family: Arial, Helvetica, sans-serif;
}

/* ▽Ice Cream */
.menu-YourOwn .menuBody table.lineup_ice {}
.menu-YourOwn .menuBody table.lineup_ice th {
	padding: 0 12px;
	vertical-align: middle;
}
.menu-YourOwn .menuBody table.lineup_ice td {
	padding: 8px 12px;
}
/* アイス各カラー */
.menu-YourOwn .menuBody table.lineup_ice tr.sweetcream th {
	background: url(/menu/create_your_own/img/bg_sweet-cream.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.yogurttaste th {
	background: url(/menu/create_your_own/img/bg_yogurt-taste.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.whitepeach th {
	background: url(/menu/create_your_own/img/bg_white-peach.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.greentea th {
	background: url(/menu/create_your_own/img/bg_green-tea.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.banana th {
	background: url(/menu/create_your_own/img/bg_banana.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.mint th {
	background: url(/menu/create_your_own/img/bg_mint.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.mango th {
	background: url(/menu/create_your_own/img/bg_mango.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.cheesecake th {
	background: url(/menu/create_your_own/img/bg_cheesecake.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.frenchvanilla th {
	background: url(/menu/create_your_own/img/bg_french-vanilla.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.strawberry th {
	background: url(/menu/create_your_own/img/bg_strawberry.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.chocolate th {
	background: url(/menu/create_your_own/img/bg_chocolate.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.royalmilktea th {
	background: url(/menu/create_your_own/img/bg_royalmilktea.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.pumpkin th {
	background: url(/menu/create_your_own/img/bg_pumpkin.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.pineapple th {
	background: url(/menu/create_your_own/img/bg_pineapple.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.maple th {
	background: url(/menu/create_your_own/img/bg_maple.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.custard th {
	background: url(/menu/create_your_own/img/bg_custard.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.murasakiimo th {
	background: url(/menu/create_your_own/img/bg_murasakiimo.gif) repeat-y left top;}
.menu-YourOwn .menuBody table.lineup_ice tr.coffee th {
	background: url(/menu/create_your_own/img/bg_coffee.gif) repeat-y left top;}

/* ▽Mix In */
.menu-YourOwn .menuBody table.lineup_mixin {}
.menu-YourOwn .menuBody table.lineup_mixin th {
	padding: 8px 12px;
}
.menu-YourOwn .menuBody table.lineup_mixin td {}
.menu-YourOwn .menuBody table.lineup_mixin td ul {
	margin: 0;
}
.menu-YourOwn .menuBody table.lineup_mixin td ul li {
	padding: 4px 12px;
	line-height: 1.4;
}
.menu-YourOwn .menuBody table.lineup_mixin td ul li.even {
	background: #faf7ef;
}

/* 【20120621追加　ジェラート】 */
.menu-YourOwn .menuBody .sideLeft .gelatoLine {
	padding: 25px 0 0 0;
}
.menu-YourOwn .menuBody .sideLeft .gelatoLine h4 {
	margin-bottom: 0.5em;
	color: #AD0002;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",	"HiraKakuPro-W3";
	font-size: 13px;
	font-weight: normal;
	line-height: 1.2;
}
.menu-YourOwn .menuBody .sideLeft .gelatoLine h4 span {
	margin-right: 0.4em;
	font-size: 150%;
	font-weight: bold;
}
.menu-YourOwn .menuBody .sideLeft .gelatoLine h5 {
	color: #AD0002;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",	"HiraKakuPro-W3";
	font-size: 13px;
	font-weight: normal;
	line-height: 1.4;
}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table {}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table th {
	width: 50%;
	padding: 0;
	background: none;
}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table th .inner {
/*	display: inline-block;*/
	height: auto;
	padding: 12px 12px 0 7px;
	border-left: 5px solid #FFCCCC;
	vertical-align: middle;
	text-align: left;
}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table tr.orange th .inner {	border-color: #E96C4E;}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table tr.berry th .inner {	border-color: #E02F49;}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table tr.lychee th .inner {	border-color: #FBD9CD;}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table tr.passion th .inner {	border-color: #E99404;}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table tr.acai th .inner {	border-color: #8C504F;}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table tr.muscat th .inner {	border-color: #bbe511;}
.menu-YourOwn .menuBody .sideLeft .gelatoLine table tr.yuzu th .inner {	border-color: #f9f3d1;}


/*----------------------------------------------------
 ■□■
 Ice Cream Cake  アイスクリーム ケーキ
------------------------------------------------------*/
.menu-IceCreamCake {}

.menu-IceCreamCake .menuBody {
	width: 722px;
	padding: 35px 36px 0 36px;
	background: url(../img/content/bg_border-dotted.gif) repeat-x left top;
}
.menu-IceCreamCake .menuBody h4 {
	margin-bottom: 8px;
}
.menu-IceCreamCake .menuBody h5 {
	margin-bottom: 1em;
}



/*----------------------------------------------------
 ■□■
 Ice Cream Cookie Sand  アイスクリーム クッキーサンド
------------------------------------------------------*/
.menu-CookieSand {}

/* 最下ボックス */
.menu-CookieSand .priceBox {
	margin-bottom: 25px;
}
.menu-CookieSand .priceBox ul {
	width: 350px;
	float: left;
}
.menu-CookieSand .priceBox ul li {
	width: 340px;
	padding: 0 0 12px 0;
	background: url(../img/content/bg_border-dotted.gif) repeat-x left bottom;
}
.menu-CookieSand .priceBox ul li h5 {
	margin: 0 0 3px 0;
	font-size: 154%;
	font-family:Arial, Helvetica, sans-serif;
}
.menu-CookieSand .priceBox ul li h5 span {
	display: block;
	font-size: 75%;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}
.menu-CookieSand .priceBox ul li p {
	margin: 0 0 3px 0;
}
.menu-CookieSand .priceBox ul li h6 {
	font-size: 123%;
}
.menu-CookieSand .priceBox ul li h6 span {
	font-size: 112%;
	font-family:Arial, Helvetica, sans-serif;
}
.menu-CookieSand .priceBox ul li#single {	overflow: hidden;}
.menu-CookieSand .priceBox ul li#single h5 {	float: left;}
.menu-CookieSand .priceBox ul li#single h5 span {	display: inline; margin: 0 0 0 8px;}
.menu-CookieSand .priceBox ul li#single h6 {	float: right;padding: 5px 0 0 0;}

.menu-CookieSand .priceBox .pic_box {
	float: right;
}
.menu-CookieSand .menuBody {
	width: 722px;
	padding: 35px 36px 0 36px;
	background: url(../img/content/bg_border-dotted.gif) repeat-x left top;
}

/*----------------------------------------------------
 ■□■
 Drinks ＆ Kid's　ドリンク・キッズ
------------------------------------------------------*/
.menu-DrinksKids {}

.menu-DrinksKids .drinkBody {
	_overflow: hidden;
	width: 340px;
	padding: 0 418px 15px 36px;
	background: url(/menu/drinks_kids/img/pic_coffee.gif) no-repeat 420px 50%;
}
.menu-DrinksKids .drinkBody h4 {
	margin-bottom: 5px;
}
.menu-DrinksKids .drinkBody ul {
	width: 360px;
	padding: 20px 0 0 0;
	background: url(../img/content/bg_border-dotted.gif) repeat-x left top;
}
.menu-DrinksKids .drinkBody ul li {
	width: 354px;
	padding: 0 3px 18px 3px;
	background: url(../img/content/bg_border-dotted.gif) repeat-x left bottom;
}
.menu-DrinksKids .drinkBody ul li h5 {
	font-family: Arial, Helvetica, sans-serif;
}
.menu-DrinksKids .drinkBody ul li h6 {
	font-size: 92%;
}
.menu-DrinksKids .drinkBody ul li h6 + p {
	margin-top: 0.75em;
}

/* ▽KIDS */
.menu-DrinksKids .kidsHead {
	width: 722px;
	padding: 35px 36px 0 36px;
	background: url(../img/content/bg_border-dotted.gif) repeat-x left top;
}
.menu-DrinksKids .kidsBody {
	margin-bottom: 0;
}
.menu-DrinksKids .kidsBody .txt_notice {
	clear: both;
	margin-bottom: 15px;
}


/*----------------------------------------------------
 ■□■
 Coolly's　クーリーズ
------------------------------------------------------*/
.menu-Coollys {}
.menu-Coollys .cscBox {
	min-height: 650px;
	height: auto !important;
	height: auto;
}
.menu-Coollys .cscBox h5 {
	color: #395bd8;
}


/*----------------------------------------------------
 ■□■
 Cup Ice Cream
------------------------------------------------------*/
.menu-cupice {}
.menu-cupice .cscBox {
	min-height: 400px;
	/*height: 580px;*/
}
.menu-cupice .cscBox h5 {
	color: #AD0002;
}


/*----------------------------------------------------
 ■□■
 コンテンツ内共通スタイル
------------------------------------------------------*/

/* ■オンラインストアのボタン */
.menu-IceCreamCake .menuHead,
.menu-CookieSand .menuHead {
	position: relative;
}
.category-menu .menuHead p.onlineStore {
	position: absolute;
	width: 173px;
	height: 22px;
}
.category-menu .menuHead p.onlineStore a {
	display: inline-block;
	margin: 0 0 5px 0;
}
.category-menu .menuHead p.onlineStore a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}
.menu-IceCreamCake .menuHead p.onlineStore {	top: 10px;	right: 0;}
.menu-CookieSand .menuHead p.onlineStore {	top: 15px;	right: 0;}

/* ■メニューが縦・3つ横並び */
.category-menu .verticalBox {
	margin-bottom: 10px;
}
.category-menu .verticalBox .cscBox {
	float: left;
	width: 233px;
	margin-right: 11px;
}
.category-menu .verticalBox .last { /* 3番目にはマージン無し */
	margin-right: 0;
}
.category-menu .verticalBox .cscBox .cscPhoto {
	float: none;
	margin: 0 0 8px 0;
}
.category-menu .verticalBox .cscBox .cscInfo {
	overflow: auto;
	padding: 0 5px;
}


/*----------------------------------------------------
 ■□■
 Seasonal　シーズナル
------------------------------------------------------*/
.menu-seasonal {}


/*----------------------------------------------------
 ■□■
 Hot drinks　ホットドリンク　【20120131】
------------------------------------------------------*/
.menu-Hotdrink {}

.menu-Hotdrink .priceBox {
	margin: 10px 0 20px 0;
	padding: 10px 15px;
	border: 2px solid #E8D4B3;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background: #fff;
	color: #3c3c3c;
	font-size: 115%;
	font-weight: bold;
}
.menu-Hotdrink .priceBox em {
	color: #AC0002;
	font-style: normal;
}


/* クリスマスプレート価格 */
h6.extra {
	margin: 4px 0 0 0;
	color: #A70002;
	font-size: 110%;
}

