@charset "shift_jis";


/*-----------------------------------------------------
  ■審査中一時非表示
 -----------------------------------------------------*/
#tp-noworder,
#kiji{
	display:none;
}

/*-----------------------------------------------------
  ■メイン
 -----------------------------------------------------*/

/* ---------- コンテンツラップ ---------- */
#contents-wrap{
	width: 1000px;
	min-height: 400px;
	margin: 30px auto 0px;
	text-align: left;
}

/* ---------- 左可変親 ---------- */
#l-wrap{
	float: left;
	width:660px;
}
/* ---------- 右固定親 ---------- */
#r-wrap{
	float: right; 
	width:300px;
}

/* ---------- サブタイトル ---------- */
h2.tp-subtit{	
	background:#666;
	color:#FFF;
	font-weight:bold;
	padding:5px 10px;
	display:inline-block;
}

/*-----------------------------------------------------
  ■大スライダー
 -----------------------------------------------------*/

#bigslider{
	width: 100%;
	height: 350px;
	text-align: left;
	margin-bottom: 40px;
	position: relative;
	overflow: hidden;
	background: url(//www.wakibungu.com/images/top/loading.gif) no-repeat center center;
}
.bxslider3 li{
	overflow: hidden;
	opacity: 0;
}
.bx-viewport .bxslider3 li {
	opacity: 1 !important;
}

/* ---------- 位置調整 ---------- */
.bx-viewport{
	width:1000px !important;
	margin: 0 auto;
	overflow: visible !important;
}

/* ---------- 画像 ---------- */
#bigslider li img{
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}

/* ---------- テキストラップ ---------- */
#bigslider li > div{
	margin: 0 auto;
	width:1000px;
}
#bigslider li p{
	position:absolute;
	top:0;
	width:300px;
	height:320px;
	margin-left:700px;
	overflow: hidden;
	background:url(//www.wakibungu.com/images/top/top-slide-txtbg.png) repeat;
	color:#FFF;
}
/* ---------- タイトル ---------- */
#bigslider .sl-tit{
	display:block;
	padding:20px 20px 10px;
	font-weight:bold;
}
/* ---------- 文章 ---------- */
#bigslider .sl-txt{
	display:block;
	padding:0 20px 0;
}
/* ---------- MOREボタン ---------- */
#bigslider a.sl-more{
	display:block;
	padding:2px 5px;
	margin:0 20px 20px;
	background:#FFF;
	color:#000;
	width:50px;
	text-align:center;
	text-decoration:none;
}

/* ---------- ボタン ---------- */
.bx-controls{
	position:absolute;
	top:0;
	width:100%;
}
#bigslider .bx-next {
    right: -500px;
}
#bigslider .bx-prev {
    left: -500px;
}
#bigslider .bx-controls-direction a {
	position: absolute;
	text-indent: -9999px;
	z-index: 3;
    background: rgba(0,0,0,.3);
    width: 50%;
    height: 320px;

}
#bigslider .bx-controls-direction a.disabled {
	display: none;
}

/* ---------- 矢印 ---------- */
#bigslider .bx-next::after,
#bigslider .bx-prev::after{
 border-top: 4px solid rgba(255,255,255,.8);
 content: "";
 position: absolute;
 width: 40px;
 height: 40px;
 top: 50%;
}
#bigslider .bx-next::after{
 border-right: 4px solid rgba(255,255,255,.8);
 margin: -10px 4px 0 10px;
 left: 20px;
 transform: rotate(45deg);
 -webkit-transform: rotate(45deg);
}
#bigslider .bx-prev::after{
 border-left: 4px solid rgba(255,255,255,.8);
 margin: -10px 10px 0 4px;
 right: 20px;
 transform: rotate(-45deg);
 -webkit-transform: rotate(-45deg);
}

/* ---------- ページャー ---------- */
/* PAGER */

.bx-wrapper .bx-pager {
	text-align: center;
	font-size: .85em;
	font-family: Arial;
	font-weight: bold;
	color: #666;
	padding-top: 20px;
}

.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
	display: inline-block;
	*zoom: 1;
	*display: inline;
}

.bx-wrapper .bx-pager.bx-default-pager a {
	background: #666;
	text-indent: -9999px;
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	outline: 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #000;
}
.bx-pager{
	position:absolute;
	top:320px;
	width:100%;
}

/*-----------------------------------------------------
  ■ランキング
 -----------------------------------------------------*/

#tp-rank {
	padding:30px 0 0;
}

/* ---------- テキストラップ ---------- */
.tp-rank-txtwrap {
	border-bottom:1px solid #E6DED5;
	padding:20px 0 0;
}
/* ---------- テキスト左 ---------- */
.tp-rank-txt1 {
	float:left;
	font-weight:bold;
}
/* ---------- テキスト右日付 ---------- */
.tp-rank-txt2 {
	float:right;
}
/* ---------- ボックス下線 ---------- */
#tp-rank li{
	border-bottom:1px solid #E6DED5;
	padding-bottom:4px;
}
/* ---------- ランキング画像 ---------- */
#tp-rank li img{
	display: inline-block;
	vertical-align: middle;
	padding: 4px 15px 0 0;
	width:100px;
	*zoom: 1; /* for IE6-7 */
	*display: inline; /* for IE6-7 */
}
/* ---------- テキストエリア ---------- */
#tp-rank li p{
	padding:40px 0 0;
	display: inline-block;
	vertical-align: middle;
	width:175px; /* 幅の指定がない場合、改行が必要な幅を超えるとカラム落ちします。 */
	*zoom: 1; /* for IE6-7 */
	*display: inline; /* for IE6-7 */
}
#tp-rank li a{
	text-decoration:none;
}
/* ---------- １〜5位 ---------- */
#tp-rank li.no1 p{
	background:url(//www.wakibungu.com/images/top/top-rank-no1.jpg) no-repeat;
}
#tp-rank li.no2 p{
	background:url(//www.wakibungu.com/images/top/top-rank-no2.jpg) no-repeat;
}
#tp-rank li.no3 p{
	background:url(//www.wakibungu.com/images/top/top-rank-no3.jpg) no-repeat;
}


/*-----------------------------------------------------
  ■ご注文状況
 -----------------------------------------------------*/

#tp-noworder {
	padding-top:30px;
	width:100%;
}
#tp-noworder p{
	float:right;
}


/*-----------------------------------------------------
  ■更新情報
 -----------------------------------------------------*/

#tp-news {
	padding-top:30px;
}
/* ---------- 日付＆商品名 ---------- */
#tp-news p {
	width:300px;
	margin:0 auto;
	padding-top:5px;
}
#tp-news span {
word-break:break-all;
}

/* ---------- アイコン ---------- */
#tp-news span.new,
#tp-news span.rup {
	display:block;
	padding:0 0 0 80px;
	min-height:25px;
	line-height: 25px;/*縦中央 1行ver.*/
}
#tp-news span.new {
	background:url(//www.wakibungu.com/images/top/top-ic-new.jpg) no-repeat;
}
#tp-news span.rup {
	background:url(//www.wakibungu.com/images/top/top-ic-rup.jpg) no-repeat;
}

/* ---------- スライダー ---------- */
.news-wrap{
	position: relative;
}
.news-wrap ul {
	padding-top:10px;
}
.news-wrap li {
	height:380px;
	overflow: hidden;
}

/* ---------- ボタン ---------- */

.news-wrap .bx-prev {
	left: 0;
	background: url(//www.wakibungu.com/images/top/top-slide-bt-ls.jpg) no-repeat;
}

.news-wrap .bx-next {
	right: 0;
	background: url(//www.wakibungu.com/images/top/top-slide-bt-rs.jpg) no-repeat;
}

.news-wrap .bx-controls-direction a {
	position: absolute;
	top: 150px;
	margin-top: -16px;
	outline: 0;
	width: 12px;
	height: 50px;
	text-indent: -9999px;
	z-index: 9999;
}
.news-wrap .bx-controls-direction a.disabled {
	display: none;
}

/* ---------- 画像 ---------- */
.news-wrap li img{
	width:300px;
}


/*-----------------------------------------------------
  ■お客様の声 ※現在未使用
 -----------------------------------------------------*/

#tp-voice {
	padding-top:30px;
}

/* ---------- スライダー ---------- */
.voice-wrap{
	position: relative;
}
.voice-wrap ul {
	padding-top:10px;
}
.voice-wrap li {
	height:270px;/* 全体の高さ */
	overflow: hidden;
}
/* ---------- 角丸ふきだし ---------- */
.voce-fuki {
	border:2px solid #999;
	padding:10px;
	border-radius: 8px;        /* CSS3草案 */  
	-webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 8px;   /* Firefox用 */ 
}
/* ---------- 商品名 ---------- */
.voce-fuki > a span {
	font-size:74%;
	padding-bottom:5px;
	width:276px;
	display:inline-block;
	white-space: nowrap;  
	overflow: hidden;  
	text-overflow: ellipsis;  
	-webkit-text-overflow: ellipsis;  
	-o-text-overflow: ellipsis;  
}
/* ---------- 文章 ---------- */
.voce-fuki p {
	float:right;
	width:120px;
	font-size:83.3%;
}
/* ---------- 名前＆日付 ---------- */
.voice-box{
	width:260px;
	margin:0 auto;
	font-size:83.3%;
	background: url(//www.wakibungu.com/images/top/top-fukidashi01.jpg) no-repeat 15px 0;/* 角丸ふきだしの▼ */
	padding-top:20px;
}
/* ---------- 名前＆アイコン ---------- */
.voice-box p{
	font-weight:bold;
	display:block;
	padding:0 0 0 60px;
	min-height:50px;
	line-height: 25px;/*縦中央 2行ver.*/
}
.voice-box p.women {
	background:url(//www.wakibungu.com/images/top/top-ic-women.jpg) no-repeat;
}
.voice-box p.men {
	background:url(//www.wakibungu.com/images/top/top-ic-men.jpg) no-repeat;
}
.voice-box p.other {
	background:url(//www.wakibungu.com/images/top/top-ic-other.jpg) no-repeat;
}


/* ---------- ボタン ---------- */

.voice-wrap .bx-prev {
	left: 0;
	background: url(//www.wakibungu.com/images/top/top-slide-bt-ls.jpg) no-repeat;
}

.voice-wrap .bx-next {
	right: 0;
	background: url(//www.wakibungu.com/images/top/top-slide-bt-rs.jpg) no-repeat;
}

.voice-wrap .bx-controls-direction a {
	position: absolute;
	top: 239px; /* ボタンの縦ポジション */
	margin-top: -16px;
	outline: 0;
	width: 12px;
	height: 50px;
	text-indent: -9999px;
	z-index: 9999;
}
.voice-wrap .bx-controls-direction a.disabled {
	display: none;
}

/* ---------- 画像 ---------- */
.voice-wrap li img{
	width:150px;
}


/*-----------------------------------------------------
  ■新着エリア masonry
 -----------------------------------------------------*/

.masonry {
	max-width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* ---------- newマーク ---------- */

.item.new > a:before {
	content: url(//www.wakibungu.com/images/top/top-mark-new.png);
	position:absolute;
}

/*---------- 画像 ----------*/

/* 通常 ボックスと画像 */
.masonry img,
.masonry .item,
.masonry .grid-sizer{
	width: 200px;
}

/* 通常 画像 */
.masonry img {
	display: block;
	height:200px;
}

/* 横長 ボックスと画像 */
.masonry .w2,
.masonry .w2 img{
	width:640px;
}
/* 横長 画像 */
.masonry .w2 img{
	height:356px;
}

/* item */
.masonry .item,
.masonry .grid-sizer,
.masonry .w2{
	margin-right:20px;
	float: left;
	margin-bottom: 20px;
}


/*---------- 文章 ----------*/

.masonry .item p {
	background:#EEE;
	color:#333;
	padding:5px 10px;
	overflow: hidden;
	line-height: 20px;/*縦中央 2行ver.*/
-webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    box-orient: vertical;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    white-space: normal;
    height:57px;
}
/* リンク */
.masonry .item a {
	text-decoration:none;
}

/* ---------- もっとみる ---------- */

/* .loadArea
--------------------------- */
.loadArea {
    margin: 0 auto 10px auto;
    width: 300px;
    text-align: left;
}
 
.loadArea .loadItem {
    padding: 10px 0;
    width: 300px;
    line-height: 160%;
    border-bottom: #666 1px dotted;
}
.loadArea #item1_1,
.loadArea #item2_1 {
    border-top: #666 1px dotted;
}
.loadArea .loadItem img {
    margin: 0 15px 0 0;
    width: 100px;
    height: 100px;
    float: left;
}
/* .nowLoading
--------------------------- */
.nowLoading {
    padding: 5px 0;
    width: 100%;
    text-align: center;
}
 
/* .loadMoreBtn
--------------------------- */
.loadMoreBtn {
    padding: 10px 0;
    text-align: center;
    border: #000 1px solid;
    cursor: pointer;
    width:640px;
    margin-bottom:30px;
}

/*-----------------------------------------------------
  ■和気文具オリジナル
 -----------------------------------------------------*/
.spot-wk img{
	display:block;
	max-width:100%;
	margin-top:10px;
}

/*-----------------------------------------------------
  ■おすめコンテンツ
 -----------------------------------------------------*/
.left-cont{
	margin-top:30px;
}
.left-cont ul{
	margin-top:10px;
}
.left-cont ul li{
}
.wctentry {
	max-width:100%;
	position:relative;
	min-height:140px;
	border-bottom:1px solid #CCC;
	padding-top:10px;
	padding-bottom:10px;
}
.wctentry img{
	width:140px;
	height:140px;
}
.post-thumbnail{
	position:absolute;
	top:10px;
	left:0;
}
.wctentry .entry-header,
.wctentry .entry-summary{
	padding-left:150px;
}
.entry-summary {
	font-size:11px;
}
.wctentry .byline,
.comments-link,
.entry-summary a {
	display:none;
}
.entry-summary p{
  -webkit-line-clamp: 3;  // 指定行数
     -moz-line-clamp: 3;
          line-clamp: 3;
  -webkit-box-orient: vertical;  // 領域内の子要素を、上から下へ垂直に積み重ねて表示
     -moz-box-orient: vertical;
          box-orient: vertical;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  overflow: hidden;
  white-space: normal;  // 領域に応じて自動的に改行する
  text-overflow: ellipsis;
}

/* ---------- FIREFOX ---------- */
.entry-summary p, x:-moz-any-link {
	white-space: nowrap;
	text-overflow: ellipsis;
} 

/* ---------- IE11 ---------- */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.entry-summary p:not(:target) {
	white-space: nowrap;
	text-overflow: ellipsis;
} 
}

/* ---------- もっとみる ---------- */
.left-cont ul li.mottomiru {
    background: #73B060;
    display: block;
    padding: 5px;
    margin-bottom:30px;
    margin-top:10px;
}

.left-cont ul li.mottomiru a{
 display:block;
 position: relative;
    color: #FFF;
    text-decoration: none;
}
.left-cont ul li.mottomiru a::after{
 border-right: 3px solid #FFF;
 border-top: 3px solid #FFF;
 content: "";
 margin: -6px 4px 0 10px;
 position: absolute;
 transform: rotate(45deg);
 -webkit-transform: rotate(45deg);
 top: 50%;
 right: 0;
 width: 10px;
 height: 10px;
}

/*-----------------------------------------------------
  ■本日のinstagram　インスタ
 -----------------------------------------------------*/
#instaarea{
	margin-top:20px;
}
#instafeed{
	margin: 10px -10px -10px 0;
	overflow: hidden;
	zoom: 1;
}
#instafeed li {
	margin: 0 10px 10px 0;
	float: left;
	width: 145px;
	display: inline;
}
#instafeed img{
	width:100%;
}
.spot-wctinst{
	margin-top:10px;
}
.spot-wctinst img{
	width:100%;
}

/*-----------------------------------------------------
  ■STINGER トップ表示部 
 -----------------------------------------------------*/

.left-cont dt {
    float: left;
    margin-right: 5px;
}
.left-cont .blog_info .pcone{
	display:none;
}
.left-cont .smanone2{
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    box-orient: vertical;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    overflow: hidden;
    white-space: normal;
}