/* 渋6組お酒習慣告知CSS */

#shibu6_article ul,#shibu6_article li,#shibu6_article dl,#shibu6_article dd{
	margin-right:0;
	margin-left:0;
	padding-right:0;
	padding-left:0;
}

#shibu6_article ul,#shibu6_article li{
	list-style:none;
}

/* box-sizingリセット */
#shibu6_article .page *,
#shibu6_article .page *:before,
#shibu6_article .page *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

/* レスポンシブフォントサイズ　.page {width: 755px;} の場合： */
@media screen and (min-width:768px) { 
    /*　画面サイズ768pxから PC　*/
		#shibu6_article .page { font-size: 16px!important; }
		#shibu6_article h1.pagemidashi { font-size: 24px!important;
		font-weight:bold;
		letter-spacing:2px!important; }
		#OSAKE .p2midashi { font-size: 18px!important;
		font-weight:bold;
		letter-spacing:1px!important; }
}
@media screen and (max-width:768px) { 
    /*　画面サイズ768pxまで SP　*/
		#shibu6_article .page { font-size: 36px!important; } 
		#shibu6_article h1.pagemidashi { font-size: 42px!important;
		font-weight:bold;
		letter-spacing:0.1em!important; }
		#shibu6_article .page h2 { font-size: 36px!important;
		font-weight:bold; }
		#contentsArea h3,
		h3.caposusume  { font-size: 32px!important;
		font-weight:bold; }
		/*#shibu6_article .page h3 { font-size: 32px!important; } */
}

/* 注意事項などのフォントサイズ */

#OSAKE .notes,
#OSAKE .NotesBox p {
	font-size:0.8em!important;
}

/* 東急百貨店限定 */
.tqgentei{
	color:#333399;
	font-weight:bold;
	font-size:0.9em!important;
}

/* 全てのリンクホバー薄める */
#shibu6_article .page a:hover,
.linkbox a{
	opacity:0.7
		
}

/* ページ最後の別ページへのリンク */
.pagelastNavi {
	display:table;
	overflow:hidden;
	width:100%;
	}
.pagelastNavi p a {
	padding:20px 10px 20px 100px;
	float:right;
	font-weight:bold;
	display: inline-block;
}

.pagelastNavi a,
.pagelastNavi a:active,
.pagelastNavi a:visited {
	text-decoration:underline!important;
	color:#ff2d64!important;
}
.pagelastNavi p a:hover{
	text-decoration:underline!important;
	color:#ff2d64!important;
}
.pagelastNavi p a.navi01 {
	background: url(/image.jsp?id=398866) no-repeat top left;
}
.pagelastNavi p a.navi02 {
	background: url(/image.jsp?id=398867) no-repeat top left;
}

/* 別ページへのリンクのボックスタイプ */

.linkbox {
	border: #88b7bb solid 2px;
	background: #d9eff3;
	margin-bottom:20px;
}
.linkbox .caption { 
	color:#0096a3;
	font-weight:bold;
}
.linkbox dd{ 
	clear:both!important;
}

/* ページフォントカラー */
/* 755px幅を必ず入れる */

#OSAKE.page  {
	color:#222;
	width:755px;
}

/* テキストリンクの色きめる */

#shibu6_article a.txtlink,
#shibu6_article a.txtlink:active,
#shibu6_article a.txtlink:visited,
.linkbox a {
	text-decoration:none!important;
	color:#ff2d64!important;
}
#shibu6_article a.txtlink:hover,
.linkbox a:hover{
	text-decoration:underline!important;
	color:#ff2d64!important;
}


/* レイアウト
---------------------- */


/* ページ背景 */

#OSAKE {
	background: url(/image.jsp?id=398587) no-repeat top center;
}


/* ヘッダーエリア */

#OSAKE header {
	padding:0;
	margin:0;
}

#OSAKE header h3 {
	padding:0;
	margin:0;
}/*　デザインごとのページ共通ヘッダー画像　*/

#OSAKE header p  {
	padding:20px;
	margin-top:120px;
	/*background-color:#fff6ea;#fffcc3*/
	color:#000;
	opacity:0.8;
}


/* コンテンツエリア */

#OSAKE #contentsArea {
	marign:0;
	padding:20px;
}
.p2otsumami #contentsArea h1 {
	margin-top:120px!important;
}

#OSAKE .block  {
	padding-bottom:20px;
}

#OSAKE .pagemidashi {
	text-align:center;
	color:#3fb3be;
}
@media screen and (max-width:768px) { 
    /*　画面サイズ768pxまで（SP）　*/
	#OSAKE .pagemidashi br {
		display:none;
	}
}


/* H4ページ見出しテキストの場合 */
	
#OSAKE .p2midashi01 {
	background: url(/image.jsp?id=398878) no-repeat top left;
	padding-left:80px;
	padding-top:24px;
	margin-top:20px!important;
	margin-bottom:0!important;
	color:#5b018a;
	font-size:1.5em!important;
	line-height:150%!important;
	clear:both;
}
#OSAKE .p2midashi02 {
	background: url(/image.jsp?id=398903) no-repeat top left;
	padding-left:80px;
	padding-top:24px;
	margin-top:20px!important;
	margin-bottom:0!important;
	color:#5b018a;
	font-size:1.5em!important;
	line-height:150%!important;
	clear:both;
}
#OSAKE .p2midashi03 {
	background: url(/image.jsp?id=398904) no-repeat top left;
	padding-left:90px;
	padding-top:20px;
	padding-bottom:40px;
	margin-top:20px!important;
	margin-bottom:0!important;
	color:#5b018a;
	font-size:1.5em!important;
	line-height:150%!important;
	clear:both;
}
/*letter-spacing:0.1em!important;*/

/* アンケートのクエスチョン見出し */

#OSAKE .Q  {
	background: url(/image.jsp?id=398805) no-repeat top left;
	padding-left:80px;
	padding-top:54px;
	margin-top:20px!important;
	margin-bottom:10px!important;
	color:#5b018a;
	font-size:1.5em!important;
	line-height:150%!important;
	letter-spacing:0.15em!important;
	clear:both;
}

#OSAKE .blk  {
	marign:0 0 20px 0;
	padding:0;
}

.episode .blk img {
	text-align:center;
}

/* ULリストのテキストエリア：雨粒水玉背景
.episode .blk .txtbox {
	background: url(/image.jsp?id=386970) no-repeat center center;
	-moz-background-size:100% 100%;
	background-size:100% 100%;
} */


@media screen and (min-width:768px) { 
    /*　画面サイズ768pxから PC　*/ 
	
	.itemimg img {
		border:#b7cfd1 solid 5px;
		width:300px!important;
	}/*d6d6d6*/

/* itemlist：左にテキストボックス */
	  dl.itemlist {
		display: flex;
	  }
	  dl.itemlist * {
		-webkit-flex: 1;
		flex: 1;
	  }
	  dl.itemlist dt {
		margin-right: 10px;
	  }
	  dd.itemtxt {
		margin:0 20px 20px 20px!important;
		padding:30px!important;
		clear:both;
	  }
	  
/* tateitemlist：縦にカラム */
	  .tateitemBox {
		display: flex!important;
	  }
	  .tateitemBox * {
		-webkit-flex: 1;
		flex: 1;
	  }
	  .tateitemBox .itemimg {
		margin-bottom: 20px;
		text-align:center;
	  }
	  
	  .tateitemBox .tatetxt {
		margin:0 10px 20px 10px!important;
		padding:20px!important;
		clear:both;
	  } 

/* Flexbox：スペースあけて並べる*/	  
	.spacebetween {
		text-align:center;
	  -webkit-justify-content: space-between; /* Safari */
	  justify-content:         space-between;
	  -webkit-align-items: center; /* Safari */
	  align-items: center;
	  -webkit-justify-content: center;
	  justify-content: center;
	}
	
/* どんなお酒を　イラスト */
	#block2{
		background: url(/image.jsp?id=398825)  no-repeat bottom right;
	}
	
	/*　P1：エピソード　PC　*/
	#OSAKE .fL{
		float:left;
	}
	#OSAKE .fR{
		float:right;
	}
	
	#OSAKE .blk  {
		display:table;
		clear:both;
	}
	
	.episode .blk img,
	.episode .blk .txtbox {
		display: table-cell;
		overflow: hidden;
	}
	.episode .blk .txtbox {
		width:400px;
	}
	
	#OSAKE .bkBottom {
		background: url(/image.jsp?id=334010)  no-repeat bottom center;
		padding-bottom:75px;
		margin-top:20px;
		text-align:center;
	}
	
	/* エピソードリストPC */
	.episode .blk ul li,
	.episode .blk .txtbox ul li {
		 list-style:none!important;
		 background: url(/image.jsp?id=398813) no-repeat top left;
		 padding-left:1.2em!important;
		 padding-bottom:0.6em!important;
		 margin-left:20px!important;
	}
 
}

@media screen and (max-width:768px) { 
    /*　画面サイズ768pxまで コンテンツ SP　*/
	
	.pagemidashi img,
	.itemimg img{
		width:100%;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	  }
	
	.linkbox {
		margin:0 0 1em 0;
		padding: 1em;
	}
	
	#headArea .txtbox{
	  margin:0;
	}
	#headArea .txtbox2{
		background:#FFF;
		padding: 1em;
    	margin: 0.5em;
	}
	
	.spacebetween {
		text-align:center;
	}

	.radiusbox {
		padding: 1em;
		margin-bottom:1em!important;
		border-radius:12px;
		background:#c6f0ea;
	}
	
	/* 上に噴出し */
	.balloonTop {
		position: relative;
		display: inline-block;
		padding: 15px;
		margin-bottom:20px!important;
		width: auto;
		min-width: 115px;
		height: 100px;
		line-height: 40px;
		text-align: center;
		background: #afdae9;
		border-radius:12px;
		vertical-align:middle!important;
		z-index: 0;
	}
	.balloonTop:after {
		content: "";
		position: absolute;
		top: -10px; left: 50%;
		margin-left: -10px;
		display: block;
		width: 0px;
		height: 0px;
		border-style: solid;
		border-width: 0 10px 10px 10px;
		border-color: transparent transparent #afdae9 transparent;
	}
	dd span.balloonTop {
		width: 100%!important;
		margin-top:20px!important;
		margin-bottom:20px;
	}
	.commentboxL {
		text-align:center;
		padding-bottom:20px;
	}
	
	.itemimg,
	.presentBox,
	.bnrBox {
		width:100%;
		text-align:center;
		margin-bottom:1em;
	} 
	.itemimg img,
	.presentBox img {
		border:#d2d2d2 solid 0.25em;
		width:96%;
	}
	.bnrBox img {
		width:96%;
	}
	
	.countimgullist li img {
		width:100px;
	}
	
	#OSAKE .blk  {
		display:table;
		clear:both;
	}
	
	/*　P1：エピソード　SP　*/
	.episode .blk img{
		width:540px;
	}
	.episode .blk .txtbox,
	#OSAKE .pagemidashi img {
		width:100%;
	}
	/* エピソードリストSP */
	.episode .blk ul li,
	.episode .blk .txtbox ul li {
		clear:both;
		 list-style:none!important;
		 background: url(/image.jsp?id=398813) no-repeat top left;
		 background-size:50px;
		 padding-left:1em!important;
		 padding-bottom:0.6em!important;
		 margin-left:20px!important;
	}
	/* tateitemlist：縦にカラム SP */
	.tateitemBox .tatetxt {
		padding:1em!important;
	  } 
}
	
dd.itemtxt,
.tateitemBox .tatetxt {
		background:#feffab;
		clear:both;
		border-radius:12px;
	}/* 商品説明など.itemtxtのコンテンツ固有のデザイン要素（色、背景、デザイン上のマージンなど）
	PC・スマホ共有feffab bae9ee e6dbff
	 */

/* ソムリエのおすすめ */
h3.caposusume {
	color:#5b018a;
	text-align:center;
	padding-bottom:0.1em;
  }

/* osusumeBox　せりふ */
dl.osusumeBox dt {
		text-align:center!important;
  }
.osusumetxt {
		position:relative;
		background:#e6dbff;
		clear:both;
		
	}/* 商品説明など.itemtxtのコンテンツ固有のデザイン要素（色、背景、デザイン上のマージンなど）
	PC・スマホ共有feffab bae9ee fffbdd
	 */
	  
@media screen and (min-width:768px) { 
    /*　画面サイズ768pxから（PC）　*/
	h3.caposusume {
		border-bottom:1px solid #5b018a;
	 }

	dl.osusumeBox {
		display: flex;
	  }
	  dl.osusumeBox dt {
		margin-right: 10px;
		-webkit-flex: 1;
		flex: 1;
	  }
	  dl.osusumeBox dt img {
		border:solid 5px #d1d1d1;
	  }
	  dl.osusumeBox dd {
		-webkit-flex: 2;
		flex: 2;
	  }
	  .osusumetxt {
		margin:0 20px 20px 20px!important;
		padding:20px!important;
		clear:both;
		border-radius:12px;
	  }
	  .osusumetxt:before{
		content: "";
		position: absolute;
		top: 50%;
		left: -23px;
		border: 12px solid transparent;
		border-right: 12px solid #e6dbff;
	}
}
@media screen and (max-width:768px) { 
    /*　画面サイズ768pxまで（SP）　*/
	h3.caposusume {
		border-bottom:0.1em solid #5b018a;
	 }
	dl.osusumeBox dt,
	dl.osusumeBox dd {
		display:block;
	  }
	dl.osusumeBox dt img {
		border:solid 0.25em #d1d1d1;
		width:80%;
	  }
	.osusumetxt {
		margin:1em 0!important;
		padding:1em!important;
		clear:both;
		border-radius:0.5em;
	  }
	 .osusumetxt:before{
		content: "";
		position: absolute;
		top: -2em;
		right: 50%;
		border: 1.2em solid transparent;
		border-bottom: 1.2em solid #e6dbff;
	}
}


/* ノーマルリスト（UL） */
.nomalllist ul li {
	list-style:none;
	font-size:1em!important;
	line-height:1.8!important; 
}
.nomalllist li strong{
	color:#3fb3be;
  
}

/* 王冠画像でランキング（UL） */
.countimgullist ul li {
	list-style:none;
	font-size:1em!important;
	line-height:150%!important;  
}
.countimgullist li strong{
	color:#3fb3be;
  
}


/* olマル抜き連番リスト */
.countlist ol{
  counter-reset:numberlist; /* 任意のカウンタ名（numberlist）を付ける。counter-resetで指定したnumberlistカウンタをリセット */
  list-style:none!important;
  margin:0!important;
  padding:0!important;
}

.countlist ol li {
	list-style:none;
	font-size:1em!important;
	line-height:1.8!important;
	margin-bottom:0.4em!important;
}
.countlist li strong{
	color:#3fb3be;
  
}
.countlist ol li:before{
  /* liの前にカウンタ部分（マル抜き数字連番） */
	counter-increment: numberlist; /* 任意の名前 */
	content: counter(numberlist); /* 任意のカウンタを呼び出し */
  	background: #3fb3be;
	display: inline-block;
	width: 1.8em;
	height: 1.8em;
	text-align: center;
	border-radius: 50%;
	color: #fff;
	font-weight:bold;
	margin-right: 0.4em;
}


/*　間隔調整あり　*/

#OSAKE .mb0{
	margin-bottom:0 !important;
}
#OSAKE .mb20{
	margin-bottom:20px !important;
}
.mb30{
	margin-bottom:30px !important;
}
.mR20{
	margin-right:20px !important;
}
.mL20{
	margin-left:20px !important;
}
.mt20{
	margin-top:20px !important;
}

.pb0{
	padding-bottom:0 !important;
}
.pb10{
	padding-bottom:10px !important;
}
.pb20{
	padding-bottom:20px !important;
}
.pt20{
	padding-top:20px !important;
}
.pt40{
	padding-top:40px !important;
}
.pL10{
	padding-left:10px !important;
}
.pR10{
	padding-right:10px !important;
}

#OSAKE .clearfix:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}
#OSAKE .clearfix {
	display: inline-block;
	overflow: hidden;
}

#OSAKE .clearfixTbl:after {
	content: ".";
	height: 0;
	clear: both;
	visibility: hidden;
}
#OSAKE .clearfixTbl {
	display: table;
	overflow: hidden;
}

/* 共有
---------------------- */

.txtcenter{
	text-align:center;
}

.imgcenter{
	text-align:center;
	display:block;
}


#OSAKE .clear{
	clear:both;
}