@charset "UTF-8";

/*--------------------リンク文字色--------------------*/
a:link{ color: #0064C2; text-decoration:none; }    /*通常色*/
a:visited{ color: #75006F; text-decoration:none; } /*訪問済み色*/
a:hover{ color: #FF0000; text-decoration:underline; }   /*カーソルを当てた時の色*/
a:active{ color: #FF0000; text-decoration:underline; }  /*クリックし離すまでの色*/

a { outline:none; }/*クリック時に枠を表示させない*/
input { outline:none; }

/*--------------------bodyとサイト幅--------------------*/
*, *:before, *: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;
}

*{ font-family:"游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;}

html{
	background: #fff;
	margin: 0 auto;
	width: auto;
	min-width: 1000px;
}

body{
	width: auto;
	background: #fff;
	z-index: 1;
	margin: 5px 0;
	padding: 0;
	font-family:"游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif;
	font-size: 14px;
	line-height: 1.4;
	color: #333;
	word-break: normal; /*行の改行方法を指定*/
	text-wrap: normal; /*テキストの折り返し方法*/
}

img{
	border: 0;
	padding: 0;
	margin: 0;
	vertical-align: bottom;
}

a:hover img{
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;opacity: 0.7;
}

/*--------------------ヘッダー--------------------*/
div.header-taroto {
	position: relative;
	width: 100%;
	height: 172px;
	margin-bottom: 10px;
}

.header-taroto-ue{/*ヘッダー上部分*/
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.header-taroto img { border: 0;}

/*店舗名部分*/
.header-taroto .title-taroto{
	margin-left: 5px;
}

.header-taroto .title-taroto:hover{ opacity: 1;}

/*上部リンク部分*/
.header-taroto .header-button-taroto{
	position: absolute;
	top: 5px;
	right: 0;
	width: 71%;
	text-align: center;
}

.header-taroto .header-button-taroto ul{
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;  /*リストのマーカー表示なし*/
	background: #FFF;
}

.header-taroto .header-button-taroto li{
	width: 14%;
	border-left: 1px solid #ccc;
}

.header-taroto .header-button-taroto li:last-child{/*最後のliのみ*/
	border-right: 1px solid #ccc;
}

.header-taroto .header-button-taroto li a{ display: block;}

.header-taroto .header-button-taroto li a:hover{/*カーソルが乗った時、上へずらす*/
	position: relative;
	top: -3px;
}

.header-taroto .header-button-taroto li a:hover img{ opacity: 1;}

/*案内画像部分*/
.header-taroto .annai-taroto{
	position: absolute;
	top: 40px;
	left: 25%;
	width: 74%;
	text-align: center;
}

/*特価品リンク部分*/
.header-taroto .tokka-taroto {
	position: absolute;
	top: 38px;
	right: 62%;
}

/*検索・各ボタン部分*/
.header-taroto .search-taroto{
	position: absolute;
	bottom: 0;
	background: #F25800;
	border-radius: 3px; /*角丸の指定*/
	width: 100%;
	height: 47px;
}

.header-taroto-sita{
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 1200px;
	height: 47px;
	background: url("https://www.taroto.jp/site/img-t/search-title.gif") 11px center no-repeat; /*検索の案内画像*/
	text-align: left;
}

.header-taroto .search-taroto form{
	display: inline-block;
	margin: 0 0 0 45px;
	padding: 0;
	width: 67.8%;
	height: 45px;
	white-space: nowrap;
}

.header-taroto .search-taroto .bar-taroto{/*検索入力バー*/
	position: relative;
	top: 8px;
	margin: 0;
	padding: 0 5px;
	width: 93%;
	height: 31px;
	border: 1px solid #A9A9A9;
	box-shadow: none; /*入力内上部の影を消す（ブラウザによる）*/
	font-size: 15px;
	cursor: text;/*マウスカーソルをテキスト編集時に*/
}

.bar-taroto::placeholder{ color: #aaa; }/*入力欄に元から入っている文字指定（ブラウザによる）*/
.bar-taroto:-ms-input-placeholder{ color: #aaa; }
.bar-taroto::-ms-input-placeholder{ color: #aaa; }
.bar-taroto::-moz-placeholder{ color: #aaa; opacity: 1;}
.bar-taroto:-moz-placeholder{ color: #aaa; opacity: 1;}

.header-taroto .search-taroto .button-taroto{/*検索ボタン*/
	position: relative;
	top: 8px;
	right: 6px;
	vertical-align: top;
	height: 31px;
	margin: 0;
	padding: 0;
	border: 0;
}

/*ログインボタン（ログアウト時）*/
.header-taroto .search-taroto .okini-taroto{
	display: inline;
	position: absolute;
	right: 14.1%;
	bottom: 1px;
}

/*マイページボタン（ログイン時）*/
.header-taroto .search-taroto .my-taroto{
	display: inline;
	position: absolute;
	right: 14.1%;
	bottom: 1px;
}

.header-taroto .my-taroto ul{/*マイページ詳細*/
	display: none;
	position: absolute;
	top: 42px;
	width: 100%;
	margin: 0;
	padding: 5px 7%;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0px 0px 4px 1px #ccc;
	font-size: 14px;
	line-height: 2.0;
	overflow: hidden;
	z-index: 3;
}

.header-taroto .my-taroto:hover ul{/*マイページボタンにカーソルを乗せるとリスト表示*/
	display: block;
}

.header-taroto .my-taroto a{
	text-decoration: none;
}

/*買い物カゴ部分*/
.header-taroto .cart-taroto{
	display: inline;
	position: absolute;
	right: 1%;
	top: 5px;
}

.header-taroto .cart-taroto ul{/*買い物カゴ詳細*/
	display: none;
	position: absolute;
	top: 42px;
	width: 100%;
	margin: 0;
	padding: 5px 7%;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0px 0px 4px 1px #ccc;
	font-size: 14px;
	line-height: 2.0;
	overflow: hidden;
	z-index: 3;
}

.header-taroto .cart-taroto .itemcount span{/*買い物カゴ詳細：商品数*/
	font-weight: bold;
	color: #f00;
}

.header-taroto .cart-taroto .subtotal span{/*買い物カゴ詳細：価格*/
	font-weight: bold;
	color: #f00;
}

.header-taroto .cart-taroto .cart_btn{/*買い物カゴ詳細：カートを見る*/
	font-weight: bold;
	color: #fff;
	background: #999;
	margin: 0 auto;
	margin-top: 5px;
	padding: 0;
	text-align: center;
	border-radius: 5px;
	font-size: 13px;
}

.header-taroto .cart-taroto .cart_btn a{
	text-decoration: none;
	color: #fff;
}

.header-taroto .cart-taroto .cart_btn:hover{
	opacity: 0.7;
}

.header-taroto .cart-taroto:hover ul{
	display: block;
}

/*--------------------中央 大外枠--------------------*/

div#contents{
	position: relative;
	width: 980px !important;
	margin: 0 auto !important;
	padding: 0;
}

/*--------------------中央 バナー部分--------------------*/

div.top-banner{
	position: relative;/*本来表示されるべき場所からの指定*/
	top: 0;
	left: 202px;
	width: 770px;
	padding: 10px;
	margin: 0 0 17px 0;
	border: 1px solid #999;
	border-radius: 10px;
	text-align: justify; /*均等割付*/
	text-align-last: justify; /*最後の行の均等割付*/
	text-justify: distribute-all-lines; /*均等割付の指定*/
}

.top-banner a{}

.top-banner img{
	width: 24%;
	vertical-align: top;
}

/*--------------------中央 本文---------------------------*/
div.center {
	position: relative;/*本来表示されるべき場所からの指定*/
	top: 0;
	left: 202px;
	width: 566px;
	color: #555;
}

.center h2 {/*各タイトル*/
	margin: 0;
	padding: 0;
	border: 0;
	background: #FFF;
}

.center p {/*各タイトル下の文字*/
	margin: 0;
	padding: 5px;
	line-height: 1.3;
	border:1px solid;
	border-width: 0 1px;
}

.center ul {
	border:1px solid;
	border-top: 0;
	border-radius: 0 0 10px 10px;
	width: 566px;
	margin: 0 0 20px 0;
	padding: 0 25px;
	list-style: none;
	text-align: justify; /*均等割付*/
	text-align-last: justify; /*最後の行の均等割付*/
	text-justify: distribute-all-lines; /*均等割付の指定*/
}

.center li {
	display: inline-block;
	margin: 7px 0;
	padding: 0;
	text-align: center;
	text-align-last: center;
	vertical-align: top;
}

.center li img {
	padding-bottom: 3px;
}

/*各色の指定*/
.center p.wakeari { background: #FFF4F0; border-color: #FF2907; }/*掘り出しモノ市場*/
.center ul.wakeari { border-color: #FF2907; }
.center p.densetu { background: #FFF4F0; border-color: #FF7C49; }/*電設資材*/
.center ul.densetu { border-color: #FF7C49; }
.center p.syoumei { background: #EEF8FF; border-color: #5CA8F5; }/*照明器具*/
.center ul.syoumei { border-color: #5CA8F5; }
.center p.lamp { background: #E8F6FB; border-color: #83C7DF; }/*ランプ・リモコン*/
.center ul.lamp { border-color: #5CA8F5; }
.center p.kanki { background: #E5FFF5; border-color: #78DBCD; }/*換気扇*/
.center ul.kanki { border-color: #78DBCD; }
.center p.sagyou { background: #F8F0F7; border-color: #C490BF; }/*作業工具*/
.center ul.sagyou { border-color: #C490BF; }
.center p.jyusin { background: #FEF5EC; border-color: #AD763A; }/*TV受信機器*/
.center ul.jyusin { border-color: #AD763A; }
.center p.phone { background: #F0F9EF; border-color: #77D36A; }/*ドアホン*/
.center ul.phone { border-color: #77D36A; }
.center p.haisen { background: #FAEFF6; border-color: #FA9DD6; }/*配線材料*/
.center ul.haisen { border-color: #FA9DD6; }


/*--------------------左サイドメニュー--------------------*/
div.l-side{
	position: absolute;/*親要素のposition場所からの指定*/
	top: 0;
	left: 0;
	font-size: 0.85em;
	color: #555;
	line-height: 1.6;
}

.l-side img{ margin: 0; padding: 0; border: 0; }

.l-side ul {
	width: 187px;
	margin: 0 0 15px 0;
	padding: 5px;
	list-style: none;
	border: 1px solid #F25800;
	border-top: 0;
}

/*--------------------右サイドメニュー--------------------*/
div .r-side{
	position: absolute;/*親要素のposition場所からの指定*/
	top: 169px;
	right: 0;
	width:195px;
}

div .r-side-event{/*右サイドイベント部分v*/
	margin-bottom: 25px;
}

.r-side-event a{/*右サイドイベント各リンク部分*/
	display: block;
	margin-bottom: 5px;
}

.r-side .itiran{ /*商品カテゴリ一覧タイトル*/
	width: 192px;
	height: 28px;
	background: url("img-t/side-title.gif");
	border-bottom: 1px solid #fff;
	box-shadow: 2px 2px 2px -1px rgba(0,0,0,0.3);
}

.r-side .maker a{
	display: table;
	margin: 0;
	padding: 0;
	background: #f4f4f4;
	color: #0066CC;
	width: 192px;
	height: 40px;
	border: 1px solid #fff;
	border-top:0;
	text-decoration:none;
	box-shadow: 2px 2px 2px -1px rgba(0,0,0,0.3);
}

.r-side .maker a:hover {
	background: #FFFCCE;
}

.r-side a:hover > img {
	opacity: 0.5;
}

.r-side .maker img {
	display: table-cell;
	border-right: 1px solid #fff;
	vertical-align: middle;
	font-size: 0.7em;
}

.r-side .maker span {
	display: table-cell;
	width: 145px;
	height: 40px;
	vertical-align: middle;
	font-size: 0.9em;
	line-height: 1.1;
}

/*--------------------上部フッターー--------------------*/
div.footer01{
	position: relative;
	width: 980px;
	margin: 0 auto;
	margin-bottom: 15px;
	padding: 15px 2% 10px 2%;
	background: #fffbf2;
	border: 1px solid #faa235;
	border-width: 1px 5px;
	color: #754C24;
	line-height: 1.3;
	font-size: 0.96em;
}

/*見だし文字*/
.footer01 .midasi{ font-weight: bold; font-size: 1.1em;}

.footer01 .midasi:before{/*見だしの前に●*/
	content: "\025cf";
	color: #FF9262;
}

/*お支払い～返品div*/
.footer01 .siharai{
	width: 40%;
	padding: 0 1% 0 0;
	border-right: 1px dashed #faa235;
}

.footer01 .siharai p{
	margin-bottom: 13px;
}

.footer01 .siharai .syousai{/*詳細の文字*/
	font-weight: normal;
	color: #0066CC;
}

.footer01 .siharai a { color: #754C24; }

/*ご留意事項*/
.footer01 .ryuui{
	position: absolute;
	bottom: 15px;
	left: 405px;
	width: 220px;
	height: 180px;
	padding: 30px 5px 0 0;
	border-right: 1px dashed #faa235;
}

/*暗号化部分*/
.footer01 .angou {
	position: absolute;
	bottom: 15px;
	right: 180px;
	width: 158px;
	height: 180px;
	border-right: 1px dashed #faa235;
	font-size: 0.92em;
	padding: 5px;
}

.footer01 .angou img{
	position: absolute;
	top: 35px;
	left: 55px;
	right: 0;
}

.footer01 .angou span{
	position: absolute;
	top: 90px;
}

/*J-FEC部分*/
.footer01 .j-fec {
	position: absolute;
	bottom: 15px;
	right: 5px;
	width: 165px;
	height: 180px;
	font-size: 0.92em;
}

.footer01 .j-fec img{
	position: absolute;
	right: 15px;
	top: 20px
}

.footer01 .j-fec span{
	position: absolute;
	top: 113px
}

/*カレンダー部分*/
.footer01 .calendar {
	position: absolute;
	top: 20px;
	left:410px;
	width: 320px;
}

.footer01 .calendar .sengetu{/*先月分カレンダー*/
	position: absolute;
	clip: rect(6px 141px 135px 7px);
}

.footer01 .calendar .raigetu{/*来月分カレンダー*/
	position: absolute;
	clip: rect(6px 295px 135px 159px);
}

.footer01 .calendar .green{/*テキスト緑部分*/
	position: absolute;
	top: 145px;
	font-weight: bold;
	color: #009944;
	line-height: 1.2em;
}

.footer01 .calendar .brown{/*テキスト茶部分*/
	position: absolute;
	top: 182px;
}

/*所在地部分*/
.footer01 .syozai {
	position: absolute;
	top: 18px;
	right: 14px;
	width: 220px;
	height: 150px;
	border: 1px solid #754C24;
	line-height: 1.4;
}

.footer01 .syozai img{
	position: absolute;
	top: 8px;
	left: 8px;
}

.footer01 .syozai .brown{ /*テキスト茶部分*/
	position: absolute;
	top: 45px;
	left: 15px;
}

.footer01 .syozai .red{ /*テキスト赤部分*/
	position: absolute;
	top: 130px;
	right: 1px;
	font-size: 0.92em;
	color: #f00;
}

.footer01 .syozai a{ /*テキストリンク部分*/
	text-decoration:underline;
}

/*--------------------下部フッターー--------------------*/
div.footer02{
	text-align: center;
}

/*--------------------コピーライト--------------------*/
div.copyright {
	background: #FAA235;
	margin: 0 auto;
	width: 980px;
	font-size: 1.0em;
	color: #fff;
	font-weight: bold;
	padding: 5px 0;
	text-align: center;
}

