@charset "UTF-8";
/* CSS Document */


		/*等寬字體*/
		@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@300&display=swap');
		@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300&display=swap');
		@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@200&display=swap');
 		@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@200&display=swap');
		@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200&display=swap');
		
		/*超連結*/
		
		a,a:link,a:visited{color:#6C6C6C;text-decoration: none}
		a:hover{color:#E0E0E0;background-color: #6C6C6C;text-decoration: none;}
		

/* 超過 768px */
@media screen and (min-width: 768px) {

		
		.imgm{
		width: 500px;
	}
	
	.box {
    overflow: hidden;
}
		
		
.middle {
    float: left;
    width: 100%;
}
.middle .content {
    margin-left: 30%;
	margin-right: 30%;
    height: 100%;
	color: #6C6C6C;
	font: 100% 'Raleway';
}
.left {
    float: left;
    width: 20%;
    height: 200px;
    margin-left: -90%;
	font: 'Inconsolata';
	opacity: 0.5;
}
		.leftName{
			font: 200% 'Inconsolata';

		}

		.leftMenu{
			position: fixed;
			font: 100% 'Ubuntu';
			color: #8E8E8E;
		}
}

/* 介於 480px 與 767px 之間 */
@media screen and (min-width: 480px) and (max-width: 767px) {
	
		.imgm{
		width: 500px;
	}
	
	
.box {
    overflow: hidden;
}
		
		
.middle {
    float: left;
    width: 100%;
}
.middle .content {
    margin-left: 30%;
	margin-right: 30%;
    height: 100%;
	color: #6C6C6C;
	font: 100% 'Raleway';
}
.left {
    float: left;
    width: 20%;
    height: 200px;
    margin-left: -90%;
	font: 'Inconsolata';
	opacity: 0.5;
}
		.leftName{
			font: 200% 'Inconsolata';

		}

		.leftMenu{
			position: fixed;
			font: 100% 'Ubuntu';
			color: #8E8E8E;
		}
}

/* 未滿 480px，即 479px 以下 */
@media screen and (max-width: 479px) {
	
	.imgm{
		width: 70%;
		height: 70%;
	}
	
	.imgm img{
      width:100%;
}
	
	
.box {
    overflow: hidden;
}
		
		
.middle {
    float: left;
    width: 100%;
}
.middle .content {
    margin-left: 40%;
	margin-right: 10%;
    height: 100%;
	color: #6C6C6C;
	font: 80% 'Raleway';
}
.left {
    float: left;
    width: 30%;
    height: 200px;
    margin-left: -90%;
	font: 'Inconsolata';
	opacity: 0.5;
}
		.leftName{
			font: 150% 'Inconsolata';

		}

		.leftMenu{
			position: fixed;
			font: 70% 'Ubuntu';
			color: #8E8E8E;
		}
}