@charset "Utf-8";




/* ------------------------------
 体験レッスン
------------------------------ */


#taiken{padding: 2em 1em;margin-bottom: 2em}


#taiken h2{
	color:#c4000a;
	font-size: 1.6em;
	margin-bottom: .8em
}

#taiken p{
	font-size: 1.2em;
	margin-bottom: 1em;
	line-height: 1.5em
}



dl#flow{
	padding: 1.5em;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: relative;
	background:#fef3f0;
	text-align: left
}
dl#flow dt{
	font-weight: bold;
	margin-bottom: 10px;
	font-size: 16px;
	color: #005000;
}
dl#flow dd{padding: 1em 0;border-bottom: 1px dotted #CCC;font-size: 1.2em}
dl#flow dd:last-child{
	border-bottom: none;padding-bottom: 0
}
dl#flow dd span{
	font-family: Arial, Helvetica, sans-serif;
	padding-right: 10px;
}

dl#flow dd a{
	font-weight: bold;
	text-decoration: underline;
	color: #98383C;
}
dl#flow dd a:hover{}


@media screen and (max-width: 667px) {}	

@media print, screen and (min-width: 668px) {
	#taiken{padding: 3em 0;margin-bottom: 2em;text-align: center}
	dl#flow{padding: 2em;}
	dl#flow dd{padding: 1em;}
}	

@media print, screen and (min-width: 1000px) {}	


.shuchou_l{
	background: #D5E9B0;
	padding: 3px 3px 5px;
	font-weight: bold;
	color: #333333;
	text-align: center;
}


/* ************************************************ 
 *	カレンダー
 * ************************************************ */
#cal_container {
	padding-top: 15px;
}

/* ************************************************ 
 *	料金・日程テーブル
 * ************************************************ */
 
.schedule{
	margin-bottom: 15px;
	line-height: 1.2em;
	color: #333333;
	width: 100%;
}


.schedule caption{
	text-align: left;
	padding-bottom: 10px;
	color: #336600;
	font-size: 13px;
}
.schedule th,
.schedule td{
	text-align: left;
	vertical-align: top;
	padding: .8em 1em;
	border-bottom: 2px solid #FFFFFF;
	line-height: 1.6em;
	background: #F7F7F7;
}

.schedule th{
	width: 115px;
	/*background: #EBEBEB;*/
	border-right: 1px solid #FFF;
}

.schedule td{
	/*background-color: #F7F7F7;*/
	line-height: 1.4em;
}

.sindex th,
.sindex td{
	font-size: 85%;
	color: #666;
}


#course h2{
	margin-bottom: 25px;
	padding-top: 20px;
	text-align: left;
}

/* ************************************************ 
 *	各コース紹介用・インデックス
 * ************************************************ */


#course_index{}

#course_index h2{
	margin-bottom: 4em;
	font-weight: normal;
	text-align: center;
}
#course_index h2 span{
	font-size: 2em;
	padding-right: .5em;
	letter-spacing: .1em;
	font-family: 'Quicksand';
	font-weight: 300
}



/*各アトリエ*/
.box{
	border-bottom: 1px solid #DFDFDF;
	margin: 0 auto 2em;
	padding-bottom: 1.5em;
}

.lesson_info{text-align: left;}

.lesson_content h4{
	font-size: 1.3em;
	line-height: 1.2em;
	text-align: left;
	margin: 5px 0 8px;
}

.lesson_content h4 a{
	color: #005000;
}

.lesson_content h4:before{
	font-family: icomoon;
	content: "\e9e3";
	color: #d6d67e;
	padding-right: 5px
}




.shousai{}

.shousai a{
	position: relative;
	background: #fed8ca;
	text-decoration: none;
	display: block;
	margin: 1em auto 0;
	-webkit-transition: all .3s;
	transition: all .3s;
	font-weight: bold;
	color: #9e3f3f;
	border-radius: 4px;
}

.shousai a:hover{
	background: #9e3f3f;
	color: #fff
}
.shousai a:before{
	padding-right: 5px;
	font-size: .8em;
	content: "▶︎";
}





@media screen and (max-width: 667px) {
	.box,.ls_etc{width: 90%;margin: 0 auto 2em;}
	.lesson_info{
		display: flex;
		justify-content: space-between;
		flex-wrap:wrap;
		margin-bottom: 1em;
	}
	.lesson_icon{width: 130px;}
	.lesson_content{width: calc(100% - 150px);}
	.shousai{margin-bottom: .5em;width: 100%}
	.shousai a{padding: .6em 1em;font-size: 1.2em;
		text-align: center
	}
	
}	

@media print, screen and (min-width: 668px) {
	.lesson_info{
		display: flex;
		justify-content: space-between;
		flex-wrap:wrap;
		margin-bottom: 1em;
	}
	
	.lesson_icon{width: 140px;}
	.lesson_icon img{width: 100%;height: auto;
		border-radius: 5px;
		position: relative;
	}
	.lesson_content{width: calc(100% - 240px);padding-left: 1.5em}
	.lesson_content h4{font-size: 1.4em;}
	.lesson_content p{margin-right: 2em;}
	.shousai{width: 100px;margin: 1em auto 0;}
	.shousai a{
		display: flex;
		justify-content: center;
		align-items: center;
		height: 70px;
		width: 70px;
		border-radius: 50%;}
}	

@media print, screen and (min-width: 1000px) {}	



.month{
	font-size: 12px;
	font-weight: bold;
	color: #4C4C4C;
	padding-bottom: 3px;
	text-align: left;
	padding-left: 10px;
}


.ls_etc span{
	color: #c4000a
}


/* ************************************************ 
 *	各レッスン詳細ページ
 * ************************************************ */

#course{}
#course h2{
	border-left: none;
	padding-top: 20px;
	padding-left: 0px;
	letter-spacing: 0.1em;
	margin-bottom: 1em;
	color: #005000;
	font-size: 1.4em;
	}

#course h2 span{
	display: block;
	color: #999;
	border-bottom: 2px dotted #CCCCCC;
	padding-bottom: .5em;
	margin-bottom: .5em;
	font-weight: normal;
	font-size: 2rem;
	font-family: 'Quicksand';
	font-weight: 300
}


 /*イントロ文*/
.intoro{
	line-height: 1.8em;
	margin-bottom: 2em;
} 


#lesson_img{
	margin-bottom: 2em;
	width: 100%;
	height: auto
}


@media screen and (max-width: 767px) {
	#course{width: 90%;margin: 0 auto}
}	

@media print, screen and (min-width: 668px) {}	

@media print, screen and (min-width: 1000px) {}	
 /*イントロ文*/
.memo{
	font-size: 13px;
	font-weight: bold;
	line-height: 1.5em;
	margin-bottom: 15px;
	margin-top: 10px;
	margin-left: 3px;
	color: #663300;
} 
 
/*ベーシックレッスン写真*/ 
#recipe_menu{
	display: flex;
	flex-wrap:wrap;
	margin-bottom: 20px;
}
#recipe_menu div {position: relative}
#recipe_menu .left{
	width: 56.3%;
	border-right: 5px solid #fff;
}
#recipe_menu .right{width: 42.7%;}

#recipe_menu div span{
	position: absolute;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
	color: #333;
	padding: 1px 3px;
	line-height: 1.2em;
}
.mark_a{
	left: 10px;
	bottom: 10px;
}
.mark_b{
	left: 10px;
	bottom: 10px;
}
.mark_c{
	left: 10px;
	bottom: 10px;}

.rtop{
	margin-bottom: 5px;
}
/*スペシャルレッスン写真*/
#sp_photo{
	padding-bottom: 20px;
}

/*写真キャプション*/
ul#caption{
	margin-bottom: 20px;
	list-style: none;
	font-size: 85%;
	font-weight: bold;
	margin-left: 5px;
}

ul#caption li{}
ul#caption li span{
	color: #CC6666;
	padding-right: 5px;
}


#menu_list{
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px dotted #900;
}

#menu_list dl{
	padding-right: 5px;
	padding-left: 5px;
	margin-bottom: 20px;
}
#menu_list dt{
	margin-bottom: 8px;
}
#menu_list dd{
	font-size: 93%;
	margin-right: 10px;
	margin-left: 10px;
	margin-bottom: 2px;
}


.back_index{
	max-width: 400px;
	margin: 0 auto 3em;
}
.back_index a{
	display: block;
	border-radius: 50px;
	position: relative;
	text-decoration: none;
	color: #fff;
	background: #c4000b;
	padding: .8em 1.5em;
	text-align: center;
	-webkit-transition: all .3s;
	transition: all .3s;
	font-size: 1.2em;
	
}

.back_index a:hover{
	background: #ac000a;
}

@media screen and (max-width: 667px) {
	.back_index{margin: 0 1em 3em;}
}	



#lesson_class{margin-top: 3em}


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



@media screen and (max-width: 667px) {
	
	#lesson_class ul{margin: 0 auto}
	
	#lesson_class ul li{
		width: calc( ( 100% - 20px ) / 2 );
		margin: 0 20px 1em 0;
		display: flex;
		justify-content: space-between;
		flex-wrap:wrap;
		align-items: center;
	}
	
	#lesson_class ul li:nth-child( 2n ) {margin-right: 0;}
	
			
	#lesson_class ul li div:nth-child(1){width:60px;}
	
	#lesson_class ul li div:nth-child(2){
		width: calc(100% - 70px);
		font-size: 1.1em;font-weight: bold;}
}	

@media print, screen and (min-width: 668px) {
	#lesson_class{margin-bottom: 5em;}

	#lesson_class ul{}
		
	#lesson_class ul li{
	width: calc( ( 100% - 80px ) / 5 );
	margin-right: 20px;
	}
	
	#lesson_class ul li:nth-child( 5n ) {margin-right: 0;}
	
	#lesson_class ul li{position: relative}
	
	#lesson_class ul li div:nth-child(1){
		width:100% !important;
		height:auto;}
	
	#lesson_class ul li div:nth-child(2){
		position: absolute;
		bottom: 0;
		display: block;
		width: 100%;
		padding: .5em .6em;
		font-weight: bold;
		background: rgba(255, 255, 255, 0.58);
	}

}	

