@charset "utf-8";

/*
	/s/styles/type1/top.css
	☆スマホ用
	
	トップページ用CSS
	◆ブレイクポイント320px - iPhone5
	◆ブレイクポイント768px - iPad
	
*/


/*
	.topHeader
	サイトヘッダー上書き
*/
.topHeader {
}
.topHeader_logo {
	/* ロゴ */
	padding:11px 0;
	text-align:center;
	line-height:0;
}


/*
	.info-1
	お知らせ1
*/
.info-1 {
	margin-bottom:1px;
	background:#f1efea;
}
.info-1 p {
	padding:15px;
	font-size:11px;
}

/*
	.mainVisual
	メインビジュアル
*/
.mainVisual {
	height:320px;
	position:relative;
}
.mainVisual_link {
	width:100%;
	max-width:850px;
	margin:0 auto;
	display:table;
	text-decoration:none;
}
.mainVisual_link > div {
	height:320px;
	display:table;
}
.mainVisual_link > div:before {
	height:100%;
	content:'';
	display:table-cell;
	vertical-align:middle;
}

/*
	.storyMessage
	メッセージ
*/
.storyMessage {
	margin:20px 0;
	text-align:center;
}
.storyMessage img {
	width:250px;
	height:auto;
}

/*
	.info-2
	お知らせ2
*/
.info-2 {
	max-width:400px;
	margin:10px auto 20px;
	padding:10px;
	box-sizing:border-box;
	background:#f1efea;
}
.info-2_in {
	width:100%;
	display:table;
	line-height:1.6;
}
.info-2_ttl {
	/* width:60px; 夏季休業*/
	width:120px;
	margin-left: 5px;
	display:block;
	font-size:12px;
	vertical-align:top;
	white-space:nowrap;
	padding-left: 1%;
}
.info-2 ul {
	width:99%;
	padding-left:10px;
	/* display:table-cell; 夏季休業*/
	margin-top:5px;
	vertical-align:top;
	box-sizing:border-box;
}
.info-2 li {
	margin-left:1em;
	list-style:disc;
	font-size:12px;
}
.info-2 a {
	text-decoration:underline;
}

/*
	.topLink
	トップリンク
*/
.topLink {
	border-bottom:1px solid #dfdfdf;
}
.topLink li {
}
.topLink li:first-child {
}
.topLink a {
	padding:8px 20px 8px 10px;
	line-height:1.6;
	display:block;
	background:url(/images/type1/template/icon_right-1.png) 98% 50% no-repeat;
	background-size:14px auto;
	border-top:1px solid #dfdfdf;
	font-size:13px;
	text-decoration:none;
}
.topLink_color {
	background:#95b189;
}

/*
	.top_ttl-1
	タイトル系
*/
.top_ttl-1 {
	text-align:center;
	font-weight:bold;
	letter-spacing:.06em;
}
.top_ttl-1_e {
	font-size:28px;
	display:block;
	font-family: 'Quicksand', sans-serif;
	letter-spacing:.06em;
	line-height:1.2;
	text-transform:uppercase;
}
.top_ttl-1_j {
	margin-top:10px;
	font-size:13px;
	display:block;
}

/*
	.features
	おすすめページ
*/
.features {
	margin-top:45px;
	font-size:0;
}
.features_ttl {
}
.features_story {
	/* ストーリー */
	margin-top:20px;
	padding-top:4px;
	position:relative;
	background:url(/s/images/top/story_bg-1.png) 0 0 repeat-x;
}
.features_story a {
	padding:15px;
	display:block;
	text-decoration:none;
}
.features_story_bg-1 {
	padding-bottom:4px;
	background:url(/s/images/top/story_bg-3.png) 0 100% repeat-x;
}
.features_story_bg-2 {
	background:url(/s/images/top/story_bg-2.png) 0 0 repeat-y;
}
.features_story_bg-3 {
	background:url(/s/images/top/story_bg-4.png) 100% 0 repeat-y;
}
.features_story_ttl {
	text-align:center;
}
.features_story_ttl img {
	width:100%;
	height:auto;
	max-width:160px;
}
.features_story_visual {
	display:table-cell;
	vertical-align:middle;
	background:url(/images/type1/template/ajax-loader.gif) 50% 50% no-repeat;
	background-size:16px auto;
}
.features_story_visual img {
	max-width:140px;
	height:auto;
}
.features_in {
	margin:0 auto;
	display:table;
}
.features_story_cell {
	padding:0 10px 10px 0;
	display:table-cell;
	vertical-align:middle;
}
.features_story_lines {
	margin-top:15px;
	font-size:12px;
	line-height:1.5;
	letter-spacing:.08em;
}
.features_story_arrow {
	margin-top:10px;
	text-align:right;
}
.features_story_arrow img {
	width:100%;
	height:auto;
	max-width:160px;
}
.features_article {
	/* 他おすすめページ */
	display:inline-block;
	vertical-align:top;
}

.features_article ul {
	margin:20px 0 0 -10px;
}
.features_article li {
	width:49.9%;
	padding:20px 0 0 10px;
	display:inline-block;
	vertical-align:top;
	line-height:1.6;
	box-sizing:border-box;
}
.features_article li a {
	display:block;
	text-decoration:none;
}
.features_article_visual {
	background:url(/images/type1/template/ajax-loader.gif) 50% 50% no-repeat;
	background-size:16px auto;
}
.features_article_visual img {
	width:100%;
	height:auto;
	display:block;
}
.features_article_ttl {
	margin-top:8px;
	font-size:11px;
}
.features_article_lines {
	margin-top:3px;
	font-size:12px;
}
@media screen and (min-width:768px) { 
    /*　画面サイズが768pxからはここを読み込む　*/
.features_article li {
	width:33.3%;
}
}

/*
	.articles
	読み物
*/
.articles {
	margin-top:50px;
}
.articles_ttl {
}
.articles ul {
	margin:20px 0 0 -10px;
	font-size:0;
}
.articles li {
	width:49.9%;
	padding:20px 0 0 10px;
	display:inline-block;
	vertical-align:top;
	font-size:14px;
	line-height:1.6;
	box-sizing:border-box;
}
.articles li a {
	display:block;
	text-decoration:none;
}
.article_visual {
	background:url(/images/type1/template/ajax-loader.gif) 50% 50% no-repeat;
	background-size:16px auto;
}
.article_visual img {
	width:100%;
	height:auto;
	display:block;
}
.articles .article_name {
	margin-top:8px;
}
.articles .article_cat {
}
.articles .article_ttl {
	margin-top:5px;
	display:block;
	font-size:11px;
}
.articles .article_name {
	padding:0 2px;
	display:inline-block;
	border-bottom:1px dotted #666;
	color:#333;
	font-size:8px;
}
.articles .article_cat {
	margin-left:.2em;
	color:#333;
	font-size:8px;
}
.articles li.style .article_name:before {
	content:'FAIR TRADE STYLE';
}
.articles li.days .article_name:before {
	content:'The days...';
}
.articles li.days-shop .article_cat:before {
	content:'\30b7\30e7\30c3\30d7\60c5\5831';
}
@media screen and (min-width:768px) { 
    /*　画面サイズが768pxからはここを読み込む　*/
.articles li {
	width:33.3%;
}
}


/*
	.homeBodyCtg
	アイテムカテゴリー
*/
.homeBodyCtg {
	margin-top:50px;
	padding:30px 0;
	background:#eff3ed;
	border-width:5px 0;
}


/*
	.campaign
	セール／キャンペーン
*/
.campaign {
	margin-top:50px;
}
.campaign_ttl {
}
.campaign ul {
	margin:30px 0 0 -10px;
	font-size:0;
}
.campaign li {
	width:49.9%;
	padding:10px 0 0 10px;
	display:inline-block;
	font-size:14px;
	vertical-align:top;
	text-align:center;
	line-height:1.4;
	box-sizing:border-box;
}
.campaign li a {
	display:block;
	text-decoration:none;
}
.campaign_visual {
	background:url(/images/type1/template/ajax-loader.gif) 50% 50% no-repeat;
	background-size:16px auto;
}
.campaign_visual img {
	width:100%;
	height:auto;
	display:block;
}
@media screen and (min-width:768px) { 
    /*　画面サイズが768pxからはここを読み込む　*/
.campaign li {
	width:33.3%;
}
}

/*
	.ranking
	ランキング
	- ナビプラス管理画面に移動しました。
*/
.ranking_name {
	max-height:3em;
	margin-top:5px;
	font-size:11px;
	line-height:1.5em;
	overflow:hidden;
	position:relative;
	text-overflow:ellipsis;
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}


/*
	.coordinate
	コーディネート
*/
.coordinate {
	margin-top:50px;
}
.coordinate ul {
	margin:30px 0 0 -10px;
	font-size:0;
}
.coordinate li {
	width:33.3%;
	padding:10px 0 0 10px;
	display:inline-block;
	font-size:14px;
	vertical-align:top;
	box-sizing:border-box;
	background:url(/images/type1/template/ajax-loader.gif) 50% 50% no-repeat;
	background-size:16px auto;
}
.coordinate li a {
	display:block;
}
.coordinate li img {
	width:100%;
	height:auto;
	display:block;
}
@media screen and (min-width:768px) { 
    /*　画面サイズが768pxからはここを読み込む　*/
.coordinate li {
	width:33.3%;
}
}

/*
	.recentlyChecked
	最近チェックしたアイテム
*/
.recentlyChecked {
	margin-top:50px;
}
.recentlyChecked_window {
	margin:20px 0 0 -10px;
	font-size:0;
	text-align:center;
}
.recentlyChecked_window > div {
	width:25%;
	padding:10px 0 0 10px;
	display:inline-block;
	font-size:14px;
	vertical-align:top;
	box-sizing:border-box;
}
.recentlyChecked_window > div a {
	display:block;
}
.recentlyChecked_window > div img {
	width:100%;
	height:auto;
	display:block;
}
.recentlyChecked_none {
	margin-top:30px;
	padding-left:20px;
	font-size:12px;
	text-align:center;
}
@media screen and (min-width:768px) { 
    /*　画面サイズが768pxからはここを読み込む　*/
.recentlyChecked_window > div {
	width:20%;
}
}

/*
	.shop
	ショップ情報
*/
.shop {
	margin-top:25px;
	padding-top:25px;
}
.shop_buy {
	margin:20px 0 0 -10px;
	font-size:0;
}
.shop_buy li {
	width:33.3%;
	padding:20px 0 0 10px;
	display:inline-block;
	font-size:14px;
	vertical-align:top;
	box-sizing:border-box;
}
.shop_buy li a {
	display:block;
	text-decoration:none;
}
.shop_visual {
	background:url(/images/type1/template/ajax-loader.gif) 50% 50% no-repeat;
	background-size:16px auto;
}
.shop_visual img {
	width:100%;
	height:auto;
	display:block;
}
.shop_name {
	margin-top:5px;
	font-size:11px;
	line-height:1.4;
	text-align:left;
}
.shop_sell {
	margin:10px 0 0 -10px;
	font-size:0;
	text-align:center;
}
.shop_sell li {
	width:49.9%;
	padding:10px 0 0 10px;
	display:inline-block;
	font-size:13px;
	vertical-align:top;
	box-sizing:border-box;
}
.shop_sell li a {
	padding:10px 5px;
	display:block;
	color:#fff;
	text-decoration:none;
	background:#95b189;
}
@media screen and (min-width:768px) { 
    /*　画面サイズが768pxからはここを読み込む　*/
.shop li {
	width:25%;
}
}

/*
	.about
	企業情報
*/
.about {
	margin-top:45px;
	padding-top:30px;
	/*border-top:10px solid #f2f2f2;*/
	font-size:0;
}
.about_ttl {
}
.about_ttl img {
	width:120px;
	height:auto;
}
.about_messsage {
	/* what's ピープルツリー */
	margin-top:15px;
	display:inline-block;
	vertical-align:top;
}
.about_messsage_lines {
	margin-top:-10px;
	font-size:13px;
	line-height:2;
	letter-spacing:.03em;
}
.about_messsage_lines p {
	margin-top:15px;
}
.about_info {
	/* 右バナー */
}
.about_info_bnr {
	margin:20px 0 0 -10px;
	font-size:0;
}
.about_info_bnr li {
	width:49.9%;
	padding:10px 0 0 10px;
	display:inline-block;
	font-size:13px;
	vertical-align:top;
	box-sizing:border-box;
}
.about_info_bnr li a {
	display:block;
	text-decoration:none;
}
.about_info_bnr .about_info_visual {
	background:url(/images/type1/template/ajax-loader.gif) 50% 50% no-repeat;
	background-size:16px auto;
}
.about_info_bnr .about_info_visual img {
	width:100%;
	height:auto;
	display:block;
}
.about_info_bnr .about_info_ttl {
	margin-top:8px;
	font-size:12px;
	line-height:1.6;
}
.about_pickup {
	/* ピックアップ */
	margin:20px 0 0 0;
	padding:15px 10px;
	font-size:0;
	background:#f6f5f3;
	color:#584214;
}
.about_pickup li {
	margin:5px 0 0 20px;
	font-size:14px;
	list-style:disc;
	line-height:1.6;
}
.about_footer {
	/* 企業情報のフッター */
	margin-top:40px;
	margin-bottom:-10px;
}
.about_footer dl {
	line-height:1.6;
}
.about_footer {
	border-bottom:1px solid #dfdfdf;
}
.about_footer dt {
	padding:10px 20px 10px 10px;
	font-size:14px;
	font-weight:bold;
}
.about_footer dd {
}
.about_footer dd a {
	padding:10px 20px 10px 10px;
	line-height:1.6;
	display:block;
	background:url(/images/type1/template/icon_right-1.png) 98% 50% no-repeat;
	background-size:14px auto;
	border-top:1px solid #dfdfdf;
	font-size:13px;
	text-decoration:none;
}
@media screen and (min-width:768px) { 
    /*　画面サイズが768pxからはここを読み込む　*/
.about_info li {
	width:33.3%;
}
}



/*
	.topFooter
	サイトフッター上書き
*/
.topFooter .siteFooter_cell-1 {
	padding-top:10px;
}
.topFooter_more {
	/* カタログ請求の枠 */
	margin:30px 0 0 -10px;
	font-size:0;
	text-align:center;
}
.topFooter_more li {
	width:150px;
	margin:10px 0 0 20px;
	display:inline-block;
	font-size:12px;
	vertical-align:top;
	text-align:center;
}
.topFooter_more li a {
	padding:10px 10px;
	display:block;
	text-decoration:none;
	background:#f2f2f2;
}
.topFooter_more li a:hover {
	opacity:.6;
}
.topFooter_more li a span:after {
	width:0;
	height:0;
	margin:0 -5px 0 10px;
	content:'';
	border:3px solid transparent;
	border-left-color:#333;
	display:inline-block;
}


/*
	190619追加
	もっとみるボタン
*/
.morebtn {
	width:50%;
	margin:20px auto 0 auto;
	text-align:center
}

.morebtn a {
	display:block;
	padding:10px;
	text-decoration:none;
	border:1px solid #000;
}

















