@charset "UTF-8";

/*-----------------------
 main
 -----------------------*/

/*-----------------------
 #topContents
 -----------------------*/
#topContents{
	position: relative;
	text-align: left;
	padding-top: 180px;
    padding-bottom: 40px;
    overflow: hidden;
}

#topContents article{
}

#topContents h2{
    font-size: 30px;
    letter-spacing: 1px;
    line-height: 1.6;
}

#topContents h3{
    font-size: 15px;
    line-height: 2;
    letter-spacing: 2px;
    font-weight: normal;
    padding-top: 20px;
    padding-bottom: 20px;
}


#topContents .shadow_logo{
    position: absolute;
    top: -10%;
    right: -11%;
}

#topContents #shadow_logo{
    fill: #F7F7F7;
    -webkit-transform: scale(1.2) rotate(-90deg);
       -moz-transform: scale(1.2) rotate(-90deg);
        -ms-transform: scale(1.2) rotate(-90deg);
         -o-transform: scale(1.2) rotate(-90deg);
            transform: scale(1.2) rotate(-90deg);
}


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

@media (min-width: 768px){
	#topContents{
		padding-top: 300px;
	    padding-bottom: 100px;
	}
	#topContents h2{
	    font-size: 35px;
	}
	#topContents h3{
	    font-size: 19px;
	    line-height: 2.2;
	    letter-spacing: 3px;
	    padding-top: 40px;
	    padding-bottom: 20px;
	}

	#topContents .shadow_logo{
	    position: absolute;
	    top: -10%;
	    right: -11%;
	}
}

@media (min-width: 992px){
	#topContents{
		padding-top: 250px;
	    padding-bottom: 150px;
	}
	#topContents h3{
	    font-size: 19px;
	    line-height: 2.2;
	    letter-spacing: 3px;
	    font-weight: normal;
	    padding-top: 65px;
	    padding-bottom: 20px;
	}
	#topContents .shadow_logo{
	    right: -9%;
	}

}

@media (min-width: 1200px){
	#topContents h2{
	    font-size: 40px;
	}
	#topContents .shadow_logo{
	    right: -7%;
	}
}


/*-----------------------
 #profileWrapper
 -----------------------*/
#profileWrapper{
	padding-bottom: 40px;
    position: relative;
	color: #fff;
}

#profileWrapper article{
    height: 100%;
    width: 100%;
}

#profileImage{
	height: 350px;
}

#profileWrapper section{
    background-color: #000;
    padding: 60px 15px 60px 15px;
}

#profileWrapper div[data-profile="mainText"]{
    position: relative;}

#profileWrapper div.profile_items{
    padding-top: 10px;
    padding-bottom: 10px;
	border-bottom: dotted 1px #ccc;
}

#profileWrapper div.profile_items h3{
	font-size: 14px;
	line-height: 1.6;
    color: #ccc;
}

#profileWrapper div.profile_items span{
	font-size: 16px;
	line-height: 1.8;
    letter-spacing: 1px;
}


@media (min-width: 768px){
	#profileImage{
		height: 850px;
	}
	#profileWrapper section{
	    position: absolute;
	    float: right;
	    background-color: rgba(0, 0, 0, 0.9);
	    padding: 60px 60px 60px 60px;
	    width: 70%;
	    top: 0;
	    right: 0;
	    -webkit-transform: translate(0%,-50px);
	       -moz-transform: translate(0%,-50px);
	        -ms-transform: translate(0%,-50px);
	         -o-transform: translate(0%,-50px);
	            transform: translate(0%,-50px);
	}
}

@media (min-width: 992px){
	#profileWrapper section{
		background-color: #000;
	    padding: 60px 90px 60px 90px;
	    width: 60%;
	}
}

@media (min-width: 1200px){
	#profileWrapper section{
	    padding: 60px 100px 60px 100px;
	    width: 45%;
	}
}


/*-----------------------
 #contactWrapper
 -----------------------*/
#contactWrapper{
    position: relative;
    overflow: hidden;
}

/*--- contact_Header ----*/
article.contact_Header{
    padding-top: 50px;
    padding-bottom: 50px;
}

article.contact_Header h2#contact{
    font-size: 30px;
    letter-spacing: 1px;
    line-height: 1.6;
}

article.contact_Header h2#contact::before{
	content: "";
    position: absolute;
    background-color: #000;
    bottom: -25px;
    left: 15px;
    width: 40px;
    height: 2px;
}

article.contact_Header p{
	font-size: 16px;
    line-height: 2.2;
    font-weight: normal;
    padding-top: 50px;
}



@media (min-width: 768px){
	article.contact_Header{
	    padding-top: 50px;
	    padding-bottom: 80px;
	}
}

@media (min-width: 992px){
	article.contact_Header p{
	    padding-top: 10px;
	}
}

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



/*-----------------------
 #mailWrapper
 -----------------------*/
#mailWrapper{
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #f9f9f9;
}

#mailWrapper article{
	text-align: left;
    font-size: 16px;
}

#mailWrapper div[data-mail="margin_target"]{
	margin-top: 5px;
}

#mailWrapper p.entry_title{
    font-size: 14px;
    padding-top: 10px;
    padding-bottom: 20px;
    color: #2DA7E0;
}



#mailWrapper article div[data-mail="submit"] {
    text-align: center;
}


/*-----------------------
 #policyWrapper
 -----------------------*/
#policyWrapper{
    text-align: center;
    padding-top: 50px;
	padding-bottom: 40px;
}

#policyWrapper h2{
    font-size: 30px;
    padding-bottom: 5px;
}

#policyWrapper article{
	font-size: 16px;
	line-height: 1.8em;
	color: #444;
	text-align: left;
}

#policyWrapper section{
	position: relative;
	padding-top: 17px;
	padding-bottom: 17px;
    border-bottom: dotted 1px #ccc;
}

#policyWrapper section h4{
	font-size: 16px;
    line-height: 1.6;
    font-weight: bold;
}

#policyWrapper section p[data-policy="text"]{
    font-size: 14px;
    line-height: 1.8;
    padding-top: 5px;
}


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

@media (min-width: 768px){
	#policyWrapper{
		padding-top: 80px;
		padding-bottom: 120px;
	}
	#policyWrapper h2{
	    font-size: 35px;
	    padding-bottom: 15px;
	}
	#policyWrapper section{
		position: relative;
		padding-top: 20px;
		padding-bottom: 20px;
	    border-bottom: dotted 1px #ccc;
	}
}

@media (min-width: 992px){
	#policyWrapper article{
		font-size: 18px;
	}

}

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