@charset "UTF-8";

/*roomlist 教室一覧*/


.roomlist .jumbotron {
    background-image:url(../roomlist/img/h1.jpg)!important;
}

/*一覧*/

@media (min-width: 768px) {
	.plink{
		padding:0!important;
		padding-bottom:3rem!important;
		border-bottom:none;
	}
	
	.plink ul{
		margin:0!important;
		padding:0!important;
		list-style-type:none;
		text-align:center;
	}
	
	.plink li{
		display: inline-block;
		margin:0 .5rem 2rem;
		font-size:.8rem;
		text-align:center;
	}
	
	.plink a{
		position:relative;
	}
	
	.plink a::after{
		content:"";
		display:block;
		width:8px;
		height:8px;
		border-top:3px solid #2badd0;
		border-right:3px solid #2badd0;
		position:absolute;
		top: 1.5rem;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform:rotate(135deg);
		transition:transform 0.3s ease;
	}
	
	.plink a:hover:after{
		top:2rem;
		transition : .5s;
	}
	
}

@media screen and (min-width: 768px) and (max-width: 1200px) {
	.plink ul{
		text-align:left;
	}
}

@media (max-width: 767.98px) {
	.plink{
		padding:0!important;
		padding-bottom:3rem!important;
		border-bottom:none;
	}
	.plink ul{
		margin: 0 ;
		padding: 0 ;
	}
	
	.plink li{
		list-style: none;
		display: inline-block;
		width:32%;
		text-align:center;
		margin-bottom:1.5%;
		padding:0 .8%;
		font-size:.8rem;
	}
	
	.plink a{
		text-decoration: none;
		color: #000;
		width:100%;
		display:block;
		border:1px solid #dfdfdf;
		border-radius:9999px;
	}
	
	.plink a:hover{
		color:#fff;
		background:#2badd0;
		border:1px solid #dfdfdf;
		border-radius:9999px;
	}
}

@media (max-width: 380px) {
	.plink li{
		font-size:.7rem;
	}
}


.roomlist .room_col{
	padding:1rem!important;
	border-bottom: 1px dotted #999;
}

.roomlist .room_col h2{
	font-size:1.4rem!important;
	margin-bottom:1rem;
	line-height:2rem;
	letter-spacing:.1rem;
	font-weight:600;
}

.roomlist .room_col h2 span{
	color:#fff;
	font-size:.8rem;
	margin-right:8px;
	border-radius: 50%;
	display: inline-block;
    width: 3rem;
    height: 3rem;
	vertical-align:middle;
	text-align:center;
	padding-top:.5rem;
}

.roomlist .room_col h2 span.s{
	background:#025fa2;
	letter-spacing:-.05rem;
}
.roomlist .room_col h2 span.n{
	background:#2badd0;
	letter-spacing:0;
}

.new {
    font-size: 14px!important;
    background: #f00!important;
    color: #fff!important;
    padding: 0.2rem 0.5rem;
	margin-right:.5rem;
}

.roomlist .room_col .address{
	margin-bottom:1rem;
}

.roomlist .room_col .address a{
	text-decoration:underline;
}

.roomlist .room_col .address a:hover{
	text-decoration:none;
}

.roomlist .room_col .time{
	margin-bottom:1rem;
}

.roomlist .room_col .course{
	margin-bottom:1rem;
	text-indent: -5.5rem;
	padding-left: 5.5rem;
}

.roomlist .room_col .course br.no{
	display:none;
}

.roomlist .room_col .course span{
	padding:1px 5px 2px 5px;
	margin:0 1.5px;
	color:#fff;
	font-size:.8rem;
}

.roomlist .room_col .course span.s{
	background:#F08080;
}

.roomlist .room_col .course span.c{
	background:#3AB757;
}

.roomlist .room_col .course span.k{
	background:#00A9FF;
}

.roomlist .room_col .course span.kome{
	font-size:.9rem;
	color:#000!important;
}

.roomlist .room_col .yousu{
	text-align:right;
	margin-top:2rem;
}

.roomlist .room_col .yousu i{
	margin-right:5px;
	vertical-align:middle;
}

.roomlist .room_col .btn{
	background-color: #00a0e9!important;
    border-color: #00a0e9!important;
	color:#fff!important;
	font-weight:500!important;
	border-radius:2rem;
	padding-right:1rem!important;
	padding-left:1rem!important;
}

.roomlist .room_col .btn:hover{
	background-color: #fff!important;
    border-color:#00a0e9!important;
	color:#00a0e9!important;
}

.roomlist .room_col .map{
	margin-bottom:.5rem;
}

.roomlist .room_col .photo img,
.roomlist .room_col .map img{
	width:100%;
}

.roomlist .room_col .photo img{
	border:none;
}

.roomlist .room_col .gomap{
	text-align:right;
	font-size:.9rem;
}

.roomlist .room_col .gomap a{
	text-decoration:underline;
}

.roomlist .room_col .gomap a:hover{
	text-decoration:none;
}

.roomlist .room_col .gomap i{
	margin-right:5px;
	vertical-align:middle;
}

@media (767px < width < 999px) {
	.roomlist .room_col .course br.no{
		display:block;
	}
}

@media (max-width: 350px) {
	.roomlist .room_col .course br.no{
		display:block;
	}
	
	.roomlist .room_col .course{
		text-indent: -4.8rem;
		padding-left: 4.8rem;
	}
}

@media (max-width: 767.98px) {
	
	.roomlist .room_col .yousu{
		margin-bottom:2rem;
	}
	
	.roomlist .room_col .photo{
		margin-bottom:2rem!important;
	}

	.roomlist .room_col .btn{
		font-size:.9rem;
	}
	
	.roomlist .room_col h2{
		font-size:1.2rem!important;
	}

	.roomlist .room_col .gomap{
		font-size:.8rem;
	}
	
}


/*詳細ページ*/

.detail{
	margin-top:2rem;
}


.detail h2{
	text-align:center;
	font-size:1.3rem;
	font-weight:500;
	line-height:2.5rem;
	margin-bottom:5rem;
	text-align:center;
	position: relative;
	color:#2badd0;
}

.detail h2 br{
	display:none;
}

.detail h2::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 5px solid #2badd0;
    width: 4rem;
    margin: 0 auto -2rem;
}

.detail .cho{
	padding:5rem 0!important;
    border-bottom: 1px dotted #999;
}

.detail .cho h3{
	font-size:1.1rem;
	font-weight:600;
	margin-bottom:1.5rem;
}

.detail .cho .message{
}

.detail .cho .message .txt{
	font-size:.9rem;
	padding:0 .5rem;
}

.detail .image{
	padding:5rem 1rem 4rem!important;
    border-bottom: 1px dotted #999;
}

.detail .image .photo{
	font-size:.85rem;
	margin-bottom:2rem;
	text-align:left;
}

.detail .image .photo img{
	border:1px solid #aaa;
	margin-top:.3rem;
}

.detail .curr{
	padding:5rem 0 2rem!important;
}

.detail .curr .time{
	margin-bottom:2rem;
	text-align:center;
	font-size:1rem;
	font-weight:600;
}

.detail .curr h3{
	font-size:1.2rem;
	font-weight:600;
	margin-top:2rem;
	margin-bottom:1rem;
}

.detail .curr h3:before{
	content:"●"
}

.detail .curr h3.silia{
    color: #025fa2;
}

.detail .curr h3.next{
    color: #2badd0;
}

.detail .curr h3+dl{
	padding: 0;
	margin-bottom:0!important;
	line-height:1.8rem;
}

.detail .curr h3+dl dt {
	padding-bottom: 5px;
}

.detail .curr h3+dl dd {
	padding-bottom: 1rem;
}

.detail .curr dl dd ul{
	margin:0!important;
	padding:0!important;
	list-style-type:none!important;
}


@media screen and (min-width: 768px) {
	.detail .curr h3+dl dt {
		clear: left;
		float: left;
	}

	.detail .curr h3.silia+dl dt {
		width: 5rem;
	}

	.detail .curr h3.next+dl dt {
		width: 8rem;
	}

	.detail .curr h3.silia+dl dd {
		margin-left: 3rem;
	}

	.detail .curr h3.next+dl dd {
		margin-left: 8rem;
	}

	.detail .cho .photo,
	.detail .cho .text{
		padding-bottom:3rem!important;
	}
	
}

.detail .curr .table table{
	width: 100%;
	border-collapse: collapse;
	border:1px solid #999;
}

.detail .curr .table table th,
.detail .curr .table table td{
	border-top:none;
}

.detail .curr .table table tr{
	border-bottom:1px solid #dfdfdf;
}

.detail .curr .table table tr:first-child{
	background:rgba(46, 163, 195,0.7);
	color:#fff;
}

.detail .curr .table table tr:last-child{
	border-bottom: none;
}

.detail .curr .table table th{
	position: relative;
	text-align: left;
	width: 30%;
	background-color:#2badd0;
	color: white;
	text-align: center;
	padding: 10px 0;
}

.detail .curr .table table td{
	width: 10%;
	text-align: center;
	padding: 10px 0;
	border-right:1px solid #999;
}

.detail .curr .table table td.no{
	background:#efefef
}


@media (max-width: 768px) {
	
	.detail h2 br{
		display:block;
	}
	
	.detail .cho h3{
		font-size:1rem!important;
		line-height:1.8rem;
	}
	
	.detail .cho .photo{
		margin-bottom:2rem!important;
		text-align:center;
	}
	.detail .cho .photo img{
		width:70%!important;
	}

	.detail .curr .table table th,
	.detail .curr .table table td{
		font-size:.8rem;
		line-height:1.2rem;
	}
	
	.detail .curr h3{
		font-size:1rem;
	}

.detail .curr h3+dl dt {
	padding-bottom:0;
	line-height:1rem!important;
}

.detail .curr h3+dl dd {
	padding-bottom: .5rem;
	line-height:1.4rem!important;
}

	.detail .cho .text{
		padding-bottom:3rem!important;
	}
	
}


/*一覧ページ*/

.roomlist.list iframe{
	padding-top:5rem;
	border-top:1px dotted #999;
}

.roomlist.list iframe:first-child{
	padding-top:0!important;
	border-top:none!important;
}


/*インライン*/

.contents.in {
	margin:0!important;
}

.contents.in .row{
	margin:0!important;
}

.contents.in #naiyo{
	padding:0!important;
}

.contents.in .roomlist .room_col {
    border-bottom:none!important;
	padding:0!important;
}

main{
	margin-bottom:6rem!important;
}

.detail .plink{
	display:none;
}

.plink form {
  margin-bottom: 50px;
  display:none;
}

.plink form .link_menu {
	width: 100%;
	padding: 20px;
	font-size: 16px;
	cursor: pointer;
}

/*	@media (min-width: 768px) {
	
		.plink ul{
			display:block;
		}
	
		.plink form{
			display:none;
		}
	
	}
	@media (max-width: 768px) {
	
		.plink ul{
			display:none;
		}
	
		.plink form{
			display:block;
		}
	
	}*/

	@media (max-width: 768px) {
		.roomlist.list .container {
			padding-right: 0!important;
			padding-left: 0!important;
			}
			
		main{
			margin-bottom:3rem!important;
		}
	}



.roomlist .yt{
	margin-bottom:.5rem;
}

.roomlist .bu span{
	display: inline-block;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	text-align:center;
	line-height: 1.8rem;
	color:#fff;
	margin:3px;
}

.roomlist .bu span.k{
	background: #00A9FF;
}

.roomlist .bu span.c{
	background: #3AB757;
}

.roomlist .bu span.s{
	background: #F08080;
}
