@charset "utf-8";

body{ margin:0; padding:0;}

#wrapper a {
  text-decoration: none;
  font-size:12px;
  color:#000;
}

* {font-family: 'Quicksand', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;}


a:hover img { opacity: 0.7; filter: alpha(opacity=80); -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out;-o-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out;}

.fast{ border-left: 1px solid #ccc;}



/* mddNav（ドロップダウンメニュー全体とナビボタン）
------------------------------------- */
#mddNav {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 53px;
  margin:0 auto;
  background:url(https://image.rakuten.co.jp/hana-online/cabinet/souko/m-menu-haikei.jpg) repeat;
  border-top: #444 1px solid;
  border-bottom: #F2F2F2 6px solid;
}
#mddNav > ul {
  display: flex; /*グローバルナビゲーション横並び*/
  margin: 0 auto;
  width: 910px;
  height: 53px;
  text-align: center;
  padding-right:43px;
}
#mddNav > ul > li {
  width: 100px;
  height: 53px;
  /*border-left: #ccc 1px dotted;*/
  box-sizing: border-box;
  border-right:1px solid #ccc;
  color:#000;
  list-style:none;
}
#mddNav > ul > li a {
  color: #222;
}
#mddNav > ul > li:last-child {
  /*border-right: #ccc 1px dotted;*/
}
#mddNav > ul > li > a {
  display: block;
  height: 53px;
  line-height: 53px;
  text-align: center;
  /*border: #fff 1px solid;*/
  transition: all 0.2s linear;
}
#mddNav > ul > li:hover > a {
  background: #eee;
}
/* mddWrap
------------------------------------- */
#mddNav .mddWrap {
  position: absolute;
  top: 53px;
  left: 0;
  z-index: 100;
  overflow: hidden;
  /*display: none;*/
  width: 100%;
  height: auto !important;
  text-align: center;
  background: #fff;
  border-top:1px dashed #111;
  background: linear-gradient(to bottom,  #fff 0%,#efefef 100%);
  border-bottom: #aaa 1px solid;
  box-shadow: 0 2px 2px #eee;
  margin:0;
  display:none;
}
#mddNav .mddWrap .mddInner {
  margin: 0 auto;
  padding-top: 30px;
  width: 950px;
  height: 200px;
  line-height: 1.5em;
  text-align: left;
}
#mddNav .mddWrap .mddInner > .dropContent {
  display: flex;
}
#mddNav .mddWrap .mddInner > .dropContent > div {
  margin-right: 20px;
  width: 950px;
/*  float: left;*/
  border-right: #aaa 1px solid;
}
#mddNav .mddWrap .mddInner > .dropContent > div:last-child {
  margin-right: 0;
  border-right: none;
}
#mddNav .mddWrap .mddInner > .dropContent > div > ul > li {
  line-height: 1.8em;
}
#mddNav .mddWrap .mddInner > .dropContent > div > ul > li i {
  margin-right: 0.5em;
}
#mddNav .mddWrap .mddInner > .dropContent > div > ul > li a:link {
  text-decoration: underline;
}
#mddNav .mddWrap .mddInner > .dropContent > div > ul > li a:hover {
  text-decoration: none;
}

#mddNav .mddWrap .mddInner dl{
	width:950px;
	margin-left:2px;
}


#mddNav .mddWrap .mddInner dd {
  margin-bottom: 20px;
  line-height: 1em;
  margin-right:2px;
  overflow:hidden;
  margin-top:-6px;
  width:110px;
  float:left;
}

#mddNav .mddWrap .mddInner dd img{
	width:108px !important;
	height:88px;
	border-radius:3px;
}

#mddNav .mddWrap .mddInner p{
	text-align:center;
	font-size:12px;
	white-space: nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
}

#mddNav .mddWrap .mddInner a{
	color:#333 !important;
	text-decoration:none !important;
}

#mddNav .mddWrap .mddInner a:hover{
	color:#C00 !important;
	text-decoration: underline !important;
}

dd img{
  	transition: 0.5s;
}

dd img:hover{
		-webkit-transform: rotateY(180deg);
		-moz-transform: rotateY(180deg);
		-ms-transform: rotateY(180deg);
		-o-transform: rotateY(180deg);
		transform: rotateY(180deg);
}

.gaiyo{
	font-size:13px !important;
	padding-left:7px;
	padding-right:6px;
	text-align:center !important;
	padding-bottom:8px;
	border-left:3px solid #333 !important;
	padding-top:8px;
	border:1px solid #333;
	overflow:hidden;
	margin-left:5px;
	margin-bottom:44px;
}


/*------------------------------------- */
.fa-chevron-right {
  color: #F00;
}
/*------------------------------------- */
