.subpage .subtitle img {
	right: 50%;
}

.about{
	margin-top: 120px;
}
.about h2 {
	margin: 120px 0 60px;
	text-align: center;
}
.about h2 small {
	color: #777;
}

.about .portrait {
	position: relative;
    display: table;
    margin: 0 auto;
    padding: 20px;
    text-align: center;
}

.about .portrait:before,
.about .portrait:after { 
    content:'';
    width: 80px;
    height: 80px;
    position: absolute;
    display: inline-block;
}
.about .portrait:before{
    border-left: solid 5px #FFC66E;
    border-top: solid 5px #FFC66E;
    top: 0;
    left: 0;
}
.about .portrait:after{
    border-right: solid 5px #FFC66E;
    border-bottom: solid 5px #FFC66E;
    bottom: 0;
    right: 0;
}

.about .polish dt {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 200px;
	height: 200px;
	margin: 0 auto;
	text-align: center;
}
.about .polish dt:before,
.about .polish dt:after { 
    content:'';
    width: 40px;
    height: 40px;
    position: absolute;
    display: inline-block;
}
.about .polish dt:before{
    border-left: solid 5px #FFC66E;
    border-top: solid 5px #FFC66E;
    top: 0;
    left: 0;
}
.about .polish dt:after{
    border-right: solid 5px #FFC66E;
    border-bottom: solid 5px #FFC66E;
    bottom: 0;
    right: 0;
}

.about .polish dd {
	margin-top: 30px;
	line-height: 1.68;
}

.about .skill ol {
  counter-reset:list;
  list-style-type:none;
  padding: 0px;
}
  
.about .skill ol li{
	position: relative;
    display: inline-flex;
    align-items: center;
    height: 60px;
    margin: 0 0 30px 60px;
    padding-left: 20px;
    line-height: 1.68;
}
  
.about .skill ol li:before{
	counter-increment: list;
    content: counter(list);
    position: absolute;
    top: 50%;
    left: -60px;
    width: 60px;
    height: 60px;
    font-family: 'Raleway', sans-serif;
    color: #fff;
    font-size: 1.2rem;
    text-align: center;
    line-height: 60px;
    vertical-align: middle;
    background: #e5a137;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.about .skill dt {
	margin: 60px 0 30px;
	font-weight: normal;
	text-align: center;
}

.about .skill dd ul {
	margin-bottom: 0;
	padding-left: 0;
}

.about .skill dd ul li {
	position: relative;
    display: inline-block;
    margin-right: 0.75rem;
	margin-bottom: 0.5rem;
    padding-left: 1.5rem;
    font-weight: normal;
}

.about .skill dd ul li:before {
	content: "●";
    position: absolute;
    top: 0;
    left: 0;
    color: #e5a137;
}

.about .profile .biography {
	padding-bottom: 33px;
}

.about .comment {
	margin-top: 90px;
}


/*----------------------------------------------------
	career
------------------------------------------------------*/

.timeline {
  list-style: none;
}
.timeline > li {
  margin-bottom: 60px;
}


/*---------------------------------------------------------------------------------
	 Responsive
-------------------------------------------------------------------------------*/

@media (min-width: 576px) {  }

@media (min-width: 768px) {
	.about .skill dd ul {
		text-align: center;
	}
	
	.timeline li {
		position: relative;
		margin: 0;
	}
	.timeline dl {
		display: flex;
	}
	.timeline-date {
		width: 160px;
		padding-right: 2rem;
		font-weight: normal;
	}
	.timeline-content {
		width: 70%;
		margin-bottom: 0;
		padding-left: 2rem;
		padding-bottom: 1rem;
	}
	.timeline > li:before {
		content: '';
		position: absolute;
		left: 155px;
		top: 7px;
		width: 13px;
		height: 13px;
		background: #e5a137;
		border-radius: 100%;
	}
	.border-line {
		position: absolute;
		left: 160px;
    	top: 20px;
    	width: 3px;
		height: 0;
		background: #dedede;
	}
	.comment p {
		text-align: center;
	}
}

@media (min-width: 992px) { 
	.subpage .subtitle img {
		margin-right: -110px;
	}
}

@media (min-width: 1200px) {  }

@media (min-width: 1400px) { 
	.subpage .subtitle img {
		margin-right: -145px;
	}
}

@media (max-width: 1399.98px) {  }

@media (max-width: 1199.98px) {  }

@media (max-width: 991.98px) {
	.subpage .subtitle img {
		margin-right: -75px;
	}
	
	.about{
		margin-top: 60px;
	}
}

@media (max-width: 767.98px) {
	.about .skill ol li {
		height: auto;
	}
	.about .skill ol li:before {
		margin-top: 35px;
    	top: 0;
	}
	
	.timeline {
		padding-left: 1rem;
	}
	
	.timeline li {
		position: relative;
		margin: 0;
		padding-left: 1rem;
	}
	.timeline dl {
		margin: 0;
	} 
	.timeline-date {
		padding-bottom: 0.25rem;
		font-size: 1.05rem;
		font-weight: normal;
	}
	.timeline-content {
		margin-bottom: 0;
		padding-bottom: 1rem;
	}
	.timeline li:before {
		content: '';
		position: absolute;
		left: -13px;
		top: 6px;
		width: 13px;
		height: 13px;
		background: #e5a137;
		border-radius: 100%;
		z-index: 2;
	}
	.border-line {
		position: absolute;
		left: -0.5em;
		top: 0.7em;
		width: 4px;
		height: 0;
		background: #dedede;
		z-index: 1;
	}	
}

@media (max-width: 575.98px) {
	.subpage .subtitle img {
		margin-right: -60px;
	}
	h2{
		font-size:1.4rem;
	}
}