@charset "utf-8";

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

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, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
border:0;
font-family:inherit;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0;
outline:0;
padding:0;
vertical-align:baseline;
}

:focus{
outline:0;
}

ol, ul{
list-style:none;
}

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

caption, th, td{
font-weight:normal;text-align:left;
}

blockquote:before, blockquote:after,q:before, q:after{
content:"";
}

blockquote, q{
quotes:"" "";
}

a img{
border:0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{
display:block;
}

body{
 "Lucida Sans Unicode", "Lucida Grande", Arial, "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;
}


/* リンク設定
------------------------------------------------------------*/

a{
margin:0;
padding:0;
text-decoration:none;
outline:0;
vertical-align:baseline;
background:transparent;
font-size:100%;
font-weight:bold;
color:#EA618E;
}

a:hover, a:active{
outline:none;
color:#ff97b8;
}

a:hover img{
  opacity: 0.7;
}

/**** Clearfix ****/

nav .panel:after, nav#mainNav:after, .newsTitle:after, .bg:after,.post:after, ul.post li:after,nav#mainNav .inner:after, .clear{
content:""; display:table;clear:both;
}

nav .panel,nav#mainNav,.newsTitle,.bg, .post, ul.post li,nav#mainNav .inner{
zoom:1;
}


/* レイアウト
------------------------------------------------------------*/
body{
height:100vh;
color:#EA618E;
}

#wrapper{
width:100%;
height:auto;
margin-top:7.5vw;
}

#header{
background:#FFFFFF;
width:100%;
height:7vw;
overflow:hidden;
position:fixed;
top:0;
z-index:5;
align-items: center;
display: flex;
border-bottom:solid 0.5vw #EA618E;
}

#main_flickity_out{
	width:100%;
	height:41.3vw;
}

#contents_area{
width:80vw;
margin:10vw auto 0 auto;
}

#contents_area h1{
	font-size:3vw;
	text-align:center;
	margin-bottom:5vw;
	border-bottom:dashed 0.2vw #FAD8E3;
}

.banners, #contents00, #contents01, #contents02, #contents03, #contents04, #contents05, #contents06, #contents07{
	width:100%;
  margin-top : -10vw;
  padding-top : 10vw;
}

.banners, #contents00, #contents01, #contents02, #contents03, #contents04, #contents06, #contents07{
	padding-bottom:10vw;
}

.sub_mainimg, .sub_mainimg img{
width:100%;
}

#footer{
clear:both;
padding:1vw 0;
} 

.sup_s{
	font-size:1.45vw;
	font-weight:bold;
	color:#b40c39;
}

.red{
	color:#b40c39;
}

/* loadingアニメーション
------------------------------------------------------------*/
#loader-bg {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: #FFFFFF;
	z-index: 10;
}
#loader-inner {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 200px;
	height: 200px;
	margin-top: -100px;
	margin-left: -100px;
	text-align: center;
	color: #000000;
	z-index: 20;
}




/* ページトップボタン
------------------------------------------------------------*/

#PageTopBtn {
    position: fixed;
    bottom: -1vw;
    right: 0;
    font-size: 1vw;
}
#PageTopBtn a {
    display: block;
    text-decoration: none;
    color: #fff;
    background: #EA618E;
    text-align: center;
    border-radius: 5%;
    outline: none;
    width: 7vw;
    height: 3vw;
    padding: 1.5vw 0;
}
#PageTopBtn a:hover {
    text-decoration: none; 
    background: #ff97b8;
}



/* ヘッダー
------------------------------------------------------------*/
#hd_left{
width:50%;
float:left;
display: flex;
}

#header h1{
padding:0;
font-size:3.5vw;
line-height:4vw;
margin-left:2vw;
font-weight:normal;
float:left;
}

#hd_mitsuki_logo{
height:3.5vw;
float:left;
margin-left:2vw;
}

#hd_mitsuki_logo img{
height:100%;
}


#hd_right{
width:50%;
float:right;
text-align:right;
font-size:80%;
}

#hd_right .tel{
font-size:3vw;
font-family: "ヒラギノ角ゴ StdN","Hiragino Kaku Gothic StdN";
float:right;
margin-right:2vw;
}

.hdicon{
height:4vw;
float:right;
margin-right:2vw;
}

.hdicon img{
height:100%;
}

.menu-btn {
height:4vw;
width:4vw;
float:right;
background:url(../img/banners/menu_open.gif) no-repeat;
background-size:contain;
margin-right:2vw;
}

.menuOpen{
background:url(../img/banners/menu_close.gif) no-repeat;
background-size:contain;
}

.menu-btn span:after {
content: attr(data-txt-menu);
}

.open .menu-btn span:after {
content: attr(data-txt-close);
}

.menu {
position: fixed;
display: table;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(255,255,255,0.95);
-webkit-transition: all .5s;
transition: all .5s;
visibility: hidden;
opacity: 0;
}

.menu ul {
display: table-cell;
vertical-align: middle;
}

.menu li {
width: 80vw;
height: 3.5vw;
line-height: 3.5vw;
margin: 0 auto;
text-align: center;
}

.menu li a {
display: block;
font-size: 2vw;
color: #EA618E;
}

.menu li a:hover {
color: #999;
}

.menu li#p_banner{
line-height: 10vw;
height: 10vw;
margin-bottom:2vw;
}

.menu li#p_banner img{
height: 10vw;
}

.open .menu {
-webkit-transition: all .5s;
transition: all .5s;
visibility: visible;
opacity: 1;
}


/*メインスライダー
------------------------------------------------------------*/

#flickity {
	margin:0 0 15vw;
	height:41.3vw;
	overflow:hidden;
}

#flickity .flickity-viewport{
	overflow:visible;
}

.main-cells {
	padding:0 2vw;
	width:100%;
}

.sliderImg{
width:100%;
}


/* banners
------------------------------------------------------------*/
.banner_single{
  width:100%;
  height:12vw;
  text-align:center;
}

.banner_single img{
  height:12vw;
}


/* boxing banners
------------------------------------------------------------*/
h1.boxing{
	border-bottom:none !important;
	margin-bottom:1vw !important;
}


/* contents00
------------------------------------------------------------*/
#outer_notice{
	width:100%;
	height:40vw;
	overflow:hidden;
	overflow-y: scroll;
	overflow-x: hidden;
}

.notice h2{
	font-size:2.5vw;
	text-decoration:underline;
}

.notice h3{
	margin-top:2vw;
}

.notice{
	padding:2vw 0;
	font-size:2vw;
	margin-bottom:4vw;
	background-color:#fff7f7;
}

.notice p.update{
	text-align:right;
	font-size:1.5vw;	
}

.notice ul{
	margin-left:3vw;
	list-style:disc;
}


/* contents01
------------------------------------------------------------*/
#contents01 h1{
	margin-bottom:-5vw;
}

#contents01 h2{
	font-size:3vw;
	text-align:center;
	display:none;
}

#contents01 img{
	width:100%;
}

#opening_hours, #facility, #admission{
	width:46%;
	float:left;
	margin-top:10vw;
	}

#schedule, #staff{
	width:46%;
	float:right;
	margin-top:10vw;
}




/* contents02
------------------------------------------------------------*/


#contents02 img{
	width:100%;
}

#fee ul {
list-style:none;
}

#fee li{
	line-height:5vw;
	border-bottom:dotted 0.2vw #FAD8E3;
	margin-bottom:5vw;
}

#fee li span{
	font-size:2.5vw;
}

#fee li .fee_left{
	width:65%;
	display:table;
	float:left;
	padding-right:5%;
}
/*　20190602 表示内容変更
#fee li .fee_center{
	width:30%;
	display:table;
	float:left;
	padding-right:5%;
}*/

#fee li .fee_right{
	width:30%;
	display:table;
}

#fee .fee_op h2{
	text-align:center;
	font-size:3vw;
}

#fee .fee_op div{
	font-size:2vw;	
	margin-bottom:5vw;
}

#fee .sup_s{
	margin-top:-3vw;
	margin-bottom:5vw;	
}


/* contents03
------------------------------------------------------------*/
#contents03 {
  max-width: 100%; /* 最大幅 */
  min-width: 160px; /* 最小幅 */
}
 
#calendar {
  position: relative;
  padding-bottom: 100%; /* 縦横比 */
  height: 0;
  overflow: hidden;
}
#calendar iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}



/* contents04
------------------------------------------------------------*/
#contents04 .fb_box {
position: relative;
left: 0px;
right: 0px;
top:0%;
text-align:center;
}

/* contents05
------------------------------------------------------------*/
#contents05 {
  max-width: 100%; /* 最大幅 */
  min-width: 160px; /* 最小幅 */
}
 
#access {
  position: relative;
  padding-bottom: 50%; /* 縦横比 */
  height: 0;
  overflow: hidden;
}
#access iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
 
#contents05 h2, #contents05 h3, #contents05 h4, #contents05 h5{
	font-size:2vw;
	text-align:left;
}

/* contents06
------------------------------------------------------------*/

#contents06 img{
	width:100%;
}



/* contents07
------------------------------------------------------------*/
#contents07 img{
	width:100%;
}


/* リンク画像
------------------------------------------------------------*/
.link_img {
  position: relative;
  }

.link_img .link_mark {
  position: absolute;
  background-image:url(../img/contents/link_mark.png) ;
  background-repeat: no-repeat;
  background-size:contain;
  bottom: 0.5vw;
  right: 0.5vw;
  margin:0;
  padding:0;
  width: 3vw;
  height: 3vw;
  }
  

/*  フッター
------------------------------------------------------------*/

#copyright{
clear:both;
text-align:center;
font-size:2vw;
}




/*
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
 subpage
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
------------------------------------------------------------*/


/*  共通
------------------------------------------------------------*/
.line_th{
	text-decoration: line-through;
	font-size:1.2vw;
	color:#df446e;
}

.txt_blink {
  animation: blinkAnime 0.8s infinite alternate;
}
@keyframes blinkAnime{
   0% { color: #ffffff }
 100% { color: #b40c39 }
}

#facility01 .facility_text, #staff01 .staff_data, #admission01 .admission_text{
	margin-bottom:15vw;
}
	
#facility01 img, #staff01 .staff_data, #staff01 img, #admission01 img{
	width:100%;
}
#facility01 .facility_text h1, #staff01 .staff_text h1, #admission01 .admission_text h1{
	text-align:left;
	    margin-bottom: 1vw;
		border:none;
}

#facility01 .facility_text h2, #staff01 .staff_text h2, #admission01 .admission_text h2{
	font-size:2vw;
	font-weight:bold;
}

#facility01 .facility_text div, #staff01 .staff_text div, #admission01 .admission_text div{
	font-size:2vw;
}

#admission01 .admission_text h1:before{
	content:"◎";
}

#staff01 .staff_photo{
width:35%;
float:left;
}

#staff01 .staff_data{
position:relative;
}

#staff01 .staff_introduction {
width:60%;
float:right;
position:absolute;
top:0;
right:0;
bottom:0;
}

#staff01 .staff_name{
width:100%;
line-height:3vw;
position:relative;
}

#staff01 .staff_name h2{
font-size:3vw;
font-weight:bold;
width:100%;
}

#staff01 .data_box{
position:absolute;
bottom:0;
left:0;
right:0;
}

#staff01 ul {
list-style:none;
}

#staff01 li{
	line-height:2.5vw;
	border-bottom:dotted 0.2vw #FAD8E3;
	position:relative;
	display:flex;
	align-items: center;
}

#staff01 li span{
	font-size:2.5vw;
	margin:1vw 0;
}

#staff01 li .data_left{
	width:35%;
	float:left;
	padding-right:5%;
	margin:auto 0;
}

#staff01 li .data_right{
	width:60%;
	display:table;
	font-size:1.5vw;
	line-height:2vw;
}


/*
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
 750pxからレイアウト変更
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
------------------------------------------------------------*/

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

/* レイアウト
------------------------------------------------------------*/
#wrapper, #contents_area{
	margin-top:21.5vw;
}

#contents_area{
width:95%;
}

.link_img .link_mark {
  bottom: 1vw;
  right: 1vw;
  width: 6vw;
  height: 6vw;
  }

.banners, #contents00,#contents01, #contents02, #contents03, #contents04, #contents05, #contents06, #contents07 {
  margin-top : -30vw;
  padding-top : 30vw;
}

.banners, #contents00,#contents01, #contents02, #contents03, #contents04, #contents06, #contents07{
	padding-bottom:30vw;
}

#contents_area h1{
	font-size:5vw;
	border-bottom:dotted 0.2vw #FAD8E3;
}

#facility01, #staff01, #admission01{
	margin-top:30vw;
}

#facility01 .facility_text h2, #facility01 .facility_text div, #staff01 .staff_name h2, #admission01 .admission_text h2, #admission01 .admission_text div{
	font-size:4vw;
}
	
/* ページトップボタン
------------------------------------------------------------*/
#PageTopBtn {
    font-size: 1vh;
}
#PageTopBtn a {
	    width: 8vh;
    height: 2vh;
    padding: 3vh 0;
}


/* ヘッダー
------------------------------------------------------------*/
#header{
	display:block;
	align-items:normal;
	background-color:#FFE6ED;
	padding-top:1vw;
	height:20vw;
}

#hd_left{
width:100%;
}

#header h1{
font-size:7vw;
line-height:7vw;
margin-left:2vw;
}

#hd_mitsuki_logo{
height:6vw;
}


#hd_right{
width:100%;
float:none;
clear:both;
padding-top:1vw;
}

#hd_right .tel{
font-size:6vw;
float:left;
margin:1vw 0 0 2vw;
}

.hdicon{
height:10vw;
}

.menu-btn {
height:10vw;
width:10vw;
}

.menu li {
width: 100%;
height: 15vw;
line-height: 15vw;
}

.menu li a {
font-size: 5vw;
}

.menu li#p_banner{
line-height: 16vw;
height: 16vw;
margin-bottom:4vw;
}

.menu li#p_banner img{
height: 16vw;
}

/* contents00
------------------------------------------------------------*/
#outer_notice{
	height:46vw;
}

.notice h2{
	font-size:3.5vw;
}

.notice, .notice p.update{
	font-size:3vw;
}

.notice ul{
	margin-left:8vw;
}

/* contents01
------------------------------------------------------------*/
#opening_hours, #facility{
	float:none;
	width:80%;
	margin:15vw auto;
	}
#schedule, #staff{
	float:none;
	width:80%;
	margin:15vw auto 0 auto;
}

#contents01 h2{
	font-size:5vw;
}

/* contents02
------------------------------------------------------------*/
#fee ul, #fee .fee_op {
width:100%;
}

#fee li{
	border-bottom:none;
}

#fee li span{
	font-size:3.5vw;
	font-weight:bold;
}

#fee li .fee_left, #fee li .fee_center{
	width:31%;
	padding-right:1%;
}

#fee li .fee_left{
	width:38%;
	display:table;
}

#fee li .fee_right, #fee li .fee_center{
	width:41%;
	padding-left:20%;
	display:table;
}

#fee .fee_op h2{
text-decoration:underline;
font-size:4vw;
}

#fee .fee_op div{
font-size:3.5vw;
}

#fee .sup_s{
	width:95%;
margin:-3.5vw auto 5vw;
font-size:3vw;
}

/* contents05
------------------------------------------------------------*/
#contents05{
	margin-bottom:15vw;
}

#contents05 h2, #contents05 h3, #contents05 h4, #contents05 h5{
	font-size:4vw;
}


/* contents07
------------------------------------------------------------*/
#contents07 p.sup_s{
	width: 95%;
	margin: 3.5vw auto 5vw;
	font-size: 3vw;
}
	
	
/* staff
------------------------------------------------------------*/
#staff01 .staff_data{
	text-align:center;
}

#staff01 .staff_photo{
	width:100%;
	float:none;
}

#staff01 img{
	height:100%;
	width:auto;
}

#staff01 .link_img{
height:50vw;
width:fit-content;
margin:0 auto;
}

#staff01 .staff_introduction, #staff01 .staff_name, #staff01 .data_box{
	position:static;
}

#staff01 .data_box{
	text-align:left;
	margin-top:3vw;
}

#staff01 .staff_introduction{
	float:none;
	width:100%;
	margin-top:3vw;
}

#staff01 .staff_name h2{
	font-size:5vw;
	line-height:5vw;
}

#staff01 li .data_left, #staff01 li .data_right{
	font-size:4vw;
	line-height:4vw;
}

/*  フッター
------------------------------------------------------------*/
#copyright{
	margin-top:15vw;
	margin-bottom:5vw;
font-size:4vw;
}





}