html, body { color:515151;background: #000;line-height:14px;font-family: 'Indie Flower'; }

/* link----------------------------------------------------------- */  
a:link {text-decoration:none;color:#414141;}
a.bk:link {text-decoration:none;color:#a1a1a1;}
a.bk2:link {text-decoration:none;color:#d1d1d1;}
a.bl:link {text-decoration:none;color:#ffffff;}
a:visited {text-decoration:none;color:#414141;}
a.bk:visited {text-decoration:none;color:#a1a1a1;}
a.bk2:visited {text-decoration:none;color:#d1d1d1;}
a.bl:visited {text-decoration:none;color:#ffffff;}
a:hover {text-decoration:none;color:#a1a1a1;}
a.bk:hover {text-decoration:none;color:#e1e1e1;}
a.bk2:hover {text-decoration:none;color:#f1f1f1;}
a.bl:hover {text-decoration:none;color:#eeeeee;}
a:active {text-decoration:none;color:#c1c1c1;}
a.bk:active {text-decoration:none;color:#a1a1a1;}
a.bk2:active {text-decoration:none;color:#d1d1d1;}
a.bl:active {text-decoration:none;color:#ffffff;}

h2{text-align:center;}

/* slick-slide */
html, body {margin: 0;padding: 0;}
 * {box-sizing: border-box;}
.slider {width: 85%;margin: 0% auto;}
.slick-slide {margin: 0px 0px;}
.slick-slide img {width: 100%;}
.slick-slide {transition: all ease-in-out .3s;opacity: .2;}
.slick-active {opacity: .5;}
.slick-current {opacity: 1;}

/* pc & sp---- */
.pc { display: block !important; }
.sp { display: none !important; }
@media only screen and (max-width: 750px) {
.pc { display: none !important; }
.sp { display: block !important; }}

/* inviewfadeIn----------------------------------------------------------- */  
.inviewfadeIn {opacity: 0;transition: 1.2s;}
.fadeIn {opacity: 1.0;}

/* LINE----------------------------------------------------------- */  
table.pickupfont2 {border:none;background-color:f2f2f2;width:71%;padding:0px;text-align:left;font-family:sans-serif;font-size:10px;line-height:14px;margin-left:11px}
.pickuphr {border:none;border-top: solid 0px #aaa;width:0%;}
.pickuplogo2 {width:90%;}

/* TOP  PHOTO----------------------------------------------------------- */  
.topphoto {width:100%;}

/* MAIN----------------------------------------------------------- */  
.mainfontbig {text-align:left;font-size:27px;line-height:32px;letter-spacing:0px;font-family: 'Julius Sans One', sans-serif;}
.subtitle {text-align:left;font-family:sans-serif;font-size:11px;line-height:15px;}
.mainfontsub {color:c5b07f;text-align:left;font-family:Sorts Mill Goudy;font-size:14px;line-height:16px;}
.mainfont {text-align:left;font-family:sans-serif;font-size:12px;line-height:21px;}
.mainfonts {text-align:left;font-family:sans-serif;font-size:11px;line-height:15px;}
.adr {font-size:10px;line-height:19px;}
.topspace {line-height:70px;}

/* MAP */
.map {width:0px;height:0px;}

/* list----------------------------------------------------------- */  
.menulist {color:676767;font-family:sans-serif;font-size:11px;line-height:16px;}
.listsmall {font-size:9px;font-style: italic;}
.listtd1 {width:90%;}
.listtd2 {width:10%;text-align:right;vertical-align:top;}

/* contact */
#formWrap {width:100%;margin:0 auto;color:#555;line-height:120%;font-size:80%;}
table.formTable{;margin:0% auto;border-collapse:collapse;}
table.formTable td,table.formTable th{ font-size:10px;border:1px solid #ccc;padding:7px;}
table.formTable th{width:30%;font-weight:normal;background:#efefef;text-align:left;}

/* event */
.eventtd {width:5%;}
.eventtd2 {width:5%;}
.eventtdl {width:%;}
.eventtdimg {width:90px;padding-top:5px;}
.eventhr{border:none;border-top: solid 1px #eee;width:100%;}
.eventtitle {text-align:left;font-size:12px;line-height:22px;letter-spacing:0px;font-family:sans-serif;}
.eventfont {text-align:left;font-size:10px;line-height:16px;letter-spacing:0px;font-family:sans-serif;}
.eventday {text-align:left;font-size:13px;line-height:30px;letter-spacing:1px;font-family: sans-serif;}
.eventimg {width:80px;}

/* brand logo size----------------------------------------------------------- */  
.brand {width:100%}
.branddiv {width:90%}

/* coupon size----------------------------------------------------------- */  
.couponpic {width:90%}

/* btn link----------------------------------------------------------- */  
.link1 {background-color:#a1cfe6;width:60px; height:21px;display: inline-block; _display: inline}  
.link2 {font-family:sans-serif;font-size:10px;line-height:21px}
.link3 {background-color:#e6b8a1;width:60px; height:21px;display: inline-block; _display: inline}
.link4 {background-color:#a1e6b8;width:60px; height:21px;display: inline-block; _display: inline}

/* HR */
hr{border-top: solid 1px #eee;width:70%;}
.hrl {border:none;margin-left:0;text-align:left;height:1px;border-top: solid 1px #ccc;width:100%;}
.hrr {margin-right:0;text-align:right;}
.hrc {text-align:center;}
.hrside {border:none;margin-left:12px;text-align:left;height:1px;border-top: solid 1px #aaa;}

/* タイトル文----------------------------------------------------------- */  
.titletop {width:100%;}

/* インデックス----------------------------------------------------------- */  
.indext {width:120px;position: absolute;top:-17px;left:0;right:0;margin: auto;z-index: 98;}
.indexm {width:130px;position: absolute;top:-28px;margin:15px;z-index: 98;}
.indexinfo {width:130px;}
.menubar {width:32px;position: absolute ;top : 19px ; right: 5%;z-index: 99;}

.perfume {width:0px;position: absolute  ;top : 5px ;left: 5%;z-index: 2;}
.shop {width:0px;position: absolute  ;top : 5px ;left: 5%;z-index: 2;}
.new {width:0px;position: absolute  ;top : 5px ;left: 5%;z-index: 2;}
.coupon {width:0px;position: absolute  ;top : 5px ;left: 5%;z-index: 2;}
.about {width:0px;position: absolute  ;top : 5px ;left: 5%;z-index: 2;}
.otoiawase {width:0px;position: absolute  ;top : 5px ;left: 5%;z-index: 2;}

/* ２カラム----------------------------------------------------------- */  
.left2 {width:44%;float:left;text-align:left;margin-left:5%;}
.center2 {padding:2%;}
.right2 {width:44%;float:left;text-align:left;margin-left:2%;}
.text2 {font-family:serif;font-size:13px;line-height:20px;}

/* 3カラム----------------------------------------------------------- */  
.left3 {width:28.8%;float:left;text-align:left;margin-left:5%;}
.center2 {padding:2%;}
.right3 {width:28.8%;float:left;text-align:left;margin-left:2%;}
.text2 {font-family:serif;font-size:13px;line-height:20px;}

/* 3メインカラム----------------------------------------------------------- */  
.main3t {width:90%;float:left;text-align:center;margin-left:5%;margin-right:5%}
.main3tcenter {width:90%;float:left;text-align:center;margin-left:5%;margin-right:5%}
.main3 {width:90%;float:left;text-align:left;margin-left:5%;margin-right:5%}
.share {width:90%;float:left;text-align:center;margin-left:5%;margin-right:5%}
.main3t1{width:5%;}
.main3t2{width:90%;text-align:left;}
.main3r1{width:90%;text-align:center;}
.main3t3{width:5%;}
.main3tt1{width:5%;}
.main3tt2{width:85%;text-align:center;}
.main3tt3{width:5%;}
.main3ttt1{width:5%;}
.main3ttt2{width:90%;text-align:center;}
.main3tttt3{width:5%;}
.centerm2 {padding:2%;}
.rightm3 {width:28.8%;float:left;text-align:left;margin-left:2%;}
.textm2 {font-family:serif;font-size:13px;line-height:20px;}

/* ムービーフレーム可変----------------------------------------------------------- */  
.iframe-content {position: relative;width: 90%;padding: 56.25% 0 0 0;}
.iframe-content iframe {position: absolute;top: 0;left: 5.5%;width: 100%;height: 90%;}
.iframe-content2 {position: relative;width: 60%;padding: 56.25% 0 0 0;}
.iframe-content2 iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

/* サイドバーフォント----------------------------------------------------------- */  
.sidefont {color:d1d1d1;width:auto;text-align:left;font-family:sans-serif;font-size:16px;line-height:19px;margin:15px;font-weight: 500;}
.sidefonts {text-align:left;font-size:12px;line-height:19px;font-weight: 400;}

/* PHOTO slides----------------------------------------------------------- */  
.rslides {position: relative;list-style: none;overflow: hidden;width: 100%;padding: 0px;margin: -0%;}
.rslides li {position: absolute;display: none;width:100%;left:0%;top: 0;}
.rslides li:first-child {position: relative;display: block;float: center;}
.rslides img {display: block;height: auto;float: center;width: 100%;border: 0;}

/* PHOTO slides----------------------------------------------------------- */  
.rslidest {position: relative;list-style: none;overflow: hidden;width: 100%;padding: 0px;margin: -0%;}
.rslidest li {position: absolute;display: none;width:100%;left:0%;top: 0;}
.rslidest li:first-child {position: relative;display: block;float: center;}
.rslidest img {display: block;height: auto;float: center;width: 100%;border: 0;}

/* PHOTO slides----------------------------------------------------------- */  
.rslidesM {position: relative;list-style: none;overflow: hidden;width: 100%;padding: 0px;margin: -0%;}
.rslidesM li {position: absolute;display: none;width:100%;left:0%;top: 0;}
.rslidesM li:first-child {position: relative;display: block;float: center;}
.rslidesM img {display: block;height: auto;float: center;width: 100%;border: 0;}

/* PHOTO slides----------------------------------------------------------- */  
.rslides90 {position: relative;list-style: none;overflow: hidden;width: 90%;padding: 0;margin: 5%;}
.rslides90 li {position: absolute;display: none;width: 100%;left: 0;top: 0;}
.rslides90 li:first-child {position: relative;display: block;float: center;}
.rslides90 img {display: block;height: auto;float: center;width: 100%;border: 0;}
  
/* TOP header要素 
----------------------------------------------------------- */  
div#header{width:100%;padding:0px;background: #fff;border-bottom: 70px solid #fff;opacity: 0.9;color:#fff;position: fixed;top:0;left:0;}
* html div#header{position: absolute;top: expression(eval(document.documentElement.scrollTop+0));}
div#header h1 { width: 800px;margin: 0 auto;}

/* -----------------------------------
 * Slidebars
 * Version 0.10.3
 * http://plugins.adchsm.me/slidebars/
 * http://www.adchsm.me/
 * Released under MIT License
 * http://plugins.adchsm.me/slidebars/license.txt
 * -------------------
 * Slidebars CSS Index
 * 001 - Box Model, Html & Body
 * 002 - Site
 * 003 - Slidebars
 * 004 - Animation
 * 005 - Helper Classes
 * ----------------------------
 * 001 - Box Model, Html & Body
 */

html, body, #sb-site, .sb-site-container, .sb-slidebar {
/* Set box model to prevent any user added margins or paddings from altering the widths or heights. */
margin: 0;
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
html, body {width: 100%;overflow-x: hidden; /* Stops horizontal scrolling. */}
html {height: 100%; /* Site is as tall as device. */}
body {min-height: 100%;height: auto;position: relative; /* Required for static Slidebars to function properly. */}

/* Site scroll locking - prevent site from scrolling when a Slidebar is open, except when static Slidebars are only available. */
html.sb-scroll-lock.sb-active:not(.sb-static) {overflow: hidden;}

/* ---------- * 002 - Site */

#sb-site, .sb-site-container {
/* You may now use class .sb-site-container instead of #sb-site and use your own id. However please make sure you don't set any of the following styles any differently on your id. */
width: 100%;min-height: 100vh;position: relative;z-index: 2; /* Site sits above Slidebars */
background-color: #ffffff; /* Default background colour, overwrite this with your own css. I suggest moving your html or body background styling here. Making this transparent will allow the Slidebars beneath to be visible. */}

/* Micro clearfix by Nicolas Gallagher, ensures the site container hits the top and bottom of the screen. */
#sb-site:before, #sb-site:after, .sb-site-container:before, .sb-site-container:after {content: ' ';display: table;}
#sb-site:before, #sb-site:after, .sb-site-container:before, .sb-site-container:after {clear: both;}

/* --------------- * 003 - Slidebars 背景色 */

.sb-slidebar {
height: 100%;
overflow-y: auto; /* Enable vertical scrolling on Slidebars when needed. */
position: fixed;
top: 0;
z-index: 0; /* Slidebars sit behind sb-site. */
display: none; /* Initially hide the Slidebars. Changed from visibility to display to allow -webkit-overflow-scrolling. */
background-color: #f2f2f2; /* Default Slidebars background colour, overwrite this with your own css. */}
.sb-slidebar, .sb-slidebar * {
-webkit-transform: translateZ( 0px ); /* Fixes issues with translated and z-indexed elements on iOS 7. */}
.sb-left {left: 0; /* Set Slidebar to the left. */}
.sb-right {right: 0; /* Set Slidebar to the right. */}

html.sb-static .sb-slidebar,
.sb-slidebar.sb-static {position: absolute; /* Makes Slidebars scroll naturally with the site, and unfixes them for Android Browser < 3 and iOS < 5. */}
.sb-slidebar.sb-active {display: block; /* Makes Slidebars visibile when open. Changed from visibility to display to allow -webkit-overflow-scrolling. */}
.sb-style-overlay {z-index: 9999; /* Set z-index high to ensure it overlays any other site elements. */}
.sb-momentum-scrolling {-webkit-overflow-scrolling: touch; /* Adds native momentum scrolling for iOS & Android devices. */}

/* Slidebar widths for browsers/devices that don't support media queries. */
.sb-slidebar {width: 30%;}
.sb-width-thin {width: 15%;}
.sb-width-wide {width: 45%;}

@media (max-width: 480px) { /* Slidebar widths on extra small screens. */
.sb-slidebar {width: 85%;}
.sb-width-thin {width: 55%;}
.sb-width-wide {width: 85%;}}

@media (min-width: 481px) { /* Slidebar widths on small screens. */
.sb-slidebar {width: 55%;}
.sb-width-thin {width: 40%;}
.sb-width-wide {width: 70%;}}

@media (min-width: 768px) { /* Slidebar widths on medium screens. */
.sb-slidebar {width: 40%;}

.sb-width-thin {width: 25%;}
.sb-width-wide {width: 55%;}}

@media (min-width: 992px) { /* Slidebar widths on large screens. */
.sb-slidebar {width: 30%;}
.sb-width-thin {width: 15%;}
.sb-width-wide {width: 45%;}}

@media (min-width: 1200px) { /* Slidebar widths on extra large screens. */
.sb-slidebar {width: 20%;}
.sb-width-thin {width: 5%;}
.sb-width-wide {width: 35%;}}

/* --------------- * 004 - Animation */
.sb-slide, #sb-site, .sb-site-container, .sb-slidebar {
-webkit-transition: -webkit-transform 400ms ease;
-moz-transition:    -moz-transform 400ms ease;
-o-transition:      -o-transform 400ms ease;
transition:         transform 400ms ease;

-webkit-transition-property: -webkit-transform, left, right; /* Add left/right for Android < 4.4. */
-webkit-backface-visibility: hidden; /* Prevents flickering. This is non essential, and you may remove it if your having problems with fixed background images in Chrome. */}


/* -------------------- * 005 - Helper Classes */
.sb-hide { display: none; /* Optionally applied to control classes when Slidebars is disabled over a certain width. */}

/* -------------------- * 006 - SIDE */
html.sb-active #sb-site, .sb-toggle-left, .sb-toggle-right, .sb-open-left, .sb-open-right, .sb-close {cursor: pointer;}

/* Fixed position examples */
#sb-site.top-padding {padding-top: 50px;}
#fixed-top {position: fixed;top: 0;width: 100%;height: 50px;background-color: red;z-index: 4;}
#fixed-top span.sb-toggle-left {float: left;color: white;padding: 10px;}
#fixed-top span.sb-toggle-right {float: right;color: white;padding: 10px;}