@charset "UTF-8";

@import url("//netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css");

/*------------------------------------------------------
reset default styles
--------------------------------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0 none;
	border-collapse: collapse;
	color: inherit;
	font-size: 13px;
	font-style: inherit;
	font-weight: inherit;
	list-style-type: none;
	margin: 0;
	outline: medium none;
	padding: 0;
	/*table-layout: fixed;*/
	text-decoration: none;
	vertical-align: baseline;
	box-sizing : border-box;
}

:focus {
	outline: 0;
}

/*------------------------------------------------------
common styles
--------------------------------------------------------*/

html, body {
	height : 100%;
	background-color : #FFF;
	color : #333;
	font-size : 16px;
	font-family: Meiryo, メイリオ, Hiragino Kaku Gothic ProN, 'ヒラギノ角ゴ ProN', 'Roboto', sans-serif;
}


.wrapper {
	/* width : 980px; */
	width : 1080px;
	margin: 0 auto;
}
.liquidWrapper {
	/* min-width: 980px; */
	width: 1080px;
	margin: 0 auto;
	padding: 0 20px;
}
.clearfix:after {
	content:" ";
	display:block;
	clear:both;
}

.strong {
	color : #B44;
}

#headerGuide a:hover,
#howToGuide a:hover,
#footer_link a:hover {
	color: #c50001 !important;
}
a:hover img {
	opacity: 0.7;
	cursor: pointer;
}

.alignc { text-align: center; }

/* ------------------------------------------------------
header
-------------------------------------------------------- */
header {
	width : 100%;
	/* overflow : hidden; */
	font-size : 12px;
}
#headerTop {
	height : 35px;
	background-color : #eee;
	line-height: 35px;
}
#headerArea {
	height   : 72px;
	position : relative;
}
#headerAreaCenter {
	float: left;
	width: 570px;
}
#headerArea #headerLogo {
	float : left;
	display: inline-block;
	width: 228px;
	height: 100%;
	margin-right: 15px;
	/* background: url('../img/logo.png') no-repeat center center; */
}
#headerArea #headerLogo a {
	display: block;
	padding:15px 0;
	box-sizing: border-box;
	height: 72px;
}
#headerArea #headerLogo:hover {
	opacity: .7;
}
#headerArea #headerInfo {
	height: 36px;
	line-height: 36px;
	overflow: hidden;
}
#headerArea #postage {
	font-weight: bold;
	float: right;
}
#headerArea #siteSentence {
	display : inline-block;
}
#headerArea p.strong {
	display : inline-block;
}
#headerArea #headerGuide {
	height: 36px;
	line-height: 36px;
}
#headerArea #headerGuide li {
	display : inline-block;
	margin-right: 20px;
}
#headerArea #headerGuide li:last-child {
	margin-right: 0;
}
#headerArea #headerGuide li a {
	display: block;
	color: #666;
}
#headerArea #headerAreaRight {
	/* float: right; */
	/* margin-left: 15px; */
	position: absolute;
	right: 0;
}
#headerArea #headerAreaRight li {
	float: left;
	width: 93px;
	height: 72px;
	text-align: center;
	border-left: 1px solid #ccc;
	box-sizing: border-box;
}
#headerArea #headerAreaRight li.header_favorite a:before {
	display: block;
	padding-bottom: 5px;
	font-family: FontAwesome;
	content: '\f005';
	color: #000;
	font-size: 30px;
}
#headerArea #headerAreaRight li.header_cart a:before {
	display: block;
	padding-bottom: 5px;
	font-family: FontAwesome;
	content: '\f07a';
	color: #c50001;
	font-size: 30px;
}
#headerArea #headerAreaRight li:last-child {
	border-right: 1px solid #ccc;
}
#headerArea #headerAreaRight li a {
	position: relative;
	display: block;
	padding: 8px 8px 9px;
	transition: background-color .3s ease;
}
#headerArea #headerAreaRight li a:hover {
	background: #eee;
}

/* ---------- Navigation ---------- */
#headerMenu {
	background-color : #000;
}
#headerMenu ul {
	/* min-width: 980px; */
	width: 1080px;
	margin: auto;
	color      : #FFF;
	text-align : center;
	font-size  : 12px;
	white-space: nowrap;
}
#headerMenu ul .nav_eng {
    margin-bottom: 4px;
    display: block;
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 2px;
}
#headerMenu ul li {
	display: inline-block;
}
#headerMenu ul li a {
	display: block;
	padding: 15px 22px;
	font-size: 12px;
	transition: background-color .3s ease;
}
#headerMenu ul li a:hover {
	color: #fff !important;
	background: #c50001;
}
#headerMenu ul h5 {
	margin-bottom: 4px;
	font-family: 'Roboto', sans-serif;
	font-size : 18px;
	font-weight: bold;
	letter-spacing : 2px;
}
#headerMenu ul li.outlet a {
	background: #00ad57;
	transition: background-color .3s ease;
}
#headerMenu ul li.outlet a:hover {
	background: #00C763;
}

/* ---------- 検索 ---------- */
#headerSearchArea {
	padding : 16px 0;
	border-bottom: 1px solid #ccc;
}
#headerSearchArea .wrapper > div {
	display : inline-block;
	border-radius : 2px;
	font-size : 14px;
}
#headerSearchArea #searchByCategory {
	float: left;
	position: relative;
	width: 187px;
	height: 36px;
	margin-right: 10px;
	padding: 0 10px;
	line-height: 36px;
	color: #fff;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.88, #1d2c67), color-stop(0.00, #293e90));
	background: -webkit-linear-gradient(top, #293e90 0%, #1d2c67 88%);
	background: -moz-linear-gradient(top, #293e90 0%, #1d2c67 88%);
	background: -o-linear-gradient(top, #293e90 0%, #1d2c67 88%);
	background: -ms-linear-gradient(top, #293e90 0%, #1d2c67 88%);
	border-radius: 3px;
	cursor: pointer;
	z-index: 6000;
}
#headerSearchArea #searchByCategory:after {
	position: absolute;
	top: 50%;
	right: 10px;
	display: block;
	margin-top: -16px;
	color: #fff;
	font-size: 12px;
	font-family: FontAwesome;
	/*content: '\f078';*/
	content: '\f054';
}
#headerSearchArea #searchByKeyword {
	position: relative;
	margin: 0 0 0 197px;
	/* min-width: 663px; */
	width: 893px;
	height: 36px;
	padding : 0;
	border : 0;
}
#headerSearchArea #searchByKeyword form {
	width: 100%;
	height: 36px;
	border-radius: 3px;
	border: 1px solid #ccc;
	overflow: hidden;
}
#headerSearchArea #searchByKeyword form:after {
	content:" ";
	display:block;
	clear:both;
}
#headerSearchArea #searchByKeyword #searchByBrand,
#headerSearchArea div.searchBtn {
	position: relative;
	float: left;
	display: inline-block;
}
#headerSearchArea #searchByBrand {
	width: 184px;
	overflow: hidden;
}
#headerSearchArea #searchByBrand select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 250px;
	height: 100%;
	padding: 8px 8px 8px 15px;
	background: #fff;
	font-size: 13px;
	font-weight: bold;
	/* line-height: 34px; */
	border-radius: 0;
	border: 0;
	cursor: pointer;
}
#headerSearchArea #searchByBrand label {
	position: relative;
	height: 100%;
	display: block;
}
#headerSearchArea #searchByBrand label:after {
	position: absolute;
	top: 50%;
	right: 10px;
	display: block;
	margin-top: -6px;
	color: #000;
	font-size: 12px;
	font-family: FontAwesome;
	content: '\f078';
}
#headerSearchArea .searchBox {
	position: relative;
	display: inline-block;
	width: auto;
	/* min-width: 54%; */
	width: calc(100% - 115px - 184px); /* 左右のボタンのサイズを引く */
	border-left: 1px solid #ccc;
}
#headerSearchArea #searchByKeyword input {
	margin: 0;
	padding: 0;
	height: 34px;
	border: 0;
}
#headerSearchArea #searchByKeyword input[type="text"]{
	width: 100%;
	box-sizing: border-box;
	padding-left: 20px;
	font-size: 13px;
	color: #777;
}
#headerSearchArea div.searchBtn {
	position: relative;
	float: right !important;
}
#headerSearchArea div.searchBtn:after {
	position: absolute;
	top: 50%;
	left: 22px;
	display: block;
	margin-top: -9px;
	color: #fff;
	font-size: 16px;
	font-family: FontAwesome;
	content: '\f002';
}
#headerSearchArea #searchByKeyword input[type="submit"]{
	width : 115px;
	color : #FFF;
	font-size: 14px;
	font-weight: bold;
	background-color : #c50001;
	cursor : pointer;
}
/*#headerSearchArea #searchByDetail {
width : 18%;
}*/

/*　fixHeader　*/
#fixHeader #headerMenu {
	min-width: 1080px;
}
#fixHeader #headerLogo {
	float : left;
	display: inline-block;
	width: 178px;
	height: 100%;
	margin-left: 100px;
	background: url('../img/logo_s.jpg') no-repeat center center;
	background-size: 76%;
}
#fixHeader #headerLogo a {
	display: block;
	height: 78px;
}
#fixHeader #headerLogo img{
	display: none;
}
#fixHeader #headerLogo:hover {
	opacity: .7;
	cursor: pointer;
}
#fixHeader #headerMenu ul {
	min-width: 852px;
	width: 852px;
}


/* ------------------------------
パンくず
------------------------------ */
.pan, .FS2_breadcrumbs {
	margin: 20px 0;
	color: #666;
	background: none;
	text-align: left;
	font-size: 13px;
}
.pan > a, .FS2_breadcrumbs > a, .breadcrumbs a {
	/* color: #e50001; */
	text-decoration: underline;
}
.pan > a:hover, .FS2_breadcrumbs > a:hover, .breadcrumbs a:hover {
	color: #c50001;
}

/*------------------------------------------------------
共通
--------------------------------------------------------*/
.pageTitle {
	margin: 30px 0 40px;
	padding-bottom: 8px;
	border-bottom: 3px solid #ccc;
	font-size: 32px;
	font-weight: bold;
	line-height: 1;
	letter-spacing: 0.01em;
}

/*------------------------------------------------------
　（ページ）ご利用ガイド、ご注文の流れ
--------------------------------------------------------*/
h2.CrossHead {
	/* padding: 20px 0; */
	margin: 20px 0;

	/* border-top: 3px solid #ccc; */
	border-bottom: 3px solid #ccc;

	font-size: 18px;
	font-weight: bold;
	letter-spacing: 0.01em;
}
p.ex {
	margin-bottom: 40px;
}

/*------------------------------------------------------
　会社概要
--------------------------------------------------------*/
table.table_detail.t_company.userTable_02 {
	width: 100%;
	margin-bottom: 80px;
	border: 0;
	border-spacing: 0;
	border-collapse: collapse;
}
table.table_detail.t_company.userTable_02 th.input_header {
	padding: 20px 6px 20px 20px;
	background: #eee;
	font-size: 14px;
	font-weight: bold;
	border: 1px solid #ccc;
	letter-spacing: 2px;
	text-align: left;
	vertical-align: middle;
}
table.table_detail.t_company.userTable_02 td.input_body {
	border: 1px solid #ccc;
	background: #fff;
	padding: 20px 6px 20px 20px;
	vertical-align: middle;
}
table.table_detail.t_company.userTable_02 td.input_body p.ex {
	margin: 0;
	font-size: 14px;
}


/*------------------------------------------------------
　よくあるご質問
--------------------------------------------------------*/
#faq {
	/* min-width: 980px; */
	width: 100%;
}
/* 質問 */
#faq .column_faq_area {
	padding: 0 20px 50px;
}
#faq .column_faq_area dl:first-child {
	float: left;
	width: 48%;
	margin-right: 2%;
}
#faq .column_faq_area dl:last-child {
	float: right;
	width: 48%;
	margin-left: 2%;
}
#faq .column_faq_area dt {
	padding: 20px 0;
	border-top: 3px solid #ccc;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 0.01em;
}
#faq .column_faq_area dd {
	padding-left: 1em;
}
#faq .column_faq_area dd ul li a {
	display: block;
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 1;
}
#faq .column_faq_area dd ul li a:before {
	display: inline-block;
	content: 'Q.';
}
#faq .column_faq_area dd ul li a:hover {
	text-decoration: underline;
	cursor: pointer;
}
/* 回答 */
#faq .detail_faq_area {
	padding: 70px 20px;
	background: #eee;
}
#faq .detail_faq_area h3.faqHead {
	margin-bottom: 50px;
	font-size: 28px;
	font-weight: bold;
	letter-spacing: 0.01em;
}
#faq .detail_faq_area h4 {
	margin: 30px 0 20px;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 0.01em;
}
#faq .detail_faq_area h4:before {
	display: inline-block;
	content: 'Q.';
	margin-right: 0.5em;
}
#faq .detail_faq_area p.faq_a {
	padding-bottom: 30px;
	font-size: 13px;
	line-height: 1.84;
	background: url(../img/faq_line.gif) repeat-x center bottom;
}
#faq .detail_faq_area p.faq_a:before {
	display: inline-block;
	content: 'A.';
	margin-right: 0.5em;
	font-size: 18px;
	font-weight: bold;
}
#faq .detail_faq_area p.faq_a a {
  text-decoration: underline;
}

/*------------------------------------------------------
カテゴリ一覧
--------------------------------------------------------*/
.category-block {
	/* min-width: 980px; */
	width: 1080px;
	margin: auto;
	/* padding: 0 20px; */
}
.category-block h2.category1 {
	padding: 20px 0;
	border-top: 3px solid #ccc;
	font-weight: bold;
	letter-spacing: 0.01em;
}
.category-block h2.category1 > a {
	font-size: 18px;
}
.category-block .sub {
	display: inline-block;
	width: 24%;
	margin-bottom: 50px;
	vertical-align: top;
}
.category-block h3.category2 {
	margin-bottom: 15px;
}
.category-block h3.category2 a {
	color: #c50001;
	font-size: 14px;
	font-weight: bold;
}
.category-block ul.category3 {
	padding-left: 1em;
}
.category-block ul.category3 li {
	margin-bottom: 10px;
}
.category-block ul.category3 li a {
	font-size: 13px;
	text-decoration: underline;
}
.category-block a:hover {
	color: #c50001;
}
.category-block h3.category2 a:hover {
	text-decoration: underline;
}

/*------------------------------------------------------
Future Recommend
--------------------------------------------------------*/
.FS2_Recommend2_recommend {
	width: 1080px;
	min-height: 290px;
	text-align: left;
}
.FS2_Recommend2_recommend h2 {
	margin-bottom: 25px;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 0.01em;
}
.FS2_Recommend2_recommend h2.purchase {
	padding-left: 30px;
	background: url(/shop/item/rokurin/design/img01/icon_link.gif) no-repeat left center;
}
.FS2_Recommend2_recommend h2.recommend {
	padding-left: 30px;
	background: url(/shop/item/rokurin/design/img01/icon_watch.gif) no-repeat left center;
}
.FS2_Recommend2_recommend h2.history:before {
	margin-right: 10px;
	font-family: FontAwesome;
	content: '\f00c';
	color: #c50001;
	font-size: 24px;

}
.FS2_Recommend2_recommend a{
	display: block;
	font-weight: bold;
	font-size: 14px;
	color: #434343;
	line-height: 1.3;
}
.FS2_Recommend2_recommend .itemPrice{
	font-weight: bold;
	font-size: 18px;
	color: #c50001;
}
.FS2_Recommend2_recommend .FS2_itemPrice_addition{
	font-weight: normal;
	font-size: 11px;
	color: #434343;
}
.FS2_Recommend2_recommend ul li {
	display: block;
	width: 216px;
	padding: 0 2px 0 12px;
	background : #fff;
	font-size:100%;
}
.FS2_Recommend2_recommend ul li:hover {
	text-decoration: underline;
}
.FS2_Recommend2_recommend ul li .item_wrapper > img {
	width: 100%;
	border: 1px solid #ccc;
}
.FS2_Recommend2_recommend img{
	margin-bottom:10px;
}




/*------------------------------------------------------
page top
--------------------------------------------------------*/
#page-top {
	background: url(../img/btn_pagetop.png) no-repeat center center;
	width: 61px;
	height: 61px;
	/* display: block; */
	display: none;
	position: fixed;
	z-index: 9999;
	bottom: 10px;
	right: 10px;
}
#page-top:hover {
	opacity: .7;
}

/*------------------------------------------------------
（フッター）ご利用ガイド
--------------------------------------------------------*/
#howToGuide {
	width  : 100%;
	padding: 60px 0;
	background-color : #e2e2e2;
	font-size : 12px;
	position: relative;
}
#howToGuide h3 {
	text-align : center;
	font-size : 32px;
	font-weight : bold;
	margin : 0 auto 50px;
}
#howToGuide > ul {
	margin-bottom: 30px;
}
#howToGuide > ul > li {
	display : inline-block;
	position: relative;
	box-sizing : border-box;
	width   : 230px;
	height: 400px;
	margin-right: 22px;
	vertical-align : top;
}
#howToGuide > ul li.calendar {
	width: 310px;
	margin-right: 0;
}
#howToGuide h5 {
	margin-bottom : 24px;
	padding-bottom: 10px;
	font-size : 15px;
	font-weight   : bold;
	border-bottom : 1px solid #434343;
}
#howToGuide p.mb20 {
	margin-bottom: 20px;
}
#howToGuide p.att {
	font-size: 11px;
}
#howToGuide p.alignr {
	text-align: right;
}
#howToGuide span.holiday {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-right: 0.5em;
	background: #c50001;
	vertical-align: middle;
}
#howToGuide > ul li.payment ol li {
	list-style: decimal;
	list-style-position: inside;
	line-height: 1.8;
}
#howToGuide > ul li.delivery img.tag {
	float: left;
	margin-right: 0.5em;
}
#howToGuide > ul li.delivery p:after {
	content:" ";
	display:block;
	clear:both;
}
div.linkWrap {
	position: absolute;
	bottom: 0;
	width: 100%;
}
#howToGuide a.guideLink {
	position: relative;
	display: block;
	width: 100%;
	height: 35px;
	margin-top: 10px;
	padding-left: 20px;
	color : #000;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 2px;
	line-height: 35px;
}
#howToGuide a.guideLink:after {
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -17px;
	font-size : 9px;
	font-family: FontAwesome;
	content: '\f054';
}
#smartseal {
	margin-top: -80px;
}
#smartseal table {
	float: right;
}
p.smartseal_att {
	color: #333;
	line-height: 1.6;
	text-align: right;
}

/*　カレンダー　*/

#footerCalendar{
	position: absolute;
    width: 100%;
    bottom: 0;
}


div#cal0 {
	float: left;
	width: 49%;
	margin-right: 1%;
}
div#cal1 {
	float: right;
	width: 49%;
	margin-left: 1%;
}
div.cal_wrapper table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 1px;
	text-align: center;
	background: #CCCCCC;
	color: #222222;
	margin: 10px 0 0;
	font-size: 13px;
	font-family: Meiryo, メイリオ, Hiragino Kaku Gothic ProN, 'ヒラギノ角ゴ ProN', 'Roboto', sans-serif;
	line-height: 1.6;
}
div.cal_wrapper table.cal tr th p {
	padding: 3px;
	color: #000;
	background: #fff;
	font-size: 13px;
	font-weight: normal;
	text-align: center;
}
div.cal_wrapper table.cal tr td {
	text-align: center;
}
div.cal_wrapper table.cal tr.headline {
	background-color: #ddd;
}
div.cal_wrapper table.cal tr td div {
	position: relative;
	padding: 0;
	text-align: center;
	background-color: #fff;
}
div.cal_wrapper table.cal tr td div span {
	display: none;
	position: absolute;
	top: 20px;
	left: 0px;
	width: 180px;
	border: solid 1px #EEE;
	background-color: #FFF;
	text-align: left;
	padding: 5px;
	z-index: 10;
	color: #000;
	font-weight: normal;
	line-height: 1.5em;
	box-shadow: 1px 1px 3px #666;
}
div.cal_wrapper table.cal tr td div.cal_holiday {
	background: #c50001;
	color: #fff;
}

div.cal_wrapper table.cal tr td div.Holyday {
	background: #c50001;
	color: #fff;
}

#footer_snsarea {
	z-index: 2;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid #434343;
}
#footer_snsarea .snsarea_newsLetter {
	background-color: #000;
	display: block;
	vertical-align: top;
	width: 230px;
	color: #FFF;
	letter-spacing: 2px;
	margin-bottom: 12px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
	box-shadow: 0 0 1px #333;
}
#footer_snsarea > .snsarea_newsLetter > a {
	padding: 6px 16px;
	display: block;
	position: relative;
	overflow: hidden;
}
#footer_snsarea > .snsarea_newsLetter > a:hover {
	color: inherit !important;
}
#footer_snsarea > .snsarea_newsLetter > a:after {
	height: 100%;
	line-height: 32px;
	padding-left: 14px;
	border-left: 1px solid #888;
	position: absolute;
	top: 50%;
	right: 12px;
	margin-top: -17px;
	font-size: 9px;
	font-family: FontAwesome;
	content: '\f054';
}
#footer_snsarea .snsarea_text { /* SHARE */
	display: inline-block;
	font-size: 16px;
	/* height: 32px; */
	padding: 6px 0;
	vertical-align: top;
	margin-right: 16px;
	font-weight: bold;
}
#footer_snsarea ul {
	display: inline-block;
	height: 36px;
}
#footer_snsarea ul > li {
	float: left;
	width: 32px;
	margin-right: 16px;
}
#footer_snsarea ul > li > a {
}
#footer_snsarea ul > li > a > img {
	width: 100%;
}
/*------------------------------------------------------
Footer
--------------------------------------------------------*/
footer {
	width: 100%;
	color: #161616;
}

#footer_link > ul {
	padding: 40px 0;
}
#footer_link ul:after{
	content:" ";
	display:block;
	clear:both;
}
#footer_link > ul > li {
	margin-bottom: 25px;
}
#footer_link > ul li ul li {
	float: left;
}
#footer_link > ul li ul li:after {
	content: '｜';
	display: inline-block;
}
#footer_link > ul li ul li:last-child:after {
	content: '';
}
#footer_link > ul li ul li a {
	padding: 0 16px;
	color: #161616;
	font-size: 13px;

}
#footer_link > ul li ul li:first-child a {
	padding-left: 0;
}
#footer_link > ul li ul li:last-child a {
	padding-right: 0;
}
#footer_link h5 {
	float: left;
	width: 155px;
	font-size: 13px;
	font-weight: bold;
}
#footer_copyright {
	width: 100%;
	padding: 30px 0;
	border-top: 1px solid #ccc;
	text-align: center;
}
#footer_copyright p {
	font-family: 'Roboto', Meiryo, メイリオ, Hiragino Kaku Gothic ProN, 'ヒラギノ角ゴ ProN', sans-serif;
	font-size: 13px;
	font-weight: bold;
}

/*------------------------------------------------------
oricoLink
--------------------------------------------------------*/
#oricoLink{
	text-align: right;
}
#oricoLink a{
	color:#c50001;
	text-decoration:underline;
}