@charset "utf-8";
/* CSS Document */


/*
#####################################################################

	目次【INDEX】
	
#####################################################################

■タイポグラフィ

■リンク

■ラッパー【wrapper】

■ヘッダー【header】

　＿ロゴ均等カラム【row-col】

　＿ロゴ【.logo】

　＿ボックス【header_box】

■フッター【footer】

　＿ロゴ【.logo】

　＿ボックス【footer_box】



*/

/*
#####################################################################

	ベイスリセット
	
#####################################################################
*/

.main{ background-color:transparent !important; background:transparent !important;}


/*
#####################################################################

	タイポグラフィ
	
#####################################################################
*/

html,
h1, h2, h3, h4, h5, h6,
body.shop,
body#shopTopPage .item,
body#shopTopPage .item .itemImg a .soldout_cover p,
.main #about p,
.main #about h2,
.inquirySection h1,
.inquirySection p,
body#shopDetailPage #mainContent .purchase,
body#shopDetailPage .itemPrice h2{
	font-size:14px;
	letter-spacing:0.02em;
	line-height:1.6em;
	
    color: #1a1a1a;
   	font-family:'Lato',YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

@media screen and (max-width : 479px){
	html,
	h1, h2, h3, h4, h5, h6,
	body.shop,
	body#shopTopPage .item,
	body#shopTopPage .item .itemImg a .soldout_cover p,
	.main #about p,
	.main #about h2,
	.inquirySection h1,
	.inquirySection p,
	body#shopDetailPage #mainContent .purchase,
	body#shopDetailPage .itemPrice h2{
    	font-size:12px;
	}
	
	body{
		overflow-x: hidden;
	}

}

/*
#####################################################################

	リンク
	
#####################################################################
*/

a{ 
	color: #1a1a1a;
	text-decoration:none;
}

a:hover{
	color: #1a1a1a;
	text-decoration:none;
}

/*
#####################################################################

	カラーカスタマイズ
	
#####################################################################
*/

body.color-white,
body.color-white h1,body.color-white h2,body.color-white h3,body.color-white h4,body.color-white h5,body.color-white h6,
body.color-white .main #about p,
body.color-white .blog_body,
body.color-white .item .itemDetail .itemPrice,
body.color-white #mainContent .itemDescription,
body.color-white #mainContent .attention,
body.color-white .inquirySection dl dt{
	color:#FFF !important;
}

body.color-white .pagetop .bg-black{
	background-color:#FFFFFF !important;
}

body.color-white .n_popup-menu a,
body.color-white .icon-colorWhite::before,
body.color-white .nav02,
body.color-white .nav02 a,
body.color-white select,
body.color-white footer.bg-gray,
body.color-white footer.bg-gray a{
	color:#1a1a1a !important;
}


body.color-white .flex-control-paging li a.flex-active,
body.color-white a{
	color:#FFF !important;
}

body.color-white .button,
body.color-white .control-panel .detail{
	background-color: #FFF !important;
    border: 1px solid #FFF !important;
    color: #1a1a1a !important;
}
body.color-white .button:hover,
body.color-white .control-panel .detail:hover{
	background-color: #1a1a1a !important;
    border: 1px solid #FFF !important;
    color: #FFF !important;
	filter: alpha(opacity=100) !important;
	-moz-opacity:1 !important;
	opacity:1 !important;
}

body.color-white .nav01 .searchBox input.searchBox-searchInput{
	border-bottom:1px solid #FFF !important;
}

@media screen and (max-width : 479px){
	body.color-white .Navigation li a{ color: #1a1a1a !important;}
}

/*
#####################################################################

	ラッパー【wrapper】
	
#####################################################################
*/

.block{ display:block; height:500px; width:100%; margin:1px auto 1px auto !important;}

body.shop .wrapper,
.wrapper,.main ,
body#shopDetailPage #mainContent,
#privacy,
#law,
.block{
    margin: 0 auto;
    width: 980px;
	padding:0 10px;
}

.wrapper02{
	padding:0 10px;
	width:100% !important;
}

/*2カラム指定*/
.wrapper3{ width:1240px; margin:auto; padding:0 10px;}
body.col-none .wrapper3{ width: 980px;}

body.col2 .wrapper,
body.col2 .main ,
body#shopDetailPage.col2 #mainContent,
body.col2 #privacy{ width:1240px; }

body.col2 .s_simple,
body.col2 .instagram,
body.col2 footer,
body.col2 .block{ min-width:1240px;}

body.col2 #mainContent.wrapper{ width: 980px;}

@media screen and (max-width : 479px){
	.wrapper,.main,
	body.shop .wrapper,
	body#shopDetailPage #mainContent,
	#privacy,
	#law,
	.wrapper3,
	body.col2 .block{ width:100% !important;}
	
	body.col2 .s_simple,
	body.col2 .instagram,
	body.col2 footer{ min-width:100% !important;}
	
	body#shopTopPage #mainContent{ padding:0 0 0 10px;}
	
	.Navigation-icon .wrapper{ padding:0;}
	
	body#shopDetailPage #mainContent.wrapper{ padding:0 0 0 10px;}
}

/*
#####################################################################

	ヘッダー【header】
	
#####################################################################
*/

header { min-width:980px; height: auto; margin-bottom:52px;}

@media screen and (max-width : 479px){
	
	header{
		margin-bottom:39px;
	}
	
}

/* ****************************************************
  均等カラム【row-col】
***************************************************** */

@media screen and (max-width : 479px){
	header { min-width:100%;}
	header .row-col{ 
		display: table-cell;
	}
}

/* ****************************************************
  ロゴ【.logo】
***************************************************** */

header .logo img{ height:36px; }
header .logo{ margin-top:60px; }

body.logoSize-none header .logo img{ height: auto;}

body.logoSize-s .logo img{ height: 36px;}
body.logoSize-m .logo img{ height: 56px;}
body.logoSize-l .logo img{ height: 76px;}

.logo .logoText {
	display:inline-block;
    font-size: 20px;
    font-weight: 500;
}

@media screen and (max-width : 479px){
	header .logo{ margin-top:40px; }
	
	body.logoSize-s .logo img{ height: 36px;}
	body.logoSize-m .logo img{ height: 46px;}
	body.logoSize-l .logo img{ height: 56px;}
}

/* ****************************************************
  ボックス【header_box】
***************************************************** */

#baseMenu{ z-index:9999;}

#baseMenu li{ display: block; float:right;}
#baseMenu li:first-child{ margin-left:16px;}

#baseMenu li,
#baseMenu img{ width:20px; height:20px;}

#baseMenu .cart{ margin-top:2px; }


.header_box01 #baseMenu,
.header_box02 #baseMenu { text-align:right; margin-top:5px;}
.fixed-nav .header_box01 #baseMenu,
.fixed-nav .header_box02 #baseMenu{ margin-top:0;}

header #baseMenu,
header #baseMenu{
	width:62px;
	position:absolute;
	right:0;
	top:138px;
}


.nav02 .kotei #baseMenu{
	display:none;
}


@media screen and (max-width : 479px){
	header #baseMenu{
		right:35px;
		top:3px;
	}
	
	.nav02 .kotei #baseMenu{
		display:block;
		position:absolute;
		right:45px;
		top:8px;
	}
	
}

/* ****************************************************
  ヘッダースタイル01【header-style01】
***************************************************** */

.header-style01 .header_box02{
	display:none;
}

/* ****************************************************
  ヘッダースタイル02【header-style02】
***************************************************** */

.header-style02 .Navigation{
	text-align:center;
}

.header-style02 .header_box01{
	display:none;
}
.header-style02 .logo{
	text-align:center;
}

@media screen and (min-width : 480px){
	.header-style02 .Navigation{			
		display: -webkit-box !important;/* Android4.3以前ブラウザ用 */
		display: -webkit-flex !important;/* iOS8以前Safari用 */
		display: flex !important;
		
		-webkit-justify-content: center; /* iOS8以前Safari用 */
		justify-content: center;
	}
	
	.header-style02 .n_popup-menu li{ text-align:left;}

}

/* ****************************************************
  検索【Form searchBox）】
***************************************************** */

.searchBox {
    display: inline-block;
	margin-top:-7px;
}

/*入力エリア*/

.searchBox input.searchBox-searchInput {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background:none;
    border-image: none;
	border:none;
	border-bottom:1px solid #1a1a1a;
    box-sizing: border-box;
    display: block;
    float: left;
    height: 25px;
    line-height: 1;
    padding:0;
    width: 110px;
	border-radius:0;
	font-size: inherit;
	box-shadow: none;
}

/*送信ボタン*/
.searchBox button.searchBox-searchSubmit {
    background:none;
    border: medium none;
    cursor: pointer;
    display: block;
    float: left;
    height: 25px;
    padding:3px 0 0px;
}

.searchBox button.searchBox-searchSubmit:hover{
	transition: all 0.2s ease 0s;
	filter: alpha(opacity=80); -moz-opacity:0.8; opacity:0.8;
}

/*アイコン*/
.searchBox button.searchBox-searchSubmit::before {
    content: "\f002";
    display: inline-block;
    font-family: "FontAwesome";
    font-style: normal;
    font-variant: normal;
    
    line-height: 1;
    margin: 0 0.3em 0.2em 0;
    text-transform: none;
    vertical-align: middle;
}

@media screen and (max-width : 479px){
	.searchBox {
		margin-top:10px;
	}
	.searchBox button.searchBox-searchSubmit {
		padding-top:10px;
	}
	.searchBox button.searchBox-searchSubmit::before {
		    vertical-align:top;
	}
}

/*
#####################################################################

	フッター【footer】
	
#####################################################################
*/

footer { min-width:980px; margin-top:100px; padding:100px 0 65px 0;}

@media screen and (max-width : 479px){
	footer {min-width:100%; padding:50px 0 30px 0; margin-top:40px;}
}

/* ****************************************************
  ロゴ【.logo】
***************************************************** */

footer .logo img{
	height:36px;
}

/* ****************************************************
  ボックス【footer_box】
***************************************************** */
.footer_box01{ margin-bottom:55px; text-align:left;}

.footer_box02{}

.footer_box03{ margin-top:140px;}
.footer_box03 .row-inbox{
	margin-right:30px;
}
.footer_box03 .row-box{
	width:300px;
	text-align:right;
}

/*アプリエリア*/
.footer_box03 #i18 > div{
	float:left;
}
@media screen and (max-width : 479px){
	.footer_box02{ display:none;}
	.footer_box03{ margin-top:0;}	
	.footer_box03 .row-inbox{ width:125px; margin:8px 0;}
	.footer_box03 .f_select{ width:100%;}
	.footer_box03 .row-box{
		text-align: left;
	}
}

