@charset "UTF-8";
.dis_sp{
	display: none;
}
html {
  font-size: 62.5%;
}
body {
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}

#header{
	max-width: 760px;
	height: 100vh;
	background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 25%) , url("images/back_header.png") repeat left top;
}
#fv{
	max-width: 760px;
	height: 100%;
	margin: 0 auto;
	position: relative;
}




#program{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	row-gap:60px;
	position: relative;
	padding: 50px 0 100px;
}
#program .back{
	position: absolute;
	width: 86%;
	height: calc(100% - 60px);
	left: 7%;
	top: 50px;
	background-color: #ffffff;
	z-index: 0;
}

/*#program div[class^="yoyaku"] {
	width: 13%;
	position: absolute;
	z-index: 999;
}*/


.buruburu-hover:hover {
    display: inline-block;
    animation: hurueru .2s  infinite;
}

@keyframes hurueru {
    0% {transform: translate(0px, 0px) rotateZ(0deg)}
    25% {transform: translate(2px, 2px) rotateZ(1deg)}
    50% {transform: translate(0px, 2px) rotateZ(0deg)}
    75% {transform: translate(2px, 0px) rotateZ(-1deg)}
    100% {transform: translate(0px, 0px) rotateZ(0deg)}
}




/*#program div{
	width: 50%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	row-gap:40px;
	z-index: 1;
}*/


#program div{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	row-gap:40px;
	z-index: 1;
}
#program div > img{
	width: 100%;
}
	
#program div .btn{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: center;
	row-gap:20px;
}
#program div .btn.wrap{
	width: 100%;
    flex-wrap: nowrap;
    flex-direction: inherit;
    justify-content: flex-end;
    column-gap: 20px;
}
#program div .btn li{
	width: 380px;
}



#program div .btn li a:hover{
opacity: 0.5;
}


#contents{
	max-width: 760px;
	margin: 60px auto 0;
	background: url("images/back_content.png") repeat-y center top;
	background-size: 720px auto;
}

.dis_sp{
	display: inherit;
}
	.dis_pc{
		display: none;
	}
	
#container{
	background-size: 100% auto;
	padding-bottom: 45px;
}
#header{
	height: auto;
	background-size: 100% 100% , 75% auto;
}
#fv{
	width: 100%;
	height: 100%;
}
/*#fv h1{
	width: 39px;
	left: 18px;
}*/
.catch{
	width: 80%;
	height: auto;
	position: inherit;
	/*margin-left: 10%;*/
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}

/*.catch{
	max-width: 614px;
	height: calc(100vh - 250px);
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
}*/


.txt{
	width: 80%;
	position: inherit;
	margin-left: 10%;

}

/*.txt{
	max-width:760px;
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
}*/

#contents{
	width: 100%;
	margin: 30px 0 0;
	background-size: calc(100% - 20px) auto;
}
#program{
	flex-direction: column;
	row-gap:0;
	padding: 0 0 100px;
}


#program div{
	width: 100%;
}
#program div .btn{
	width: 100%;
}
#program div .btn.wrap{
    justify-content: center;
    column-gap: 10px;
}
#program div .btn li{
	width: calc((100% - 60px) / 2);
}

/*.ukiwa{
	width: calc(100% - 20px);
	bottom: 0;
}*/
	
@media screen and (max-width: 768px) {	
/*#program div[class^="leaf"] {
display: none;
}	*/
}



#footer {
  padding: 1em 1em 128px 1em;
  font-size: 1.2rem;
  line-height: 1.6;
  text-align: center;
	color: #fff;
	background-color: #1b1439;
}
#footer img {
  display: block;
  margin: 1em auto;
  width: 70%;
  max-width: 334px;
}
small {
  font-size: 80%;
}
.maru {
 background-color: #fff;
 height:80px;
 width:80px;
 border-radius:50%;
 line-height:80px;
 text-align:center;
 float: left;
 margin-right: 0.5em;
}
.maru span{
color: #66aade;
font-size: 5rem;
}
.orange {
	color: #f39700 !important;
}
/* Responsive */
@media screen and (min-width: 601px) {
  #container {
    font-size: 3rem;
  }
}

/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
  transition: 0.8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}
.scroll_up.on {
  transform: translateY(0);
  opacity: 1.0;
}

/*----------------------------
scroll_left ｜左から出現
----------------------------*/
.scroll_left {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(-30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
}
.scroll_left.on {
    opacity: 1.0;
    filter: alpha(opacity=100);
    -moz-opacity: 1.0;
    transform: translateX(0);
}

/*----------------------------
scroll_right ｜右から出現
----------------------------*/
.scroll_right {
    -webkit-transition: 0.8s ease-in-out;
    -moz-transition: 0.8s ease-in-out;
    -o-transition: 0.8s ease-in-out;
    transition: 0.8s ease-in-out;
    transform: translateX(30px);
    opacity: 0;
    filter: alpha(opacity=0);
    -moz-opacity: 0;
}
.scroll_right.on {
    opacity: 1.0;
    filter: alpha(opacity=100);
    -moz-opacity: 1.0;
    transform: translateX(0);
}

	#con{max-width: 760px ; margin: 0 auto;  background-color: #fff;}
	#program .buruburu-hover{
	position: absolute;
    width: 22%;
    height: auto;
    top: 2.6%;
    left: 24%;
}
	#program .buruburu-hover img{width: 100%; height: auto;}
	
	#program div[class^="leaf"] {
	width: 30%;
	position: absolute;
	z-index: 1;
}

	
	#program .leaf01{
	position: absolute;	
	width: 38%;	
	right: 1.2%;
    top: -1.8%;
	z-index: 1;	
}
	#program .leaf01 img{width: 100%; height: auto;}
	
	#program .leaf02{
	position: absolute;	
	width: 38%;	
	left: 1.2%;
    top: 9%;
	z-index: 1;	
}
    #program .leaf02 img{width: 100%; height: auto;}
	
    #program .leaf03{
	position: absolute;	
	width: 38%;	
	right: 1.2%;
    top: 40%;
	z-index: 1;	
}
   #program .leaf03 img{width: 100%; height: auto;}
	
    #program .leaf04{
	position: absolute;	
	width: 38%;	
	left: 1.2%;
    top: 70.5%;
	z-index: 1;	
}
	#program .leaf04 img{width: 100%; height: auto;}
	
	#program .leaf05{
	position: absolute;	
	width: 38%;	
	right: 1.2%;
    top: 92.5%;
	z-index: 1;	
}
	#program .leaf05 img{width: 100%; height: auto;}
	
	.btn_bridal{position: absolute; padding-bottom: -500px;}
	#fv h1{
	width: 10%;
	position: absolute;
	left: 5%;
	top: 0;
}
	.ukiwa{
	max-width: 740px;
	position: absolute;
	left: 0;
	top:97%;
	
		z-index: 999;
	}
	
	.ukiwa img{width: 100%; height: auto;}
	#container{
	background: url("images/back_footer.png") no-repeat center bottom;
	position: relative;
	padding-bottom: 17%;
	margin: 0 auto;
}
	.lp-bg {
  background-image: url('images/back.png');
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
}