@charset "utf-8";
/* CSS Document */
/*
 *Landing page Template | Webly Maker 1.0
 *Copyright (C) 2008-2017 infosmile Inc. All Rights Reserved.
 */
/*main css
---------------------------------------------------------------------------*/
.header-bg00{
    height: auto;
	background-repeat: repeat;
	background-position: center center;
	background-position: 50% 0%;
	background-attachment: fixed;
	background-image:url(../img/headbg_01.png);
	text-align: center;
}
.header-bg0{
background-size: cover;
background-position: center;
height: 95vw;
background-image:url(../img/headbg_01.png);
}

.header-bg00{
height: auto;
background-repeat: repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/head_01.png);
	color: #FFFFFF;
}

.header-bg01{
height: 1080px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/head_02.png);
}
.header-bg02{
height: 404px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/head_03_01.png);
}
.header-bg03{
height: 319px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/head_03_02.png);
}


.headsita{
height: 16vw;
background-size: cover;
background-position: center;
background-image:url(../img/headsita.png);
}
.headsita2{
height: 365px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/dono.png);
}

.sub01{
height: 420px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/sub01.png);
}
.sub02{
height: 420px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/sub02.png);
}
.sub03{
height: 301px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/sub03.png);
}
.sub04{
height: 330px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/sub04.png);
}
.sub{
height: 240px;
background-repeat: no-repeat;
background-position: center center;
background-position: 50% 0%;
text-align: center;
background-image:url(../img/sub00.png);
}

.movie-btn {
    visibility: visible !important;
    animation-fill-mode: both !important;
    -webkit-animation-fill-mode: both !important;
}
.btn-infinite {
    -webkit-animation-iteration-count: infinite !important;
    animation-iteration-count: infinite !important;
}
.btn-bounce {
    -webkit-animation: btn-bounce 2.0s;
            animation: btn-bounce 2.0s;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
}
@keyframes btn-bounce {
   0%  {transform: scale(1);opacity: 1;}
    20% {transform: scale(1.1);}
    35% {transform: scale(.9);}
    45% {transform: scale(1.22);}
    55% {transform: scale(.9);}
    65% {transform: scale(1.05);opacity: 1;}
    75% {transform: scale(.95);}
    85% {transform: scale(1.01);}
    100%{transform: scale(1);}
}
@-webkit-keyframes btn-bounce {
   0%  {transform: scale(1);opacity: 1;}
    20% {transform: scale(1.1);}
    35% {transform: scale(.9);}
    45% {transform: scale(1.22);}
    55% {transform: scale(.9);}
    65% {transform: scale(1.05);opacity: 1;}
    75% {transform: scale(.95);}
    85% {transform: scale(1.01);}
    100%{transform: scale(1);}
}

/*入力フォームの設定*/
.form-text{ 
width:97%;
height: 60px;
font-size:1.4em;
border:5px solid #ED1E79;
border-radius: 5px;
padding: 5px;
color: #000;
background:#FFF;
margin-bottom:5px;
}
 
 @media screen and (max-width: 768px) {
.form-text{
width:94%;	
height: 40px;
margin-bottom:0px;
}
}
.form-text2{ 
width:97%;
height: 60px;
font-size:1.4em;
border:5px solid #D8D8D8;
border-radius: 5px;
padding: 5px;
color: #000;
background:#FFF;
margin-bottom:5px;
}
 
 @media screen and (max-width: 768px) {
.form-text2{
width:94%;	
height: 40px;
margin-bottom:0px;
	border:2px solid #D8D8D8;
}
}
.btn-add{ 
margin-left: -2px;
}
 @media screen and (max-width: 768px) {
.btn-add{ 
margin-left: -10px;
}
}


.naka01 {
text-align: left;
background-image: url(../img/cta04_02.png);
background-repeat: repeat;
background-size: contain;
color: #fff;
padding: 0px 40px 30px 40px;
font-size:80%;
line-height:180%;	
}
@media screen and (max-width: 768px) {
.naka01 {
padding: 0px 10px 20px 10px;
font-size:70%;
line-height:160%;		
	
}
}

.naka02 {
text-align: left;
background-image: url(../img/naka02.png);
background-repeat: repeat;
background-size: contain;
padding: 40px 50px 10px 50px;
}
@media screen and (max-width: 768px) {
.naka02 {
padding: 10px 15px 0px 15px;
background-image: none;
}
}

.semi2 {
text-align: left;
background-image: url(../img/semi2.png);
background-repeat: repeat;
background-size: contain;
padding: 0px 65px 10px 65px;
color: #fff;
line-height:130%;

}
@media screen and (max-width: 768px) {
.semi2 {
padding: 0px 30px 0px 30px;

}
}

.bto{
	padding: 470px 0 0 0;
}

.kona{
	height: 179px;
	background-repeat: no-repeat;
	background-position: center center;
	background-position: 50% 0%;
	text-align: center;
	background-image:url(../img/kona.png);
}
.pre{
	height: 179px;
	background-repeat: no-repeat;
	background-position: center center;
	background-position: 50% 0%;
	text-align: center;
	background-image:url(../img/pre0.png);
}
.pre2{
	height: 170px;
	background-repeat: no-repeat;
	background-position: center center;
	background-position: 50% 0%;
	text-align: center;
	background-image:url(../img/pre2.png);
}
@media screen and (max-width: 768px) {
.pre2 {
	height: 70px;

}
}
.cta01{
	height: 97px;
	background-repeat: no-repeat;
	background-position: center center;
	background-position: 50% 0%;
	text-align: center;
	background-image:url(../img/cta01.png);
}



.cta02 {
height: auto;
background-repeat: repeat;
background-position: center center;
background-position: 50% 0%;
background-attachment: fixed;
background-image:url(../img/ctabg.png);
}

@media screen and (max-width: 768px) {
.cta02 {
	height: auto;
	background-image:url(../img/spctabg.png);
}
}

.cta03 {
text-align: left;
background-image: url(../img/cta03.png);
background-repeat: repeat;
background-size: contain;
padding: 20px 95px 20px 95px;
color: #fff;
line-height:130%;

}
@media screen and (max-width: 768px) {
.cta03 {
background-image: url(../img/spcta03.png);
padding: 10px 20px 10px 20px;
}
}


.cta04 {
	height: 284px;
	background-repeat: no-repeat;
	background-position: center center;
	background-position: 50% 0%;
	text-align: center;
	background-image:url(../img/cta4.png);
}

.cta-spe{
	padding: 50px 0px 0px 0px; 
}
@media screen and (max-width: 768px) {
.cta-spe{
   padding: 20px 0px 0px 0px; 
}
}


.test-form-box{
	width:98%;
	margin:auto;
	text-align:center;}
@media screen and (max-width: 768px) {
.test-form-box {
   padding: 0px 10px 0px 10px; 
}
}

.kikanue{
	padding: 75px 0px 0px 0px; 
}
@media screen and (max-width: 768px) {
.kikanue {
   padding: 30px 10px 0px 10px; 
}
}
.ansinue{
	padding: 20px 0px 0px 0px; 
}
@media screen and (max-width: 768px) {
.ansinue {
   padding: 20px 0px 30px 0px; 
}
}

.txpd {
	padding: 10px 0 5px 0;
}


.text-f {
}
@media screen and (max-width: 768px) {
.text-f {
   font-size:60%;
}
}


.headgentei{
	padding: 20px 20px 20px 20px;
	font-size: 160%;
	letter-spacing: 5px;
}
@media screen and (max-width: 768px) {
.headgentei{
	font-size: 100%;	
   padding: 10px 0px 10px 0px;
}
}

.aisatu01 {
text-align: left;
background-image: url(../img/waku_02.png);
background-repeat: repeat;
background-size: contain;
padding: 0px 50px 0px 50px;
line-height:180%;

}
@media screen and (max-width: 768px) {
.aisatu01{
   padding: 0px 20px 0px 20px; 
}
}
.pure01 {
text-align: left;
background-image: url(../img/pure_02.png);
background-repeat: repeat;
background-size: contain;
padding: 0px 00px 0px 0px;
line-height:180%;

}
@media screen and (max-width: 768px) {
.pure01{
   padding: 0px 0px 0px 0px; 
}
}
.pure-001 {
text-align: left;
background-image: url(../img/pure01_02.png);
background-repeat: repeat;
background-size: contain;
padding: 0px 100px 0px 100px;
line-height:180%;

}
@media screen and (max-width: 768px) {
.pure-001{
   padding: 0px 45px 0px 45px; 
}
}




.zyuuyou {
    margin: 0px;
    background: #ffffff;
}

.zyuuyou p {
	height:500px;
	overflow:scroll;
    padding: 0px 0px;
    margin: 0px 0px 0px 0px;
	text-align:left;
	color:#3C3C3C;
	font-size: 85%;
	line-height: 160%;
}
@media screen and (max-width: 640px) {
.zyuuyou {
    margin: 0px 0px;
    background: #ffffff;
}
.zyuuyou p {
	height:300px;
	overflow:scroll;
    padding: 0px 0px;
    margin: 0px 0px 0px 0px;
	text-align:left;
	color:#3C3C3C;
	font-size: 85%;
	line-height: 160%;
}
}