/*------------------------------------------------------------
 レイアウト
-------------------------------------------------------------*/
html,body {
width: 100%;
height: 100%;
}

/* Bootstrapのガター調整 */
.row-0 {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.row-0 > div {
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.row-6 {
  margin-left: -3px !important;
  margin-right: -3px !important;
}

.row-6 > div {
  padding-right: 3px !important;
  padding-left: 3px !important;
}

.row-10 {
  margin-left: -5px !important;
  margin-right: -5px !important;
}

.row-10 > div {
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.row-20 {
  margin-left: -10px !important;
  margin-right: -10px !important;
}

.row-20 > div {
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.header {
padding: 6px 20px;
display: flex;
justify-content: space-between;
align-items: center;
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
height: 60px;
background: #fff;
box-shadow: 0 1px 2px -1px rgba(0,0,0,.1);
}

.header-left {
display: flex;
align-items: center;
}

.header-right {

}


#home .header {
background: #fff;
}

#designer .header {
position: absolute;
background-color: transparent;
box-shadow: none;
}

#cont .header {
background: #192538;
}

.wrapper {
width: 100%;
height: auto !important;
height: 100%;
min-height: 100%;
position: relative;
background: #fafafa;
}

.inner {
margin: 0 auto;
max-width: 720px;
}

#category .wrapper {
background: #fff;
}

#hp .wrapper {
background: #fff;
}

#plan .wrapper {
background: #fff;
}

#cont .wrapper {
width: 100%;
height: 100%;
min-height: 100%;
position: relative;
background: #fff;
}

#signup .wrapper {
background: #e3e9ea;
}

.header-wrapper {
position: relative;
text-align: center;
color: #fff;
height: 480px;
}

.header-wrapper:before {
  z-index: 0;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url('/img/header-mockup.jpg');
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;
}

.header-wrapper:after {
  z-index: 0;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(60, 83, 111, 0.5);
}

.firstview {
padding: 4px 0;
width: 100%;
min-height: 50px;
background: #01103A;
position: relative;
}

.firstview.plan {
padding: 20px 0;
background: url(/img/header-mockup.jpg) no-repeat;
background-size: 100% auto;
text-align: center;
}

.firstview-bg {
background: url(/img/bg-pixel.png);
}

#home .firstview {
padding: 60px 0 3rem;
background: #01103A;
}

#category .firstview {
padding: 20px 0 20px;
}

#plan .firstview {
padding: 20px 0;
background: url(/img/firstview-price_1920.jpg) no-repeat;
background-size: 100% auto;
text-align: center;
}

#designer .firstview {
padding-top: 120px;
background: none;
z-index: 1;
}

#cont .firstview {
background: #fff;
}

.secondview {
padding: 1rem 0 2rem;
width: 100%;
background: #58BED5;
}

.bodycopy {
padding: 60px 0 140px;
width: 100%;
}

#signup .bodycopy {
padding: 60px 0 60px;
}

.note-section {
padding-bottom: 20px;
background: #9AD70F;
min-height: 300px;
}

.closing {
padding: 3rem 0;
width: 100%;
}

.footer {
width: 100%;
background: #192538;
min-height: 80px;
position: absolute;
bottom: 0;
}