@charset "utf-8";






#tab-box-main{padding: 10px 12px 5px 0px ;}
.tab-btn {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .btn {
        flex-basis: 100%;
        text-align: center;
        writing-mode: vertical-rl;
    }
    .btn a {
        display: block;
        position: relative;
        font-size: 14px;
        padding: 8px 0px 8px 4px;
        text-decoration: none;
        color: #181716;
        background-color: none;
        cursor: pointer;
        border-radius: 10px 0px 0px 10px ;
        margin: 0px -1px 5px 0px ;
        border-top: 1px solid #CCC ;
        border-left: 1px solid #CCC ;
        border-bottom: 1px solid #CCC ;
    }
    .btn a.is-active {background-color: #f4f4f4;}

    .tab-contents-item {
        display: none;
        justify-content: center;
    }
    .tab-contents-item.is-active {
        display: block;
        width: 90vw ;
        max-width: 730px ;
        background-color: #f4f4f4;
        border: 1px solid #CCC ;
        border-radius: 0px 10px 10px 10px ;
    }
    .tab-contents-item.is-active>div.tabbox {
      animation:  fadeinAnime 2s forwards;
    }
    @keyframes fadeinAnime{
        from {opacity: 0;}
        to {opacity: 1;}
    }



#tab-contents h1{
	text-align: center ;
	margin: 10px auto 30px auto ;
	font-size: 160% ;
}
#tab-contents h2{
	width: 95% ;
	max-width: 600px ;
	text-align: left ;
	margin: 15px auto 0px auto ;
	padding: 15px 0px 10px 15px ;
	font-size: 150% ;
	border-top: 1px dotted #9EC8C3 ;
}


.tate{width: 40px ;}/*タブ名部分*/
.tabbox{/*タブの中身*/
	max-width: 700px ;
	padding: 20px 15px ;
	font-size: 14px ;
}
.tab-text01{
	max-width: 560px ;
	margin: 0px auto ;
	padding: 20px 20px 20px 20px ;
	background: #FFF ;
	border-radius: 10px ;
}
.fee-text01{
	margin: 5px auto 5px auto ;
	border-collapse: separate;
	border-spacing : 10px ;
}
.fee-text01 td{
	border-radius: 10px;
	padding: 3px 13px ;
	background: #FFF ;
	border: 1px solid #9EC8C3 ;
}
.map-icon{
	display: block ;
	height: 20px ;
	margin: 5px auto 10px auto ;
	padding: 10px 0px 0px 35px ;
	background: url(../images/mapicon1.png) left bottom no-repeat ;
}

.timetable{margin: 0px auto ;border: 2px solid #9EC8C3 ;}
.timetable th{
	border-top: 2px solid #9EC8C3 ;
	border-bottom: 2px solid #9EC8C3 ;
	border-left: 1px dotted #9EC8C3 ;
	border-right: 1px dotted #9EC8C3 ;
	padding: 5px 7px ;
	vertical-align:middle;
	background: #ebf6f5 ;
	font-weight: 700 ;
}
.timetable td{
	border: 1px dotted #9EC8C3 ;
	padding: 5px 10px ;
	vertical-align:middle;
	background: #FFF ;
}
.timetable tr{
	border: 1px solid #9EC8C3 ;
}
.timetable .border02{
	border-top: 2px solid #9EC8C3 ;
}
.timetable .week{
	background:#f5fdfc;
	font-size: 90% ;
}


.contact-link01{
	margin: 15px auto 0px auto ;
	padding: 20px 10px 10px 10px ;
	text-align: center ;
	border-top: 1px dotted #9EC8C3;
}
.contact-link01 a{
	padding: 7px 15px ;
	border-radius: 20px ;
	background: #81b8b1 ;
	font-weight: 700 ;
	color: #FFF ;
	text-decoration: none ;
}
.contact-link01 a:visited{
	color: #FFF ;
}
.contact-link01 a:hover{
	border-radius: 10px ;
	color: #FFF ;
	background: #9EC8C3 ;
}






.koriyama-pic,
.shirakawa-pic,
.sukagawa-pic{
	border-collapse: separate;
	border-spacing : 10px ;
}
.sukagawa-pic{
	width: 70% ;
	margin: 0px auto ;
}
.aikoukai-pic{
	width: 50% ;
	margin: 0px auto ;
}
.koriyama-pic td,
.shirakawa-pic td,
.sukagawa-pic td,
.aikoukai-pic td{
	font-size: 10px ;
	line-height: 170% ;
}
.koriyama-pic img,
.shirakawa-pic img,
.sukagawa-pic img,
.aikoukai-pic img{
	width: 100% ;
	border-radius: 5px ;
}
.koriyama-pic td.td-left{width: 33% ;}
.koriyama-pic td.td-center{width: 33% ;}
.koriyama-pic td.td-right{width: 33% ;}

.shirakawa-pic td.td-left{width: 38% ;vertical-align: middle ;}
.shirakawa-pic td.td-center{width: 38% ;vertical-align: middle ;}
.shirakawa-pic td.td-right{width: 24% ;vertical-align: middle ;}

.sukagawa-pic td.td-left{width: 64% ;}
.sukagawa-pic td.td-right{width: 36% ;}

.aikoukai-pic td{}




/*
	レスポンシブ：タブレット縦/スマホ横/スマホ縦
	@media screen and (max-width: 1024px) { }
	@media screen and (max-width: 896px) { }
	@media screen and (max-width: 480px) { }
*/


@media screen and (max-width:650px) {
	.timetable td{
		padding: 5px 7px ;
	}
	.tabbox{/*タブの中身*/
		font-size: 12.5px ;
	}

}

