@charset "UTF-8";
/* CSS Document */

/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */
body {
  padding:0;
  margin:0;
	overflow-x: hidden;
  color: #5a5a5a;
 font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
.pc{display:block;}
.sp{display:none;}
h1, h2, h3, h4{font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";}
h3{font-weight:100;}

main{}
.navbar{padding:10px 15px;}
nav.navbar .zpp_logo{width:100%; max-width:150px;}

#page-top{bottom:20px; position: fixed; right: 20px; font-size:20px; margin:0;}
#page-top i { background: #006fb1; text-decoration: none; color: #fff; width: 40px;
 padding: 10px 0; text-align: center; display: block; border-radius: 3px; opacity:.8;
}
#page-top i:hover {opacity:1;
}

.btn-go{background-color:#fff; color:#414141; font-size: 18px; font-weight:bold; border-radius:6px; border:none; padding:15px 10px; max-width:400px; }
.btn-go:hover, .btn-go-dark:hover{opacity:.8;}
.btn-go-dark{background-color:#414141; color:#fff; font-size: 18px; font-weight: bold; border-radius:6px; border:none; padding:15px 10px; max-width:400px;}

h2.online_ttl{background-color:#006fb0; color:#fff; text-align: center; display:block;     padding: 70px 10px 60px 10px;
    position: relative;
    margin-top: 50px;}
h2.online_ttl:before{
content:"";
background:url("../../img/online/top/vidicon.png") no-repeat;
	background-size: 100%;
width: 100px;
height: 100px;
position:absolute;
top:-25px;
left:0;
right:0;
margin:0 auto;}

h3.featurette-heading{color:#006fb0; font-size:25px; line-height:45px; text-align:center;}

section.top-section{background-color:#70afd6; position:relative; }

p.sub-p{background-color:#a99370; color:#fff; font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; font-size: 30px; z-index:2; max-width: 650px; }
span.blue{color:#006fb0;}
h1.h-ttl{color: #fff;
    font-size: 45px;
    z-index: 2;
    line-height: 85px;}
.onlineles{font-size:68px;}
.top-section-up{position: relative;}
img.logosymb{position: absolute;
    z-index: 1;
    width: 700px;
    left: 50px;
    top: -250px;
}
.z-pack{position:relative; z-index:2;}

.dark_bg{background-color:#414141; color:#fff;}
.dark_bg h2{color:#fff; font-weight:100;}




footer p{color:#646668; font-size:10px; font-weight:100; font-family:'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;}

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2 {
  font-weight: 400;
}
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.05rem;
}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 1200px){
.container {
    max-width: 1000px; }
	
}

@media (min-width: 1000px) and (max-width: 1400px){
	
img.logosymb {    position: absolute;
    z-index: 1;
    width: 500px;
    left: 50px;
    top: -180px;
	}
}

@media (max-width:768px){
	.effect_photos .photo2{position:absolute; bottom:25px; right:0;}
.pc{display:none;}
.sp{display:block;}
	
	img.logosymb {
    position: absolute;
    z-index: 1;
    top: -50px;
    width: 300px;
    left: -40px;
}
	
h1.h-ttl{color: #fff;
    font-size: 30px;
    z-index: 2;
    line-height: 55px;}
	
.onlineles{font-size:40px;}
	
p.sub-p{background-color:#a99370; color:#fff; font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; font-size: 18px; z-index:2; max-width: 650px; }
}

@media (max-width:600px){
button.basibutton{ font-size:13px; padding:3px; }
.zpp_nbone{ font-size:25px; padding:7px 0;}
.zpp_nbone span{font-size:35px;}
.mainban {position:relative;}
.mainban h1 {position:absolute; font-size:18px; right:3%; top:15%; }
.mainban h1 span{display:block; font-size:40px; }
section#allages{padding-bottom:20px;}
section.effect_list{background: url("/lp/img/pilates/effects_bg.png") top no-repeat; background-size: 100%;}
.allages{position:relative; height:auto;}
.allages div.allages_text {position:relative;}
.allages div.circle_ttl { position:relative; width:200px; height:200px; border-radius:100%; background-color:#d8b57e; }
.allages div.circle_ttl p{color:#20252b; font-size:22px; line-height:30px; position:absolute; top:50px; left:0; right:0;}
.allages div.circle_ttl span{font-size:48px;}

div.effect_block div button{text-align:left; }

.section_separate{display:block; height:150px; background:url("/lp/img/pilates/enjoy_pilates.jpg") center no-repeat;
background-attachment: scroll; background-size: 100%;}


}