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

body{
    margin: 0;
    padding: 0;
    background-color:white;
}

a{
    text-decoration: none;
    color:#AAAAAA;
}

li{
    list-style: none;
}

.wrapper{
	width:100%;
}

h2{
    font-family: cursive;
}

*{
    box-sizing: border-box;
}


.fade_off {

    opacity: 0;

    -webkit-transition: all 1s;

    -moz-transition: all 1s;

    -o-transition: all 1s;

    -ms-transition: all 1s;

    transition: all 1s;
}

.fade_on {
    opacity: 1;
}

.wrapper0{
    overflow: hidden;
}



/*ここからrow1の内容*/
.row1{
    height:50vw;
}

header{
	width: 100vw;
	height: 20vw;
	margin: 0 auto;
    text-align: center;
}

.visual h1{
    font-size: 5vw;
    font-family:cursive;
}

header p{
    font-family: cursive;
    margin-bottom: 8vw;
    font-size:1.2vw;
}

.menu-list{
    display: flex;
    width: 100%;
    height: 6vw;
    padding: 0;
    background-color:black;
}

.page-header {
    position: absolute;
    width: 100%;
    z-index:1000;
}

.page-header.sticky {
    position: fixed;
    top:-18px;
    padding: 0;
}


.menu-list li{
    width: 25%;
}

.menu-list li a{
    font-size:2vw;
    font-family:cursive; 
    color:white;
    position: relative;
    top: 1.5vw;
}

.menu-list a:hover{
    color:#CCCCCC;
}
/*row1の内容終わり*/


/*ここからrow2の内容*/
.row2{
    height:60vw;
    margin-top:-20vw;
}

.row2-title{
    font-family: cursive;
    font-size:4vw;
    text-align: center;
    position: relative;
    top: 7vw;
}

.img-text{
    width:50vw;
    height:10vw;
    background-color:black;
}

.img-text p{
    color:white;
    font-size:1vw;
    font-family: "ヒラギノ明朝 Pro";
    padding-top:4vw;
    text-align: center;
}

.img-text a{
    display: block;
    font-size:1.5vw;
    margin-top:2vw;
}

ul.slider {
    padding: 0;
}

.slider img{
    width:50vw;
    height:38vw;
    position: relative;
    top:4vw;
    border:1px solid #CCCCCC; 
}

.slick-prev:before,
.slick-next:before{
   color:black!important;
}

.slick-prev,
.slick-next{
    z-index: 999;
    right:0%; 
    cursor: pointer;
}

.slick-center img{
    width:50vw;
    height:38vw;
}


/*ここからrow3の内容*/
.row3{
    height: 90vw;
    text-align: center;
}

.row3-title{
    font-family: cursive;
    font-size: 4vw;
    text-align: center;
    margin-top:6vw;
    position: relative;
    top:10vw;
}

.face-icon{
    width: 15vw;
    height: 15vw;
    background-color:black;
    border-radius: 50%;
    margin: 0 auto;
    position: relative;
    top: 8vw;
}

.face-icon img{
   position: relative;
   bottom:.1vw
}

.face-text {
    text-align: center;
    font-family:cursive;
    margin-top: 10vw;
    font-size:1.2vw;
}

.plofile{
    margin-top:13vw;
}

span{
    font-size:4vw;
    padding-bottom:3vw;
}

h2{
    font-family: cursive;
}

.profile-text{
    width:52vw;
    text-align: left;
    font-family:"ヒラギノ明朝 Pro";
    line-height:2.8vw;
    position: relative;
    left:24vw;
    font-size:1vw; 
}

.other-text{
	font-size: 1vw;
    width: 52vw;
    position: relative;
}


.text{
    width: 55vw;
    height: 30vw;
    position: relative;
    font-size:1.5vw;
    text-align: left;
    position: relative;
    margin-left: 38%;
}

.text p{
   font-family: cursive;
}

h2{
    font-size: 2vw;
    margin-top:7vw;
}

.profile-box{
    width:50vw;
    text-align: left;
    position: relative;
    margin-left:25%;
    font-family:"ヒラギノ明朝 Pro";
    font-size: 1.5vw;
}
/*row3の内容終わり*/




/*ここからrow4の内容*/
.row4{
    width: 100vw;
    height: 150vw;
}

.row4-title{
    text-align: center;
    font-family: cursive;
    font-size:4vw;
    position: relative;
    top: 7vw;
    left:1vw
}

.img-contena{
    width: 70vw;
    height:50vw;
    margin: 0 auto;
    position: relative;
    top: 6vw;
    right: 2vw;
    display: flex;
    flex-wrap: wrap;
}

.img-box{
    width: 18vw;
    height:12vw;
    margin: 2vw;
    position: relative;
}

.img-box img{
    width: 15vw;
    height: 15vw;
    margin-left:5vw
}

.img-box p{
    position: relative;
    text-align: left;
    width: 22vw;
    font-size:1.23vw;
    line-height:2vw;
    left: 5vw;
    font-family: "ヒラギノ明朝 Pro";
}

#text0,#text1,#text2,#text3,#text4{
    display: none;
}

#text0{
    position: relative;
    top:2vw;
    left:2vw
}

#text1{
    position: relative;
    left:4vw;
}

#text2{
    position: relative;
    top: 1.5vw;
    left:6vw;
}

#text3{
    position: relative;
    left: 14vw;
    top:1.5vw;
}

#text4{
    position: relative;
    left: 18vw;
}

#icon img{
    height:17vw;
    width: 16.5vw;
    margin-left:6vw;
}

#icon2 img{
    height: 16vw;
    position: relative;
    right: -2vw;
}

#icon3 img{
    width:13.5vw;
    margin-left:17vw;
    margin-top:6vw;
}

#icon4 img{
    width: 13.5vw;
    margin-left: 20vw;
    margin-top:6vw;
}

.video-containar video{
    width: 101vw;
    height: 30vw;
    margin-top: -10vw;
}

.skills{
    width: 100%;
    display: block;
    position: relative;
    top:5vw;
    background-color: darkgray;
}

.skills img{
    height:50vw;
    width: 53vw;
    display: block;
    margin: 0 auto;
    margin-top:1vw;
}

.skills h2{
    text-align: center;
    font-size:3vw;
    position: relative;
    top: 3vw;
    
}
/*row4の内容終わり*/


/*ここからrow5の内容*/
.row5{
    height: 50vw;
    width: 100%;
}

#formWrap {
	width:100%;
	color:#555e;
}

.row5-title{
    text-align: center;
    font-size: 4vw;
    color: black;
}
    
table.formTable{
	width:40vw;
	
}
table.formTable td,table.formTable th{
	
	padding:10px;
}
    
table.formTable th{
	width:20vw;
	font-weight:normal;
    display: block;
	
}
    
.formTable{
    margin: 0 auto;
}
      
input{
    border: none; 
    margin-top:-1vw;
    display: block;
    height:3vw;
    width:20vw;
    border:1px solid #CCCCCC;
}
    
textarea{
    border: none;
    width: 20vw;
    height:10vw;
    border:1px solid #CCCCCC;
}
    
h3{
    text-align: center;
    font-size:3vw;
    font-family: cursive;
}
    
th{
    text-align: center;
    font-size: 1vw;
    margin: 0;
    display: block;
}
    
tr{
    width: 30vw;
    height: 5vw;
    font-family: cursive;
}

#qestion{
    margin-top: 50px;
}
   
#sent{
    width:10vw;
    height:3vw;
    font-size:1.7vw;
    position: relative;
    margin-top: 5vw;
    font-family: cursive;
    background-color: darkgray;
}
/*row5の内容終わり*/


/*ここからrow6の内容*/

.row6{
    height:15vw;
    background-color: black;
    text-align: center;
}

footer p{
    color: white;
    font-family: cursive;
    font-size:4vw;
}

#footertext{
    font-size:1vw;
    margin-top:-2vw;
}