@charset "utf-8";
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* CSS Document */
body {
    font-size: 16px;
	color: #000000;
    font-family: 'Noto Sans JP', sans-serif;
	background: #ffffff;
	font-weight: 400;
	margin: 0;
	padding: 0;
}

a,
a:visited,
a:hover,
a:active {
  color: inherit;
  text-decoration: none;
}
h1{
	margin-top: 20px;
	font-family: "A1 Mincho", serif;
	font-size: 35px;
    line-height: 1.63;
	letter-spacing: 0.05em;
}

h2{
	margin-top: 60px;
	text-align: center;
	font-family: "A1 Mincho", serif;
	font-size: 28px;
    line-height: 1.63;
	letter-spacing: 0.05em;	
    position: relative;
	padding: 0.5rem;
	
}

h2:before {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 60px;
  height: 5px;
  content: '';
  border-radius: 3px;
  background: #fa9fbc;
}

h3{
	margin: 40px 0 20px;
	font-family: "A1 Mincho", serif;
	font-size: 28px;
    line-height: 1.63;
	letter-spacing: 0.05em;	
    position: relative;
}
/*-------------------
コンテンツのフェードイン
-------------------*/
.fadein {
	opacity : 0.1;
	transform : translate(0, 100px);
	transition : all 500ms;
}

.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}
/*-------------------------------

header

-------------------------------*/
.sp{
    display: none;
}

.pc{
    display: block;
}
header{
  display: flex;
  align-items: center;
  z-index:11;
  position: absolute;
  width: 100%;
}

header .logo{
  padding: 10px 5vw;
  display: inline-block;
}

.logo img{
	height: 80px;
}

header nav{
	  margin: 0 auto;
}

nav ul{
display: table;
margin: 0 auto;
padding: 0  5vw;
width: 100%;
text-align: center;
}

nav li{
display: table-cell;
min-width: 30px;
	padding: 0 30px;
  list-style-type: none;
}
nav a{
display: block;
width: 100%;
text-decoration: none;
color: #555;
padding-bottom: 5px;
}
nav li.current{
border-bottom: 3px solid #fa9fbc;
}
nav li:hover{
border-bottom: 3px solid #F0E475;
}
header .btn{
	margin-right: 5vw;	
  color: #fff;
  background: #fa9fbc;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}
header .btn2{
	margin-right: 5vw;	
  color: #fff;
  background: #63bce5;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}
/*-------------------------------

FV

-------------------------------*/
.fv{
	display: flex;
}
.main_imgBox {
	width:50%;
    height: 680px;
    overflow: hidden;
    position: relative; 
}
.main_imgBox img{
	width: 100%;
}
.main_imgM {
    opacity: 0;
    width:100%;
    height:100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 18s 0s infinite;
    animation: anime 18s 0s infinite; }
    .main_imgM:nth-of-type(2) {
      -webkit-animation-delay: 6s;
      animation-delay: 6s; }

    .main_imgM:nth-of-type(3) {
      -webkit-animation-delay: 12s;
      animation-delay: 12s; }
@keyframes anime {
    0% {
        opacity: 0;
    }
    22% {
        opacity: 1;
    }
    44% {
        opacity: 1;
    }
    66% {
        opacity: 0;
         transform: scale(1.2);
                    z-index:9;
    }
    100% { opacity: 0 }
}
@-webkit-keyframes anime {
    0% {
        opacity: 0;
    }
    22% {
        opacity: 1;
    }
    44% {
        opacity: 1;
    }
    66% {
        opacity: 0;
         -webkit-transform: scale(1.2);
            z-index:9;
    }
    100% { opacity: 0 }
}
/*-------------------------------

大人

-------------------------------*/
.main_imgL {
    height:100%;
    left: 0;
    top: 0;
}
.main_txtBox{
	margin: 140px 0px 0px 80px;
}
.main_txtBox img{
	width: 400px;
}


/*-------------------------------

features

-------------------------------*/
#features .inner{
	display: flex;
	justify-content: center;
	margin: 0 auto;
	padding: 50px 0 0;
	flex-wrap: wrap;	
	margin-bottom: 100px;
	max-width: 1150px;
	width: 100%;	
}

#features .inner .box{
  max-width: 360px;
  width: 30vw;
  margin-right: 35px;
  float: left;
  margin-bottom: 4vw;
}

#features .inner .box img{
	max-width: 360px;
  width: 30vw;
}

#features .inner .box:nth-child(3){
	margin-right: 0;
}

#features .inner  .box p{
	text-align: center;
	padding: 20px 0;
	margin: 0;
	font-family: "A1 Mincho", serif;
	font-size: 18px;
	line-height: 1.5em;
}
#features .inner  .box p .under{
    background: linear-gradient(transparent 50%, #fa9fbc 50%);
}
#features .inner  .box p .under2{
    background: linear-gradient(transparent 50%, #63bce5 50%);
}

#features2 {
	width: 100%;
}

#features2 .bg {
  background-image: url("../images/featuresbg.jpg"); 
  background-size: cover;
  background-repeat: no-repeat;
}

#features2 .bg2 {
  background-image: url("../images/featuresbg2.jpg"); 
  background-size: cover;
  background-repeat: no-repeat;
}

#features2 .text {
	position: relative;
	max-width: 1200px;
margin: 0 auto;
	padding: 100px 5vw;
	line-height: 2em;
}

#features2 p{
   padding-left: 0.5em;
}

/*-------------------------------

schedule

-------------------------------*/
#schedule h2{
	margin-top: 100px;
	margin-bottom: 100px;
}
#schedule .inner{
	display: flex;
	margin: 0 auto;
}

#schedule .inner .photo_box img{
	width: 50vw;
}
#schedule .inner .text_box {
	width: 50vw;
}

#schedule .table_schedule{
	margin: 0px 5vw 10px;
	width: 80%;
}
#schedule h3{
	font-size: 20px;
	margin-left: 5vw;
	margin-top: 0px;
	margin-bottom: 0px;
}
#schedule .table_schedule th,td{
vertical-align: middle; 
}
#schedule .table_schedule td{
  text-align: center;
  border: 2px solid #fa9fbc; 
  padding: 15px 0px;
}
#schedule .table_schedule th{
  padding:15px 0px;
  color: #ffffff;
  font-weight: normal;
  background: #fa9fbc;
  border: 2px solid #fa9fbc; 
}

#schedule .table_schedule th:nth-child(1) {
  border-right: 2px solid #ffffff; 
}
#schedule .table_schedule th:nth-child(2) {
  border-right: 2px solid #ffffff; 
}
#schedule .table_schedule th:nth-child(3) {
  border-right: 2px solid #ffffff; 
}

#schedule .table_schedule td:nth-child(even) {
  background: #f5c3c8;
}

#schedule .table_schedule td:nth-child(2) {
  line-height: 1.5em;
}
#schedule .table_schedule td:nth-child(3) {
  line-height: 1.5em;
}

.haba{
	width: 100px;
}


/*-------------------------------

大人

-------------------------------*/
#schedule .table_schedule2{
	margin: 0px 5vw 10px;
	width: 80%;
}

#schedule .table_schedule2 th,td{
vertical-align: middle; 
}
#schedule .table_schedule2 td{
  text-align: center;
  border: 2px solid #63bce5;
  padding: 15px 0px;
}
#schedule .table_schedule2 th {
  padding:15px 0px;
  color: #ffffff;
  font-weight: normal;
  background: #63bce5;
  border: 2px solid #63bce5; 
}

#schedule .table_schedule2 th:nth-child(1) {
  border-right: 2px solid #ffffff; 
}
#schedule .table_schedule2 th:nth-child(2) {
  border-right: 2px solid #ffffff; 
}
#schedule .table_schedule2 th:nth-child(3) {
  border-right: 2px solid #ffffff; 
}

#schedule .table_schedule2 td:nth-child(even) {
  background: #a4d6e5;
}

#schedule .table_schedule2 td:nth-child(2) {
  line-height: 1.5em;
}
#schedule .table_schedule2 td:nth-child(3) {
  line-height: 1.5em;
}

#schedule .table_price{
	margin: 0px 5vw;
	width: 80%;
}

#schedule .table_price th,#schedule .table_price td{
vertical-align: middle; 
  text-align: center;
  padding:15px 0px;
  border: 2px solid #fa9fbc; 
}

#schedule .table_price th{
  background: #fa9fbc;
  color: #ffffff;
}

#schedule .table_price th.border{
  border-bottom:  2px solid #ffffff; 
}

.bg_pink{
	background: #f5c3c8;
}
#schedule .text_box p{
	margin-left: 5vw;
	margin-top: 10px;
}
/*-------------------------------

大人

-------------------------------*/

#schedule .table_price2{
	margin: 0px 5vw;
	width: 80%;
}

#schedule .table_price2 th,#schedule .table_price2 td{
vertical-align: middle; 
  text-align: center;
  padding:15px 0px;
  border: 2px solid #63bce5; 
}

#schedule .table_price2 th{
  background: #63bce5;
  color: #ffffff;
}

#schedule .table_price2 th.border{
  border-bottom:  2px solid #ffffff; 
}

#schedule .table_price2 th.border{
  border-bottom:  2px solid #ffffff; 
}

.bg_blue{
	background: #a4d6e5;
}
/*-------------------------------

experience

-------------------------------*/
#experience .inner{
	width: 100%;
	max-width: 1150px;
	margin: 0 auto;
	padding-top: 100px;
	padding-bottom: 100px;
}
#experience .inner .photo_box{
	width: 100%;
	max-width: 1150px;
	position: absolute;
}
#experience .inner .photo_box img{
	width: 100%;
	margin: 0 auto;
}
#experience .inner .text_box{
	width: 50%;
	max-width: 520px;
	padding: 20px 30px 20px 200px;
	position: relative;
}
#experience .inner .text_box h3{
	font-size: 24px;
	line-height: 2em;
	margin-top: 100px;
}

#experience .inner .text_box h3 .bg_yellow{
	font-size: 20px;
	padding: 10px;
	letter-spacing: 0.5em;
	color: #ffffff;
	background: #faaf3b;
}

#experience .inner .text_box p{
	margin-top: 20px;
	line-height: 1.5em;
}
#experience .inner .check_box {
    display: flex;
	margin-top: 10px;
}

#experience .inner .check_box img {
    width: 6%;
	height: 3%;
	margin-top: 5px
}
#experience .inner .check_box p{
	margin-top: 10px;
}
#btn .inner{
position: relative;
text-align: center;
margin-top: 20px;
}

#btn .inner a{
  color: #ffffff;
  background: #fa9fbc;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}

#btn .inner2{
position: relative;
text-align: center;
margin-top: 50px;
}

#btn .inner2 a{
  color: #ffffff;
  background: #63bce5;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}

#btn2 .inner{
position: relative;
text-align: center;
margin-top: 20px;
}

#btn2 .inner a{
  color: #ffffff;
  background: #63bce5;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}

#btn2 .inner2{
position: relative;
text-align: center;
margin-top: 20px;
}

#btn2 .inner2 a{
  color: #ffffff;
  background: #fa9fbc;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}

/*-------------------------------

message

-------------------------------*/
#message {
	margin-top: 60px;
	width: 100vw;
	height: 50vw;
}
#message .bg{
	position: absolute;

}
#message .bg img{
	width: 100%;
}

#message .text {
	position: relative;
    margin: 0 auto;
	max-width: 1150px;
	padding-top: 30px;
	line-height: 2em;
}

#message h3{
	margin: 60px 0 30px;
	text-align: center;
}
#message p{
   padding-left: 17vw;
}
.photo{
	text-align: center;
	margin-top: 30px;
	margin-bottom: 40px;
}
.photo a{
	position: relative;
margin: 2em auto;
 padding: 1em 2em;
 width: 90%;
 background-color: #000; /* 背景色 */
color:#fff;
	border-radius: 5px;
}
/*-------------------------------

profile

-------------------------------*/
#profile{
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
}
#profile h2{
	margin-bottom: 100px;	
}

#profile .inner{
	display: flex;
	margin: 0 10vw;
}

#profile .text_box {
	margin: 0 0 0 50px;
	line-height: 2em;
}

.name{
	font-size: 20px;
}
/*-------------------------------

access

-------------------------------*/
#access{
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
}
#access h2{
	margin-top: 50px;
	margin-bottom: 100px;	
}

#access .inner{
	display: flex;
	margin: 0 5vw;
}
#access .text_box {
	margin: 0 10px
}
#access .text_box img{
	width: 300px;
}
#access .text_box p{
	line-height: 2.5em;
}
.pink{
	background: #fa9fbc;
	color: #ffffff;
	padding: 5px 10px;
}
.blue{
	background: #63bce5;
	color: #ffffff;
	padding: 5px 10px;
}
#access .text_box iframe{
	margin-top: 20px;
    width:500px;
	height:360px; 
}
#access .photo_box {
	margin: 0 10px;
}


/*-------------------------------

formWrap

-------------------------------*/

#formWrap{
	max-width: 1150px;
	width: 94vw;
	margin: 0 auto;
	padding: 0 0px 100px;
}

#formWrap h2{
	margin-top: 70px;
	margin-bottom: 50px;	
}

#formWrap p{
	line-height: 2em;
	margin-bottom: 30px;
}

.red{
	background-color: #f6921e;
	padding: 5px 20px;
	color: #ffffff;
}
#formWrap .formTable{
    width: 100%;
	max-width: 1050px;
	margin: 0 auto;
}

#formWrap .formTable tr th{
	max-width: 250px;
	width: 30%;
	border-top: 2px solid #d9d9d9;
	border-bottom: 2px solid #d9d9d9;	
	vertical-align:middle;
	text-align: left;
	padding: 20px 50px;
}

#formWrap .formTable tr td{
	border-top: 2px solid #d9d9d9;
	border-bottom: 2px solid #d9d9d9;
	border-left: none;
	border-right: none;
	padding:10px 20px;
	max-width:800px;
	width: 70%;
	text-align: left;
}


input[type="text"]{
	width: 100%;
	height: 40px;
    padding: 0px;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
}


input[type="tel"]{
	width: 100%;
	height: 40px;
    padding: 0px;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
}

textarea{
	width: 100%;
	height: 100px;
    padding: 0px;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
}

#formWrap p{
	text-align: center;
	margin-top: 30px;
}

input[type="reset"] {
-webkit-appearance: none;
	display: inline-block;
	padding: 20px 80px;
	color: #ffffff;
	font-size: 18px;
	text-decoration: none;
	background: #c4c4c4;
	border-radius: 5px;
	border: none;
	margin-right: 40px;
}

input[type="submit"] {
-webkit-appearance: none;
	display: inline-block;
	padding: 20px 80px;
	color: #ffffff;
	font-size: 18px;
	text-decoration: none;
	background: #fa9fbc;
	border-radius: 5px;
	border: none;
}



span.error_m{
	font-size:15px;
	font-weight: normal;
	color:red;
	display:block;
	margin:0;
}

/*-------------------------------

instagram

-------------------------------*/
#instagram{
	max-width: 1150px;
	text-align: right;
}
#instagram img{
	width: 200px;
}

/*-------------------------------

footer

-------------------------------*/
footer {
	position: relative;
	z-index: 2;
	background: #fa9fbc;
	padding: 40px 5vw;
	font-size: 14px;
	text-align: center;
	line-height: 2em;
	color: #ffffff;
}

footer a,
footer a:hover {
	color: #ffffff;
	text-decoration: none;
}


/*-------------------

privacy policy

-------------------*/

.privacy{
	max-width: 1000px;
	padding: 0vw 5vw;
	margin: 0 auto;
}

.privacy h1{
	text-align: center;
	margin-top: 50px;
	
}

.privacy h2{
	margin-top: 30px;
	
}

.privacy p{
	margin-top: 30px;
	
}

#btn3{
	margin-bottom: 50px;
	margin-top: 50px;
}
#btn3 .inner{
position: relative;
text-align: center;
margin-top: 20px;
}

#btn3 .inner a{
  color: #ffffff;
  background: #fa9fbc;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}

#btn3 .inner2{
position: relative;
text-align: center;
margin-top: 20px;
}

#btn3 .inner2 a{
  color: #ffffff;
  background: #63bce5;
  padding: 20px 40px;
  display: inline-block;
  border-radius: 10px;
}


/*-------------------
PS/スマホの表示切替
-------------------*/

@media screen and (max-width:768px) {
.sp{
    display: block;
}

.pc{
    display: none;
}
h1{
	font-size: 24px;
}
h2{
	font-size: 20px;
}
h3{
	font-size: 24px;
}
header{	
	width: 96%;	
}

header .btn{
	margin-right: 0;
    display: inline-block;
	padding: 20px 30px;
}
header .btn2{
	margin-right: 0;
    display: inline-block;
	padding: 20px 30px;
}
/*-------------------------------

FV

-------------------------------*/
.fv{
	display: block;
}
.main_imgBox {
	width:100%;
    height: 400px;
	top:100px;
    overflow: hidden;
    position: relative; 
}
.main_txtBox{
	margin: 140px 5vw 0px;
}
.main_txtBox img{
	display: none;
}
.main_txtBox h1{
	margin-top: 0px;
	text-align: center;
	}
/*-------------------------------

features

-------------------------------*/
#features .inner .box{
  width: 100%;
  width: 80vw;
  margin-right: 0px;
  float: left;
  margin-bottom: 4vw;
}
#features .inner .box img{
  width: 80vw;
}
#features2 .bg {
  background-image: url("../images/featuresbgsp.jpg"); 
}
#features2 .bg2 {
  background-image: url("../images/featuresbgsp2.jpg"); 
}
#features2 .text {
box-sizing: border-box;
  padding: 50px 5vw 100px;
}
/*-------------------------------

schedule

-------------------------------*/
#schedule h2{
	margin-top: 50px;
	margin-bottom: 50px;
		
}
#schedule .inner{
	display: block;
}
#schedule .inner .photo_box img{
	width: 100%;
}
#schedule .inner .text_box {
	width: 100%;
}
#schedule .table_schedule{
	width: 90%;
	margin: 0 auto;
}
#schedule .table_schedule2{
	width: 90%;
	margin: 0 auto;
}
#schedule h3{
	margin-top: 20px;
}
#schedule .table_price{
	width: 90%;
	margin: 0 auto;
}
#schedule .table_price2{
	width: 90%;
	margin: 0 auto;
}
	
.moji{
	letter-spacing: -0.1em;
	font-size: 14px;
}

/*-------------------------------

experience

-------------------------------*/
#experience .inner{
box-sizing: border-box;
  padding-top: 50px;
  padding-bottom: 0px;
}
#experience .inner .photo_box img{
  height: 300px;
  object-fit: cover;
	}
#experience .inner .text_box{
box-sizing: border-box;
	width: 100%;
	padding: 20px 30px 20px 5vw;
	position: relative;
}
#experience .inner .check_box p{
	margin-top: 5px;
}
/*-------------------------------

message

-------------------------------*/
#message .bg{
	position: relative;
}

#message .text {
	padding-top: 25px;
}

#message h3{
 margin-top:0px!important		
	}
#message .bg img{
height: 250px;
  object-fit: cover; /* この一行を追加するだけ！ */
	}
#message p{
   padding: 0vw 5vw;
box-sizing: border-box;
}

/*-------------------------------

profile

-------------------------------*/

#profile h2{
	margin-top: 450px;	
	margin-bottom: 50px;	
}
#profile .inner{
	display: block;
	margin: 0 5vw;
}
#profile .photo_box {
	margin-top: 20px;
}
#profile .photo_box img{
	width: 100%;
}
#profile .text_box {
    margin: 0 auto;
}

#profile .text_box h3 {
    text-align: center;
}
.name{
	font-size: 20px;
}

/*-------------------------------

access

-------------------------------*/
#access{
	position: relative;
	margin: 0 auto;
}
#access h2{
	margin-top: 70px;
	margin-bottom: 50px;	
}
#access .inner{
	display: block;
}
#access .text_box iframe{
    width:100%;
	height:360px; 
}
#access .photo_box {
	margin-top: 20px;
}
#access .photo_box img{
	width: 100%;
}
/*-------------------

#formWrap

-------------------*/
#formWrap{
	padding: 0 0px 50px;
} 

#formWrap .formTable tr th{
	width: 100%;
	text-align: center;
	padding: 20px 20px 10px;
	margin: 0 auto;
box-sizing: border-box;
	border-top: none;
}
#formWrap .formTable th,.formTable td {
    display: block;
	padding: 20px 0;
	margin: 0;
box-sizing: border-box;
}
#formWrap .formTable tr td {
		width: 100%;
		padding: 10px;
		border: 0;

box-sizing: border-box;
}
.name{
width: 100%!important;
}
#name{
margin: 0;
}
.name2{
width: 100%!important;
}
#furigana2{
margin: 0;
}
#formWrap p{
text-align: left;
}
input[type="reset"]{
-webkit-appearance: none;
padding: 10px 140px;
margin: 0 2vw 10vw;
}
input[type="submit"]{
-webkit-appearance: none;
margin: 0 2vw 50px;
padding: 10px 140px;
box-sizing: border-box;
}

/*-------------------------------

instagram

-------------------------------*/
#instagram{
	margin: 0 5vw;
}
#instagram img{
	width: 150px;
}

/*-------------------------------

footer

-------------------------------*/
footer {
font-size: 10px;
padding: 20px 5vw;
}
}