@charset "utf-8";
/* CSS Document */

/* ヘッダーコンテンツ */
html,body{
	margin:0;
	padding:0;
	width:100%;
}

.broome_contents a:link    {color:#000; text-decoration:none;}
.broome_contents a:visited {color:#000; text-decoration:none;}
.broome_contents a:hover   {color:#000; text-decoration:none;}
.broome_contents a:active  {color:#000; text-decoration:none;}
.broome_contents img{border:0;}

ul,p{
	margin:0;
	padding:0;
}
div.broome_heder.mini{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:80px;
	z-index:100;
	background-color: #c6b066;
	text-align:center;
	animation: fadeIn 1s ease 0s 1 normal;
}
@keyframes fadeIn { /*animetion-nameで設定した値を書く*/
  0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
  100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
}
.broome_top{
	background-color:#c6b066;
	width:100%;
	text-align:center;
	padding:10px 0;
}
.broome_top .log_tate{
	display:block;
}
.broome_top .log_yoko{
	display:none;
}
.broome_top img{
	display:block;
	margin:0 auto 2px;
	width:60px;
	height:auto;
}
span.log_brname{
	font-size:70%;
	color:#fff;
	line-height: 0;
}
.broome_top.mini{
	position:absolute;
	top:20px;
	left:5px;
	padding:0;
	height:40px;
	width:127px;
}
.broome_top.mini .log_tate{
	display:none;
}
.broome_top.mini .log_yoko{
	display:block;
}
.broome_top.mini img{
	width:100%;
}

/* メニューバー */
div.bromme_menu{
	text-align:center;
	margin:20px 0;
	font-size:80%;
}
div.bromme_menu.mini{
	text-align:center;
	margin:0;
	padding:10px 0;
	color:#ffffff;
}
.bromme_menu li{
	display:inline-block;
	width:110px;
}
.bromme_menu.mini li{
	display:inline-block;
	width:85px;
}
.bromme_menu p{
	display:inline-block;
	width:100%;
}
.bromme_menu.mini p{
	display:inline-block;
	vertical-align:middle;
	padding:0 2px;
	width:100%;
	font-size:90%;
}
.bromme_menu img{
	width:60px;
}
.bromme_menu.mini img{
	width:38px;
}
.bromme_menu.mini a:link    {color:#fff; text-decoration:none;}
.bromme_menu.mini a:visited {color:#fff; text-decoration:none;}
.bromme_menu.mini a:hover   {color:#fff; text-decoration:none;}
.bromme_menu.mini a:active  {color:#fff; text-decoration:none;}

li.spMenu, .spMenu, .bromme_menu.mini li.spMenu, .footer_ul li.spMenu{
	display:none;
}

/* 右端のカートアイコン(バナー小さくなったときのみ表示　フューチャーショップのパーツを利用) */
.broome_heder .hedCart{
	display:none;
}
.broome_heder.mini .hedCart{
	display:block;
	position:absolute;
	right:35px;
	top:15px;
	width:60px;
	height:60px;
}
.broome_heder.mini .hedCart img{
	width:100%;
}
/* スライダー */

/* 左メニュー */
div.broome_contents{
	width:100%;
	text-align:center;
	padding:10px 0 0;
}
div.left_cont{
	margin:100px auto 0;
	padding:0;
	text-align:left;
}
.left_cont img{
	max-width:180px;
}
.membercnt{
	width:100%;
	text-align:left;
	padding:10px 0;
}
.membercnt p{
	display:inline-block;
	font-size:65%;
	text-align:center;
	margin:10px 5px;
	width:50px;
}
.membercnt img{
	width:50px;
	height:50px;
	vertical-align:middle;
}
div.left_conten_list{
	width:100%;
	text-align:left;
	padding:0 4px;
}
.left_conten_list p{
	font-size:90%;
	text-align:left;
	padding:10px 0;
	border-bottom:1px solid #dcdcdc;
}
.left_conten_list p:nth-child(1){
	border-top:1px solid #dcdcdc;
}
.left_conten_list img{
	width:25px;
	height:25px;
	vertical-align:middle;
}

.broome_left_search{
	width:15%;
	display:inline-block
}

/* 右メニュー */
div.right_cont{
	display:inline-block;
	width:79%;
	margin:0;
	padding:0;
	vertical-align:top;
	font-size:90%;
}
div.rcontent_item{
	text-align:center;
	padding:0 20px;
	margin:20px 0 35px;
}
img.rcontent_titleimg{
	width:300px!important;
}

/* イベント＆お知らせ */
.rcontent_eventNews{
	margin:0;
	padding:25px 0;
}

/* 新商品 */
.rcont_newitem{
	margin:0 auto;
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
}
.rcont_newitem div{
	display:inline-block;
	padding:10px;
	text-align:center;
}
.rcont_newitem img{
	max-width:100%;
	min-width:200px;
}

/* 季節のアイテム */
ul.rcont_season{
	margin:0 auto;
	display:flex;
	justify-content:space-between;
	list-style:none;
}
.rcont_season li{
	padding:10px;
	width:25%;
	text-align:center;
}
.rcont_season div{
	width:100%;
	position:relative;
	z-index:20;
}
.rcont_season img{
	max-width:100%;
}

/* タオルコンテンツ */
.rcont_towelcont{
	width:100%;
	margin:0 auto;
	padding:0;
	text-align:center
}
.rcont_towelcont div{
	display:inline-block;
	padding:5px;
	text-align:center;
	width:33%;
}
.rcont_towelcont img{
	width:100%;
}
.rcont_towelcont p:first-child{
	width:50%;
}
.rcont_towelcont p{
	display:inline-block;
	width:70%;
	font-weight:bold;
	font-size:110%;
	vertical-align:top;
	text-align:left;
}
.rcont_towelcont p span{
	font-size:80%;
	font-weight:normal;
}
/* おすすめ商品(特集) */
ul.rcont_topics_ul{
	display:flex;
	justify-content:space-between;
	list-style:none;
}
.rcont_topics_ul li{
	padding:10px;
	width:50%;
}
.rcont_topics_ul img{
	max-width:100%;
}

/* おすすめ商品(スライド) */
.topics_slide{
	width:90%;
	margin:0 auto;
}
.topics_slide li{
	padding:10px;
	width:150px;
}
.topics_slide img{
	width:100%;
}

/* ランキング */
.ifre_ranking{
	width:100%;
	height:340px;
	overflow:hidden;
}
div.con_ranking{
	margin:15px;
}
ul#tab_runk{
	margin:0 auto;
	list-style: none;
	margin-top:10px;
}
#tab_runk li{
	display:inline-block;
	padding:5px 0;
	background:#f3f3f3;
	width:30%;
	letter-spacing:2px;
}
#tab_runk li.rn_active{
	background-color:#C6B066;
	color:#fff;
}
#tab_runk_box {
	padding:5px;
	border-top:2px solid #C6B066;
	width:95%;
	margin:0 auto;
}
/*
#tab_runk_box div{
	display:none;
}
#tab_runk_box div.rn_active{
	display:block;
}
*/


/* スタッフオススメ2 */
div.rcont_recomend{
	text-align:left;
}
.rcont_recomend div{
	display:inline-block;
	vertical-align:top;
	padding:15px 0;
}
.rcont_recomend .recomend_img{
	padding:15px;
	width:40%;
}
.rcont_recomend .recomend_comment {
	width:35%;
}
.recomend_comment span{
	font-size:70%;
}
.rcont_recomend .recomend_staff{
	width:13%;
	vertical-align:bottom;
	padding-left:20px;
}
.rcont_recomend .recomend_img img{
	width:100%;
}
.fukidashi01{
  position: relative;
  display: inline-block;
  padding: 5px;
  min-width: 120px;
  max-width: 100%;
	border-radius:10px;
  background: #efefef;
}
.fukidashi01:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 103%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-left: 20px solid #efefef;
}
p.fukidashi01{
	text-align:left;
	line-height:2;
	letter-spacing:2;
}
img.fukidashi_img{
	max-width:100%;
}

@media only screen and (min-width: 1440px) {
.rcont_recomend_ul li{
	width:25%;
	padding:20px;
}
p.fukidashi01{
	line-height:2;
	letter-spacing:2;
	font-size:110%;
	padding:10px;
}
}

/* タオルシリーズ */
.rcontent_series p{
	display:inline-block;
	width:150px;
	padding:10px;
	margin:0;
}
.rcontent_series img{
	width:100%;
}

/* お知らせ */
p.rcontent_info{
	padding:30px 0 20px;
	font-weight:bold;
	font-size:120%;
	letter-spacing:2px;
}


/* 会員登録について */
ul.content_member {
	vertical-align:top;
}
.content_member li{
	position:relative;
	display:inline-block;
	width:190px;
	height:250px;
	padding:5px;
	margin:5px 10px;
	border:1px solid #C6B066;
	vertical-align:top;
	text-align:center;
}
.con_mem_setumei{
	line-height:2;
	letter-spacing:1.5px;
}
.content_member li:nth-child(1){
	border:0;
	background-color:#324733;
	border:1px solid #324733;
	color:#ffffff;
}
.content_member img{
	width:100%;
}
.content_member p.con_member_icon{
	padding:10px;
}
.content_member .con_member_icon img{
	width:40px;
	height:40px;
}
.con_member_title {
	font-size:120%;
	padding:10px 0;
}
.content_member .con_mem_setumei{
	text-align:left;
	font-size:90%;
}
.content_member p.con_mem_link{
	position:absolute;
	bottom:0;
	padding:10px 0;
	width:100%;
	text-align:center;
}
.content_member li:nth-child(1) a:link    {color:#fff; text-decoration:none;}
.content_member li:nth-child(1) a:visited {color:#fff; text-decoration:none;}
.content_member li:nth-child(1) a:hover   {color:#fff; text-decoration:none;}
.content_member li:nth-child(1) a:active  {color:#fff; text-decoration:none;}

/* 会員登録　最近チェックした商品 */
.contentTitle {
	font-weight: bold;
	border-top: 2px solid #000;
	text-align: center;
	margin-bottom: 1em;
}

/* フッター */
.broome_footer{
	font-size:90%;
	letter-spacing:1.5px;
	padding:25px 30px;
}
@media only screen and (min-width: 1440px) {
	.broome_footer{
		padding:25px 270px;
	}
}
ul.footer_ul{
	display:table;
	width:100%;
	padding:0;
	margin:0;
}
.footer_ul li{
	margin:0;
	display:table-cell;
	width:20%;
	text-align:center;
	padding:10px;
	background-color:#ffffff;
	border-radius:15px;
	vertical-align:top;
	border:10px solid #f3f3f3;
}
.footer_ul .company_calender{
	width:40%;
}
.footer_ul p{
	margin:5px;
}
.footer_ul .content_icon img{
	width:55px;
}
.footer_ul .content_midashi{
	font-weight:bold;
	text-align:left;
	border-bottom:1px solid #999999;
}
.footer_ul .content_naiyo{
	text-align:left;
}
.footer_ul .content_link{
	text-align:right;
}

/* フッター　他店舗一覧 */
.f_snsnshop{
	display:flex;
	justify-content: space-between;
}
.f_snsnshop_items{
	display:flex;
	align-items: center;
	width:50%;
}
.f_snsnshop_items img{
	height:12px;
}
ul.ul_sns_shop{
	margin:0 5px;
}
.ul_sns_shop li{
	display:inline-block;
	text-align:center;
	font-size:81%;
	margin:0 5px;
	vertical-align:top;
}
.ul_sns_shop li img{
	width:35px;
	height:35px;
}


/*フッター カレンダー*/
.br_calender {
	font-size:80%;
	display:inline-block;
	padding:10px 20px;
}
.br_calender table{
	border-spacing:3px;
}
.br_calender p{
	padding:5px;
}
.br_calender td{
	text-align:center;
	padding:7px;
}
td.br_calender_week_hr {
	border-top:1px solid #ccc;
	padding:3px;
}
.holiday_day{
	background-color:#ffdddd;
	border-radius:50%;
	color:#F00;
}
.br_calende_broomeholiday{
	font-size:80%;
	color:#F00;
	text-align:right;
	line-height:2;
}
.br_calende_broomeholiday span{
	background-color:#ffdddd;
	padding:3px;
	border-radius:50%;
}
	
/*フッター コピーライト*/
div.footer_copyright{
	margin:30px 0 0;
	font-size:90%;
	text-align:center;
}
.footer_copyright p{
	display:inline-block;
	margin:0;
	padding:10px 0;
}

/* 上に戻るボタン */
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 20px;
  bottom: 20px;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top img{
	width:100%;
	height:100%;
}
#page_top a:hover{
  opacity: 1;
}

/* 共通 */
.divbgcolor {
	background:#f3f3f3;
}
.rcont_item p{
	margin:0;
	padding:5px 0;
}

/* マウスが上に乗った時に文字が浮きでるcss */
.hovermask .caption{
	text-align:center;
	color:#ffffff;
	position:absolute;
	top:40%;
}
.hovermask .mask {
	width:100%;
	height:98%;
	position:absolute;	/* 絶対位置指定 */
	top:0;
	left:0;
	opacity:0;	/* マスクを表示しない */
	background-color:rgba(0,0,0,0.4);	/* マスクは半透明 */
	-webkit-transition:all 0.2s ease;
	transition:all 0.2s ease;
}
.hovermask:hover .mask {
	opacity:1;	/* マスクを表示する */
}

/* マウスが上にオススメ文書が出てくるCSS */
.recmask{
	width:100%;
	height:100%;
	opacity:0;	/* マスクを表示しない */
	transition:all 0.2s ease;
}
.hoverrecomend:hover .recmask {
	opacity:1;	/* マスクを表示する */
}
.recmask img{
	max-width:90%;
	min-width:90px;
}


/* マウスオーバーでメニューが表示されるcss */
.mod_dropnavi ul li a{
  transition-property: border;
  transition-duration: 0.5s;
  transition-timing-function: ease;
  transition-delay: 0s;
}
.mod_dropnavi ul li a:link    {color:#000; text-decoration:none;}
.mod_dropnavi ul li a:visited {color:#000; text-decoration:none;}
.mod_dropnavi ul li a:hover   {color:#000; text-decoration:none;}
.mod_dropnavi ul li a:active  {color:#000; text-decoration:none;}
 
/* mod_dropnavi */
.mod_dropnavi>ul>li{
    position:relative;
}
.mod_dropnavi>ul>li>a{
    display:block;
}

/* mod_dropnavi_child */
.mod_dropnavi .mod_dropnavi_child{
  display:none;
  position:absolute;
  top:70px;
  left:0px;
  z-index:99;
  padding:12px 0 0 0!important;
}

.mod_dropnavi .mod_dropnavi_child ul{
	padding:4px 27px 16px 27px!important;
	background-color:rgba(220,220,220,0.9);
	display:table-cell;
}
.mod_dropnavi .mod_dropnavi_child ul li{
	font-size:90%;
	line-height:1.3;
	text-align:left;
	margin:12px 0 0 0!important;
	white-space:nowrap;
	width:150px;
}
.mod_dropnavi .mod_dropnavi_child ul li a{
	padding:0 0 0 12px!important;
	display:inline-block;
}
.mod_dropnavi .mod_dropnavi_child ul li a:link    {color:#000; text-decoration:none;}
.mod_dropnavi .mod_dropnavi_child ul li a:visited {color:#000; text-decoration:none;}
.mod_dropnavi .mod_dropnavi_child ul li a:hover   {color:#000; text-decoration:underline;}
.mod_dropnavi .mod_dropnavi_child ul li a:active  {color:#000; text-decoration:underline;}

.menu_sabitem{
	font-weight:bold;
	color:#000000;
}