@import url(http://fonts.googleapis.com/css?family=Josefin+Sans:300italic|Josefin+Slab:300italic);

*{margin: 0; padding: 0; border: none; }

body, pre
{
    font-family: "AXIS Pro", "AXIS Std", sans-serif;
    font-weight: lighter;
    letter-spacing: .16em;
    font-size: 13px;
    line-height: 1.88em;
background-color: #FFF; color: #333;}

.webfont
{
    font-family: 'Josefin Sans', "AXIS Pro", "AXIS Std", sans-serif;
    font-style: italic;
/*     font-family: 'Josefin Slab', "AXIS Pro", "AXIS Std", sans-serif; */
    font-weight: lighter;
    letter-spacing: .16em;
}

a
{
    color: #0092D1;
    text-decoration: none;
}
a:hover,
input[type="button"]:hover,
input[type="submit"]:hover
{
    color: #47B4DC;
    border-bottom: solid 2px #47B4DC;
}

h1, h2, h3, h4, h5, h6
{
    font-weight: lighter;
}

::-webkit-input-placeholder
{

}


table
{
    width: 100%;
    margin: 3em 0;
}
th
{
    text-align: left;
    font-weight: lighter;
    border-bottom: dotted 1px #666;
    width:34%;
}
td
{
    border-bottom: dotted 1px #666;
}

.stripe
{

    padding: 10px 10px;
    background-color:#F9F7F5  /* Opera、IE用代替スタイル指定 */  ;
    background-position: left top; background-repeat: repeat;

  -webkit-background-size: 50px 50px; 
     -moz-background-size: 50px 50px;
          background-size: 50px 50px;


  /* --Firefox用指定------------------------ */
  background-image:
    -moz-linear-gradient(
      top left -45deg,
      #F9F7F5,
      #F9F7F5 25%,
      #FFF 26%,
      #FFF 50%,
      #F9F7F5 51%,
      #F9F7F5 75%,
      #FFF 76%,
      #FFF
  );

  /* --Safari、Chrome用スタイル------------- */
  background-image:
    -webkit-gradient(
      linear, left top, right bottom,
      from(#F9F7F5),
      color-stop(0.25, #F9F7F5),
      color-stop(0.25, #FFF),
      color-stop(0.50, #FFF),
      color-stop(0.50, #F9F7F5),
      color-stop(0.75, #F9F7F5),
      color-stop(0.75, #FFF),
      to(#FFF)
  );
}
.stripe.red
{

    padding: 10px 10px;
    background-color:#E94D42  /* Opera、IE用代替スタイル指定 */  ;
    background-position: left top; background-repeat: repeat;
    background-attachment: fixed;

  -webkit-background-size: 10px 10px; 
     -moz-background-size: 10px 10px;
          background-size: 10px 10px;


  /* --Firefox用指定------------------------ */
  background-image:
    -moz-linear-gradient(
      top left -45deg,
      #E94D42,
      #E94D42 25%,
      #FFF 26%,
      #FFF 50%,
      #E94D42 51%,
      #E94D42 75%,
      #FFF 76%,
      #FFF
  );

  /* --Safari、Chrome用スタイル------------- */
  background-image:
    -webkit-gradient(
      linear, left top, right bottom,
      from(#E94D42),
      color-stop(0.25, #E94D42),
      color-stop(0.25, #FFF),
      color-stop(0.50, #FFF),
      color-stop(0.50, #E94D42),
      color-stop(0.75, #E94D42),
      color-stop(0.75, #FFF),
      to(#FFF)
  );
}

.stripe.blue
{

    background-color:#0092D1  /* Opera、IE用代替スタイル指定 */  ;
    background-position: left top; background-repeat: repeat;
/*     background-attachment: fixed; */

  -webkit-background-size: 50px 50px; 
     -moz-background-size: 50px 50px;
          background-size: 50px 50px;


  /* --Firefox用指定------------------------ */
  background-image:
    -moz-linear-gradient(
      top left -45deg,
      #0092D1,
      #0092D1 25%,
      #FFF 26%,
      #FFF 50%,
      #0092D1 51%,
      #0092D1 75%,
      #FFF 76%,
      #FFF
  );

  /* --Safari、Chrome用スタイル------------- */
  background-image:
    -webkit-gradient(
      linear, left top, right bottom,
      from(#0092D1),
      color-stop(0.25, #0092D1),
      color-stop(0.25, #FFF),
      color-stop(0.50, #FFF),
      color-stop(0.50, #0092D1),
      color-stop(0.75, #0092D1),
      color-stop(0.75, #FFF),
      to(#FFF)
  );
}
.stripe.yellow
{

    background-color:#FFF03D  /* Opera、IE用代替スタイル指定 */  ;
    background-position: left top; background-repeat: repeat;
/*     background-attachment: fixed; */

  -webkit-background-size: 50px 50px; 
     -moz-background-size: 50px 50px;
          background-size: 50px 50px;


  /* --Firefox用指定------------------------ */
  background-image:
    -moz-linear-gradient(
      top left -45deg,
      #FFF03D,
      #FFF03D 25%,
      #FFF 26%,
      #FFF 50%,
      #FFF03D 51%,
      #FFF03D 75%,
      #FFF 76%,
      #FFF
  );

  /* --Safari、Chrome用スタイル------------- */
  background-image:
    -webkit-gradient(
      linear, left top, right bottom,
      from(#FFF03D),
      color-stop(0.25, #FFF03D),
      color-stop(0.25, #FFF),
      color-stop(0.50, #FFF),
      color-stop(0.50, #FFF03D),
      color-stop(0.75, #FFF03D),
      color-stop(0.75, #FFF),
      to(#FFF)
  );
}
.loading
{
    position: relative;
    background-color:#F9F7F5  /* Opera、IE用代替スタイル指定 */  ;
    background-position: left top; background-repeat: repeat;
    background-attachment: fixed;

  -webkit-background-size: 50px 50px; 
     -moz-background-size: 50px 50px;
          background-size: 50px 50px;


  /* --Firefox用指定------------------------ */
  background-image:
    -moz-linear-gradient(
      top left -45deg,
      #F9F7F5,
      #F9F7F5 25%,
      #FFF 26%,
      #FFF 50%,
      #F9F7F5 51%,
      #F9F7F5 75%,
      #FFF 76%,
      #FFF
  );

  /* --Safari、Chrome用スタイル------------- */
  background-image:
    -webkit-gradient(
      linear, left top, right bottom,
      from(#F9F7F5),
      color-stop(0.25, #F9F7F5),
      color-stop(0.25, #FFF),
      color-stop(0.50, #FFF),
      color-stop(0.50, #F9F7F5),
      color-stop(0.75, #F9F7F5),
      color-stop(0.75, #FFF),
      to(#FFF)
  );
}
.loading:after
{
    content: 'loading...';
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -.5em;
    margin-left: -2em;
    color: #0092D1;
    font-size: 18px;
    font-family: 'Josefin Sans', "AXIS Pro", "AXIS Std", sans-serif;
    font-style: italic;
    font-weight: lighter;
    letter-spacing: .16em;
}

html
{
    overflow-y: scroll;
}

#wrapper
{
    width: 960px;
    margin: 0 auto;
    position: relative;
}

#header
{
    position: relative;
}
    #header h1
    {
        position: absolute;
        top: 30px;
        left: 58px;
        width:190px;
    }
    body.home #header h1
    {
        float :none;
        width:410px;
        height: 370px;
        overflow:hidden;
        margin: 0 auto;
        text-align: center;
        position: inherit;
        top: 0;
        left: 0;    
    }
    #header h1 a img
    {
        width:100%;
    }
    
    body.home #header .badge
    {
        display: block;
    }
    #header .badge
    {
        display: none;
        position: absolute;
        top: 20px;
        right: 130px;
        width: 60px;
        height: 60px;
        background: yellow;
        -moz-border-radius: 60px;
        -webkit-border-radius: 60px;
        border-radius: 60px;
        text-align: center;
        padding: 30px;
        font-size: 20px;
    }
    #header .badge:hover
    {
        opacity: .9;
        text-decoration: none;
    }
    #header .badge .date
    {
        line-height: 1.5em;
    }

#container
{
    overflow: hidden;
    padding: 20px;
}

    #container .wrap
    {
        background-color: #FFF;
    }
    
#nav
{
    float: left;
    width: 220px;
    padding: 20px;
    margin-top: 200px;
    margin-bottom: -1px;
    border: dashed 1px #0092D1;
}
    #nav li
    {
        display: block;
        margin-bottom: .8em;
        text-align: center;
    }
        #nav li a
        {
            display: inline;
            position: relative;
            padding-left: 20px;
            font-size: 22px;
            line-height: 1em;
        }
            #nav li a:before
            {
                content: '';
                display: block;
                position: absolute;
                bottom: 10px;
                left: 2px;
                height: 0;
                width: 0;
                border:4px solid transparent;
                border-top-color:transparent;
                border-color:transparent;
                border-bottom-color:#0092D1;
            }
            #nav li a:after
            {
                content: '';
                display: block;
                position: absolute;
                bottom: 6px;
                left: 2px;
                height: 5px;
                width: 8px;
                background-color: #0092D1;
            }
    
body.home #nav
{
    width: auto;
    float: none;
    text-align: center;
    margin-bottom: 20px;
    margin-top: 0;
    margin-left: 0;
    padding: 20px;
    overflow: hidden;
    border: none;
}

    body.home #nav ul
    {
        overflow: hidden;
        font-size: 24px;
        padding: 10px 0;
        background-color: #FFF;
    }
    body.home #nav li
    {
        display: inline-block;
        /display: inline;
        /zoom: 1;
        margin-right: 3em;
        margin-bottom: 0;
    }
    body.home #nav li:last-child
    {
        margin-right: 0;
    }

        body.home #nav li a
        {
            display: inline;
        }
            body.home #nav li a:before
            {
            }
            body.home #nav li a:after
            {
            }
    
    body.home #news
    {
        text-align: center;
        font-size:.8em;
    }
    body.home #news a:bofore
    {   
        content:"・";
    }
    
#main
{
    width: 580px;
    padding: 15px 30px;
    background-color: #FFF;
    float: right;
}
#main .title
{   
    font-size: 24px;
    margin-bottom: 1.5em;
}

    #main #news
    {
        text-align: center;
        margin-bottom: 6em;
    }
    #main #fbfeed
    {
        text-align: center;
        margin-bottom: 6em;
    }
        #main #fbfeed ul
        {
            text-align: left;
            overflow: hidden;
            margin-right: -13%;
        }
        #main #fbfeed li
        {
            width: 30%;
            margin-right: 3%;
            float: left;
            list-style: none;
            font-size: 10px;
            line-height: 1.55em;
            min-height: 200px;
        }
        #main #fbfeed .body a
        {
            display: block;
            text-align: center;
            margin-bottom: 1em;
        }
        #main #fbfeed li img
        {
            margin-bottom: 1em;
        }
    #main #about
    {
        margin: 0 auto;
        padding: 20px 0;
        padding-bottom:10px;
    }
        #main #about .title
        {
            background-color: #FFF;
            width: 11em;
            margin: 0 auto;
            text-align: center;
            font-size: 26px;
            line-height: 1.5em;
            height: 1.5em;
            margin-bottom: 1em;
        }
        #main #about .description
        {
            text-align: center;        
            font-size: .9em;
            line-height: 1.88em;
            width: 500px;
            margin: 0 auto;
            background-color: white;
            padding: 20px 30px;
        }
        #main #about .info
        {
            text-align: center;
            margin-top: 3em;
            background-color: white;
            margin: 0 auto;
            padding: 20px 30px;
            width: 500px;
        }
            #main #about .info dt
            {
                display: none;
            }
            #main #about .info dd
            {
                margin: 0;
            }
        #main #about .map
        {
            width: 560px;
            height: 400px;
            margin: 0 auto;
            font-size:10px;
        }

#sub
{
    float: left;
    width: 220px;
    padding: 20px;
    background-color: #FFF;
    border: dashed 1px #0092D1;
}
#sub .title
{   
    font-size: 24px;
    margin-bottom: .5em;
}
    #category
    {
        margin-bottom: 20px;
    }
        #category ul
        {
            overflow: hidden;
            margin-right: -8%;
        }
        #category li
        {
            float: left;
            width: 42%;
            margin-right: 8%;
            list-style: none;
            text-align: center;
        }
        #category .thumb img
        {
            width: 100%;
            display: block;
            margin: 0 auto;
        }
    #viewCart
    {
        margin-bottom: 20px;
    }
        #viewCart a
        {
            display: block;
            background: transparent url(https://img11.shop-pro.jp/PA01147/236/etc/cart.png?20111031151843) no-repeat 42px 6px;
            font-size: 14px;
            line-height: 30px;
            height: 30px;
            padding: 0px 10px;
            padding-left: 68px;
            border: 5px solid #0092D1;
        }
        #viewCart a:hover
        {
            border: 5px solid #47B4DC;
            background-color: #47B4DC;
            color: #000;
            text-decoration: none;
        }
        #viewCart a:after
        {
            content: '>';
            float: right;
            font-size: 10px;
        }
    #search
    {
        margin-bottom: 20px;
        overflow: hidden;
    }
        #search form
        {
        }
        #search form .select
        {
            width: 100%;
            margin-bottom: 1em;
            font-size: 13px;
            line-height: 2em;
            height: 2em;
        }
        #search form .text
        {
            float: left;
            font-size: 16px;
            height: 30px;
            padding: 0 10px;
            border: 5px solid #0092D1;
            width: 155px;
        }
        #search form .button
        {
            float: right;
            font-size: 16px;
            line-height: 40px;
            height: 40px;
            padding: 0;
            background-color: #0092D1;
            color: #FFF;
            text-decoration: none;
            width: 35px;
            cursor: pointer;
            font-size: 10px;
        }
        #search form .button:hover
        {
            background-color: #47B4DC;
            color: #FFF;
        }
    
    #sub #fbfeed
    {
        margin-bottom: 2em;
    }
        #sub #fbfeed ul
        {
        }
        #sub #fbfeed li
        {
            list-style: none;
            font-size: 10px;
            line-height: 1.55em;
            min-height: 200px;
        }
        #sub #fbfeed li img
        {
            display: block;
            margin-bottom: 1em;
        }
    #fblikebox
    {
        width:220px; 
/*         height:590px; */
    }
    #fblikebox iframe
    {
        border:none; 
        overflow:hidden; 
        width: 100%;
        height: 400px;
    }

#footer
{
    clear: both;
    text-align: center;
    padding-top: 7em;
}
    #footer ul
    {
        overflow: hidden;
        font-size: 11px;
        margin-right: -2em;
    }
    #footer li
    {
        display: inline-block;
        /display: inline;
        /zoom: 1;
        margin-right: 2em;
    }
    #footer .copyright
    {
        margin: 2em 0;
    }