@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP&display=swap');


body{
font-family: 'Noto Sans JP', sans-serif;
font-size:4.3vw;
color:#333;
margin:0;
}

header 
{
} 


ul{
list-style: none;
}

dl{
				padding-left:2vw;
}

.top-font{
   	position:relative;
    text-align: center;
    padding-top:30vw;
    padding-bottom:15vw;
    letter-spacing:1vw;
    font-size:6vw;
    font:#ddd;
    font-family:'Noto Serif JP', sans-serif;
}


.form_input{
    position:relative;
    
				top:;
}

input[type='text']{
				font-size:3vw;
    width:60vw;
}

input[type='email']{
				font-size:3vw;
       width:60vw;
}

input[type='tel']{
				font-size:3vw;
       width:60vw;
}

input[type='submit']{
				font-size:3vw;
    padding-right:3vw;
    padding-left:3vw;
				background-color:f4d5ff;
    border:solid 1vw rgba(210, 65, 130, 0.1);
    box-shadow:	0 0 1vw #007182;
				border-radius:2vw;
}

textarea{
    font-size:3vw;
    width:60vw;
    height:30vw;
}

header, .wrap
{
height: 28vw;
}

.wrap {
position: relative;
background: url('back.svg');
top:-10vw;
z-index:100;
}

.pc-image{
    display:none;
}


				
 				
.header
{
				position:relative;
				height:4vw;
				}

.header2
{
				position:relative;
				height:5vw;
				}

.header3
{
				position:relative;
				height:2vw;
				}

.header4
{
				position:relative;
				height:5vw;
				}

a{
text-decoration: none;		
}


.align-right
{
    text-align:right;
    font-size:2.5vw;
}


.box-flex{
position:relative;
}


		
.box29{ 
				
    background: #ffffff; 			
    position:relative;			
    font-size:2vw;
    position:relative;
				} 

.box29 span{
    position:relative;
    text-align:center;
    color:#65350f;
    font-size:4vw;
    top:-10px;
    left:5px;
}

.box29 ul
{
				list-style-type:none;
				
    padding:vw;
    position:relative;
    height:6.3vw;
        background-color:antiquewhite;
				}
				 
	
.box-title span{
position:relative;
left:15px;
}					
.box29 img
	{
        position:relative;
        top:2vw;
        width:5vw;
        padding:0.5vw;
}
			
.box29 li {

padding:px;
    margin:1px;
    font-size:2vw;
              
}




.midashi{
    border-left:1.5vw solid #8098ff;
    border-right:1.5vw solid #8098ff;
    font-size:3vw;
    font-weight:300;
    width:50vw;
    height:5vw;
    border-radius:10px;
    margin-top:2vw;
    margin-right:auto;
    margin-left:auto;
    font-family:'Noto Serif JP', sans-serif;
    background-color:rgba(0,100,200,0.2)
}

.pad{
    position:relative;
    width:10vw;
    margin-right:auto;
    margin-left:auto;
    margin-bottom:5vw;
}

.pad img{
    width:10vw;
}


.intro-top{
position:relative;
font-size:4vw;
text-align:center;
color:#65350f;
margin-bottom:5vw;
font-family:'Noto Serif JP', sans-serif;
}


.flex-wrap
{
display:;
width:90.5vw;
position:relative;
font-size:4vw;
text-align:center;
    margin-right:auto;
    margin-left:auto;
margin-bottom:5vw;
font-family:'Noto Serif JP', sans-serif;
}

.flex-wrap .sentence img
{
    position:absolute;
    width:4vw;
    padding-top:0.9vw;
}

.sentence
{
    position:relative;
    list-style-type:none;
    font-size:3vw;
}


.sentence ul
{
    list-style-type:none;
    font-size:3vw;
    text-align:;
    position:relative;
    line-height:2;
    padding:0;
}


.header
{
				position:relative;
				height:6vw;
				}				

#wrap4{
				position:relative;
				padding:0px;
				left:0;
				width:100%;
    height:315vw;
				}							

#footer
{ 
    position:relative;
    display:flex;
    justify-content: center;
    top:vw;
    width:100%; 
    margin:0px;
    height:326vw;
    background:#85CBCD;
    opacity:1; 
    color:#333;
    font-family:'Noto Serif JP', sans-serif;
				}

#footer a {
	text-decoration:none;
}

#footer_wrap{
    position:relative;
    background:#fff;
    margin-top:10vw;
    width:85vw;
    height:294vw;
    border-radius:3vw;
}

#footer_img_wrap{
    position:relative;
    display: flex;
    justify-content: center;
    top:1.5vw;
}

#footer_img_wrap img:first-child{
    position:relative;
    width:13vw;
    top:0.5vw;
}

#footer_img_wrap img:nth-child(2){
    position:relative;
    top:3.5vw;
    width:35vw;
    height:10vw;
}

.footer_tel{
    position:relative;
    left:5vw;
}

.footer_tel a{
    text-decoration:none;
	color:green;
}

.footer_tel a img{
      position:relative;
    top:2.5vw;
    width:4vw;
}


#footer_table{
    position:relative;
    width:80vw;
    margin-top:5vw;
    text-align:center;
    left:2vw;
}

#footer_table a{
    font-size:2.8vw;
    color:cornflowerblue;
    
}

#footer_table table{
    font-size:3.5vw;
    border-spacing: 0;
    white-space: nowrap;
}

#footer_table th {
    font-weight:100;
    padding: 1.5vw;
    border-bottom:1px solid #333;
}

#footer_table td {
    padding:1vw;
    font-size: 3vw;
    text-align: center;
    border-bottom:1px solid #333;
}

#footer_wrap .credit
{
    text-align:center;
    font-size:3vw;
    padding:4vw;
}

#footer_wrap .credit img
{
    position:relative;
    width:60vw;
    background-color:#fff;
    padding:10px;
    border-radius:10px;
 
}

.anicom
{
    position:relative;
    display:flex;
    justify-content: center;
    flex-flow:;
    align-items:center;    
}

.anicom a{
    width:;
    padding-top:;
    padding-left:5vw;
    padding-right:5vw;
}

.anicom a img{
    width:20vw;
}
.invisible-mobile-anicom{
    display:none;
}

.invisible-pc-anicom{   
}



#gmap {
top:4vw;
position: relative;
width:70vw;
height:50vw;
margin:auto;
padding:0;
}

#gmap iframe{
position:absolute;
width:70vw; 
height: 50vw;
margin:auto;
border-radius:3vw;
}

#menu{
}

#center{
    position:relative;
    display:flex;
    justify-content: center;
    top:5vw;
    left:
}


#menu ul{
    position:relative;
    padding:0;
    width:100%;
}

#menu li{
    position:relative;
    margin-left:auto;
    margin-right:auto;
    margin-top:1vw;
    margin-bottom:1vw;
    font-weight:100;
    font-size:3vw;
    background: #eee;
    width:60vw;
    border-radius:2vw;
    padding:1vw;
    opacity:0.9;
}


#menu a {
	text-decoration:none;
	color:#333;
}

#menu a.active {
	color: #;
	background-color: #0d6990;
}

#menu a:hover:not(.active) {
	color: #; 
	opacity:0.5;
	background-color: #fff;
}

.arrow{
    position:absolute;
    border: 0;
    border-top: solid 0.6vw #28A1A3;
    border-right: solid 0.6vw #28A1A3;
    display:inline-block;
    transform: rotate(45deg);
    top:2.3vw;
    left:57vw;
    width: 1.5vw;
    height: 1.5vw;
}

.p1{
    position:relative;
    text-align:left;
    font-size:3.5vw;
    padding-left:2vw;
    top:2vw;
}

.p2{
    position:relative;
    text-align:left;
    font-size:2.5vw;
    left:-0.5vw;
    bottom:0;
}


.p3{
    top:4vw;
    position:relative;
    text-align:center;
    font-size:2.5vw;
    left:-0.5vw;
    bottom:0;
}

.p4{
    text-align: center;
    background: #eee;
    width:70vw;
}



.p8{
    font-size:3vw;
    text-align: center;
}

#copyright{
    position:relative;
    text-align: center;
    top:5vw;
    color:#eee;
    font-size:3vw;
}


.invisible-mobile{
      display:none;
}

/*フッターのアイコン群ここから-----------------------------*/

.tel{
    font-size:3vw;
    position:fixed;
    bottom:0;
    left:0;
    width:33.3vw;
    height:13vw;
    padding:;
 	border-radius:;
    background:#888;
    border-radius:;
    text-align: center;
    z-index:500;
}

.tel a
{
				color:#fff;
}

.tel img{
    position:absolute;
    top:0.5vw;
    width:5vw;
    left:13.5vw;
    
    
}

.tel p{
    position:relative;
    text-align: center;
    font-size:2.5vw;
    top:3.8vw;
}

.tizu{
    font-size:3vw;
    position:fixed;
    bottom:0;
    right:0;
    width:33.3vw;
    height:13vw;
    padding:;
 	border-radius:;
    background:#3EB4B6;
    border-radius:;
    text-align: center;
    z-index:500;

}

.tizu a
{
				color:#fff;
}

.tizu img{
    position:absolute;
    top:1.3vw;
    width:5vw;
    left:13.5vw;    
}


.tizu p{
    position:relative;
    text-align: center;
    font-size:2.5vw;
    top:3.8vw; 
}



.time{
    font-size:3vw;
    position:fixed;
    bottom:0;
    left:33.3vw;
    width:33.7vw;
    height:13vw;
    background:#28A1A3;
    border-radius:;
    text-align: center;
    z-index:500;
}

.time a
{
				color:#fff;
}


.time img{
    position:absolute;
    top:1vw;
    width:5vw;
    left:14vw;    
}


.time p{
    position:relative;
    text-align: center;
    font-size:2.5vw;
    top:3.8vw; 
}

/*フッターのアイコン群ここまで-------------------------------------------------*/

/*メニューアイコンここから----------------------------------------------------*/

#nav-button{
position:fixed;
 top: 1vw;
 right:1vw;
 padding: 3vw;
 width:		6.5vw;	
 height:		6vw;	
 display:	block;
 	border:		0vw solid #00999f;	
 	/*box-shadow:	1px 1px 1px #007182;*/	
 	border-radius:	4px;
 	background-color:rgba(133,203,205,0.8);
 	/*background-color:#90CE9C;*/
 	text-align:	center;
 	z-index:220;
}
 	
#nav-button p{
 				position:absolute;
 				left:2vw;
 				top:4.6vw;
 				font-size:0.7em;
 				color:#fff;
 				z-index:200;
 					}
 
 
.nav-unshown { 
				display:none; 
				}
				
#nav-open { 
display: inline-block;
width: 7vw; 
height: 6vw;
vertical-align: middle;
z-index:200;
}

#before{
position:absolute; 
top:4vw;
     left:1.3vw;
height: 1vw;
width: 10vw;
border-radius: 0.5vw; 
background: #fff; 
display: block; 
cursor: pointer;
z-index:200;
 } 
 
#after{
position:absolute; 
top:4vw;
left:1.3vw;
height: 1.2vw;
width: 10vw;
border-radius: 0.5vw; 
background: #fff; 
display: block; 
cursor: pointer;
z-index:200;
 } 

#before2{
position:absolute; 
top:1.5vw;
     left:1.3vw;
height: 1.2vw;
width: 10vw;
border-radius: 0.5vw; 
background: #fff; 
display: block; 
cursor: pointer;
z-index:200;
 } 
 
#after2{
position:absolute; 
top:6.3vw;
     left:1.3vw;
height: 1.2vw;
width: 10vw;
border-radius: 0.5vw; 
background: #fff; 
display: block; 
cursor: pointer;
z-index:200;
 } 



#nav-input:checked ~ #before
{
			transform: rotate(45deg);
 	transition: .3s ease-in-out;		
				}
				
#nav-input:checked ~ #before2
{
			display:none;
				}

#nav-input:checked ~ #after
{
			transform: rotate(-45deg);
 	transition: .3s ease-in-out;		
				}

#nav-input:checked ~ #after2
{
			display:none;
				}

#nav-close {
display: none;
position: fixed; 
z-index: 80;
top: 13vw;
left: 0; 
width: 100%;
height: 100%; 
background: #000000;
opacity: 0;
 } 

#nav-top-close{
				position:fixed;
				display:block;
				top:0;
				left:0; 
				height:14vw;
				width:50vw;
				background:#28A1A3;/*#2ec6ff;*/
				z-index:100;
				-webkit-transform: translateX(-105%);
				transform: translateX(-105%);
}

#nav-content {
position: fixed;
display:block;
top: 0; 
left: 0; 
z-index:80;
width: 50vw;
max-width: 100vw;
height: 100%; 
background: #ffffff;
box-shadow:0 0 5px #000000;
-webkit-transform: translateX(-105%); transform: translateX(-105%);
} 

#nav-input:checked ~ #nav-close
{
				display: block;
				} 

#nav-input:checked ~ #nav-top-close
{
				-webkit-transform: translateX(0%); 
				transform: translateX(0%);
				transition: .2s ease-in-out;
				} 

#nav-input:checked ~ #nav-content { 
-webkit-transform: translateX(0%); 
transform: translateX(0%);
transition: .2s ease-in-out;
}


#ul {
	width: 50vw;
	font-size:4.5vw;
	margin: 0;
	padding: 0;
	list-style-type: none;
	background-color:#28A1A3;/*#2ec6ff;*/
    font-family:'Noto Serif JP', sans-serif;
	opacity:1;
	z-index:85;
}

#ul li a {
	display: block;
		border-top: 0.5vw dotted #ffffff
	;
	padding: 1vw 6vw;
	text-decoration: none;
	color: #fff;
}

#ul li {
	text-align: center;
}

#ul li img{
    display:none;
}

#ul li:first-child{
border:none;
height:14vw;
}


#ul li:nth-child(6){
border:none;
height:vw;
font-size:vw;
padding-left:;
padding-right:;
}

#ul li:last-child {
border-bottom: 0.5vw dotted #ffffff
}

#ul li a.active {
	color: #ffffff;
	background-color: #0d6990;
}
#ul li a:hover:not(.active) {
	color: #ffffff; 
	opacity:0.5;
	background-color: #0d6990;
}

/*メニューアイコンここまで----------------------------------------------------*/



.logo{
				position:absolute;
		 	font-size:6.6vw;
				/*color:#fafad2;*/
				text-align:left;
				top:6vw;
				left:28vw;
				z-index:5;
				text-shadow:
0 0 0.5vw #000,
0 0 0.5vw #000,
0 0 1vw #000;
}

.logo img{
    width:55vw;
}
.logo span:nth-child(1){
color:#dff;
}

.logo span:nth-child(3){
color:#fafad2;
}

.logo2
{
				position:absolute;
				left:2vw;
				top:1.5vw;
				width:auto;
				height:26vw;
    z-index:100;
}


