@charset "UTF-8";



/* .top-menu-col
------------------------------- */
.top-menu-col{
margin:1em auto;
line-height:1.2;
list-style:none;
}

.top-menu-col a{
position:relative;
display:block;
margin:0.8em 0.2em;
padding:10px;
color:#412121;
background-color:rgba(204,153,102,0.5);
text-decoration:none;
font-size:140%;
}

.top-menu-col a:after{
position:absolute;
right:2%;
top:50%;
content:'\f107';
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
font-size:120%;
color:#412121;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
transform:translateY(-50%);
}

.top-menu-col a:hover{
background-color:rgba(204,153,102,0.3);
}



/* u.outline
------------------------------- */

ul.outline{
border:#CCC solid 1px;
margin:1em;
padding:0.5em;
background-color:#FFF;
font-size:120%;
}

ul.outline.children{
background-color:rgba(237,201,56,0.1);
}

ul.outline.senior{
background-color:rgba(204,102,153,0.1);
}

ul.outline li{
padding:0.2em;
}

ul.outline li:before{
display:inline-block;
margin:0 5px 0;
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
content:"\f1b0";
color:#F90;
font-size:120%;
}

ul.outline.children li:before{
color:#EDC938;
}

ul.outline.senior li:before{
color:#CC6699;
}



/* classes-col
---------------------- */

.classes-col{
font-size:120%;	
}

.classes-col > div{
position:relative;
}

.classes-col > div h3{
margin-top:2em !important;
margin-bottom:1em !important;
}

.image-col{
margin:0 auto;
text-align:center;
}

.image-col img{
max-height:160px;
}



.for-children{
margin-top:2em;
margin-bottom:2em;
padding:0.5em;
background-color:#F7F0BB;

background-color:rgba(237,201,56,0.1);
border:rgba(237,201,56,0.5) solid 8px;
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
}

.for-children h4{
margin-top:0 !important;
}


.for-elderly{
margin-top:2em;
margin-bottom:2em;
padding:0.5em;
background-color:#EFD8F1;

background-color:rgba(204,102,153,0.1);
border:rgba(204,102,153,0.5) solid 8px;
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
}

.for-elderly h4{
margin-top:0 !important;
}


/* figure
---------------------- */

.figure-col{
max-width:460px;
margin:5px auto;
padding:5px 5px;
text-align:center;
}

figure{
margin:0 auto;
padding:0.3em;
border:#666 solid 1px;
background-color:#FFF;
}

figcaption{
padding:0.2em;
color:#FFF;
font-weight:700;
text-shadow:1px 1px 2px #333;
}

.for-children figure{
border:#EDC938 solid 1px;
}

.for-children figcaption{
background-color:#EDC938;	
}


.for-elderly figure{
border:#CC6699 solid 1px;
}

.for-elderly figcaption{
background-color:#CC6699;
}


.overview{
max-width:360px;
}

.overview th{
width:6em;
}


.inquiries-applications a{
display:block;
margin:1em auto 2em;
width:300px;
height:60px;
line-height:60px;
font-size:120%;
color:#FFF;
background-color:#FF9900;
text-align:center;
text-decoration:none;
-webkit-transition:0.2s;
-moz-transition:0.2s;
-o-transition:0.2s;
-ms-transition:0.2s;
transition:0.2s;
}

.inquiries-applications a:hover{
background-color:#FFCC00;
position:relative;
left:0;
top:0;
}



/* イベント
------------------------------- 


ul#newsList{
margin:0 0 15px;
padding:0;
font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

ul#newsList li{
color:#666;
font-size:12px;
margin:0;
padding:5px 0;
margin-bottom:3px;
border-bottom:1px dotted #CCC;
line-height:120%;
list-style-type:none;
}


ul#newsList a{
position:relative;
}

ul#newsList a li:hover{
background-color:#FEF7E7;
}




ul#newsList li a{
pointer-events:none;
color:#333;
text-decoration:none;
font-weight:700;
font-size:120%;
}


ul#newsList li span{
margin:5px;
padding:5px;
}


.catName.class{
display:inline-block;
padding:3px 8px;
font-size:11px;
line-height:100%;
margin:0 2px;
background-color:#20AD86;
color:#FFF;
}

.catName.event{
display:inline-block;
padding:3px 8px;
font-size:11px;
line-height:100%;
margin:0 2px;
background-color:#48ABD4;
color:#FFF;
}


.newMark{
display:inline-block;
padding:1px;
font-size:14px;
line-height:100%;
color:#F00;
font-style:italic;
}

.comment{
display:block;
padding:5px 0;
font-size:120%;
line-height:1.5;
}

.thumbNailWrap{
display:block;
width:110px;
float:left;
height:80px;
overflow:hidden;
}





.pager{
text-align:right;
padding:10px;
clear:both;
}

.pager a{
border:1px solid #999;
border-radius:5px 5px 5px 5px;
color:#333;
font-size:12px;
padding:3px 7px 2px;
text-decoration:none;
margin:0 1px;
}

.pager a.current{
background:#999;
border:1px solid #999;
border-radius: 5px 5px 5px 5px;
color:#FFF;
font-size:12px;
padding:3px 7px 2px;
margin:0 1px;
text-decoration:none;
}

.pager a:hover{
background:#999;
color:#FFF;
}

.overPagerPattern{
padding:0 2px ;	
}





#up_ymd{
text-align:right;
font-size:13px;
margin:5px 10px;
}

.detailUpfile{
margin:5px 0 35px;
text-align:center;
}

.backORcloseBtn{
text-align:center;
line-height:100%;
margin-top:15px;
}

.backORcloseBtn a{
display:inline-block;
padding:4px 15px;
border:1px solid #AAA;
color:#999;
border-radius:6px;
text-decoration:none;
font-size:12px;
}
.detailUpfile img{
max-width:100%;
height:auto;
}
.pNav{
font-size:11px;	
}



#detail{
padding:1em;
line-height:1.5;
font-size:140%;	
}


*/


@media all and (min-width:700px) {
	
/* .top-menu-col
------------------------------- */
.top-menu-col{
display:flex;
align-items:stretch;
max-width:900px;
}

.top-menu-col a{
flex:1;
text-align:center;
margin:1em;
padding-bottom:2em;
}

.top-menu-col a span {
display:block;
margin-bottom:0.5em;
font-size:120%;
}

.top-menu-col a:after{
position:absolute;
right:0;
left:0;
top:75%;
}


/* classes-col
---------------------- */

.classes-col{
display:flex;
}

.classes-col > div{
flex:1;
margin:1em;
}

.classes-col > div h3{
margin-top:2em !important;
margin-bottom:1em !important;
}

.classes-col table{
min-width:400px;
}

.image-col{
position:static;
margin:0 auto;
}

figcaption{
padding:0.4em 0.2em !important;
}

}