@charset "UTF-8";
:root{
	--body : #222;
	--link : #222;
}
@media screen and (max-width: 768px){
	#main{
		padding-bottom : calc( 191 * 100vw / 375 );
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#main{
		padding-bottom : calc( 671 * 100vw / 1300 );
	}
}
@media print,screen and (min-width: 1300px){
	#main{
		padding-bottom : 671px;
	}
}
@media screen and (max-width: 768px){
	#toHome{
		margin-top : calc( 50 * 100vw / 375 );
	}
	#toHome li + li{
		margin-top : calc( 40 * 100vw / 375 );
	}
}
@media print,screen and (min-width: 769px){
	#toHome ul{
		display : flex;
		justify-content : center;
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#toHome{
		padding-top : calc( 140 * 100vw / 1300 );
	}
	#toHome li + li{
		margin-left : calc( 40 * 100vw / 1300 );
	}
}
@media print,screen and (min-width: 1300px){
	#toHome{
		margin-top : 140px;
	}
	#toHome li + li{
		margin-left : 40px;
	}
}
@media print,screen and (min-width: 769px){
	#main .border{
		background-color : #fff;
	}
	#main .border .wrap-inner{
		max-width : inherit;
		width : 100%;
		padding-left : 0;
		padding-right : 0;
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#main .border{
		margin-top : calc( 40 * 100vw / 1300 );
		width : calc( 1000 * 100% / 1300 );
		margin-left : auto;
		margin-right : auto;
		box-shadow : 0 calc( 3 * 100vw / 1300 ) calc( 6 * 100vw / 1300 ) rgba(0,0,0,.16);
	}
}
@media print,screen and (min-width: 1300px){
	#main .border{
		margin-top : 40px;
		box-shadow : 0 3px 6px rgba(0,0,0,.16);
		max-width : 1000px;
		margin-left : auto;
		margin-right : auto;
	}
}
#studio h2 span{
	display : block;
	text-align : center;
	font-weight : 600;
	letter-spacing : .2em;
}
#studio .catch{
	font-weight : 600;
	letter-spacing : .1em;
}
#studio .description{
	font-weight : 300;
}
@media screen and (max-width: 768px){
	#studio .wrap-inner{
		padding-top : calc( 12 * 100vw / 375 );
		padding-bottom : calc( 6 * 100vw / 375 );
		padding-left : 0;
		padding-right : 0;
	}
	#studio h2{
		width : calc( 335 * 100% / 375 );
		margin-left : auto;
		margin-right : auto;
	}
	#studio h2 span:nth-of-type(1){
		font-size : calc( 15 * 100vw / 375 );
	}
	#studio h2 span:nth-of-type(2){
		font-size : calc( 30 * 100vw / 375 );
		margin-top : calc( 12 * 100vw / 375 );
	}
	#studio .box{
		margin-top : calc( 40 * 100vw / 375 );
	}
	#studio picture img{
		width : 100%;
		height : auto;
	}
	#studio .box > div{
		margin-top : calc( 40 * 100vw / 375 );
		padding-left : calc( 20 * 100% / 375 );
		padding-right : calc( 20 * 100% / 375 );
	}
	#studio .catch{
		font-size : calc( 22.5 * 100vw / 375 );
		line-height : 1.33;
	}
	#studio .description{
		margin-top : calc( 36 * 100vw / 375 );
		font-size : calc( 12 * 100vw / 375 );
		line-height : 1.67;
	}
}
@media print,screen and (min-width: 769px){
	#studio .wrap-inner{
		background-color : #fff;
	}
	#studio .box{
		position : relative;
	}
	#studio picture{
		overflow : hidden;
		position : absolute;
		top : 0;
		right : 0;
	}
	#studio picture > img{
		width : 100%;
		height : 100%;
		object-fit : cover;
		font-family : "object-fit: cover;";
	}
	#studio .box > div{
		position : relative;
		background-color : #fff;
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#studio .wrap-inner{
		padding-top : calc( 76 * 100vw / 1300 );
		padding-bottom : calc( 12 * 100vw / 1300 );
	}
	#studio h2 span:nth-of-type(1){
		font-size : calc( 20 * 100vw / 1300 );
	}
	#studio h2 span:nth-of-type(2){
		font-size : calc( 40 * 100vw / 1300 );
		margin-top : calc( 10 * 100vw / 1300 );
	}
	#studio .box{
		margin-top : calc( 62 * 100vw / 1300 );
		width : calc( 940 * 100% / 1000 );
		margin-left : calc( 20 * 100% / 1000 );
		padding-top : calc( 40 * 100vw / 1300 );
	}
	#studio picture{
		width : calc( 480 * 100% / 940 );
		height : calc( 360 * 100vw / 1300 );
	}
	#studio .box > div{
		width : calc( 500 * 100% / 940 );
		padding-left : calc( 20 * 100% / 940 );
		padding-right : calc( 40 * 100% / 940 );
		padding-top : calc( ( 47 - 5 ) * 100vw / 1300 );
		padding-bottom : calc( ( 43 - 6.5 ) * 100vw / 1300 );
	}
	#studio .catch{
		font-size : calc( 30 * 100vw / 1300 );
		line-height : 1.33;
	}
	#studio .description{
		margin-top : calc( ( 38 - 5 - 6.5 ) * 100vw / 1300 );
		font-size : calc( 15 * 100vw / 1300 );
		line-height : 1.87;
	}
}
@media print,screen and (min-width: 1300px){
	#studio .wrap-inner{
		padding-top : 76px;
		padding-bottom : 12px;
	}
	#studio h2 span:nth-of-type(1){
		font-size : 20px;
	}
	#studio h2 span:nth-of-type(2){
		font-size : 40px;
		margin-top : 10px;
	}
	#studio .box{
		margin-top : 62px;
		width : 940px;
		margin-left : 20px;
		padding-top : 40px;
	}
	#studio picture{
		width : 480px;
		height : 360px;
	}
	#studio .box > div{
		width : 500px;
		padding-left : 20px;
		padding-right : 40px;
		padding-top : calc( 47px - 5px );
		padding-bottom : calc( 43px - 6.5px );
	}
	#studio .catch{
		font-size : 30px;
		line-height : 1.33;
	}
	#studio .description{
		margin-top : calc( 38px - 5px - 6.5px );
		font-size : 15px;
		line-height : 1.87;
	}
}
#course h4{
	font-weight : 600;
	white-space : nowrap;
}
#course li li{
	font-weight : 300;
}
@media screen and (max-width: 768px){
	#course .wrap-inner{
		padding-top : calc( 39 * 100vw / 375 );
		padding-bottom : calc( 93 * 100vw / 375 );
	}
	#course .wrap-inner > ul{
		margin-top : calc( 42 * 100vw / 375 );
	}
	#course .wrap-inner > ul > li + li{
		margin-top : calc( 36 * 100vw / 375 );
	}
	#course h4{
		font-size : calc( 18 * 100vw / 375 );
	}
	#course ul ul{
		margin-top : calc( 24 * 100vw / 375 );
		display : flex;
		flex-wrap : wrap;
	}
	#course li li{
		font-size : calc( 15 * 100vw / 375 );
		width : 50%;
	}
	#course li li:nth-child(n+3){
		margin-top : calc( 15 * 100vw / 375 );
	}
}
@media print,screen and (min-width: 769px){
	#course .wrap-inner > ul{
		display : flex;
	}
	#course .wrap-inner > ul .instrument{
		flex-shrink : 0;
	}
	#course .wrap-inner > ul .instrument ul{
		display : flex;
		flex-wrap : wrap;
	}
	#course .wrap-inner > ul .instrument ul > li{
		width : 25%;
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#course .wrap-inner{
		padding-left : calc( 20 * 100% / 1000 );
		padding-right : calc( 20 * 100% / 1000 );
		padding-top : calc( 39 * 100vw / 1300 );
		padding-bottom : calc( 93 * 100vw / 1300 );
	}
	#course .wrap-inner > ul{
		padding-left : calc( 40 * 100% / 960 );
		padding-right : calc( 36 * 100% / 960 );
		margin-top : calc( 42 * 100vw / 1300 );
	}
	#course .wrap-inner > ul > li + li{
		margin-left : calc( 70 * 100% / 884 );
	}
	#course .instrument{
		width : calc( 493 * 100vw / 1300 );
	}
	#course .instrument li:nth-child(n+5){
		margin-top : calc( 15 * 100vw / 1300 );
	}
	#course h4{
		font-size : calc( 18 * 100vw / 1300 );
	}
	#course ul ul{
		margin-top : calc( 24 * 100vw / 1300 );
	}
	#course li li{
		font-size : calc( 15 * 100vw / 1300 );
	}
	#course .vocal li + li , #course .eurhythmics li + li{
		margin-top : calc( 15 * 100vw / 1300 );
	}
}
@media print,screen and (min-width: 1300px){
	#course .wrap-inner{
		padding-left : 20px;
		padding-right : 20px;
		padding-top : 39px;
		padding-bottom : 93px;
	}
	#course .wrap-inner > ul{
		padding-left : 40px;
		padding-right : 36px;
		margin-top : 42px;
	}
	#course .wrap-inner > ul > li + li{
		margin-left : 70px;
	}
	#course .instrument{
		width : 493px;
	}
	#course .instrument li:nth-child(n+5){
		margin-top : 15px;
	}
	#course h4{
		font-size : 18px;
	}
	#course ul ul{
		margin-top : 24px;
	}
	#course li li{
		font-size : 15px;
	}
	#course .vocal li + li , #course .eurhythmics li + li{
		margin-top : 15px;
	}
}
#photo h4{
	font-weight : 600;
}
@media screen and (max-width: 768px){
	#photo .wrap-inner{
		padding-top : calc( 40 * 100vw / 375 );
		padding-bottom : calc( ( 62 - 4) * 100vw / 375 );
		padding-left : 0;
		padding-right : 0;
	}
	#photo ul{
		margin-top : calc( 36 * 100vw / 375 );
	}
	#photo li + li{
		margin-top : calc( 40 * 100vw / 375 );
	}
	#photo h4{
		font-size : calc( 15 * 100vw / 375 );
		padding-left : calc( 20 * 100% / 375 );
		padding-right : calc( 20 * 100% / 375 );
	}
	#photo picture{
		margin-top : calc( 24 * 100vw / 375 );
	}
	#photo picture img{
		width : 100%;
		height : auto;
	}
	#photo p{
		padding-left : calc( 20 * 100% / 375 );
		padding-right : calc( 20 * 100% / 375 );
		font-size : calc( 12 * 100vw / 375 );
		line-height : 1.67;
		margin-top : calc( ( 17 - 4) * 100vw / 375 );
	}
}
@media print,screen and (min-width: 769px){
	#photo ul{
		display : flex;
		justify-content : space-between;
		flex-wrap : wrap;
	}
	#photo picture{
		overflow : hidden;
		width : 100%;
	}
	#photo picture > img{
		width : 100%;
		height : 100%;
		object-fit : cover;
		font-family : "object-fit: cover;";
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#photo .wrap-inner{
		padding-top : calc( 39 * 100vw / 1300 );
		padding-bottom : calc( ( 62 - 6.5 ) * 100vw / 1300 );
	}
	#photo ul{
		margin-top : calc( 47 * 100vw / 1300 );
		padding-left : calc( 40 * 100% / 1000 );
		padding-right : calc( 40 * 100% / 1000 );
	}
	#photo li{
		width : calc( 440 * 100% / 920 );
	}
	#photo li:nth-child(n+3){
		margin-top : calc( ( 50 - 6.5 ) * 100vw / 1300 );
	}
	#photo h4{
		font-size : calc( 20 * 100vw / 1300 );
	}
	#photo picture{
		margin-top : calc( 31 * 100vw / 1300 );
		height : calc( 330 * 100vw / 1300 );
	}
	#photo p{
		font-size : calc( 15 * 100vw / 1300 );
		line-height : 1.87;
		margin-top : calc( ( 22 - 6.5 ) * 100vw / 1300 );
	}
}
@media print,screen and (min-width: 1300px){
	#photo .wrap-inner{
		padding-top : 39px;
		padding-bottom : calc( 62px - 6.5px );
	}
	#photo ul{
		margin-top : 47px;
		padding-left : 40px;
		padding-right : 40px;
	}
	#photo li{
		width : 440px;
	}
	#photo li:nth-child(n+3){
		margin-top : calc( 50px - 6.5px );
	}
	#photo h4{
		font-size : 20px;
	}
	#photo picture{
		margin-top : 31px;
		height : 330px;
	}
	#photo p{
		font-size : 15px;
		line-height : 1.87;
		margin-top : calc( 22px - 6.5px );
	}
}
#access h4{
	font-weight : 600;
}
#access ol > li{
	counter-increment : no;
	display : flex;
}
#access ol p:before{
	content : counter(no, decimal-leading-zero);
	display : block;
	font-weight : 700;
	font-family : "Roboto", sans-serif;
	line-height : 1;
}
#access picture{
	overflow : hidden;
	flex-shrink : 0;
}
#access picture > img{
	width : 100%;
	height : 100%;
	object-fit : cover;
	font-family : "object-fit: cover;";
}
@media screen and (max-width: 768px){
	#access .wrap-inner{
		padding-top : calc( 32 * 100vw / 375 );
		padding-bottom : calc( 72 * 100vw / 375 );
		padding-left : 0;
		padding-right : 0;
	}
	#access .map-container{
		margin-top : calc( 36 * 100vw / 375 );
		height : calc( 282 * 100vw / 375 );
	}
	#access h4{
		font-size : calc( 18 * 100vw / 375 );
		margin-top : calc( 36 * 100vw / 375 );
		line-height : 1.4;
		padding-left : calc( 20 * 100% / 375 );
		padding-right : calc( 20 * 100% / 375 );
	}
	#access ol{
		margin-top : calc( 36 * 100vw / 375 );
		padding-left : calc( 20 * 100% / 375 );
		padding-right : calc( 20 * 100% / 375 );
	}
	#access li{
		padding-bottom : calc( ( 28 - 3 ) * 100vw / 375 );
	}
	#access picture{
		width : calc( 132 * 100% / 335 );
		height : calc( 86 * 100vw / 375 );
		margin-right : calc( 20 * 100% / 335 );
	}
	#access p{
		font-size : calc( 12 * 100vw / 375 );
		line-height : 1.67;
	}
	#access p:before{
		font-size : calc( 16 * 100vw / 375 );
		margin-top : calc( -4 * 100vw / 375 );
		margin-bottom : calc( 4 * 100vw / 375 );
	}
}
@media print,screen and (min-width: 769px){
	#access h4{
		text-align : center;
	}
	#access ol{
		display : flex;
		justify-content : space-between;
		flex-wrap : wrap;
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#access .wrap-inner{
		padding-top : calc( 33 * 100vw / 1300 );
		padding-bottom : calc( 72 * 100vw / 1300 );
	}
	#access .map-container{
		margin-top : calc( 44 * 100vw / 1300 );
		height : calc( 330 * 100vw / 1300 );
	}
	#access h4{
		font-size : calc( 20 * 100vw / 1300 );
		margin-top : calc( 41 * 100vw / 1300 );
	}
	#access ol{
		margin-top : calc( 50 * 100vw / 1300 );
		padding-left : calc( 20 * 100% / 1000 );
		padding-right : calc( 20 * 100% / 1000 );
	}
	#access li{
		width : calc( 470 * 100% / 960 );
		padding-bottom : calc( ( 28 - 3 ) * 100vw / 1300 );
	}
	#access picture{
		width : calc( 193 * 100% / 470 );
		height : calc( 129 * 100vw / 1300 );
		margin-right : calc( 20 * 100% / 470 );
	}
	#access p{
		font-size : calc( 12 * 100vw / 1300 );
		line-height : 1.5;
	}
	#access p:before{
		margin-top : calc( 4 * 100vw / 1300 );
		font-size : calc( 20 * 100vw / 1300 );
		margin-bottom : calc( ( 14 - 3 ) * 100vw / 1300 );
	}
}
@media print,screen and (min-width: 1300px){
	#access .wrap-inner{
		padding-top : 33px;
		padding-bottom : 72px;
	}
	#access .map-container{
		margin-top : 44px;
		height : 330px;
	}
	#access h4{
		font-size : 20px;
		margin-top : 41px;
	}
	#access ol{
		margin-top : 50px;
		padding-left : 144px;
		padding-right : 144px;
	}
	#access li{
		width : 336px;
		padding-bottom : calc( 28px - 3px );
	}
	#access picture{
		width : 132px;
		height : 86px;
		margin-right : 20px;
	}
	#access p{
		font-size : 12px;
		line-height : 1.5;
	}
	#access p:before{
		margin-top : 4px;
		font-size : 20px;
		margin-bottom : calc( 14px - 3px );
	}
}
#information h4{
	font-weight : 600;
}
#information p , #information li li{
	font-weight : 300;
}
#information dl > div{
	display : flex;
	align-items : flex-start;
}
#information li > dl > div > dt{
	font-weight : 600;
}
#information dt:after{
	content : "：";
}
#information li > dl > div > dt{
	width : 5em;
	flex-shrink : 0;
	text-align : right;
}
@media screen and (max-width: 768px){
	#information .wrap-inner{
		padding-bottom : calc( 40 * 100vw / 375 );
	}
	#information .wrap-inner > ul{
		margin-top : calc( 36 * 100vw / 375 );
	}
	#information .wrap-inner > ul > li + li{
		margin-top : calc( 36 * 100vw / 375 );
	}
	#information h4{
		font-size : calc( 18 * 100vw / 375 );
	}
	#information p , #information li li , #information dt , #information dd{
		font-size : calc( 15 * 100vw / 375 );
		line-height : 2;
	}
	#information p , #information ul ul , #information li > dl{
		margin-top : calc( 24 * 100vw / 375 );
		padding-left : calc( 18 * 100% / 335 );
		padding-right : calc( 18 * 100% / 335 );
	}
}
@media print,screen and (min-width: 769px){
	#information .wrap-inner{
		padding-bottom : calc( 110px - 7.5px );
	}
	#information .wrap-inner > ul{
		display : flex;
		justify-content : center;
	}
}
@media screen and (min-width: 769px) and (max-width:1299px){
	#information .wrap-inner{
		padding-top : calc( 40 * 100vw / 1300 );
	}
	#information .wrap-inner > ul{
		margin-top : calc( 82 * 100vw / 1300 );
	}
	#information .wrap-inner > ul > li + li{
		margin-left : calc( 117 * 100% / 1000 );
	}
	#information h4{
		font-size : calc( 18 * 100vw / 1300 );
	}
	#information p , #information li li , #information dt , #information dd{
		font-size : calc( 15 * 100vw / 1300 );
		line-height : 2;
	}
	#information p , #information ul ul , #information li > dl{
		margin-top : calc( ( 41 - 7.5 ) * 100vw / 1300 );
	}
}
@media print,screen and (min-width: 1300px){
	#information .wrap-inner{
		padding-top : 40px;
	}
	#information .wrap-inner > ul{
		margin-top : 82px;
	}
	#information .wrap-inner > ul > li + li{
		margin-left : 117px;
	}
	#information h4{
		font-size : 18px;
	}
	#information p , #information li li , #information dt , #information dd{
		font-size : 15px;
		line-height : 2;
	}
	#information p , #information ul ul , #information li > dl{
		margin-top : calc( 41px - 7.5px );
	}
}
/*# sourceMappingURL=../maps/studio.css.map */