/*--- default */
body {
	color: #111;
	line-height: 150%;
}

.hidden{
    display: none;
}

/*clearfix---------------------------------------------------*/


.cf:after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}
.cf {
	display: inline-block;
}
/* Hides from IE Mac */
* html .cf {
	height: 1%;
}
.cf {
	display: block;
}

a{
	color: #111;
	text-decoration: none;
}
a:hover {
	color: #124DC4;
	text-decoration: underline;
	opacity: 0.9;
}
a:hover img {
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}
img{max-width:100%;}

.marR60{margin-right:60px;}



.fa-facebook-f{color:#4267B2;}
.fa-twitter{color:#1DA1F2;}
.fa-youtube,fab fa-youtube-square
{color:#cd201f;}
.fa-instagram{
	background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
	background-clip: text;
	text-fill-color: transparent;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.fa-instagram:before{
	background: linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
	background-clip: text;
	text-fill-color: transparent;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
@media all and (-ms-high-contrast:none){
.fa-instagram{background: none; color:#E1306C;}
.fa-instagram:before{background: none;}
}

.modal.fade.in{top:30%;}

/* header
-----------------------------------------------*/
header .innner_box{
	background:#FFF;
	height:65px;
	letter-spacing: 0.05em;
	top:0;
	left:0;
	position: fixed;
	width:100%;
	z-index:9999;
}

header .header{
	margin:0 auto;
	width:1200px;
}

header .header h1{
	float:left;
	margin:20px 0 0 60px;
}

header .header h1 img{
	height:27px;
}

header .header .intro{
	float:left;
	font-weight:bold;
	height:65px;
	line-height:69px;
	margin:0 25px;
	text-align:center;
	width:200px;
}

header .header .search{
	float:left;
	margin:21px 0 0 0;
}

header .header .search .txtarea{
	box-shadow:none;
	float:left;
	height:17px;
	padding:2px;
	width:260px;
}

header .header .search .submit{
	background:#111;
	border:none;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	box-shadow:none;
	color:#FFF;
	cursor:pointer;
	float:left;
	font-size:0.85em;
	font-weight:bold;
	height:23px;
	letter-spacing:0.1em;
	margin-left:5px;
	padding:0;
	text-align:center;
	width:70px;
}

header .header .search .submit:hover{
	opacity:0.7;
}

header .header .member{
	float:right;
	font-size:20px;
	margin:21px 10px 0 0;
	position:relative;
}

header .header .member .fas{
	font-size:12px;
	margin:0 0 5px 2px;
}

header .header .member:hover .member_box {
	display: inline;
}

header .header .member .member_box {
	background:#EEE;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	display: none;
	font-size:0.8rem;
	left: -80px;
	top: 100%;
	margin-top: 8px;
	padding:15px;
	position: absolute;
	width:180px;
	z-index:999;
}
header .header .member .member_box:after{
	border-bottom: 10px solid #EEE;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	top: -10px;
	left : 83px;
	content: "";
	position: absolute;
}

header .header .member .member_box a{
	display:block;
	padding:7px;
}


header .header .cart{
	float:right;
	font-size:20px;
	margin:21px 20px 0 0;
}

header .header .sns{
	float:right;
	font-size:20px;
	height:65px;
	line-height:65px;
	display:flex;
}

header .header .sns li{
	margin:0 10px 0 0;
}

header .gnav{
	display:flex;
	justify-content:space-around;
	margin:65px auto 20px auto;
	width:1200px;
}

#nav-drawer {
	position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
	display:none;
}

/*アイコンのスペース*/
#nav-open {
	display: inline-block;
	width: 30px;
	height: 30px;
	vertical-align: middle;
	position:absolute;
	left:10px;
	top:20px;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
	position: absolute;
	height: 5px;
	width: 30px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background: #111;
	display: block;
	content: '';
	cursor: pointer;
}
#nav-open span:before {
	bottom: -10px;
}
#nav-open span:after {
	bottom: -20px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
	display: none;/*はじめは隠しておく*/
	position: fixed;
	z-index: 99;
	top: 0;/*全体に広がるように*/
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0;
	transition: .3s ease-in-out;
}

#nav-close span{
	position: absolute;
	width: 30px;
	height: 30px;
	display: block;
	color:#FFF;
	cursor: pointer;
	top: 15px;
	left: 310px;
}

#nav-close span::before {
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	position: absolute;
	top: 0;
	left: 0.9em;
	width: 0.5em;
	height: 2.5em;
	content: "";
	background: #FFF;
	transform: rotate(45deg);
}

#nav-close span::after {
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	position: absolute;
	top: 1.0em;
	left: 0;
	width: 2.5em;
	height: 0.5em;
	content: "";
	background: #FFF;
	transform: rotate(225deg);
}


/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;/*最前面に*/
	width: 300px;
	height: 100%;
	background: #FFF;/*背景色*/
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
	display: block;/*カバーを表示*/
	opacity: .5;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);/*中身を表示（右へスライド）*/
	box-shadow: 1px 0 7px rgba(0,0,0,.15);
}

#nav-content .shipping{
	background:#111;
	color:#FFF;
	font-size:1.1em;
	font-weight:bold;
	padding:15px 0;
	text-align:center;
	width:100%;
}

#nav-content .shipping .fa-truck{
	margin:0 7px 0 0;
}

#nav-content .nav_search{
	border-bottom:1px solid #111;
	margin:20px 10px;
}

#nav-content .nav_search .txtarea{
	border:none !important;
	box-shadow:none;
	padding:5px 0;
	width:255px;
}

#nav-content .nav_search .submit{
	background:none !important;
	border:none !important;
	box-shadow:none;
	color:#111;
	float:right;
	font-size:16px;
	padding:5px 0;
	width:20px;
}

#nav-content h2 {
	border:none;
	font-family: "游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size: 1.2em;
	font-weight: bold;
	letter-spacing:0.5em;
	margin:30px 10px 0 10px;
	padding:0;
	text-align: center;
}

#nav-content .products{
	margin:0;
}

#nav-content .products li{
	font-size:1.0em;
	height:40px;
	line-height:40px;
	margin:10px 0 0 0;
	width:100%;
}

#nav-content .products li a{
	display:block;
	padding:0 10px;
}

#nav-content .products li img{
	float:left;
	margin:0 5px 0 0;
	width:40px;
}

#nav-content .nav_sns{
	font-size:25px;
	display:flex;
	justify-content:center;
	margin-top:30px;
}

#nav-content .nav_sns li{
	margin:0 15px;
}

/* SSLページ用 */
.theme-default .header{
	border:none;
	height:65px;
	width:1200px;
}
.theme-default .header a{
	display:block;
	height:auto;
}
.theme-default .footer{
	height:auto;
}


/* navi
-----------------------------------------------*/
#navi {
	width: 220px;
}


/* footer
-----------------------------------------------*/
footer {
	width: 100%;
}

footer .footer{
	display:flex;
	justify-content:space-around;
	margin:1em auto;
	padding-right: 80px;
}

footer .footer dt{
	font-family: "游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-weight: bold;
	letter-spacing:0.2em;
}

footer .footer dd{
	margin:10px 0 0 10px;
	line-height:200%;
}

footer .footer dd div{
	float:left;
}

.copyright{
	font-size:0.9em;
	margin:25px 0;
	text-align:center;
}

.device_change a{
	font-size:50px;
	padding:30px 0;
}


/* トップページ
-----------------------------------------------*/
.index{
	width:100%;
}

.brand h2, .products h2 , .recommend h2 , .newitem h2 {
	border:none;
	font-family: "游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size: 1.7em;
	font-weight: bold;
	letter-spacing:0.2em;
	margin:20px 0 0 0;
	padding:0;
	text-align: center;
	font-feature-settings: "palt";
}

.new_item{
	margin:120px auto 100px auto;
	text-align:center;	
	width:1024px;
}

.new_item .items{
	border:none;
	padding:0;
}

.new_item ul{
	display:flex;
	flex-wrap: wrap;
	justify-content:space-between;
	margin:20px 0 30px 0;
}

.new_item ul li{
	font-size:1.0em;
	margin:20px 0 0 0;
	width:190px;
}

.new_item ul li a .thumbnail{
	width:190px;
	height:190px;
}

.new_item ul li .description,
.new_item ul li .price,
.new_item ul li .tax_label,
.new_item ul li .tag{
	display:none;
}

.new_item ul li img{
	border:1px solid #EEE;
	margin:0 0 10px 0;
	max-height:188px !important;
	max-width:188px !important;
}

.new_item .more a{
	background:#111;
	color:#FFF;
	font-size:1.2em;
	padding:10px 25px;
}

.products{
	margin:120px auto 100px auto;
	width:1024px;
}

.products ul{
	display:flex;
	flex-wrap: wrap;
	margin:20px 0 30px 12px;
	padding: 0;
}

.products ul li{
	font-size:1.1em;
	height:65px;
	line-height:65px;
	margin:10px 0;
	width:250px;
}

.products ul li img{
	float:left;
	margin:0 5px 0 0;
	width:65px;
}

.recommend{
	margin:120px auto 100px auto;
	width:1024px;
}

.recommend ul{
	display:flex;
	justify-content:space-between;
	margin:30px 0 0 0;
}

.recommend ul li{
	width:300px;
}

.brand{
	margin:0 auto;
	width:1024px;
}

.brand ul{
	display:flex;
	align-items: center;
	justify-content:center;
	margin:30px 0;
}

.brand ul li{
	margin:0 25px;
}

.brand ul.sns li{
	font-size:40px;
	margin:0 15px;
}

.catalog{
	margin:0 auto;
	width:1024px;
}

.catalog ul{
	display:flex;
	justify-content:space-between;
	margin:90px 0;
}

/*タブ切り替え全体のスタイル*/
.topics {
	margin: 0 auto 80px auto;
	width: 100%;
}
/*タブのスタイル*/
.tab_item {
	background: #FFF;
	border-left:2px solid #EEE;
	border-right:2px solid #EEE;
	border-top:2px solid #EEE;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	-moz-border-top-left-radius:10px;
	-moz-border-top-right-radius:10px;
	-webkit-border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	cursor:pointer;
	display: block;
	float: left;
	font-family: "游明朝", "Yu Mincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size:1.5em;
	font-weight: bold;
	letter-spacing:0.5em;
	line-height: 50px;
	margin-right:10px;
	text-align: center;
	transition: all 0.2s ease;
	width: 200px;
}
.tab1{margin-left:calc(50% - 512px);}
.tab2{margin-left:0;}
.tab_item:hover {
	opacity: 0.75;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
	display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
margin:0 -200%;
padding:0 200%;
background: linear-gradient(#ffffff 0%, #ff6666 100%);
text-align: center;
	background:#F9F9F9;
	clear: both;
	display: none;
	overflow: hidden;
	margin: 30px -200%;
	padding: 30px 200%;
}
.tab_content .inner{
	margin:0 auto;
	width:1024px;
}
.tab_content .inner dl{
	border-bottom:1px solid #111;
	display:flex;
	padding:0 0 10px 0;
	width:100%;
}
.tab_content .inner dl dt{
	height:20px;
	line-height:20px;
	padding-left:20px;
	width:250px;
}
.tab_content .inner dl dt img{
	float:left;
	margin-right:30px;
}
.tab_content .inner dl dd{
	width:calc(100% - 270px);
	text-align: left;
}
.tab_content .inner .more{
	margin-top:35px;
	text-align:center;
}
.tab_content .inner .more a{
	background:#111;
	color:#FFF;
	font-size:1.2em;
	padding:10px 25px;
}


/*選択されているタブのコンテンツのみを表示*/
#news:checked ~ #news_content,
#exhibition:checked ~ #exhibition_content,
#New-Items:checked ~ #New-Items_content
 {
	display: block;
}
/*選択されているタブのスタイルを変える*/
.topics input:checked + .tab_item {
	background:#F9F9F9;
	border-color:#F9F9F9;
}


.icon-kojin{
    display:inline-block;
    width: 2em;
    height: 2em;
    background-image: url("./images/kojin.png") no-repeat;
}