/*
###############################################################################
Date: 2021/3/7
contributor: Saito Harutaka
Contact: saito.harutaka@mat.eng.osaka-u.ac.jp
How to Modify: ======= >> see /Newweb/README
###############################################################################
*/

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.home_pc { display: block !important; }
.home_sp { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .home_pc { display: none !important; }
    .home_sp { display: block !important; }
}

body{
	background: white;
	color: #330000;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	font-family: ヒラギノ丸ゴ ProN;
	width: 100vw;
	height: 100vh;
}

.home{
	overflow-x: hidden;
}

.ml6_pc{
	position: relative;
	width: 90vw;
	left: 3vw;
}

.ml6_sp{
	position: relative;
	width: 90vw;
	left: 2vw;
}

/* PC version */
.header_pc{
	width: 100vw;
	height: auto;
	position: relative;
	left: 0;
	top: 0;
}

.greet_title{
	position: relative;
	font-size: 40px;
}

.greet_text{
	position: relative;
	font-size: 30px;
	width: 70vw;
}

.proj_title_pc{
	position: relative;
	left: 5vw;
	width: 65vw;
}

.proj_text_pc{
	position: relative;
	left: 10vw;
	font-size: 30px;
	width: 80vw;
	word-wrap: break-word;
}

.ind_title_pc{
	position: relative;
	left: 5vw;
	width: 65vw;
}

.ind_text_pc{
	position: relative;
	left: 10vw;
	font-size: 30px;
	width: 80vw;
	word-wrap: break-word;
}

.img_feedback_pc{
	position: relative;
	left: 5vw;
	width:65vw;
}

.illust1_pc{
  width: 25vw;
  height: auto;
  position: relative;
  left: 70vw;
  bottom: 5vw;
  z-index: -1;
}

.illust2_pc{
  width: 20vw;
  height: auto;
  position: relative;
  left: 48vw;
  bottom: 1500px;
  z-index: -1;
}

.footer_pc{
	width: 100vw;
	height: auto;
	position: relative;
	left: 0;
	top: 0;
}

/* Cell Phone version */
.header_sp{
	width: 100vw;
	height: auto;
	position: relative;
	left: 0;
	top: 0;
}

.greet_title{
	position: relative;
	font-size: 30px;
}

.greet_text{
	position: relative;
	font-size: 20px;
	width: 70vw;
}

.proj_title_sp{
	position: relative;
	left: -3vw;
	width: 80vw;
}

.proj_text_sp{
	position: relative;
	left: 7vw;
	font-size: 20px;
	width: 80vw;
	word-wrap: break-word;
}

.ind_title_sp{
	position: relative;
	left: -3vw;
	width: 80vw;
}

.ind_text_sp{
	position: relative;
	left: 7vw;
	font-size: 20px;
	width: 80vw;
	word-wrap: break-word;
}

.img_feedback_sp{
	position: relative;
	left: -3vw;
	width:80vw;
}

.illust1_sp{
  width: 30vw;
  height: auto;
  position: relative;
  left: 60vw;
  bottom: 5vw;
  z-index: -1;
}

.illust2_sp{
  width: 30vw;
  height: auto;
  position: relative;
  left: 35vw;
  bottom: 950px;
  z-index: -1;
}

.footer_sp{
	width: 100vw;
	height: auto;
	position: relative;
	left: 0;
	top: 0;
}