@charset "utf-8";	
	
/* ========================================================	
	left_nav.css => 左ナビゲーションCSS
======================================================== */	


/* ------------ ナビエリア ------------ */	
#lNav{
	width:190px;
	float:left;
}
.lNavBox {
  background: #f3f1eb;
  padding: 15px 20px;
}
.lNavTtl {
  background: #E9E4D8;
  text-align: center;
  font-size: 15px;
  font-weight: 700;
  line-height: 50px;
  height: 50px;
}

/* ------------ ベースのデザイン ------------ */	
#lNav > .lPrice {
	text-indent:0;
	margin:0 0 10px 0;
	padding:0 0 20px 0;
	display:block;
	list-style:none;
	background-color:#f4f1ea;
}

/* ------------ 祝弔ボタン ------------ */	
ul.lCategory {
  overflow: hidden;
  padding: 10px 0;
}
ul.lCategory > li {
  width: 90px;
  float:left;
  padding-bottom: 10px;
}
ul.lCategory > li:nth-of-type(2) {
  float: right;
}
ul.lCategory > li > span {
  width: 90px;
  height: 60px;
  text-align: center;
  line-height: 60px;
  padding-top: 15px;
  background: #E9E4D8;
  border-radius: 5px;
	margin:0 auto;
  display: block;
  position: relative;
}

ul.lCategory > li.cel span:hover , ul.lCategory > li.cel.on span {
  background-color: rgb(220, 128, 95);
  box-shadow: 0px 2px 0px 0px rgba(170, 99, 75, 1);
}
ul.lCategory > li.on span:after {
  content: "";
  border-width: 6px;
  border-style: solid;
  position: absolute;
  left: 50%;
  margin-left: -6px;
  bottom: -12px;
}
ul.lCategory > li.con span:hover , ul.lCategory > li.con.on span {
  background-color: rgb(114, 112, 158);
  box-shadow: 0px 2px 0px 0px rgba(78, 76, 115, 1);
}
ul.lCategory > li.cel span:after {
  border-color: rgb(220, 128, 95) transparent transparent;
}
ul.lCategory > li.con span:after {
  border-color: rgb(114, 112, 158) transparent transparent;
}
.CateArea .showArea {
  display: none;
}
.CateArea .showArea.show {
  display: block;
}

/* ------------ 利用場面ボタン ------------ */	
div.lEvent {
  margin-bottom: 10px;
}

div.lEvent ul {
	list-style:none;
}

div.lEvent ul li {
	padding:8px 0;
	list-style:none;
  position: relative;
}
div.lEvent ul li a {
	display:block;
	line-height:21px;
	text-decoration:none;
	color:#453a2c;
	padding-left:30px;
}

div.lEvent ul li a:hover:before {
	text-decoration:underline;
	background-color:#e4e1da;
}

/*利用場面各種アイコン*/

div.lEvent ul li a.lEventWedding:before {/*結婚*/
	background-image: url("../../images/top/ico_scene1.png");
}
div.lEvent ul li a.lEventBirthday:before {/*誕生日*/
	background-image: url("../../images/top/ico_scene2.png");
}
div.lEvent ul li a.lEventBabygift:before {/*出産*/
	background-image: url("../../images/top/ico_scene3.png");
}
div.lEvent ul li a.lEventPrize:before {/*開店・受賞*/
	background-image: url("../../images/top/ico_scene4.png");
}
div.lEvent ul li a.lEventPromotion:before {/*就任・昇進*/
	background-image: url("../../images/top/ico_scene5.png");
}
div.lEvent ul li a.lEventSchoolgift:before {/*入学・卒業*/
	background-image: url("../../images/top/ico_scene6.png");
}
div.lEvent ul li a.lEventElection:before {/*選挙*/
	background-image: url("../../images/top/ico_scene7.png");
}
div.lEvent ul li a.lEventCondolence:before {/*お悔み*/
	background-image: url("../../images/top/ico_scene8.png");
}
div.lEvent ul li a.lEventOther:before {/*その他*/
	background-image: url("../../images/top/ico_scene9.png");
}

div.lEvent ul li a:before {
  content: "";
  background-color:#fff;
  background-size: 21px auto;
  border-radius: 50%;
  width: 21px;
  height: 21px;
  position: absolute;
  left: 0;
  top: 8px;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

/* ------------ 利用場面ボタン　ここまで ------------ */	

/* ------------ 価格から選ぶボタン ------------ */	

div.lPrice > dl {
	display:block;
}

div.lPrice > dl > dt {
	display: block;
	background-color: #9c958b;
	color: #fff;
	margin: 0 0 10px 10px;
	padding-left: 10px;
	background-image: url(/images/common/lnav_dt_bg.png);
	background-repeat: repeat-y;
	background-position: left top;
	line-height:21px;
}

div.lPrice > dl > dd {
	display:block;
	text-align:center;
	line-height:0;
	padding:0;
	margin:0 0 20px 0;
	background-image: url(/images/common/l_nav_dot.png);
	background-repeat: repeat-y;
	background-position: center top;
}
div.lPrice > dl > dd > a {
	line-height:20px;
	display:inline-block;
	margin:0;
}


/* ------------ /価格から選ぶボタン ------------ */	

div.lAddress {
  margin-bottom: 10px;
}
div.lAddress .lNavBox {
  padding: 15px 10px;
  text-align: center;
}
div.lAddress .lNavBox > span {
  font-size: 13px;
  padding-bottom: 15px;
  display: block;
}
div.lAddress .lNavBox form {
}
div.lAddress .lNavBox form > span {
  float: left;
  line-height: 30px;
  margin-right: 5px;
}
div.lAddress .lNavBox form input {
  float: left;
}
div.lAddress .lNavBox form input[type="text"] {
  padding: 5px;
  height: 18px;
  float: left;
  font-size: 16px;
  line-height: 18px;
  border:1px solid #E4E1DA;
  background: #fff;
  width:95px;
  margin: 0;
}
div.lAddress .lNavBox form input[type="submit"] {
	width:40px;
	height:30px;
  background: #544637;
  color: #fff;
  font-size: 12px;
  line-height: 30px;
  padding: 0;
  border: none;
  outline: none;
  vertical-align: middle;
  text-align: center;
  float: left;
  display: block;
  margin-left: 3px;
}
.lAddressBtn {
  clear: both;
  padding: 15px 0 0;
}
.lAddressBtn a {
  border: 1px solid #dedacd;
  border-radius: 3px;
  display: block;
  font-size: 10px;
  text-decoration: none;
  line-height: 20px;
  text-align: center;
  color: #765e31;
}
.lAddressBtn a:before {
  content: "";
  background: url("../../images/top/ico_arrow_line_base.png") no-repeat;
  background-size: 3px auto;
  width: 3px;
  height: 5px;
  display: inline-block;
  margin-right: 3px;
}
.lAddress p {
  text-align: left;
  font-size: 10px;
  padding-top: 15px;
  clear: both;
}

/* ------------ 商品から選ぶボタン ------------ */	
div.lProduct {
  margin:0 0 10px 0;
}
div.lProduct .lNavBox {
  padding: 5px;
}
div.lProduct dl {
  padding-bottom: 10px;
  position: relative;
}
div.lProduct dl:hover {
  opacity: 0.8;
}
div.lProduct dl > dt {
  text-align: center;
  color: #fff;
  line-height:30px;
  font-size: 14px;
  border-radius: 5px;
}
.celArea div.lProduct dl > dt {
  background: #E69378;
}
.conArea div.lProduct dl > dt {
  background: rgb(114, 112, 158);
}

div.lProduct dl > dd {
  font-size: 10px;
  padding: 10px 25px 10px 5px;
  margin: 0 10px 0 0;
}
div.lProduct dl > dd > a {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.celArea div.lProduct dl > dd > a {
  background: url("../../images/top/ico_arrow.png") no-repeat 100% 50%;
  background-size: 18px auto;
}
.conArea div.lProduct dl > dd > a {
  background: url("../../images/top/ico_arrow-con.png") no-repeat 100% 50%;
  background-size: 18px auto;
}

/* ------------ /商品から選ぶボタン ------------ */	

/* ------------ 祝電・弔電ボタンのロールオーバー ------------ */

.catLeftBtn {
  margin-bottom: 10px;
}
.catLeftBtn a {
  font-weight: 700;
  color:#fff;
  text-decoration: none;
  font-size: 15px;
  line-height: 50px;
  border-radius: 3px;
  width: 190px;
  height: 50px;
  display: block;
  text-align: center;
}
.celArea .catLeftBtn a {
  background-color: rgb(220, 128, 95);
  box-shadow: 0px 2px 0px 0px rgba(170, 99, 75, 1);
}
.conArea .catLeftBtn a {
  background-color: rgb(114, 112, 158);
  box-shadow: 0px 2px 0px 0px rgba(78, 76, 115, 1);
}
.catLeftBtn a img {
  position: relative;
  margin-right: 3px;
  bottom: -3px;
}
a.celebrationS:hover {
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}
a.condolenceS:hover {
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}


/* ------------ VERYCARD祝電ページボタンアクティブ ------------ */	

.celVeryCard a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celVeryCard .hereVeryCard > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ VIPCard祝電ページボタンアクティブ ------------ */	

.celVipCard a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celVipCard .hereVipCard > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ うるし祝電ページボタンアクティブ ------------ */	

.celLacquer a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celLacquer .hereLacquer > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ ぬいぐるみ祝電ページボタンアクティブ ------------ */	

.celCharacter a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}
.celCharacter .hereCharacter > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ デコレーション祝電ページボタンアクティブ ------------ */	

.celDecoration a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celDecoration .hereDecoration > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 押花刺繍祝電ページボタンアクティブ ------------ */	

.celPressedFlower a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celPressedFlower .herePressedFlower > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ ボトルフラワー祝電ページボタンアクティブ ------------ */	

.celBottleFlower a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celBottleFlower .hereBottleFlower > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ リカちゃんページボタンアクティブ ------------ */	

.celLicca a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celLicca .hereLicca > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ プリザーブド祝電ページボタンアクティブ ------------ */	

.celPreservedFlower a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celPreservedFlower .herePreservedFlower > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ アートフラワー祝電ページボタンアクティブ ------------ */	

.celArtFlower a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celArtFlower .hereArtFlower > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ カタログギフト祝電ページボタンアクティブ ------------ */	

.celCatalogGift a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celCatalogGift .hereCatalogGift > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ バルーン電報祝電ページボタンアクティブ ------------ */	

.celBalloon a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celBalloon .hereBalloon > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ フラワーギフト祝電ページボタンアクティブ ------------ */	

.celFlowerGift a.celebrationL {
	background-image: url(/images/common/lnav_celebration_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.celFlowerGift .hereFlowerGift > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}


/* ------------ 弔電ボタンアクティブ ------------ */	
/* ------------ VERYCARD弔電ページボタンアクティブ ------------ */	

.conVeryCard a.condolenceL {
	background-image: url(/images/common/lnav_condolence_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.conVeryCard .hereVeryCard > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ VIPCard弔電ページボタンアクティブ ------------ */	

.conVipCard a.condolenceL {
	background-image: url(/images/common/lnav_condolence_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.conVipCard .hereVipCard > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ うるし弔電ページボタンアクティブ ------------ */	

.conLacquer a.condolenceL {
	background-image: url(/images/common/lnav_condolence_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.conLacquer .hereLacquer > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 押花刺繍弔電ページボタンアクティブ ------------ */	

.conPressedFlower a.condolenceL {
	background-image: url(/images/common/lnav_condolence_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.conPressedFlower .herePressedFlower > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ プリザーブド弔電ページボタンアクティブ ------------ */	

.conPreservedFlower a.condolenceL {
	background-image: url(/images/common/lnav_condolence_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.conPreservedFlower .herePreservedFlower > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 香電ページボタンアクティブ ------------ */	

.conIncense a.condolenceL {
	background-image: url(/images/common/lnav_condolence_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

.conIncense .hereIncense > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 供花ページボタンアクティブ ------------ */	

.conCondolenceFlower a.condolenceL {
	background-image: url(/images/common/lnav_condolence_l_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}
.conCondolenceFlower .hereCondolenceFlower > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}


/* ------------ 価格ボタンアクティブ ------------ */	
/* ------------ 祝電1280円アクティブ ------------ */	
.cel1280 .here1280 > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 祝電1500円アクティブ ------------ */	
.cel1500 .here1500 > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 祝電3000円アクティブ ------------ */	
.cel3000 .here3000 > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 祝電5000円アクティブ ------------ */	
.cel5000 .here5000 > a.celebrationS{
	background-image: url(/images/common/lnav_celebration_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 弔電1280円アクティブ ------------ */	
.con1280 .here1280 > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 弔電1500円アクティブ ------------ */	
.con1500 .here1500 > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 弔電3000円アクティブ ------------ */	
.con3000 .here3000 > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}

/* ------------ 弔電5000円アクティブ ------------ */	
.con5000 .here5000 > a.condolenceS{
	background-image: url(/images/common/lnav_condolence_s_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
}




/* ------------ /祝電・弔電ボタンのロールオーバー ------------ */	


/* ------------ バナー ------------ */	
div.lBanner {
	margin:10px 0;
}

/* ------------ ご利用ガイドボタン ------------ */	
div.lGuide {
  margin-bottom:10px;
}
div.lGuide .lNavBox {
  padding: 15px 15px 0;
}
div.lGuide ul {
	list-style:none;
}

div.lGuide ul > li {
	list-style:none;
}
div.lGuide ul > li > a {
	display:block;
  font-size: 14px;
  line-height:24px;
  text-decoration:none;
  color:#453a2c;
  padding: 5px 0;
  padding-left:20px;
  background: url("../../images/top/ico_howto.png") no-repeat 0 50%;
  background-size: 15px auto;
}
div.lGuide ul > li >a:hover  {
	text-decoration: none;
	color: #766d63;
}
.PrizeBox {
  background: #F9F8F5;
  padding: 15px;
  margin-bottom: 0;
}
.PrizeBox .PrizeBoxBtn {
  padding-top: 5px;
}
.PrizeBox .PrizeBoxBtn a {
  background-color: rgb(81, 70, 57);
  width: 150px;
  height: 34px;
  line-height: 34px;
  color: #fff;
  text-decoration: #fff;
  border-radius: 17px;
  text-align: center;
  display: block;
  margin: 0 auto;
}
.PrizeBox .PrizeBoxBtn a:hover {
  background: #453a2c;
}

/* ------------ ID入力エリア ------------ */
div#inputid {
  width: 190px;
  background: #f3f1eb;
  padding-bottom: 5px;
}
div#inputid .inputidTtl {
  font-size: 13px;
  text-align: center;
  line-height: 30px;
  padding-top: 5px;
}
div#inputid > form{
  text-align:center;
  padding: 0 19px 10px;
  display: block;
  vertical-align:middle;
  font-size: 14px;
  overflow: hidden;
}
div#inputid > form > input[type="text"] {
  padding: 5px;
  height: 18px;
  float: left;
  font-size: 16px;
  line-height: 18px;
  border:1px solid #E4E1DA;
  background: #fff;
  width:100px;
  margin: 0;
}
div#inputid > form > input#btn-submit {
  width:40px;
  height:30px;
  background: #544637;
  color: #fff;
  font-size: 12px;
  line-height: 30px;
  padding: 0;
  border: none;
  outline: none;
  vertical-align: middle;
  text-align: center;
  float: right;
  display: block;
}
div#inputid p {
  font-size: 10px;
  text-align: center;
  padding-bottom: 15px;
}
::placeholder {
  color: #c4c4c4;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#c4c4c4;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:#c4c4c4;
}
::placeholder{ /* Others */
 color:#c4c4c4
}
/*利用場面各種アイコン*/
/*利用ガイド*/
div.lGuide > ul > li >a.lGuideIcon{
	background-image: url(/images/common/levent_icon_guide.gif);
}

/* ------------ 懸賞電報ボタン ------------ */	

div.Prize {
	background-color: #e4e1da;
	border-top: 1px dotted #453a2c;
	padding-top:10px;
}

div.Prize > ul {
	padding:0;
	margin:0;
	list-style:none;
}

div.Prize > ul > li {
	padding:0;
	list-style:none;
}

div.Prize > ul > li > a {
	display:block;
	line-height:24px;
	text-decoration:none;
	color:#453a2c;
	padding-left:50px;
	background-repeat: no-repeat;
	background-position: 20px center;
}

div.Prize > ul > li >a:hover  {
	text-decoration:underline;
	/*color:#957044;*/
	background-color:#f4f1ea;
}

div.Prize > ul > li >a.lGuideIcon{
	background-image: url(/images/common/levent_icon_guide.gif);
}

.QRBox {
  text-align: center;
}
.QRBox p {
  font-size: 10px;
  font-weight: 700;
  padding-bottom: 10px;
}

div.Oubo{
    background: url(/images/common/lnav_btn_oubo_on.png) no-repeat;
    width: 190px;
    height: 55px;
}

div.Oubo > a{
    display: block;
}
div.Oubo > img{
    border: none;
}
div.Oubo > a:hover{
    background: none;
}
div.Oubo > a:hover > img{
    visibility: hidden;
}