@charset "UTF-8";

/* Base */
html { font-family: "Ropa Sans", sans-serif; font-size: 16px; line-height: 1.5; }
body { background-color: rgb(240, 240, 240); color: rgb(0, 0, 0); min-width: 960px; padding-top: 10px; }
h1, h2, h3, p, ul { margin: 0; }
ul { padding-left: 0; }
ul li { list-style-type: none; }
a { color: inherit; text-decoration: none; }
img { vertical-align: middle; }
.dummy { margin: 0 auto; max-width: 32em; padding: 6em 0; }


/*
 * Sticky header
 */

/* 默認風格 */
.page-header {
    background-color: rgb(255, 255, 255);
   
    width: 100%;
    min-width: 960px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}

/* スティッキー状態のスタイル */
.page-header.sticky {
    position: fixed;
    top: 0;
}


.page-header > .inner {
    margin: auto;
    width: 100%;
}

.no-boxshadow .page-header {
    border-bottom: 1px solid rgb(204, 204, 204);
}

/* Logo */
.site-logo {
    float: left;
    margin-left: 0px;
    width:25%;
}

/* Primary nav */
.primary-nav {
    float: right;
    line-height: 65px;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.primary-nav li {
    float: left;
}
.primary-nav a {
    display: block;
    padding: 0 1.36em;
}
.primary-nav a:hover {
    background-color: rgb(240, 240, 240);
}




/* Sticky header (clone) */

.page-header-clone{
    background-color:rgb(20,200,100);
    opacity:0.9;
    position:fixed;
    top:-66px;
    width:100%;
    z-index:30;
    -webkit-box-shadow:0 1px 1px rgba(0,0,0,0.25);
            box-shadow:0 1px 1px rgba(0,0,0,0.25);
    -webkit-transition:top 0.25s;
            transition:top 0.25s;

}
.page-header-clone > .inner{
    margin:auto;
    width:960px;

}

.page-header-clone.visible{
    top:0;
}

.page-header-clone:hover{
    opacity:1;
}