@charset"UTF-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

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

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;  
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

	img{
		width:100%;
		max-width:100%
			height:auto
			
	}	 /* リセットCSS終了 */

           
	

	body{   background-color:#80c49;/* body全体 */
		font-size:10px;
	
	}
	      
	/* ヘッダー開始 */
	header{position: fixed;
		height:85px;
		background-color:white;
		text-align:right;
		width:100%;
	padding-bottom:10px;
}
	
	header .logo{height:60px;
		position:absolute;
		top:10px;
		left:0;
	}
	
	.logo img{width:150px;
		      height:40px;
	}
	
	.mail-img{display:inline-block;
		margin-right:20px;
		margin-top:30px;
	
	}
	
		.mail-img a{color:black;
			
	}
	
	
	/* ヘッダー全体終了*/
	
	 
	body{   background-color:#80c49;/* body全体 */
		font-size:10px;
		
		
	}
	 /*メニュー*/
	.cc-check{display:none;
		
	
	}
	
	.c-check{
		display:flex;
		height: 20px;
		width: 20px;
		justify-content:center;
		align-items:center;
		position:relative;
		z-index:100;
		cursor:pointer;
		padding-top:10px;
		
	}
	
	.c-check span,
	.c-check span:before,
	.c-check span:after{
		content:'';
		display:block;
		height: 2px;
		width: 20px;
		border-radius: 3px;
		background: #333;
		transition:0.5s;
		position:absolute;

		
		
	}
		
	.c-check span:before{
		bottom:6px;
	}
	
	.c-check span:after{
		top:6px;
	}
		
	#check:checked ~ .c-check span{
		background:rgba(255, 255, 255,0);
	}
	
	
	#check:checked ~ .c-check span::before{
		bottom:0;
		transform:rotate(45deg);
	}
			
	#check:checked ~ .c-check span::after{
		top:0;
		
		transform:rotate(-45deg);
	}	
	
	#check:checked ~ #content{transform:translateX(0px);
		
		
	}
		#content{background-color:#fffafa;/*メニュー内容*/
		width: 100%;
		min-height:100vh;
		text-align:center;
		transform: translateX(-100%);
		transition: 0.5s;
	}
    
	  #content h3{
	    font-size: 20px;
		padding-top:15px;
	    padding-bottom:20px;
	padding-left:3px;
	font-family: 'League Gothic', sans-serif;
	}
	
	#nav li{list-style-type:none;
		border-bottom:solid 1px #dcdcdc;
		margin-left:20px;	
	margin-right:20px;	
		
	}

	
	#nav li	a{text-decoration:none;
		font-size: 12px;
		line-height: 50px;
		padding-left:3px;
		color:black;
		display:block;
		font-family: 'Roboto', sans-serif;
	}
	
	label{margin-left:10px;
		
	}
	
	  
	.kochira h2 a{
		font-size:16px;
		font-family: 'BIZ UDPGothic', sans-serif;
		text-decoration:none;
		font-weight:bold;
	}
	
	
	.kochira{
		text-align:center;
		background-color:#dcd6d2;
		width:100%;
	
	}
	.f-inner a{
		font-family: 'BIZ UDPGothic', sans-serif;
	}
	
		/*aboutのページ*/
		
		.about{
			padding-top:100px;
			text-align:left;
		width:100%;
			padding-bottom:50px;
		
			
		}
	.a-tes{
		margin:0 auto;
		width:80%;
	
	}
	.namae{
		width:100%;
		text-align:right;
	}
		.about p{
			font-size:14px;
		line-height:35px;
		font-family: 'BIZ UDPGothic', sans-serif;
		
			
	}
	.a-tes-mes{
		margin:50px 30px 30px 30px;
		padding:50px 30px 50px 50px;
	
		background-color:#f5f5f5;
	}
	.zikan{
		margin:20px 30px 100px 30px;
		padding:10px 30px 50px 50px;
	
		background-color:#f5f5f5;
	
		
	}
		
		/*イベント企画のページ*/
		
		.event-page{
		width:100%;
			display:inline-block;
		text-align:center;
		padding-bottom:100px;
		background-color:#f5f5f5;	
			
			
		}
		
	.event-page h1{
		font-size:40px;
		font-family: 'League Gothic', sans-serif;

	       color:#54917f;
		padding-top:120px;
		padding-bottom:30px;
		font-weight:bold;
		}
	
		
	.event-page p{
		     font-size:14px;
		line-height:20px;
		font-family: 'BIZ UDPGothic', sans-serif;
		font-weight:bold;
	}
	

	.end-event-img{
		margin-left:20px;
		margin-right:20px;
		width:90%;
	    margin-top:50px;
		margin-bottom:70px;
		text-align:center;
	
		}
	.end-event-img p{
		font-size:10px;
		text-align:left;
	}
	
	.end-event-img a p{
		font-size:14px;
		text-align:left;
	}
	
	
	
	
		/*リペアのページ*/
		
		.rep-page{
			width:100%;
			background-color:#dcd6d2;
		text-align:center;
		
		
	}
		

	
	
	
	.rep-img{
		width:250px;
		height:300px;
		text-align:center;
		display:inline-block;
		margin-top:20px;
		
		}	
	.rep-page-m	{
		width:100%;
		text-align:left;
		box-sizing: border-box;
		padding:30px 30px 30px 30px;
		padding-right:30px;
		
	}
			
	
		
	.rep-page h1{
		    font-size:40px;	
		padding-top:100px;
		color:#54917f;
		font-family: 'League Gothic', sans-serif;
		font-weight:bold;
	
		}
		
		.rep-page h2{
			font-size:15px;
		line-height:40px;
		color:#54917f;
		font-family: 'League Gothic', sans-serif;
		font-weight:bold;
		
	
			
		}
		.rep-page p{
		     font-size:14px;
		line-height:30px;
		font-family: 'BIZ UDPGothic', sans-serif;
	
		
	}
	.kihon ul li .naiyo{
		     font-size:14px;
		line-height:30px;
		font-family: 'BIZ UDPGothic', sans-serif;
		
	}
		
	
	.rep-page ul{
		text-align:left;
		
		
		}
		.kihon{
			
			display:inline-block;
			text-align:center;
		}
		.rep-page h3{
			font-size:16px;
		font-weight:bold;
		color:#bc611e;
		font-family: 'BIZ UDPGothic', sans-serif;
		font-weight:bold;
		}
		.kihon2{
			width:100%;
		text-align:center;
		margin-top:30px;
		padding-bottom:30px;
		
	}
	.kihon2 h3{
		font-size:14px;
		
	}
	.kochira a{
	font-family: 'BIZ UDPGothic', sans-serif;
		font-weight:bold;
	}
	.kochira p{
		    font-size:14px;
		line-height:30px;
		font-family: 'BIZ UDPGothic', sans-serif;
		
		
	}
	


	
		
		
	label{
		
			margin-top:10px;
			margin-bottom:5px;
		display:block;
		font-weight:bold;
		}
	

			


			
		
		
		

		
		/*infoのページ*/
		
		.info{
			padding-top:100px;
			text-align:center;
		width:100%;
			margin-bottom:50px;
	
			
		}
.a-tes{
		margin:0 auto;
		width:80%;

	}
	
	
	.info-t h1{
	font-size:30px;
	font-family: 'BIZ UDPGothic', sans-serif;
		
		
	}
	
	.info-con{
		margin:30px 30px 30px 30px;
		text-align:left;
		
		
	}
	
	.info-con time{
	font-size:12px;
	font-family: 'BIZ UDPGothic', sans-serif;
	}
	
	.info-con p{
	font-size:20px;
	font-family: 'BIZ UDPGothic', sans-serif;
	
	}
	
	.info-con ul li{
		list-style-type:none;
	}
	
	.info-con ul {
	}
	.info-con1{
		margin-bottom:30px;
		padding-top:30px;
	}
	
		.info p{
			font-size:14px;
		line-height:24px;
		font-family: 'BIZ UDPGothic', sans-serif;
		font-weight:bold;
			
	}
	
	.kuwasiku{
		text-align:left;
		margin:30px 30px 30px 30px;
	}
	.kuwasiku p{
		font-family: 'BIZ UDPGothic', sans-serif;
	
	}			
	
	.info-naiyo p{
	font-weight:normal;
	font-family: 'BIZ UDPGothic', sans-serif;
	}
	.info-naiyo{
	background-color:#fdf5e6;
		margin-left:30px;
		margin-right:30px;
		text-align:left;
		padding:30px 30px 30px 30px;
			
	}

	


	.con1-title{/*料金プランのページ*/
	margin-bottom:30px;
	margin-left:20px;
	
	}
	
.con1-title{
	text-align:left;
	
}
.con1-title span p{
	font-size:20px;
	
}
	.con-naiyo p{
	font-weight:normal;
	font-family: 'BIZ UDPGothic', sans-serif;
	line-height:30px;
	font-size:14px;
	
	
	}
	.con-naiyo{
	background-color:#fdf5e6;
		margin-left:30px;
		margin-right:30px;
		text-align:left;
		padding:30px 30px 30px 30px;
	}
	
			
	.ev-pic .pic1{
		
		text-align:center;
		margin-left:20px;
		margin-right:20px;
	}	
		
	.pic1{
		margin-top:14px;
	}	
		
	.ev-pic .pic2{
		margin-left:6px;
		margin-right:6px;
	}	
			
	/*shop */	
		.shop-page{
		width:100%;
			display:inline-block;
		text-align:center;
		padding-bottom:100px;
		background-color:#f5f5f5;	
	
			
		}
		
	.shop-page h1{
		font-size:20px;
		font-family: 'Roboto', sans-serif;
        text-align:center;
     	color:#54917f;
		padding-top:120px;
		padding-bottom:30px;
		font-weight:bold;
		}
		
		
	.shop-page li a p{
		font-size:;
		line-height:20px;
		font-family: 'BIZ UDPGothic', sans-serif;
		font-weight:bold;
		
	}
	.shop-page li time{
		font-size:10px;
		line-height:;
		font-family: 'BIZ UDPGothic', sans-serif;
		font-weight:normal;
		
	}	
		
	.shop-page h2 a {
		font-size:16px;
		font-family: 'BIZ UDPGothic', sans-serif;
		text-decoration:none;
		font-weight:bold;
		color:#bc611e;
		text-align:center;
	}
	
	
	.shop-box{
		font-size:16px;
		text-align:left;
		list-style:none;
		margin-left:40px;
		margin-top:30px;
	}
	
	/*shop-item */	
	
			.shopitem{
			padding-top:100px;
			text-align:center;
		width:100%;
			margin-bottom:50px;
	
			
		}
.a-tes{
		margin:0 auto;
		width:80%;

	}
	
	
	.shopitem h1{
	font-size:30px;
	font-family: 'BIZ UDPGothic', sans-serif;
		
		
	}
	
	.shopitem-con{
		margin:30px 30px 30px 30px;
		text-align:left;
		
		
	}
	
	.shopitem-con time{
	font-size:12px;
	font-family: 'BIZ UDPGothic', sans-serif;
	}
	
	.shopitem-con p{
	font-size:20px;
	font-family: 'BIZ UDPGothic', sans-serif;
	
	}
	
	.shopitem-con ul li{
		list-style-type:none;
	}
	
	.shopitem-con ul {
	}
	.shopitem-con1{
		margin-bottom:30px;
		padding-top:30px;
	}
	
		.shopitem p{
			font-size:14px;
		line-height:24px;
		font-family: 'BIZ UDPGothic', sans-serif;
		font-weight:bold;
			
	}
	.shopitem-pic{
		display:grid;
		grid-template-columns:1fr 1fr ;
		gap:10px;
	}
	
	
	.kuwasiku{
		text-align:left;
		margin:30px 30px 30px 30px;
	}
	.kuwasiku p{
		font-family: 'BIZ UDPGothic', sans-serif;
	
	}			
	
	.shopitem-naiyo p{
	font-weight:normal;
	font-family: 'BIZ UDPGothic', sans-serif;
	}
	.shopitem-naiyo{
	background-color:#fdf5e6;
		margin-left:30px;
		margin-right:30px;
		text-align:left;
		padding:30px 30px 30px 30px;
			
	}


			/*フッター*/				
		.footer{
			
			background-color:#432;
		text-align:center;
		display:inline-block;
		width:100%;
		padding-bottom:20px;
		
	}
	
		footer .f-inner{
		color:#fff;
		text-align:center;
	width:100%;
		display:inline-block;
		
		
	}
			
	.f-inner h1{font-size:12px;
		padding-top:10px;
		
		font-family: 'BIZ UDPGothic', sans-serif;
		
	}	
		
	.f-inner h2{
		padding-bottom:20px;
		padding-left:20px;
		color:white;
		font-family: 'BIZ UDPGothic', sans-serif;
	}
		
	
	footer p{
		
		color:white;
		font-family: 'BIZ UDPGothic', sans-serif;
	}
		
	footer .mail-img a{color:white;
		
	}
	footer a{text-decoration:none;
		color:white;
	}	
	
	
	
	
				
		
	/*タブレット表示*/	
		@media(min-width:700px){
			
			
			.vocal{display:flex;	/*レッスン*/						
                text-align:center;
			width:100%;
			justify-content:center;
			
			
		}
		.lesson-mes {
		text-align:center;
			width: 100%;
	}
		
	    .guitar-annai{

	     padding-top:15px;
	     width:400px;
	     height:450px;
        
			margin-top:50px;
			
         }
	 .vocal-annai{

	     padding-top:15px;
	     width:400px;
	     height:400px;
        
	   	margin-top:50px;
         }
	
	    .guitar-annai span{font-weight:bold;
				}	
		
		
		.vocal{display:flex;					
              justify-content:center;   
	    width:100%;
		}
		
	   
	    .vocal-annai span{font-weight:bold;
				}	
		
		.event-img{width:500px;	/*イベント 開始*/	
			height:700px;
			text-align:center;
			display:inline-block;
			margin-bottom:0px;
			}
		.end-event-img{width:500px;
			height:700px;
			text-align:center;
			display:inline-block;
			
			}	
	
			

		.event-page h1{
			
			padding-top:100px;
		}
		.c-check{
	display:none;
	}	
	
	#content{background-color:#fffafa;/*メニュー内容*/
		
		text-align:left;
		width:;
			min-height:0;
			transform: translateX(0%);
		margin-top:20px;
	}
	
	#nav li	a{text-decoration:none;
		font-size: 8px;
		line-height: 0px;
		padding-left:3px;
		color:black;
		display:inline;	
		justify-content:space-between;
	}
	#nav li{
		display:inline-block;	
		
	}
	#content h3{
		display:none;
	}
	.a-tes{
	
		width:50%;

	}
		
	
			
			.shopitem-pic{
		display:grid;
		grid-template-columns:1fr 1fr 1fr 1fr;
		gap:10px;
	}	
			
	
			
	}
		
	/*pc表示*/	
		@media(min-width:1000px){
		
	
		
	   
	   
		.toiawase{padding-top:20px;
		}

		.toiawase h2{
			padding-bottom:10px;
		}
		
		
		.event-img{width:500px;
			height:700px;
			text-align:center;
			display:inline-block;
			margin-bottom:0px;
			}
		.end-event-img{width:500px;
			height:700px;
			text-align:center;
			display:inline-block;
			
		}	
		
	
			
	.c-check{
	display:none;
	}	
	
	#content{background-color:#fffafa;/*ハンバーガーメニュー内容*/
		
		text-align:left;
		width:;
			min-height:0;
			transform: translateX(0%);
		margin-top:20px;
	}
	
	#nav li	a{text-decoration:none;
		font-size: 8px;
		line-height: 0px;
		padding-left:3px;
		color:black;
		display:inline;	
		justify-content:space-between;
	}
	#nav li{
		display:inline-block;	
		
	}
	#content h3{
		display:none;
	}
			/*aboutのページ*/
		
	
	.a-tes{
	
		width:40%;

	}


	
	.info img{
				width:50%;
				height:100%;
			}
.shopitem-pic{
		display:grid;
		grid-template-columns:1fr 1fr 1fr 1fr;
		gap:10px;
	}	
			
		}