@charset "UTF-8";
/***********************************************/
/* HTML tag styles                             */
/***********************************************/

body{
background-color:#fff;
margin:0;
min-width:640px;
padding:0;
text-align:center;
-webkit-text-size-adjust: none;}

div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fildset,input,textarea,p,blockquote,table,th,td,address{
margin:0;
padding:0;
color:#333;
font-style:normal;
font-family: tbcinergothic-std, sans-serif;
font-size:14px;
line-height:161%;
word-wrap:break-word;
letter-spacing: 1px;}

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

table{
	width:100%;}

table th{
	width:30%;
	padding:30px 20px;
    background-color:#D5EAF6}

table td{
	padding:30px;}
	
table th,
table td{
	border-bottom:1px dotted #fff;
	vertical-align:middle;}

textarea,input{margin:0;padding:0}

caption,th{text-align:left}
td,th{vertical-align: top}

fieldset,img,abbr{border:none}
li{list-style-type:none}
hr{display:none}

a,a:link{color:#00afcc;overflow:hidden;text-decoration:none;}
a:visited{color:#00afcc}
a:hover{color:#00afcc;text-decoration:underline;}
strong{font-weight:bold}

img{vertical-align:bottom}

img.smp,
br.smp{display:none}

input[type="text"]{
	padding:10px;
	width:80%;
    vertical-align : middle;}

.sizeSmall input[type="text"]{
    width: 20%;}

textarea{
	width:100%!important;
	height:200px!important;
    box-sizing: border-box;}

.btn input{
    width: 100%;
    background-color:#00afcc;
    border: none;
    color:#fff;
    padding: 20px;}

.tabNav{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 1200px;
    margin: 0 auto 80px;
}
.tabNav li{
    display: block;
    text-align: center;
    width: 50%;
    min-width: 33.333%;}

.tabNav li a{
    display: block;
    text-align: center;
    padding: 40px 0;
    background-color: #fff;
    transition: 0.3s;
    color:#00afcc;
    border: 1px solid #00afcc;
    box-sizing: border-box;
    position: relative;
    overflow: visible;}

.tabNav li a:hover,
.tabNav li a.c{
    text-decoration: none;
    background-color: #2F83B5;
    border: 1px solid #2F83B5;
    color:#fff;
}

.tabNav li a span{
    display: block;
    position: absolute;
    width: 80px;
    height: 80px;
    box-sizing: border-box;
    padding: 28px 0;
    font-size: 140%;
    font-weight: bold;
    background-color: #FF7F00;
    color: #fff;
    top: -20px;
    left: -10px;
    border-radius: 50%;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
.tabContWrap .tabCont {
  visibility: hidden;
  height: 0;
}
.tabContWrap .tabCont.c {
  visibility: visible;
  height: auto;
}

/***********************************************/
/* layout divs                                 */
/***********************************************/

#wrapper{
min-width:1200px;
position:relative;
overflow:hidden}

/***********************************************/
/* #head style                                 */
/***********************************************/

#head{
	background:url(../img/common/headBg.png) 50% top repeat;
	width:100%;
    position: fixed;
	z-index:99;
    border: 1px solid #00afcc;}

#head .inner{
	text-align:left;
	margin: 0 auto;
	height:100px;
	width:100%;
	position:relative;}

#head #headLogo{
	position:absolute;
	top:10px;
	left:40px;
	width:152px;
	height:80px;
	background:url(../img/common/logo.png) left top no-repeat;
	text-indent:-9999px;
	z-index:999;}

#head .inner #headLogo a{
	display:block;
	width:100%;
	height:100%;}

#head .inner #navArea{
	position:absolute;
	top:0px;
	right:0;}

#head #headContact{
	position:absolute;
	top:8px;
	right:0;
	text-align:right;
	margin-bottom:10px;
	color:#fff;}

#head p.openTime,
#head #headContactMob{
	display:none;}

#head #headContact a#mailCont{
	margin-left:20px;
	width:100px;
	padding:0 0 0 45px;
	background:url(../img/common/headMailIcon.png) left 50% no-repeat #00afcc;
	color:#fff;
	text-decoration:none;}
	
#head #headContact a#mobCont,
#head #headContact a#telCont{
	font-weight:normal;
	color:#fff;
	padding: 3px 0 3px 25px;
	background:url(../img/common/headMobIcon.png) left 50% no-repeat;
	margin-left:20px;}
	
#head #headContact a#telCont {
	background:url(../img/common/headTelIcon.png) left 50% no-repeat;}

#head #headContact a#mobCont:hover,
#head #headContact a#telCont:hover{
	text-decoration:none;}

#head #linkArea ul{text-align:right;}

#head #linkArea ul li{
    display:inline-block; 
    zoom:1 // IE7以下;
	padding:7px 0 7px 18px;
	margin-left:20px;
	background:url(../img/common/listIcon.jpg) left 50% no-repeat;}

#head #linkArea ul:before,
#head #linkArea ul:after{content:"";display:table;}
#head #linkArea ul:after{clear:both;}
	
#head #inner:before,
#head #inner:after{content:"";display:table;}
#head #inner:after{clear:both;}

#head #menuBtn{display:none}

#head #navArea{
    position: absolute;
    top:0;
    right: 20px;}

#head #navArea ul#gnav li{
	float:left;
	border-left:1px solid #80D7E6;
    text-align: center;
    font-weight:lighter;}

#head #navArea ul#gnav li.nav05{
    background-color: #2F83B5;}

#head #navArea ul#gnav li.nav06{
    background-color: #FF6737;}

#head #navArea ul#gnav li.nav06 a strong{
    font-size: 161%;
    font-weight: normal;}

#head #navArea ul#gnav li a{
    height: 65px;
    color:#FFE7E5;}

#head #navArea ul#gnav li:hover{
	background-color:#2F83B5;}

#head #navArea ul#gnav li:hover > a{
	text-decoration:none;}

#head #navArea ul#gnav li span,	
#head #navArea ul#gnav li span a{
	display:block;}
	
#head #navArea ul#gnav li .navChild{
	display:none;
	position:fixed;
	top:100px;
	left:0;
	width:100%;
	background-color:#333;
	color:#fff;
	z-index:5;}

#head #navArea ul#gnav li a{
	display:block;
     padding: 26px 20px 10px;}

#head #navArea ul#gnav li .navChild .inner{
	color:#fff;
	margin:0 auto;}

#head #navArea ul#gnav li .navChild .inner ul{padding-left: 200px;}

#head #navArea ul#gnav li .navChild .inner ul li{
	padding:20px;
	margin-right:20px;
	height:auto;}

#head #navArea ul#gnav li .navChild .inner ul li a{
	font-weight:bold;
	color:#fff;}

/***********************************************/
/* #foot style                                 */
/***********************************************/

#pageTop{
    text-align: center;
    width: 100%;
    background-color: #2F83B5;}

#pageTop a{
    display: block;
    padding: 20px 0;
    text-align: center;
    color:#FFE7E5;}

#foot{
	background-color:#00afcc;
	padding:40px 0;}

#foot .inner {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;}

#foot .inner #linkArea {
    width: 100%;
    padding-bottom: 40px;
    border-bottom: 1px dotted #fff;
    margin-bottom: 40px;}

#foot .inner #linkArea ul{
    justify-content: center;
    display: flex;}

#foot .inner #linkArea ul li{
    margin-right: 20px;
    margin-left: 20px;}

#foot .inner #linkArea ul li:last-child{
    margin-right: 0;}

#foot .inner #linkArea ul li a{
    color: #FFE7E5;}
    
#foot .inner .pdf{
    width: 100%;
    padding-bottom: 40px;
    border-bottom: 1px dotted #fff;
    margin-bottom: 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#foot .inner .pdf p{
    width: 48%;}

#foot .inner .corpInfo{
	width:740px;
    display: flex;
    text-align: left;}

#foot .inner .corpInfo .leftArea{
    text-align: left;}
    
#foot .inner .corpInfo p{
	color:#FFE7E5;
    margin-right: 40px;}

#foot .inner .corpInfo p a{
    color:#FFE7E5;}
	
#foot .inner ul#footSns{
    display: flex;
    justify-content: flex-end;}

#foot .inner ul#footSns li{
    margin-left: 40px;}

address{
	padding:10px 0;
	width:100%;
	background-color:#2F83B5;
	color:#FFE7E5;}

/***********************************************/
/* #main style                                 */
/***********************************************/

a:hover img {
opacity: .7;
-webkit-opacity: .7;
-moz-opacity: .7;
filter: alpha(opacity=70);	/* IE lt 8 */
-ms-filter: "alpha(opacity=70)"; /* IE 8 */}
 
a img {
-webkit-transition: opacity 0.5s ease-out;
-moz-transition: opacity 0.5s ease-out;
-ms-transition: opacity 0.5s ease-out;
transition: opacity 0.5s ease-out;}

#main{
margin:0 auto;
padding:0;
position:relative;
text-align:left;}

#index #main{width:100%}

h1{z-index:0;}

#h1Area{
    position: relative;
	padding:220px 0 150px;
	background:url(../img/common/sech1Bg.jpg) 50% top no-repeat;
	margin-bottom:80px;}

h1{
    width: 1200px;
	border-bottom:1px solid #fff;
	padding:0 0 20px;
	margin:0 auto 20px;
	color:#FFE7E5;
    line-height: 300%;
	font-weight:normal;
    font-style: italic;}
	
h1 span{
	font-size:300%;}

#h1Area p{
    color: #FFE7E5;
    text-align:center;}

section h2{
    border-top: 2px solid #00afcc;
    background: url(../img/access/h2Border.jpg) left 50% no-repeat;
    padding: 10px 0 10px 30px;
	font-size:161%;
    text-align: left;
	font-weight:normal;
    border-bottom: 1px dotted #00afcc;
    margin-bottom: 40px;}

h2 span{
	color:#00afcc;
	font-size:200%;
    font-style: italic;
    display: block;}

.btn{
	width:400px;
	text-align:center;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
	background:#fff;
    -webkit-transform: skew(-15deg,0);
    -moz-transform: skew(-15deg,0);}

.btn input,
.btn a{
	display:block;
	padding:20px 20px;
	color:#FFE7E5;
	background-color:#2F83B5;
	font-size:100%;
	text-decoration:none;
	transition: 0.3s ;}

.btn input:hover,
.btn a:hover{opacity: 0.5 ;}

.inner {
	width:1200px;
	margin: 0 auto;}

#linkPath{
    position: absolute;
    bottom:0;
    width: 100%;
    background: url(../img/common/headBg.png) repeat;}

#linkPath ul{
    display: flex;
    padding: 10px 0;}

#linkPath ul li{
    color: #fff;
    padding-right: 26px;
    background: url(../img/common/pathAlor.png) right 50% no-repeat;
    margin-right: 20px;}

#linkPath ul li:last-child{
    background: none;
    padding-right: 0;
    margin-right: 0;}

#linkPath ul li a{color:#fff;}

.outLine{
    border: 10px solid #D5EAF6;
    padding: 20px;
    margin-bottom: 80px;}

/***********************index***********************/
    
#pcSlider{display:block;}

#smahoSlider{display: none;}

#index #vaArea{
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;}


#index #vaArea h1{
    position: absolute;
    bottom: 160px;
    left: 0;
    padding: 40px 160px 40px 80px;
    color:#00afcc;
    font-size: 417%;
    z-index: 98;
    text-align: left;
    font-style: italic;
    line-height: 120%;
    border: none;
    background: url(../img/common/h1Bg.png) right 50% no-repeat;
    width: 730px;}

#index #vaArea h1 span{font-size:40%;}

#index dl#news{
    display: flex;
    z-index: 98;}

#index dl#news dt{
    min-width:30%;
    padding: 20px 40px;
    color:#FFE7E5;
    font-size: 161%;
    background-color: #2F83B5;
    text-align: center;}

#index dl#news dd{
    padding: 30px 140px 20px 40px;
    width: 70%;
    background-color:#00afcc;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
    color: #fff;}

#index dl#news dd a{
    color: #fff;}

#vaslider {
    position: relative;
	margin-top:40px;
	width: 100%;
	height: 100vh;
	max-height:1200px;
	z-index: 0;}

#vaslider p.todayIcon{
    position: absolute;
    bottom:10px;
    left: 0;
    right: 0;
	z-index: 2;}

#vaslider .flexslider{
	width:100%;
	height:100vh;
	max-height:1200px;
	z-index:0;}

#index .flexslider ul.slides{
	width:100%;
	height:100vh;}

#index .flexslider ul.slides li{
	width:100%;
	height:100vh;
	max-height:1200px;
	position:relative;
	overflow:hidden;}

#index .flexslider ul.slides li img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
#index .flexslider ul.slides li dl,
#index .flexslider ul.slides li h2{
    color:#fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
#index .flexslider ul.slides li dl dt img{
    width: 360px;
    height: auto;
    margin: 0 auto 40px;
}
#index .flexslider ul.slides li dl dd{
    font-size: 161%;
    color:#fff;
}
#index .flexslider ul.slides li h2{
    width: 100%;
    font-size: 300%;
    line-height: 300%;
}
#index .flexslider ul.slides li h2 strong{
    font-size: 300%;}

#index section h2{
    text-align: center;
    background: none;
    border: 0;}

/************* TEL *************/

#index #tel{
    padding: 40px 0;
}
#index #tel .inner{
    position: relative;
    transition: 0.3s;
}
#index #tel .inner h2{
    padding: 40px;
    margin: 0;
    font-size: 100%;
    line-height: 300%;
}

#index #tel .inner:hover{
    opacity: 0.7;}

#index #tel .inner h2 strong{
    font-size: 259%;
    color: #2F83B5;}

#index #tel .inner a{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent: -9999px;
}
/*************ABOUT US*************/

#index #about{
    background: url(../img/common/Bgcolor.png) repeat;}

#index #about .inner{
    padding: 160px 0;
    display: flex;}

#index #about .inner h2{
    padding-top: 80px;
    width: 500px;
    color:#00afcc;}

#index #about .inner h2 strong{font-size: 200%;}

#index #about .inner .rightArea{width: 900px;}

#index #about .inner .rightArea p.reed{
    color:#00afcc;
    font-size: 141%;
    margin-bottom: 30px;}

/*************course*************/

#courseList{
    display: flex;
    flex-wrap:wrap;
    margin: 0 auto;}

.item{
    box-sizing: border-box;
    border: 1px solid #fff;
    width: 100%;}

.item a{
    display: flex;
    transition-duration: 0.3s;
    text-decoration: none;
    min-height:260px;}

.item dl{
    width: 66%;
    box-sizing: border-box;
    text-align: left;
    padding: 60px 40px;
    color: #FFE7E5;
    background-color:#00afcc;}

.item:nth-child(even) > a dl{background: #2F83B5;}

.item dl dt{
    color:#FFE7E5;
    font-weight: normal;
    padding-bottom: 40px;
    border-bottom: 1px dotted #fff;
    margin-bottom: 40px;}

.item dl dt strong{
    font-size: 259%;
    line-height: 140%;
    font-weight: normal;}

.item dl dd{
    color:#FFE7E5;
    margin-bottom: 40px;
}
.item dl dd.price strong{
    font-size: 161%;}

.item dl dd.moreBtn{
    padding: 10px 40px;
    border: 1px solid #FFE7E5;
    text-align: center;
    width: 50%;
	transition-duration: 0.3s;	/*変化に掛かる時間*/
    transition: 0.3s;}

.item dl dd.moreBtn:hover{
    background-color: #fff;
    color: #00afcc;}

.item .itemPhoto {
    text-align: center;
	overflow: hidden;	/*拡大時にはみ出た部分を隠す*/
    width: 30%;	/*画像の幅*/
	height: auto;
}
.item .itemPhoto img {
	height:  100%;
    width: 100%;
    object-fit: cover;
	transition-duration: 0.3s;	/*変化に掛かる時間*/
    transition: 0.3s;}


.item .itemPhoto img:hover {
	transform: scale(1.1);	/*画像の拡大率*/
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}

.item p{
    width: 4%;
    border-left: 1px dotted #fff;
    text-indent: -9999px;
    background: url("../img/index/courseList/linkIcon.png") 50% 50% #2F83B5 no-repeat;
    
}

/*************couseDetail*************/

#courseDetail #h1Area {
    background: url(/img/course/play/vaBg.jpg) 50% top repeat-x;
}

#courseDetail #main h2{
    text-align: center;
    border: none;
    background:none;
    width: 100%;
padding: 0;}

#courseDetail #main h2 strong{
    font-size: 200%;
    font-weight: normal;
    color:#00afcc;
    line-height: 120%;
    margin-bottom: 40px;}

#imgArea{
    background: url(../img/course/common/imgBg.jpg) left 50% top 110px no-repeat;
    margin-bottom: 80px;}

#imgArea .inner{
    display: flex;
}

.mainVisual{
    width: 722px;
	margin-bottom:40px;}

.mainVisual .flex-viewport{
    width: 722px;
	height:448px;
	margin-bottom:10px;}

.mainVisual .slides li{
    position: relative;
}

.mainVisual .slides li img{
    margin: 0 auto;
    height: 100%;
    width: auto;}

.mainVisual .flex-control-thumbs li{
	width:134px;
	margin-right:10px;
    margin-bottom: 10px}

.mainVisual .flex-control-thumbs li img{
    width: 100%;}

#detailArea{
    width: 398px;
    padding: 150px 40px 40px;}

#courseDetail #main #detailArea h2{
    padding: 0;
    border: none;
    margin-bottom: 40px;
    background: none;
    text-align: left;
    color:#00afcc;}

#courseDetail #main #choiceArea{
    margin-bottom: 80px;
}

.choiceTable tr th{
    font-size: 259%;
    text-align: center;
}

#courseDetail #main #priceArea{margin-bottom: 80px;}

#courseDetail #main #priceArea .inner table{border: 1px solid #00afcc;}

#courseDetail #main #priceArea .inner table tr th{
    text-align: center;
    padding: 20px;
    font-size: 161%;
    font-weight: normal;
    width: 25%;
    color:#fff;
    background-color:#00afcc; }

#courseDetail #main #priceArea .inner table tr th span{
    font-size: 64%}

#courseDetail #main #priceArea .inner table tr td{
    padding: 40px;
    box-sizing: border-box;
    width: 25%;
    line-height: 161%;}

#courseDetail #main #priceArea .inner table tr td strong{
    text-align: left;
    line-height: 161%;
    color:#FF7F00;
    font-size:161%;}

#courseDetail #main #priceArea .inner table tr td.time{
    text-align: left;}

#courseDetail #optionArea {
    margin-bottom: 80px;
}

#courseDetail #optionArea .inner{
    display: flex;
    flex-wrap: wrap;
}

#courseDetail #optionArea dl{
    display: flex;
    margin-bottom: 10px;
    width: 50%;
}
#courseDetail #optionArea dl dt{
    box-sizing: border-box;
    width: 50%;
    padding: 20px 40px;
    background-color: #00afcc;
    border: 1px solid #00afcc;
    font-weight: bold;
    color: #fff;}
#courseDetail #optionArea dl dd{
    padding: 20px 40px;
    box-sizing: border-box;
    width: 50%;
    border: 1px solid #00afcc;
    text-align: right;}
#courseDetail #optionArea dl dd strong{
    font-weight: normal;}


#courseDetail #infoArea .btn{
    margin: 0 auto 80px;
    width: 722px;}

#courseDetail #infoArea .btn a{
    padding: 40px;
font-size: 161%;
background-color:#FF7F00;}


/*************ACCESS*************/

#index #access {
    padding: 80px 0 0;
    background: url(../img/common/Bgcolor.png) repeat;}

#index #access p{
	margin-bottom:40px;
	text-align:center;}

#index #access p.btn{
	margin: 0 auto;
	margin-bottom:80px;
}

/************* INSTAGRAM *************/

#index #insta h2 img{
    margin-bottom: 20px;}
    
#index #insta{
    padding: 80px 0;
}

#index #insta .inner ul.instagram{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 70px;
}

#index #insta .inner ul li{
    margin: 0 10px 10px 0;
    overflow: hidden;
    height: 232px;
    width: 232px;}

#index #insta .inner ul li:nth-child(5n){
    margin-right: 0;}

#index #insta .inner ul li img{
    min-width: 100%;
    height: 232px;}

#index #insta .inner #insta-window{
    border: none!important;
    margin: 0!important;
    padding: 0!important;
}

#index #insta .inner #insta-window .iswd-profile{
    display: none;
}

#index #insta .inner #insta-window .iswd-images{
}

#index #insta .inner #insta-window .iswd-images .iswd-images-item{
    padding: 0!important;
    width: 24%!important;
    margin-bottom: 10px;
    margin-right: 10px;
}
#index #insta .inner #insta-window .iswd-images .iswd-images-item:nth-child(4){
    margin-right: 0;}

.iswd-copyright-wrapper{
    display:none;
}

/************* WEATHER *************/

#weather{
    background-color: #00afcc;
    padding: 80px 0;
    color:#fff;
}
#weather h2,
#weather h2  span{color:#fff;}
#weather table.mamewaza_weather tr{
}
#weather table.mamewaza_weather tr th{
    width: 12.5%;
    color:#fff;
    background-color: transparent;
    border:  1px dotted #fff;
}
#weather table.mamewaza_weather tr td{
    border:  1px dotted #fff;
    color:#fff;}

/*************STAFF BLOG*************/

#index #blog{
background: url(../img/common/Bgcolor.png) repeat;
padding: 80px 0}

#index #blog .inner{
	width:1200px;
	margin:0 auto 40px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
	flex-wrap: wrap;
	justify-content: space-between;}

#index #blog .inner .blogItem{
	position:relative;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
	flex-wrap: wrap;
	width:580px;
	margin-bottom:40px;
	transition:0.3s;}

#index #blog .inner .blogItem:hover{
	opacity:0.5;}

#index #blog .inner .blogItem p.imgArea,
#index #blog .inner .blogItem dl{
	display:inline-block;}
	
#index #blog .inner .blogItem p.imgArea{
	margin-right:20px;
	height:160px;
	width:160px;
	overflow:hidden}
	
#index #blog .inner .blogItem p.imgArea img{
	object-fit: cover;
	width: 160px;
	height:160px;}
	
#index #blog .inner .blogItem dl{
	width:400px;}
	
#index #blog .inner .blogItem dl dt{
	font-weight:bold;
	margin-bottom:12px;
	color:#00afcc;}
	
#index #blog .inner .blogItem dl dd{
	margin-bottom:12px;}
	
#index #blog .inner .blogItem dl dd.date{
	color:#FF7F00}

#index #blog .inner .blogItem a.linkArea{
	position:absolute;
	width:100%;
	height:100%;
	text-indent:-9999px;}

#index #blog p.btn{
	margin:0 auto 80px;}

/*************FAQ*************/

#faq #h1Area{background: url(../img/faq/vaBg.jpg) 50% top repeat-x}

section#faq{margin-bottom:80px;}

section#faq h2{
	margin-bottom:0;
	padding-bottom:40px;
	border-bottom:3px solid #00afcc;}
	
.faq dl{
	padding:0 80px 0 40px;
    margin-bottom: 40px;
	border:1px dotted #00afcc;
	border-top:3px solid #00afcc;
	background:url(../img/faq/plusIcon.png) right 50% no-repeat #fff;
	cursor:pointer;}

.faq dl dt{
	padding:30px 0 30px 50px;
	background:url(../img/faq/QIcon.png) left 50% no-repeat;
	font-weight:bold;}

.faq dl dd{
	border-top:1px dotted #ccc;
	padding:30px 0 30px 50px;
	background:url(../img/faq/AIcon.png) left top 30px no-repeat;
	display:none;}

.faq dl.open{
	background:url(../img/faq/minusIcon.png) right 50% no-repeat #EFF0F4;}

/***********************COURSE***********************/

#course #h1Area {
    background: url(../img/course/common/vaBg.jpg) 50% top repeat-x;
}

#course #courseList{
    margin-bottom: 80px;
}
#course #courseList .inner{
    display: flex;
    flex-wrap: wrap;
}


/***********************course***********************/

/******************STAFF******************/

#staff #h1Area {
    background: url(/img/common/vaBg.jpg) 50% top repeat-x;
}

#staff .inner .staffItem{
    box-sizing: border-box;
    width: 100%;
    padding: 40px 0 40px 560px;
    margin-bottom: 80px;
    min-height: 411px;
}
#staff .inner .staffItem:nth-child(even){
    padding: 40px 560px 40px 0;}
    

#staff .inner .staffItem h2{
    background: #00afcc;
    border: none;
    color:#fff;
    box-sizing: border-box;
    padding:40px;
    -webkit-transform: skew(-15deg);
    -moz-transform: skew(-15deg);
}

#staff .inner .staffItem h2 strong{
    font-size: 200%;
    line-height: 140%;}

#staff .inner .staffItem dl{
    padding: 0 80px;
}

#staff .inner .staffItem dl dt{
    font-size: 161%;
    color: #00afcc;
    -webkit-transform: skew(-15deg);
    -moz-transform: skew(-15deg);
    margin-bottom: 20px;}

#staff .inner .num01{background: url("../img/staff/kobayashi.jpg") left 50% no-repeat;}
#staff .inner .num02{background: url("../img/staff/kohei.jpg") right 50% no-repeat;}
#staff .inner .num03{background: url("../img/staff/jiei.jpg") left 50% no-repeat;}
    


/******************ACCESS******************/

#access #h1Area{background:url(../img/access/vaBg.jpg) 50% top no-repeat;}

#access #main{
	width:1200px;}

#access section{
    margin-bottom: 80px;
}

#access section #mapArea{height: 500px;}

#access section#address .inner dl{display:flex;}

#access section#address .inner dl dt{width: 100px;}
    
/******************contact******************/

#contact #h1Area{
    background: url(../img/faq/vaBg.jpg) 50% top repeat-x;
}

#contact #mailArea p,
#contact #telArea p{
    margin-bottom: 40px;
}
#contact #telArea p.telCont{
    border: 10px solid #DCDEE9;
    text-align: center;
    padding: 40px;
    margin-bottom: 80px;
    line-height: 300%;
}
#contact #telArea p.telCont strong{
    font-size: 361%;
    color:#00afcc;}

#contact #mailArea table{
    margin-bottom: 40px;
}

#contact #mailArea .btn{
    margin: 0 auto 20px;
}
/******************thanks******************/

#thanks #main{
	width:1200px;
	margin:0 auto 80px;}

#thanks section .btn{
	margin: 80px auto;}

#thanks section .btn a{
	background-color:#FF7F00;}


/******************contact******************/

#tokusho #h1Area{
    background: url(../img/tokusho/vaBg.jpg) 50% top repeat-x;
}
	
/******************個人情報保護******************/

#discPage #h1Area {
    background: url(/img/common/vaBg.jpg) 50% top repeat-x;
}

#discPage #main section h2{
	font-size:140%;
	background-color:#E5F6FD;
	text-align:left;
	padding:10px 20px;}

#discPage #main section p{
	margin-bottom:40px;}

#discPage #main section ul{
	margin-bottom:40px;
	margin-left:20px;}

#discPage #main section ul li{
	margin-bottom:20px;
	list-style-type:square;}
	
/******************　おすすめマップ ******************/

#mapLink .inner ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background: url("../img/map/tizuImg.jpg") 50% 50% no-repeat;
    background-size:40%; 
    min-height: 620px;
}

#mapLink .inner ul li:nth-child(2n){
    margin-left: 470px;
}

#mapLink .inner ul li a{
    display: block;
    padding: 40px 80px;
    font-size: 161%;
    width: 200px;
    color: #fff;
    text-decoration: none;
    text-align: center;
    transition: 0.3s;
}
#mapLink .inner ul li a:hover{
    opacity: 0.7;
}


#mapLink .inner ul li:nth-child(1) a{background-color: #91AE7E;}
#mapLink .inner ul li:nth-child(2) a{background-color: #B8472C;}
#mapLink .inner ul li:nth-child(3) a{background-color: #B62E7C;}
#mapLink .inner ul li:nth-child(4) a{background-color: #55AEB2;}
#mapLink .inner ul li:nth-child(5) a{background-color: #FF9623;}
#mapLink .inner ul li:nth-child(6) a{background-color: #2F83B5;}

#comMap .inner dl{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 80px;
}

#comMap .inner dl dt{
    width: 100%;
    font-size: 161%;
    padding: 20px 40px;
    margin-bottom: 40px;
    border-left: 5px solid #00afcc;
}

#comMap .inner dl dd{
    padding: 20px;
    border: 1px solid #00afcc;
    width: 348px;
    margin-bottom: 10px;
}

#comMap .inner dl.teike dd{
    padding: 0;
    width: 590px;
}
#comMap .inner dl.teike dd a{
    display: block;
    padding: 20px;
    text-align: center;
    transition: 0.3s;
}
#comMap .inner dl.teike dd a:hover{
    background-color: #00afcc;
    color:#fff;
    text-decoration: none;
}

/******************サイトマップ******************/
#sitemap #h1Area {
    background: url(/img/common/vaBg.jpg) 50% top repeat-x;
}

#sitemap #main section{
	margin-bottom:80px;}

#sitemap #main section ul li{
	width:100%;
	border-bottom:1px dotted #00afcc;}

#sitemap #main section ul li:first-child{
	border-top:1px dotted #00afcc;}

#sitemap #main section ul li a{
	display:block;
	widows:100%;
	height:100%;
	padding:20px;}

/******************会社概要******************/
#company #h1Area {
    background: url(/img/common/vaBg.jpg) 50% top repeat-x;
}
#company #main{
	width:1200px;}

#company #main #googleMap{
	margin-bottom:80px}

/******************ご予約******************/


#reservation #h1Area {
    background: url(/img/common/vaBg.jpg) 50% top repeat-x;
}

#reservation #main{
    width: 1200px;
    background: none;
    margin:  0 auto 80px;
}

#reservation #main h2{
    text-align: center;
    border: none;
    background: none;
    width: 100%;
    padding: 0;
    
}

#reservation #consent{
	text-align:center;
	margin: 0 0 40px;
}

#reservation #consent .mfp_err{
	text-align:center;
}


#reservation #consent p{
	margin:0 0 20px;
}

#reservation #consent input{
    width: auto;
    margin: 0 10px 0 0;}

#reservation tr#note  th{
	text-align:center;
}

#reservation #flow{
	margin: 0 0 30px;
}

#reservation #main .payDatel{
	margin: 0 20px 30px;
}

#reservation #main h2{
	margin: 0 0 30px;
}

#reservation #main h3{
	text-align:center;
}

#reservation #main .sectionH3{
	margin:0 20px 30px;
}

#reservation #main .sectionH3 table{
	border:none;
}

#reservation #main .sectionH3 table th{
	width:30%;
	padding: 20px 70px 20px 20px;
}

#reservation #main .sectionH3 table th,
#reservation #main .sectionH3 table td{
	background:none;
	border: 1px dotted #ccc;
	border-width: 1px 0px 0px;
}

#reservation #main .sectionH3 table tr#note th,
#reservation #main .sectionH3 table tr#courseTr th,
#reservation #main .sectionH3 table tr#courseTr td{
	border:none;
}

#reservation #main .sectionH3 table #optArea.non{display:none}

#reservation #main .sectionH3 table tr.noneBorder th,
#reservation #main .sectionH3 table tr.noneBorder td{
	border-width: 0;
}

#reservation #main .sectionH3 table th.required{
	background:url(http://okinawa-bluelink.com/img/reservation/requiredIcon.jpg) right no-repeat;
}
#reservation #main .sectionH3 table tr#sendTr th,
#reservation #main .sectionH3 table tr#sendTr td{
	border-bottom:none;
}

#reservation #main .sectionH3 #paymant table,
#reservation #main .sectionH3 #paymant table th,
#reservation #main .sectionH3 #paymant table td{
	border-width: 0;
}

#reservation #main .sectionH3 #paymant table span{
	color:#333;
}

#reservation #main .sectionH3 #paymant table td{
	padding: 10px 20px;
}

#reservation #main .sectionH3 #paymant table tr{
	border: 1px dotted #ccc;
	border-width: 0px 0px 1px;
}

#reservation #main .sectionH3 #paymant table th{
	background:#F0F0F0;
	text-align:center;
	padding:10px 20px;
}

#reservation #main .sectionH3 #paymant table td#priBre,
#reservation #main .sectionH3 #paymant table td#numBre,
#reservation #main .sectionH3 #paymant table td#totBre{
	text-align:right;}


#reservation #main .sectionH3 #paymant tr#totalPri th{
	font-size:200%;
	font-weight:bold;
	text-align:left;
	padding:20px;
}

#reservation #main .sectionH3 #paymant #totalPri #totalPrice span,
#reservation #main .sectionH3 #paymant #totalPri #totalPrice{
	color:#FF8932;
	text-align:right;
}

#reservation #main .sectionH3 #paymant table tr.priDown td,
#reservation #main .sectionH3 #paymant table tr.priDown td span{
	color:#FF0100;
	background-color:#FFF4F4;
}

#reservation #main .sectionH3 #paymant table tr#retPreTr td,
#reservation #main .sectionH3 #paymant table tr#retFreeTr td,
#reservation #main .sectionH3 #paymant table tr#senPreTr td,
#reservation #main .sectionH3 #paymant table tr#senFreeTr td{
	text-align:center;
}

#reservation #main .sectionH3 input[type="text"],
#reservation #main .sectionH3 input[type="email"],
#reservation #main .sectionH3 textarea{
	margin: 10px 0;
    padding: 20px;
    width: 80%;
}

#reservation #main .sectionH3 input#optSle{
    width: auto;
    margin:  0 10px 0 0;
    padding: 0;
}

#reservation #main .sectionH3 select{
	padding:10px;
    width: 250px;
	margin: 10px 10px 10px 0;
}
#reservation #main .sectionH3 #courseTr select,
#reservation #main .sectionH3 #renTimeTr select{
	width:400px;
	padding:10px;
	margin: 10px 10px 10px 0;
}

#reservation #main .sectionH3 #choiceTr h3{
    padding: 15px;
    text-align: left;
    background-color: #00afcc;
    margin-bottom: 20px;
    color:#fff;
}

#reservation #main .sectionH3 tr#optTr select{
	width:150px;
}

#reservation #main .sectionH3 select.optSel{
	width:80px;
	margin: 0 10px 10px 0;
}

#reservation #main checkbox,
#reservation #main #optArea input{
	margin:10px 0;
	width:30px;
}

form#mailformpro input[type="text"], form#mailformpro textarea{
    padding: 10px;
}

form#mailformpro textarea{
    width: 100%;
    height: 300px;
}

form#mailformpro input[type="text"]{
    padding: 20px 0;
}

form#mailformpro input[type="radio"]{
    padding:0;
    width: 10%;
}

form#mailformpro input[type="checkbox"]{
    margin-right: 10px;
}

#reservation #main #consentForm{
	margin: 0 20px 0;
}

#reservation #main #consentForm dl{
	width:730px;
	margin: 0 0 50px;
	padding:20px;
	border:1px solid #BB0706;
	background-color:#FFDCD0;
	
}

#reservation #main #subCourseCont,
#reservation #main #dNumCont{display:none}

#reservation #main #consentForm dl dt,
#reservation #main #consentForm dl dd{
	border:none;
	float:left;
	margin: 0 0 0 19px;
	padding:0;
	width:auto;
}

#reservation #main #consentForm dl dt{
	margin: 0;
}
/****** Cleafix ******/
#reservation #main #consentForm dl,
#reservation #main #consentForm dl{content: " ";display: table;}
#reservation #main #consentForm dl{clear: both;}
#reservation #main #consentForm dl{*zoom: 1;}
/****** Cleafix ******/

#reservation #main .submitBtn{
	text-align:center;
}

#reservation #main .submitBtn input{
	height:55px;
	margin: 0 0 60px;
}

#reservation #main .topBtn{
	margin: 40px 0 0;
	text-align:center;
}

#reservation p.payP{
	margin:20px 0 0;
	text-align:center;
	font-size:14px;
	font-weight:normal;
	text-height:160%;
}

#loadHide{
	display:none;
}

#reservation .hidenNone{display:none;}
#reservation .hidenBlock{display:block;}

#reservation table tr.paySele th{
	margin:0;
	padding:0;
}

#reservation #main .sectionH3 table th.paysele{
	width:100px;
	padding:20px;
}

#reservation #main .sectionH3 table th.paysele input{
	width:100px;
}

#reservation #main .sectionH3 td.birthday select{
	width:70px;
}

#reservation #main .btn input{
    width: 100%;
    padding: 20px;
     background-color: #00afcc;
     font-size: 100%;
    text-decoration: none;
    transition: 0.3s;
    color:#FFE7E5;
    border: none;}

#reservation #main .btn input:hover{
    opacity: 0.7;}

#reservation #main .sectionH3 textarea{
    width: 80%;
    height: 200px;}

#reservation #main .btn{
    margin: 0 auto;
}

form#mailformpro label.mfp_checked{
    display: block;
    padding: 10px;
}

form#mailformpro label.mfp_not_checked{
    display: block;
    padding: 10px;
}