@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Prata');
@import 'https://fonts.googleapis.com/css?family=Open+Sans:400,300,700';
@import 'https://fonts.googleapis.com/css?family=Montserrat:400,700';
@import 'https://fonts.googleapis.com/css?family=Cinzel+Decorative:400,700,900';
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans|Playfair+Display:400,700,900');

.floating-banner {
  position: fixed;
  z-index: 99999;
    top:10px;
  right: 40px;
}
.pc {
  width: 300px;
  height: auto;
}
.floating-banner:hover {
  opacity: .8;
}
.sp {
  display: none;
}

@media screen and (max-width: 990px) {
    .pc {
    display: none;
  }
}

@media screen and (max-width: 560px) {
    .sp {
    display: inline;
    width: 100vw;
  }
  .floating-banner  {
    top: 420px;
    right: 0;
    bottom: 0;
  }
}

/*  ==========================================
	RESET
=========================================== */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr,
acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong,
sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption,
tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header,
hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video{
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
	font-weight: normal;
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	font-family: 'Montserrat' ,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	vertical-align: baseline;
	box-sizing: border-box;
}
body{
user-select:none;
-webkit-user-select:none;
-moz-user-select:none;
-khtml-user-select:none;
-webkit-user-drag:none;
-khtml-user-drag:none;
}
body{
	
	width: 100%; max-width: 960px;
	margin-right: auto;
margin-left : auto;
}

article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section　{
	display: block;
	box-sizing: border-box;
}

html { overflow-y: scroll; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; }
input, textarea { margin: 0; padding: 0; }
ol, ul { list-style:none; }
table { border-collapse: collapse; border-spacing:0; }
caption, th { text-align: left; }
a:focus { outline:none; }

/* BASE */

img { max-width: 100%; vertical-align: bottom; height: auto; }
table { width: 100%; }

a,a:hover { -webkit-transition: 0.1s; -moz-transition: 0.1s; -o-transition: 0.1s; transition: 0.1s; }
a { text-decoration: none; color: #0000ff; }

.cf:before,.cf:after { content: " "; display: table; }
.cf:after { clear: both;visibility: hidden; height: 0; line-height: 0; } 
.cf { *zoom: 1; }


p { font-size: 0.8rem; line-height: 1.5; }


.header { position: fixed; top: 0; left: 0; width: 100%; height: 60px; line-height: 60px; z-index: 100; background: #91bce6; border-bottom: solid 1px #91bce6; }

/* DRAWER MENU */
.drawer-hamburger-icon { background: #91bce6; }
.drawer-hamburger-icon:before { background: #91bce6; }
.drawer-hamburger-icon:after { background: #91bce6; }

.drawer-nav { padding: 60px 0; z-index: 3; font-size: 0.9rem; background: rgba(145,188,230,0.9); color: #FFFFFF; }
.drawer-contents { padding-top: 20px; }
.drawer-menu { margin: 10px 0; }
.drawer-menu > li > span { display: block; width: 100%; box-sizing: border-box; padding: 10px 15px; background: #FFFFFF; color: #91bce6; font-size: 0.9rem; }

.drawerList { font-size: 0; }
.drawerList > li { display: inline-block; font-size: 1.0rem; vertical-align: top; border-bottom: solid 1px #f5f4f2; border-right: solid 1px #f5f4f2; }
.drawerList > li > a { display: block; padding: 10px 15px; font-size: 1.0rem; color: #FFFFFF; }

.drawerList > .w100per { border-right: none; }
.drawerList > .w50per:nth-child(even) { border-right: none; }


address { text-align: center; font-size: 0.8rem; color: #FFFFFF; background: #91bce6; padding: 15px; }


/* COMMON STYLE */
.bgBlack { background: #1e1e1e; color: #f5f4f2; }
.bgPink { background: #91bce6; color: #f5f4f2; }
.bgGray { background: #f5f4f2; }
.bgRed { background: #FF0004; }
.bgBlue { background: #008BFD; }
.bgNavy { background: #0009AF; }
.bgYellow { background: #FFB600; }
.bgPurple { background: #6100FF; }
.bgOrange { background: #FF5F00; }
.bgBeige { background: #FFBBBB; }
.bgSimple { background: none; }
.bgPrint { background: url('http://style-labo.com/vm/images/icon/print.jpg') no-repeat 0 0; }

.txt_center { text-align: center; }

.w20per { width: 20%; }
.w25per { width: 25%; }
.w33per { width: 33.33%; }
.w50per { width: 50%; }
.w100per { width: 100%; }

.w140px { width: 140px; }
.img120px { display: block; width: 120px; }

.p5 { padding: 5px; }
.p10 { padding: 10px; }

.m5 { margin: 5px; }
.m10 { margin: 10px; }
.m20 { margin: 20px; }

.fs06 { font-size: 0.6rem; }
.fs07 { font-size: 0.7rem; }
.fs08 { font-size: 0.8rem; }
.fs09 { font-size: 0.9rem; }
.fs10 { font-size: 1.0rem; }
.fs11 { font-size: 1.1rem; }
.fs12 { font-size: 1.2rem; }

.fc_red { color: #91bce6; }

.table { display: table; table-layout: fixed; width: 100%; }
.tRow { display: table-row; }
.cell { display: table-cell; vertical-align: top; position: relative; }


/* COMMON BOX */
.contents { overflow: hidden; background: #ffffff; border-bottom: solid 20px #f5f4f2; }
.inlineBlock { display: inline-block; vertical-align: top; }

/* HEAD LINE */
.contents > p { margin: 10px; font-size: 0.85rem; }
.contents > h1 { margin: 10px 0; padding-top: 10px; text-align: center; position: relative; z-index: 1; }
.contents > h1:before { position: absolute; border-top: solid 1px #9e9e9e; content: ""; top: 50%; left: 0; z-index: -1; width: 100%; }
.contents > h1 > span { display: inline-block; padding: 0 10px; line-height: 1.0; background: #ffffff; text-align: center; font-size: 1.2rem; font-weight: 700; color: #6e6e6e; font-family: 'Josefin Sans', sans-serif; }
.contents > h1 > span > .subTitle { display: block; line-height: 1.5; text-align: center; font-size: 0.6rem; font-weight: 700; font-family: 'Josefin Sans', sans-serif; }

.contents > h2 { margin: 10px 0; padding-top: 10px; text-align: center; position: relative; z-index: 1; }
.contents > h2:before { position: absolute; border-top: solid 1px #9e9e9e; content: ""; top: 50%; left: 0; z-index: -1; width: 100%; }
.contents > h2 > span { display: inline-block; padding: 0 10px; line-height: 1.0; background: #ffffff; text-align: center; font-size: 1.2rem; font-weight: 700; color: #6e6e6e; font-family: 'Josefin Sans', sans-serif; }
.contents > h2 > span > .subTitle { display: block; line-height: 1.5; text-align: center; font-size: 0.6rem; font-weight: 700; font-family: 'Josefin Sans', sans-serif; }

.contentTitle { position: relative; }
.contentTitle > .category { position: absolute; top: 0; left: 0; padding: 5px 10px; background: #91bce6; color: #FFFFFF; font-size: 0.8rem; }
.contentTitle > h2 { padding: 50px 20px 20px; font-size: 1.0rem; background: #FFFFFF; line-height: 1.7; font-weight: 700; }
.contentTitle > h2 > span { display: block; font-size: 0.9rem; margin-bottom: 10px; }

.contents > h3 { margin: 10px; padding: 10px 0; position: relative; z-index: 1; }
.contents > h3:before { position: absolute; border-top: solid 1px #9e9e9e; content: ""; top: 50%; left: 0; z-index: -1; width: 100%; }
.contents > h3 > span { display: inline-block; padding: 0 10px; line-height: 1.0; background: #ffffff; font-size: 0.9rem; font-family: 'Josefin Sans', sans-serif; }

/* button */
.more { width: 75%; margin: 20px auto; border:  solid 1px #91bce6; }
.more > a { display: block; padding: 10px 0; text-align: center; color: #91bce6; font-size: 0.9rem;}
.more > a:after { font-family: FontAwesome; content: "\f138"; padding-left: 10px; }

/* タブメニュー */

#tab { overflow: hidden; }

.tabMenu { width: 100%; display: table; table-layout: fixed; margin-bottom: 20px;}
.tabMenu > li { display: table-cell; text-align: center; font-size: 0.7rem; padding:10px 0; border-top: solid 1px #dedede; border-bottom: solid 1px #dedede; }
.tabMenu > li > span { display: block; font-size: 1.1rem;}
.tabMenu > .select { border-bottom: solid 1px #91bce6; border-top: solid 1px #91bce6; background:#91bce6; color: #f5f4f2; position: relative; }
.tabMenu > .select:before { display: block; width: 20px; height: 20px; position: absolute; bottom: -20px; left: calc(50% - 15px); content: ' '; background: url(../images/icon/ar_down.png) no-repeat 0 0; }

.tabContainer > .hide { display: none; }
.tabContainer > li > .tabContents:last-child { margin-bottom: 0; }
	.tabContents { margin-bottom: 20px; }
	.tabContents > .thumb { margin: 20px; }
	.tabContents > h2 { margin: 10px 20px; }

/* LIST */

.list { font-size: 0; margin: 5px; }
.list > li { display: inline-block; vertical-align: top; padding: 5px; }

.tagList { font-size: 0; margin: 20px 10px; }
.tagList > li { display: inline-block; vertical-align: top; padding: 10px; margin: 0 10px 10px 0; font-size: 0.8rem; background: #fff; border: solid 1px #91bce6; border-radius: 3px; }
.tagList > li > a { display: block; font-size: 0.7rem; color: #91bce6; font-weight: 700; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,; }
.tagList > li > a:before { font-family: FontAwesome; content: "\f02b"; padding-right: 5px; color: #91bce6; }

.textList { font-size: 0; margin: 10px; border-top: solid 1px #aeaeae; border-left: solid 1px #aeaeae; }
.textList > li { display: inline-block; padding: 0 10px; height: 44px; line-height: 44px; border-bottom: solid 1px #aeaeae; border-right: solid 1px #aeaeae; vertical-align: top; }
.textList > li > a { display: block; font-size: 0.7rem; font-weight: 700; color: #6e6e6e; }
.textList > .text > a:before { font-family: FontAwesome; content: "\f138"; padding-right: 10px; color: #91bce6; }
.textList > .color > a > span { display: inline-block; width: 20px; height: 10px; border: solid 1px #ededed; margin-right: 10px; }


.newsList { margin: 5px; }
.newsList > li { display: table; table-layout: fixed; width: 100%; padding: 10px 5px; border-bottom: solid 1px #cecece; }
.newsList > li:last-child { padding: 10px 5px 0; border-bottom: none; }
.newsList > li > .thumb { display: table-cell; width: 140px; vertical-align: top; }
.newsList > li > .thumb > img { display: block; width: 120px; }
.newsList > li > .body { display: table-cell; width: 100%; vertical-align: top; }
.newsList > li > .body > h3 { font-size: 1.0rem; font-weight: 700; margin-bottom: 10px; }
.newsList > li > .body > p { font-size: 0.8rem; margin-bottom: 5px; }
.newsList > li > .body > p > .telLink { color: #91bce6; font-weight: 700; }

.listContainer { margin-bottom: 15px; }
.listContainer > .detail { font-size: 0.7rem; }
.listContainer > .detail > .status > img { margin: 0 3px 3px 0; }
.listContainer > .detail > p { margin: 5px 0; }
.listContainer > .detail > p > .aPrice { padding: 0 5px; }

.productContainer > .thumb { margin-bottom: 10px; }
.productContainer > .body > p { color: #6e6e6e; margin-bottom: 3px;}
.productContainer > .body > .date { font-size: 0.7rem; font-weight: 700; }	
.productContainer > .body > .brand { font-size: 0.8rem; }	
.productContainer > .body > .price { font-size: 0.8rem; font-weight: 700; }	
.productContainer > .body > .price > span { font-size: 0.7rem; padding-left: 5px; }	

.productList { margin: 5px; }
.productList > li { padding: 5px 0; border-bottom: solid 1px #ededed; }
.productList > li:last-child { border-bottom: none; }
.productList > li > a { display: table; table-layout: fixed; width: 100%; }
.productList > li > a > .thumb  { display: table-cell; width: 50%; padding: 5px; vertical-align: top; }
.productList > li > a > .body  { display: table-cell; width: 50%; padding: 5px; vertical-align: top; position: relative; }
.productList > li > a > .body > .price  { position: absolute; bottom: 0; right: 10px; text-align: right; }
.productList > li > a > .body > .price > span { padding: 0 5px; font-size: 1.2rem; color: #FF0067; font-weight: 700; }


/* 検索 */

.searchBox { padding: 10px 10px 0; background: #f5f4f2; position: relative; }
.searchBox > p { margin: 20px 0; font-size: 0.8rem; font-weight: 700; }
.searchTextarea { box-sizing: border-box; width: 100%; padding: 10px; height: 44px; line-height: 44px; background: #ffffff; border: solid 1px #9e9e9e; border-radius: 3px; -webkit-appearance: none; font-size: 1.0rem; }
.searchBtn { font-family: FontAwesome; background: none; border: none; font-size: 1.4rem; color: #9e9e9e; position: absolute; top: 20px; right: 26px; -webkit-appearance: none; }

/* 詳細検索 */

.formText { margin: 10px 0; font-size: 0.8rem; }
.formText > .text { width: 100px; height: 36px; line-height: 36px; }
.formText > dd > input { width: 100%; padding: 0 10px; height: 36px; line-height: 36px; box-sizing: border-box; border-radius: 3px; border: solid 1px #9e9e9e; }
.formText > dd > input.pricePull { width: 40%; }
.formText > .pulldown > select { width: 100%; padding: 0 10px;  height: 36px; line-height: 36px; box-sizing: border-box; border-radius: 3px; border: solid 1px #9e9e9e; }
.formText > .pricePulldown > select { height: 36px; line-height: 36px; box-sizing: border-box; border-radius: 3px; border: solid 1px #9e9e9e; }
.exSearchBtn { margin: 20px 0; }
.exSearchBtn > input { width: 100%; padding: 10px; box-sizing: border-box; -webkit-appearance: none; border: solid 1px #91bce6; border-radius: 3px; background: #91bce6; color: #FFFFFF; }

#searchPanel > dt { width: 100%; padding: 10px; font-weight: 700; text-align: center; border: solid 1px #91bce6; color: #91bce6; background: #fff; border-radius: 3px; font-size: 0.8rem; }
#searchPanel > dd { background: #c5c4c2; padding: 10px; margin-top: 10px; }

/* この条件で検索するボタン */

.exSearchBtn { margin: 20px 0; }
.exSearchBtn a { display: block; text-align: center; width: 100%; padding: 10px; box-sizing: border-box; -webkit-appearance: none; border: solid 1px #91bce6; border-radius: 3px; background: #91bce6; color: #FFFFFF; }


/* 特集コーナー */

.event > p { margin: 5px 0 10px; font-size: 0.8rem; }f006
.event > p > span:before { font-family: FontAwesome; content: "\f006"; padding-right: 10px; }

.sns { padding: 10px; background: #91bce6; color: #FFF; }
.sns > h2 { text-align: center; margin-bottom: 10px; font-size: 1.4rem;}
.sns > p { text-align: center; margin-bottom: 10px; font-size: 0.8rem; color: #FFFFFF; }
.sns > ul { width: 100%; display: table; table-layout: fixed; }
.sns > ul > li { display: table-cell; vertical-align: top; padding: 10px 0; text-align: center; }
.sns > ul > li > a { display: block; color: #FFFFFF; font-size: 1.6rem; }

/* footer */

.footer { background: #91bce6; color: #FFFFFF; text-align: center; }

.footerList > li { border-bottom: solid 1px #ededed; border-right: solid 1px #ededed; }
.footerList > li > a { padding: 10px 0; display: block; color: #f5f4f2; }
.footerList > li > a > span { display: block; font-size: 0.6rem; margin-top: 5px; }
.footerList > li > a > i { font-size: 1.8rem; }

.footerText > li { display: inline-block; font-size: 0.7rem; }
.footerText > li > a { color: #f5f4f2; }

.footerContents { margin: 10px 0; }
.footerContents > p { font-size: 0.7rem; }
.footerContents > p > .tel { font-size: 1.2rem; color: #FFFFFF; }
.footerContents > ul > li { display: inline-block; font-size: 0.7rem; margin-right: 5px; color: #FFFFFF; }
.footerContents > ul > li > a { color: #f5f4f2; font-weight: 700; }


/* スライダー */
.contentSlider { margin-bottom: 50px; }
.specialContents { margin: 10px; }

.slideContainer > .description { position: relative; }
.slideContainer > .description > .category { display: inline-block; padding: 5px 10px; font-size: 0.8rem; background: #91bce6; color: #f5f4f2; }
.slideContainer > .description > h2 { padding: 20px; }
.slideContainer > .description > h2 > span { display: block; font-size: 0.8rem; font-weight: 700; }

/* パンくずリスト */

ul#topicPath { padding: 10px; background: #f5f4f2; }
ul#topicPath { font-size: 0; }
ul#topicPath li { display: inline-block; font-size: 0.8rem; padding-right: 10px; }
ul#topicPath li:before { content: none; }
ul#topicPath li a { font-size: 0.8rem; }
ul#topicPath li a:after { font-family: FontAwesome; content: "\f105"; padding-left: 10px; color: #91bce6; }

.newsMainInfo { padding: 10px; background: #f5f4f2; font-size: 0.8rem; }

/* 常時表示フッター */

#fadeMenu > #footerCart { position: fixed; bottom: 20px; left: 20px; z-index: 2; width: 44px; height: 44px; line-height: 44px; border: solid 1px #fff; background: #91bce6; text-align: center; border-radius: 44px;  }
#fadeMenu > #footerCart > a { font-size: 26px; color: #fff;  }
#fadeMenu > #topBtn { position: fixed; bottom: 40px; right: 20px; z-index: 2; background: none; }
#fadeMenu > #topBtn > a { font-size: 33px; }




.fixedTel {
	display:table;
	background:rgba(0,0,0,0.6);
	width:100%;
	display:table;
	position:fixed;
	z-index:100;
	bottom:0;
	left:0;
	padding:3px 0;
	vertical-align:middle;
}
.fixedTel_inner {
	display:table-cell;
	padding:0 5px;
	vertical-align:middle;
	overflow:hidden;
}
.fixedTel a {
	display:block;
	width:100%;
	padding-top:5px;
	text-decoration:none;
}
.fixedTel .tel {
	float:left;
	width:75%;
}
.fixedTel .tel p {
	background:#CD0000;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #F20000), color-stop(1, #AA0000));
	background: -moz-linear-gradient(top, #F20000 0%, #AA0000 100%);
	border:1px solid #AA0101;
	-webkit-border-radius:5px;
	border-radius:5px;
	margin-right:5px;
	text-align:center;
}
.fixedTel p img {
	height:30px;
}
.fixedTel .form {
	float:left;
	width:25%;
}
.fixedTel .form p {
	background:#fff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.70, #ffffff), color-stop(1, #e5e5e5));
	background: -moz-linear-gradient(top, #FFFFFF 70%, #e5e5e5 100%);
	border-radius:5px;
	text-align:center;
}

.fixedTel .line,
.fixedTel .kakao {
	display:table-cell;
width:42%;
	vertical-align:middle;
}
.fixedTel .line p {
	background:#00c300;
	border-radius:5px;
	text-align:center;
	margin-right:5px;
}
.fixedTel .kakao p {
	background:#3c1e1e;
	border-radius:5px;
	text-align:center;
	margin-right:5px;
}
.fixedTel .line img {

}
.fixedTel .line a {
}

.table th, .table td {
    padding: 8px;
    line-height: 20px;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #dddddd;
}

.topics_list .kanren {
    padding-top: 20px;
    margin-top: 0px;
}

#topics_list img {
    float: left;
    width: 100px;
	padding: 8px;
}