@charset "utf-8";

*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
} 

*:after {
display:block;
clear:both;
} 

html, body {
position:relative;
word-wrap:break-word;
scroll-behavior: smooth;
}


body{
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: 400;
	width: 100%;
	color: #333;
	position: relative;
font-family: 'Quicksand','BIZ UDPGothic', sans-serif;
}

/*
font-family: 'Quicksand', 'Noto Sans JP', sans-serif;
font-family: 'BIZ UDPGothic', sans-serif;
font-family: 'BIZ UDPMincho', serif;
*/

header{
margin:0;
}

section{
	position:relative;
	margin-bottom:60px;
}


.inner{
width:100%;
max-width:1120px;
margin:0 auto;
padding:0 60px;
}



h1,h2,h3,h4,h5{
margin:0;
padding:0;
font-size:100%;
line-height:120%;
	font-family: 'BIZ UDPGothic', sans-serif;
	letter-spacing:0.1em;
	color:#EA5D97;

}


ul,dl{
margin:0;
padding:0;}

ul li{
list-style-type:none;
}

form{
margin:0;
}

p{
margin:0;
line-height:200%;
}

figure{
margin:0;
}

figure img{
	width:100%;
	height:auto;
	max-width:100%;
}

img{
border:none;
margin:0;
vertical-align:middle;
}

.tcenter{
text-align:center;
}

.tright{
text-align:right;
}

.fsmall{
	font-size:80%;
}

.flarge{
	font-size:120%;
}

.fbold{
	font-weight:bold;
}

.martop1em{
	margin-top:1.5em;
}

.marbom1em{
	margin-bottom:1.5em;
}

.pink{
		color:#EA5D97;
}

.pcenter{
	text-align:center;
}

.parenthesis{/*カッコ*/
position: relative;
padding: 15px 40px;
display:inline-block;
margin:1.5em auto;
text-align:center;
line-height:120%;
}

.parenthesis::before,
.parenthesis::after {
  position: absolute;
  top: 0;
  content: '';
  width: 20px;
  height: 100%;
  border-top: 1px solid #EA5D97;
  border-bottom: 1px solid #EA5D97;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.parenthesis::before {
  left: 0;
  border-left: 2px solid #EA5D97;
}
.parenthesis::after {
  right: 0;
  border-right: 2px solid #EA5D97;
}

/***common***/

header#header{
	position:relative;
z-index:900;
}

#fixnav{
position:fixed;
bottom:300px;
right:0;
z-index:110;
}

#fixnav li{
width:50px;
text-align:center;
background:rgba(12,115,150,1);
border-bottom:1px solid #fff;
-webkit-transition: .3s;
-moz-transition: .3s;
transition: .3s;
height:75px;
border-radius:5px 0 0 5px;
}

#fixnav li a{
	display:flex;
	width:100%;
	height:100%;
	align-items :center;
}


#fixnav li a img{
	margin:auto;
}


#fixnav li:last-child{
border-bottom:none;
}



#fixnav li:hover{
background:rgba(234,93,151,1);

}


aside {
	position:relative;
	width:100%;
	display:flex;
	flex-direction:column;
 margin:0 auto 30px;	
	padding:0 0px;
text-align:center;

}

aside a{
	display:block;
	margin:0px auto 3em;
	line-height:100%;
	padding:0;
	-webkit-transition: .3s;
 -moz-transition: .3s;
 transition: .3s;
}



aside a img{
	-webkit-transition: .3s;
 -moz-transition: .3s;
 transition: .3s;
}

aside a img:hover{
	transform: scale(0.97);
}




aside picture img{
	width:100%;
	max-width:100%;
	height:auto;
}


/** page top ***/
#pagetop{
position: fixed;
right: 15px;
bottom: 20px;
z-index:10;

}

#pagetop a{
display:block;
}

#pagetop img{
	 transition: .3s ease;
		position:relative;
		top:0;
}

#pagetop img:hover{
	top:-10px;
}




footer{
	position:relative;
	width:100%;
	z-index:1;
	padding:2em 0;
	margin-bottom:2em;
}


footer h2{
	font-size:140%;
	margin:1em 0;
	text-align:center;
	color:#0C7396;}

footer h2 span{
	display:block;
font-size:60%;
font-family: 'Noto Serif JP', serif;
color:#E85D97;}


footer .office{
	z-index:1;
}

footer .office::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(/img/bg_sakura_w.png), url(/img/footer.svg) #FCF3F6;
	background-position:bottom right ,top;
	background-size:auto,100%;
	background-repeat:no-repeat;
	z-index:-1;
}


footer .svgimg{
	position:absolute;
}


footer .office figure{
	width:100%;
}

footer .office figure img{
	width:100%;
	height:auto;
}



footer .office .map{
	margin:2em auto;
}


footer .office .kanaya{
	width:50%;
	margin:1em auto 2em;
	text-align:center;
}

footer .item:nth-of-type(1) span{
	color:#E85D97;
	
}

footer .office ul{
	margin:0 auto;
	text-align:center;
}
footer .office ul li{
	margin:10px 0;
}
footer .office ul li a{
	width:15em;
}


small{
	display:block;
	font-size:80%;
	margin:0 0 2em;
	text-align:center;
}



.pright-sleft a{
	position:relative;
	left:0;
		-webkit-transition: .3s;
 -moz-transition: .3s;
 transition: .3s;
}

.pright-sleft a:hover{
	left:0.3em;
	opacity:0.8;
}

a.linkstyle{
	background-color:#ACDDF7;
	display:inline-block;
	padding:0.2em 1.5em 0;
	color:#0C7396;
	position:relative;
	margin-right:10px;
	vertical-align:middle;
	height:40px;
	font-size:150%;
	text-decoration:none;
	transition: .3s;
	font-weight: 100;
}

a.linkstyle:link{color:#0C7396;}
a.linkstyle:active {color:#0C7396;}
a.linkstyle:visited {color:#0C7396;}

a.linkstyle::before{
	content:"";
	width:0;
	height:100%;
	position:absolute;
	top:0;
	left:-10px;
	border-width: 20px 10px;
	border-style:solid;
	border-color: #ADDEF8 #ADDEF8 #ADDEF8 transparent;
	transition: .3s;
}

a.linkstyle::after{
	content:"";
	width:0;
	height:100%;
	position:absolute;
	top:0;
	left:calc(100%);
	border-width: 20px 10px;
	border-style:solid;
	border-color: transparent transparent transparent #ADDEF8;
	transition: .3s;
}


a.linkstyle:hover{
	background-color:#0C7396;
		color:#fff;
}

a.linkstyle:hover::before{
	border-color: #0C7396 #0C7396 #0C7396 transparent;
}
a.linkstyle:hover::after{
	border-color: transparent transparent transparent #0C7396;
}

@media only screen and (min-width: 769px) and (max-width: 1000px) { /*sp*/

footer .office ul li a{
	width:14em;
	font-size:120%;
}

a.linkstyle{
	background-color:#ACDDF7;
	display:inline-block;
	padding:0.2em 1.5em 0;
}


}

@media only screen and (min-width: 769px) and (max-width: 1300px) { /*sp*/
body{
	background-size:contain;
	background-size:80%;

}


}


@media only screen and (min-width: 769px) { /*pc*/
body{
	background-image:url(../img/bg_cloud.png);
	background-position: right 60px;
	background-repeat:no-repeat;
}

header#header{
	position:relative;
	z-index:200;
}

header#header h1 a{
	display:inline-block;
}

header#header h1 img{
margin:10px;
width: calc(100vw / 4);
height:auto;
min-width:250px;
max-width:463px;
}





br.pc_none{
display:none;
}

.pright-sleft{
	text-align:right;
}


footer h2{
	font-size:200%;
}

footer h2 span{
	font-size:60%;
}


footer .fbox{
	display:flex;
}

footer .item:nth-of-type(1){
	flex:0 0 60%;
}

footer .item .map{
	width:80%;
	margin:1em 0;
}


footer .item:nth-of-type(2){
	flex:0 0 40%;
}

footer .item .kanaya{
	width:65%;
	position:relative;
	top:-30px;
	text-align:center;
}


}



@media only screen and (min-width: 1000px) { /*pc*/
nav#gnavi input, nav#gnavi label {
display: none;
}

#gnavi{
	width:100%;
	position:absolute;
	top:20px;
	right:0;
	padding-right:40px;
	text-align:right;
	font-family: 'BIZ UDPGothic', sans-serif;
}



#gnavi li{
	display:inline-block;
}

#gnavi li a{
	display:block;
	text-decoration:none;
	padding:0.5em 1em;
	color:#333;
	font-size:90%;
	position:relative;
	-webkit-transition: .3s;
 -moz-transition: .3s;
 transition: .3s;
	z-index:1;}
	

#gnavi li a:hover{
color:#EA5D97;
}


#gnavi li a::after{
content:"";
display:block;
width:1px;
border-top:36px solid transparent;
position:absolute;
bottom:0;
left:50%;
transform: translateX(-50%);
transition:0.5s ease;
z-index:-1;
}


#gnavi li a:hover::after{
content:"";
display:block;
width:100%;
border-top:36px solid rgba(234,93,151,0.1);
}


#gnavi .tgLabel + .gnavi_content li:last-child img{
margin-left:1em;
}


}



@media only screen and (min-width: 768px) { /*pc*/
#gnavi{
	max-width: calc(100% - calc(100vw / 4) - 20px);
}
}


@media only screen and (max-width: 1100px) { /*tab*/
.inner{
width:100%;
margin:0 auto;
padding:0 60px;
}

#pagetop{
position: fixed;
right: 10px;
bottom: 20px;
}

br.tb_none{
display:none;
}

}



@media only screen and (max-width: 999px) { 

#gnavi{
	position:absolute;
	right:0px;
	top:0px;
	width:0%;
	height:100%;
	text-align:right;
	overflow-y: hidden;
	overflow: hidden;
}

#gnavi ul{
	margin-top:10px;
}
#gnavi li{
	text-align:center;
}


#gnavi label.tgLabel {
	position:fixed;
	right:0px;
	top:0px;
	padding: 10px 10px 0 ;
	display: block;
	cursor: pointer;
	z-index:900;
}

#gnavi label.tgLabel::before{
	content:url("../img/btn_menu_open.png");
	vertical-align:middle;
}

#gnavi input {		
	display: none;
}


#gnavi input:checked + label.tgLabel::before{
	content:url("../img/btn_menu_close.png");
	vertical-align:middle;
}



#gnavi .gnavi_content {	
	position:fixed;
	overflow: hidden;
	opacity: 0;
	transition: .6s;
	top:0;
	left:100vw;
	width:100%;
	height:100%;
 padding-top:55px;
	background:rgba(255,255,255,1);
	background:url(../img/bg_sakura2_spmenu.png) rgba(255,255,255,1) no-repeat;
	background-size: auto;
	background-position: top right;
	padding-bottom:60px;
	z-index:200;
}


#gnavi input:checked + .tgLabel + .gnavi_content {
	height:100%;
	opacity: 1;
	z-index:200;
	left:0;
}


#gnavi .tgLabel + .gnavi_content li{
	position:relative;
	transition: .4s;
}

#gnavi .tgLabel + .gnavi_content li:hover{
	/*margin-left:0.5em;*/
	background:rgba(234,93,151,0.1);
	letter-spacing:0.2em;
}



#gnavi .tgLabel + .gnavi_content li a{
	display:block;
	padding:0.6em 1em;
	color:#0C7396;
	text-decoration:none;
	font-size:120%;
}

#gnavi .tgLabel + .gnavi_content li a:hover{
	color:#EA5D97;
}

#gnavi .tgLabel + .gnavi_content li:last-child img{
	margin-top:40px;
}


}



@media only screen and (max-width: 768px) { /*sp*/


section{
	margin-bottom:20px;
}

.inner,
section .inner,
aside .inner,
footer .inner{
	padding: 0 1em;
}


br.sp_none{
display:none;
}


.pright-sleft{
	text-align:left;
}

.pic{
	max-width:100%;
	height:auto;
}


body{
height:100%;
}


header#header h1{
	margin:10px;
z-index:999;
}

header#header h1 a{
	display:inline-block;
}


header#header h1 img{
	width:250px;
	height:auto;
}



/**/


aside {
 margin:10px auto 30px;	
	padding:0 0px;
}

aside a{
	display:block;
	margin:15px auto 2em;
}


.bana img{
	width:100%;
	height:auto;
}

#fixnav{
display: block;
position: fixed;
left:0;
bottom: 0px;
width: 100%;
	z-index:999;
}

#fixnav ul{
display:flex;
height:60px;
width:100%;
}

#fixnav li{
text-align:center;
background:rgba(12,115,150,1);
margin:0;
padding:0;
display:flex;
flex:1 1 33%;
align-self:stretch;
border-right:1px solid #fff;
border-top:1px solid #fff;
border-bottom:none;
display:flex;
-webkit-transition: .3s;
-moz-transition: .3s;
transition: .3s;
border-radius:5px 5px 0 0;
}

#fixnav li:hover{
background:rgba234,93,151,1);

}



#fixnav li:last-child{
border-right:none;
}

#fixnav li:last-child img{
position:relative;
top:5px;
}


#fixnav li a{
display:block;
lign-self:stretch;
width:100%;
margin: auto;
padding:10px 0 4px;
}


#pagetop{
position: fixed;
right: 5px;
bottom: 65px;
}

#pagetop img{
	width:40px;
	height:40px;
}



footer .office::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(/img/bg_sakura_w.png), url(/img/footer.svg) #FCF3F6;
	background-position:center bottom ,top;
	background-size:100%,100%;
	background-repeat:no-repeat;
	z-index:-1;
}


footer .office ul li a{
	width:15em;
}
a.linkstyle{
	font-size:110%;
	padding-top:0.3em;
}

small{
	margin:0 0 5em;
}



} 



.youtube_fbox{
	margin:1em 1em;
}

.youtube_warp{
	margin:0.5%;
	wdith:100%;
text-align:center;
}

.youtube{
margin:2em 0 0.5em;
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}

.youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0px;

}

@media only screen and (min-width: 769px) { /*pc*/
.youtube_fbox{
	display:flex;
	max-width:1600px;
	margin:0 auto;
	
}

.youtube_warp{
	flex:0 0 32%;
	margin:0.5%;
	wdith:100%;
}

}

aside#sns {
	position:relative;
	width:100%;
	display:block;
 margin:0 auto 20px;	
	padding:0 0px;
text-align:center;
border-bottom:2px solid #FCF3F6;
}

#sns ul{
	text-align:center;
	margin-bottom:30px;
}
#sns li{
	display:inline-block;
	padding:0 30px;
}


#sns li a{
	margin:0;
}

#sns li img{
	width:50px;
	height:auto;
}




table{
font-size:100%;
border-collapse:collapse;
border-spacing:0;
empty-cells:show;
}


a:link {color:#EA5D97;
	-moz-transition: 0.3s ease;
-webkit-transition:  0.5s ease;
-o-transition:  0.3s ease;
-ms-transition:  0.3s ease;
transition: 0.3s ease;}
a:active {:#EA5D97;}
a:visited {color:#EA5D97;}
a:hover {color:#F19DBB;}