@media screen and (min-width: 1024px) {
	
	body{font-size: calc(1rem + ((1vw - 10.24px) * 0.4678));}  /*16px to 17.6px */
	#loading-wrapper .num{font-size: calc(9.375rem + ((1vw - 10.24px) * 14.6199));}
	.univ .planet1,
	.univ .planet5{
		width:350px;
		height:350px;
	top:calc((100vh - 350px) /2);
	left:calc((100vw - 350px) /2);
	}
	.univ .planet2{
		width:180px;
		height:180px;
	top:calc((100vh - 180px) /2);
	left:calc((100% - 180px) /2);
	}
	header{margin:0 0 100px 0;}
	main section#experiences article,
	main section#strategy article,
	main section#principal article{width:90vw;padding:0;margin:0 0 100px 0;}
	
	header{padding:5vw 0 0 0;}
	#mob-slide{width:100vw;}
	#mob-slide-btn{top:0px;left:0px;width:5vw;height:auto;padding:calc((5vw - 2vw)/2);aspect-ratio:1/1;}
	#mob-slide-btn .hamburger {width:2vw;height:auto; aspect-ratio:1/1;}
	#mob-slide-close-btn{top:0px;left:0px;width:5vw;height:auto;padding:calc((5vw - 2vw)/2);aspect-ratio:1/1;}
	#mob-slide-close-btn .hamburger {width:2vw;height:auto; aspect-ratio:1/1;}
	
	
	/* text contents */

	main section#experiences article .pf-detail-box h2{font-size: calc(3rem + ((1vw - 10.24px) * 9.3567));}
	main section#experiences article .pf-detail-box .pf-textbox .text{font-size: calc(0.9rem + ((1vw - 10.24px) * 0.4094));}/* 14.4px to 15.8px */
	main section#experiences article .pf-detail-box .pf-textbox .num{font-size: calc(3rem + ((1vw - 10.24px) * 9.3567));}
	
	header{	padding:50px 0 0 0;min-height:auto;}
	header .header-mob-container{display:none;}
	header .header-container{display:grid;}
	header .header-container > div:nth-of-type(1),
	header .header-container > div:nth-of-type(7){font-size: calc(4.375rem + ((1vw - 10.24px) * 8.7719));} /* 70px - 100px */

	
	
	/* headline */
	main section#principal article h1,
	main section article h1,
	main section article h1 span,
	main section#strategy article .seo-container h1 span,
	main section#strategy article h1{font-size: calc(7.5rem + ((1vw - 10.24px) * 17.5439));text-align:left;} /*120px to 180px */
	

	main section#principal article .textbox1 .textbox-container span.title,
	main section#principal article .textbox2 .textbox-container span.title,
	main section#principal article .textbox3 .textbox-container span.title{font-size: calc(2.375rem + ((1vw - 10.24px) * 3.5088));}/* 38px to 50px */
	main section#strategy article .seo-container .container .minibox .work-title em{ font-size: calc(3rem + ((1vw - 10.24px) * 9.3567));} /* 48px to 78px */
	
	
	header .header-title .header-title-container span{
		font-size: calc(2.25rem + ((1vw - 10.24px) * 3.5088)); /* 36px - 48px */
		padding:0;}
	
	header .header-title .header-title-container .header-title-ico{
		width:2.5vw;
		height:auto;
		aspect-ratio:1/1;
		display:inline-block;
		margin: 0 8px 0 0;
		top:2px;
	}
	header .header-title .header-title-container .header-title-ico i:nth-of-type(1){
		width:100%;
		height:33.333%;
	}
	header .header-title .header-title-container .header-title-ico i:nth-of-type(2){
		width:calc(2.5vw/3);
		height:calc(100% - 33.333%);
		top:calc(2.5vw/3);
		left:0;
	}
	header .header-title .header-title-container .header-title-ico i:nth-of-type(3){
		width:calc(2.5vw/3);
		height:calc(100% - 33.333%);
		top:calc(2.5vw/3);
		left:calc((100% - (2.5vw/3))/2);
	}
	header .header-title .header-title-container .header-title-ico i:nth-of-type(4){
		width:calc(2.5vw/3);
		height:calc(100% - 33.333%);
		top:calc(2.5vw/3);
	}
	header .header-container .warp{height:60%;}
	header .header-container .warp span:nth-of-type(1),
	header .header-container .warp span:nth-of-type(2),
	header .header-container .warp span:nth-of-type(3),
	header .header-container .warp span:nth-of-type(4){display:none;}
	header .header-container > div:nth-of-type(22) span{border-width:1.0vw;}
	header .header-container > div:nth-of-type(17) > span{font-size: calc(1.375rem + ((1vw - 10.24px) * 1.7544));} /* 22px to 28px */
	
	main section#about article .about-grid-container div:nth-of-type(1) h1 span em:nth-of-type(1){left:-0.3em;}
	main section#about article .about-grid-container div.comment{font-size: calc(0.9375rem + ((1vw - 10.24px) * 1.462)); padding:11%;} /* 15px - 17.6px*/
	main section#about article .about-grid-container div.email{padding:10%;}
	main section#about article .about-grid-container div.email em{ font-size: calc(1.2rem + ((1vw - 10.24px) * 1.4035));} /* 19.2px - 24px*/
	main section#about article .about-grid-container div.email span{font-size: calc(0.625rem + ((1vw - 10.24px) * 1.2865));} /* 10px - 14.4px*/
	main section#about article .about-grid-container div:nth-of-type(6) em{font-size: calc(0.75rem + ((1vw - 10.24px) * 1.1696));}	 /* 12px - 16px*/
	main section#about article .about-grid-container div:nth-of-type(1) h1 span{
		display:block;
		position:relative;
		font-size: calc(10.625rem + ((1vw - 13.66px) * 10.8303));
		letter-spacing:-0.1em;
		line-height:1.0;
		margin:0 0 0 0;
		padding:0;
		top:-0.1em;
	}/* 170px - 230px*/

	
/*--- EXPERIENCES PORTFOLIO  -----*/


	main section#experiences article .pf-detail-box{
		margin:0 0 80px 0;
	}
	main section#experiences article .pf-detail-box:last-of-type{
		margin:0 0 0px 0;
	}
	main section#experiences article .pf-detail-box h2{
		top:25%;
	}
	main section#experiences article .pf-detail-box h2 .mini-title{
		font-size:20%;
		padding:0;
		margin:0 0 0 0.25em;
	}
	main section#experiences article .pf-detail-box .pf-textbox{
		margin:28% 8% 0 0;
		padding:0;
	}
	main section#experiences article .pf-detail-box .pf-textbox .num{
		flex:0.3;
	}
	main section#experiences article .pf-detail-box .pf-textbox .detailbtn span{
		width:9vw;
		height:4vh;
		min-height:50px;
	}
	main section#experiences article .pf-detail-box .pf-textbox .detailbtn::before{
		width: calc(100% - 11vw);
	}
	main section#experiences article .pf-detail-box .pf-textbox .detailbtn::after{
		right:11.2vw;
	}
	main section#experiences article .pf-detail-box .pf-textbox .detailbtn:hover::before{
		width:calc((100% - 11vw) + 1vw);
	}
	main section#experiences article .pf-detail-box .pf-textbox .detailbtn:hover::after{
		right:calc(11.2vw - 1vw);
	}
	main section#experiences article .pf-detail-box .pf-imgbox{
		flex: 0 0 45vw;
		height:auto;
	}
	main section#experiences article .pf-detail-box .pf-imgbox span{
		max-width:100%;
		max-height:auto;
		width:100%;
		height:auto;
	}
	main section#experiences article .pf-detail-box .pf-imgbox span img{
		max-width:100%;
		max-height:auto;
		width:100%;
		height:auto;
	}
	

/*---STRATEGY -----*/
	main section#strategy article .seo-container .container .minibox:nth-of-type(2){margin:0 0 0 30px;}
	main section#strategy article .seo-container .container .minibox:nth-of-type(3){margin:0 0 0 60px;}
	main section#strategy article .seo-container .container .minibox .work-title{
		border-left:30px solid #1a1a1a;
	}
	main section#strategy article .seo-container .container .minibox .textbox{
		border-left:30px solid #1a1a1a;
		height:auto;
		margin:0;
		padding:0px 0 40px 0;
	}
	main section#strategy article .seo-container .ico-m,
	main section#strategy article .seo-container .ico-c,
	main section#strategy article .seo-container .ico-y{display:block;width:15px;}
	main section#strategy article .seo-container .ico-c{right:25px;top:0;}
	main section#strategy article .seo-container .ico-y{right:0px;top:0;}
	main section#strategy article .seo-container .ico-m{right:50px;top:0;}
	
	main section#strategy article .seo-container .container .minibox .textbox{
		margin:0;
		padding:60px 0 60px 0;
		}
	main section#strategy article .seo-container .container .minibox .textbox .textbox-container{
		flex:0 0 60%;
		width:60%;
		padding:0 0 0 30px;
		margin:0;
		display:flex;
		justify-content: flex-start;
		align-items: center;
	}
	main section#strategy article .seo-container .container .minibox .work-title{
		padding:60px 0 0px 0px;
	}
	main section#strategy article .seo-container .container .minibox .work-title em{
		padding:0 0 0 30px;
	}


/*--- PRINCIPAL  -----*/

	main section#principal{
	min-height:100vh;
	padding: 0;
	}
	main section#principal article{
	display:flex;
	height:100%;
	justify-content: space-between;
	}
	main section#principal article .textbox1,
	main section#principal article .textbox2,
	main section#principal article .textbox3{
		height:50%;
		width:50%;
		flex:0 0 50%;
		padding:0;
		margin:0;
	}
	main section#principal article .textbox1::before,
	main section#principal article .textbox2::before,
	main section#principal article .textbox3::before{
		height:100%;
		width:100%;
		top:0;
		left:0;
		border:1px solid #1a1a1a;
	}
	main section#principal article .textbox1{margin: 0 100px 0 0;}
	main section#principal article .textbox2{margin: -25% 0 0 0;}
	main section#principal article .textbox3{margin: -20% 100px 0 0;}
	
	main section#principal article .textbox1,
	main section#principal article .textbox3{
		left:0;
	}
	main section#principal article .textbox2{
		top:0;
		left:calc(100% - 50%);
	}
	main section#principal article .textbox3{
		top:0px;
	}
	main section#principal article .textbox1 .textbox-container span.title,
	main section#principal article .textbox2 .textbox-container span.title,
	main section#principal article .textbox3 .textbox-container span.title{
		padding:0 0 10px 0;
		margin:0 0 30px 0;
	}
	main section#principal article .textbox1 .textbox-container,
	main section#principal article .textbox2 .textbox-container,
	main section#principal article .textbox3 .textbox-container{
		width:70%;
		height:70%;
		top:calc((100% - 70%)/2);
		left:calc((100% - 70%)/2);
		padding:0;
		margin:0;
	}
	main section#principal article .textbox1 .textbox-container span.title i,
	main section#principal article .textbox2 .textbox-container span.title i,
	main section#principal article .textbox3 .textbox-container span.title i{
		width:2.8vw;
		height:auto;
		aspect-ratio:1/1;
		border-width:0.93vw;
		margin:3px 10px 0 0;
	}
	main section#principal article .textbox1 .satelite::before,
	main section#principal article .textbox2 .satelite::before,
	main section#principal article .textbox3 .satelite::before{
		content:'';
		display:block;
		position:absolute;
		border-radius:50%;
		z-index:444;
	}
	main section#principal article .textbox1 .satelite::before{
		width:30px;
		height:auto;
		aspect-ratio:1/1;
		top:-15px;
		left:calc((100% - 30px)/2);
	}
	
	main section#principal article .textbox2 .satelite::before{
		width:50px;
		height:auto;
		aspect-ratio:1/1;
		top:-25px;
		left:calc((100% - 50px)/2);
	}
	main section#principal article .textbox3 .satelite::before{
		width:20px;
		height:auto;
		aspect-ratio:1/1;
		top:-10px;
		left:calc((100% - 20px)/2);
	}
	
	/* ABOUT ME */
	main section#about article .about-grid-container{display:grid;}
	main section#about article .about-grid-mob-container{display:none;}
	
/*--- FOOTER  -----*/
	footer .footer-btn-container{height:30px;bottom:0px;padding:0 120px 0 0;}
	footer .footer-btn-container a{flex:1;max-width:12%;width:auto;height:100%;padding:0;font-size: calc(1rem + ((1vw - 10.24px) * 0.4678));} /* 16px - 17.6px */
	footer .footer-container p.copywrite{font-size: calc(1rem + ((1vw - 10.24px) * 0.4678));} /* 16px - 17.6px */
	footer .footer-container .btn{width:90px;height:120px;}
	footer .footer-container .btn .btn-container{height:90px;}
	footer .footer-container .btn p{font-size: calc(1rem + ((1vw - 10.24px) * 0.4678)); height:30px;}
	
	
	.mob-slide-container ul.category li{font-size: 60px;}
	.mob-slide-container ul.category li:nth-of-type(5) i,
	.mob-slide-container ul.category li:nth-of-type(6) i,
	.mob-slide-container ul.category li:nth-of-type(7) i{
		width:30px;
		height:30px;
		border:4px solid #1a1a1a;
		border-width:4px 4px 0 0;
	}
	.mob-slide-container ul.category li:nth-of-type(5) i::before,
	.mob-slide-container ul.category li:nth-of-type(6) i::before,
	.mob-slide-container ul.category li:nth-of-type(7) i::before{
		height:4px;
		top:calc(((100% - 4px)/2));
	}
	/* -- MODAL WINDOW --*/
	aside.pf-menu{
		display:block;
		width:150px;
		padding:5% 50px 0 0;
	}
	aside.pf-menu .pf-menu-container .pf-menu-thumbnail{
		width:100px;
		height:71px;
	}
	aside.pf-menu .pf-menu-container .pf-menu-sns{
		width:100px;
	}
	.modal-contact,
	.modal-footer,
	.modal-content{
		padding: 5% calc(150px + 5%) 5% 5% !important;
	}
	.modal-contact .modal-contact-container form{
		width:60%;
		left:0;
	}

}