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

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.6/dist/web/variable/pretendardvariable.css");
@import url("sitewide.css");
@import url("desktop-default.css");


@media screen and (min-width: 2400px) {
	
	}
@media screen and (min-width: 1600px) and (max-width:2399) {
	
	}
@media screen and (min-width: 1200px) and (max-width: 1599px) {
	li.sample-thumb {
		width: calc( var(--line-block) * 5 );
		height: calc( var(--line-block) * 5 );
		box-shadow: none;
		}
	}
@media screen and (min-width: 800px) and (max-width: 1199px) {
	li.sample-thumb {
		width: calc( var(--line-block) * 6 );
		height: calc( var(--line-block) * 6 );
		box-shadow: none;
		}
	.left-side {
		width: calc(var(--grid)*2);
		}
	.left-side+div.grid-8 {
		width: calc(var(--grid)*6);
		}
	.left-side h4::after {
		top: .6667rem;
		}
	.left-side h3::after {
		bottom: .2875rem
		}
	#nav-block.sticky li {
		font-size: .75rem;
		}
	}
@media screen and (max-width: 799px){	
	#timeline::before,
	#timeline::after {
		visibility: hidden;
		}
	#nav-block-container {
		visibility: hidden;
		height: 0;
		}
	div#header {
		padding-bottom: 0;
		}
	.left-side h3, .left-side h4 {
		text-align: left;
		}
	.left-side h3::after, .left-side h4::after {
		display: none;
		visibility: hidden;
		}
	.left-side h4.date,
	.left-side h3.date {
		font-size: 1rem;
		margin-top:1rem;
		color: rgba(0,0,0,.38);
		}
	.cv h4 {
		margin-top: 0;
		}
	h4.company {
		padding-top: 0;
		margin-top: 0;
		}
	.row.experience h2 {
		line-height: 1;
		margin-bottom: 0.1667em;
		}
	.award .publisher {
		font-size:0.75em;
		color: rgba(0,0,0,0.5);
		}
	ul#sample-grid {
		margin-bottom: calc(var(--line-block)*2)
		}
	li.sample-thumb {
		width: calc( var(--line-block) * 8 );
		height: calc( var(--line-block) * 8 );
		box-shadow: none;
		}
	#contact-block {
		width: calc(var(--line-block)* 26);
		aspect-ratio: unset;
		}
	#header #contact-block h4 {
		margin-top:0;
		}
	#header h1 {
		margin-top:1em;
		}
}

@media screen and (max-width:600px){
	li.sample-thumb {
		margin: 0;
		width: calc( var(--line-block) * 6 );
		height: calc( var(--line-block) * 6 );
		box-shadow: none;
		}
	#contact-block {
		width: calc(var(--line-block)* 16);
		}
}