@charset "UTF-8";

html{
	height: 100%;
}
body {
	min-width: 1000px;
	height: 100%;
}
.sp {
	display: none;
}
#wrap {
     width: 100%;
     position: relative;
     min-height: 100%;
}


#top {
	background: url("../images/vis_yamasawa.jpg?250910") no-repeat top left;
	background-size: cover;
}

#container {
	/* min-height: 100vh; */
}


/* sidebar
===================================*/
#sidebar {
	float: left;
	/* background: #221815; */
	width: 280px;
	height: 85vh;
	padding: 30px 50px 50px 50px;
	position: relative;
}
#sidebar .nav ul {
	width: 120px;
	margin: 0 auto;
}
#sidebar .nav li {
	margin: 0 0 20px;
}
#sidebar .nameK {
	position: absolute;
	bottom: 60px;
	left: calc(50% - 80px);
	width: 160px;
}



/* vis
===================================*/
#vis {
	overflow: hidden;
	width: auto;
	height: 85vh;
	padding: 50px;
}
.profile .tit {
	color: #fff;
	font-size: 14px;
	margin: 0 0 5px;
}
.profile p {
    color: #fff;
	line-height: 1.6;
	font-size: 12px;
}
.profile table th,
.profile table td {
	color: #fff;
	text-align: left;
	font-size: 13px;
}
.profile table th {
	padding: 0 15px 5px 0;
}




/* footer
===================================*/
.footWrap {
	bottom: 0;
	position: absolute;
	width: 100%;
}
#footer {
	/* background: #221815; */
	height: 100px;
	position: relative;
}
#footer .name {
	position: absolute;
	bottom: 0;
	left: -0;
	width: 100%;
}
#footer .name img {
	width: 100%;
}
.copy {
	background: rgba(255,255,255,0.85);
	text-align: center;
	padding: 15px;
}
.copy p {
	font-size: 13px;
}





/* =================================
	
	contact
	
===================================*/
#contact {
	background: url("../images/contact_vis_yamasawa.jpg?250910") no-repeat top left;
	background-size: cover;
}
#contact #vis {
	height: auto;
	width: 100%;
	overflow: inherit;
	padding: 0 0 170px 0;
}
#contact.thanks #vis {
	padding: 80px 10px 170px 10px;
}
@media screen and (min-width:1441px) {
    #contact #vis {
        height: 100vh;
    }
}
#contact #vis .name {
	width: 500px;
	margin: 0 0 20px;
}
#contact #vis .contsBox {
	width: 600px;
	margin: 0 0 0 50px;
}
#contact.thanks #vis .contsBox {
	padding: 0 0 334px;
}
#contact #vis .contsBox .tit {
	color: #fff;
	line-height: 1.8;
	font-size: 25px;
	font-weight: bold;
	margin: 0 0 5px;
}
#contact #vis .contsBox .txt {
	color: #fff;
	line-height: 1.8;
	font-size: 15px;
}
#contact #vis .formArea {
	width: 430px;
}
#contact #vis .formArea table {
	width: 100%;
	margin: 10px 0 0;
}
#contact #vis .formArea table th,
#contact #vis .formArea table td {
	display: block;
	text-align: left;
	color: #fff;
	font-size: 15px;
}
#contact #vis .formArea table th {
	padding: 0 0 3px;
}
#contact #vis .formArea table td {
	padding: 0 0 15px;
}
#contact #vis .formArea table td strong {
	font-weight: bold;
}
#contact #vis .formArea .inputC {
	width: 100%;
	border: solid 1px #eee;
	border-radius: 0;
	padding: 3px;
	height: 35px;
	font-size: 15px;	
}
#contact #vis .formArea textarea.inputC  {
	width: 100%;
	border: solid 1px #eee;
	border-radius: 0;
	padding: 3px;
	height: 130px;
	font-size: 15px;	
}
/*#contact #vis .formArea .inputC:focus:invalid {
  border: tomato 2px solid;
}
form input:focus:valid + .error .invalid {
  display : none;
}
form input:valid:not(:last-child) {
  border : seagreen 2px solid;
}*/

#contact #vis .formArea .submitBtn {
	background: #fff;
	width: 240px;
	margin: 5px auto 0;
	border-radius: 10px;
	display: block;
}
#contact #vis .formArea .submitBtn input {
	background: #910000;
	color: #fff;
	text-align: center;
	border: none;
	font-weight: bold;
	font-size: 18px;
	width: 100%;
	letter-spacing: 1em;
	border-radius: 10px;
	padding: 12px 20px 10px 45px;
	display: block;
	cursor: pointer;
}
#contact #vis .formArea .submitBtn input[disabled] {
    background: #aaa;
    cursor: not-allowed;
}
#contact #vis .formArea .submitBtn input:hover {
	-ms-filter:"alpha( opacity=80 )";
	filter:alpha( opacity=80 );
	opacity:0.8;
	transition: .3s;
}
#contact #vis .formArea .submitBtn input[disabled]:hover {
    opacity: 1;
}


/* footer */
#footWrap {
	position: static;
}

.footWrap.footVer01 {
	position:absolute;
    bottom: 0;
	width: 100%;
}
.footWrap.footVer01 #footer {
	padding: 31px 0 0 50px;
}
.footWrap.footVer01 #footer li {
	float: left;
	width: 120px;
	margin: 0 25px 0 0;
}
.footWrap.footVer01 #footer li:nth-child(1) {
	margin: 0 10px 0 0;
}
/*.footWrap.footVer01 #footer li:nth-child(3) {
	margin: 0 10px 0 0;
}*/
.footWrap.footVer01 #footer li:last-child {
	margin: 0;
}









/*
#################################################
 
	佐藤義人
 
#################################################
*/

.sato {
	position: relative;
	background: #002870;
}
.sato #container {
	padding: 80px 0 0;
}
.sato .bigName {
	position: absolute;
	top: -32px;
	left: -19px;
	z-index: 1;
	width: 700px;
}
.sato #sidebar {
    background: #002870;
	height: 88vh;
}
.sato #sidebar .nav {
    position: absolute;
	bottom: 20px;
	left: 70px;
}
/*.sato #sidebar .nav ul {
    width: 180px;
}*/

.sato #vis {
    background: url("../images/vis_sato.jpg") no-repeat top left;
    background-size: cover;
    padding: 50px;
	height: 88vh;
	position: relative;
}
.sato #vis .profile {
    position: absolute;
	bottom: 30px;
	left: 40px;
}

/* =================================
	
	contact
	
===================================*/
#contact.sato #container {
    padding: 0;
}
#contact.sato #vis {
    background: url("../images/contact_vis_sato.jpg") no-repeat top left;
    background-size: cover;
}
#contact.sato #vis .name {
    width: 546px;
	position: relative;
	top: -23px;
	left: -23px;
	margin: 0 0 16px;
}
#contact.sato #vis .contsBox {
    margin: -20px 0 0 50px;
}
#contact.thanks.sato #vis .contsBox {
    margin: 0 0 0 50px;
}
#contact.sato #footer {
    background: #002870;
}





/*
#################################################
 
	堀江翔太
 
#################################################
*/

.horie #container {
	background: url("../images/vis_horie.jpg") no-repeat top center;
	background-size: cover;
}
.horie .bigName {
    position: absolute;
    top: -7px;
    left: 0;
    z-index: 1;
    width: 700px;
}
.horie #sidebar {
    background: none;
	height: 97vh;
}
.horie #sidebar .nav {
    position: absolute;
	bottom: 0;
}
.horie #sidebar .nav ul {
    /*width: 180px;*/
}
.horie #vis {
    background: none;
	position: relative;
	height: 97vh;
}
.horie #vis .profile {
    position: absolute;
	bottom: 30px;
}



/* =================================
	
	contact
	
===================================*/

#contact.horie #vis {
    background: url("../images/contact_vis_horie.jpg") no-repeat top left;
    background-size: cover;
}






/*
#################################################
 
	金 正奎
 
#################################################
*/

.kin .bigName {
    position: absolute;
    top: -4px;
    right: 0;
    z-index: 1;
    width: 700px;
}
.kin #vis {
    background: url("../images/vis_kin.jpg") no-repeat top left;
    background-size: cover;
	position: relative;
}
@media screen and (min-width:1441px) {
.kin #vis {
        height: 100vh;
    }
}
.kin #vis .profile {
    position: absolute;
    bottom: 14%;
    right: 2%;
}
.kin #vis .profile .tit {
    color: #221815;
}
.kin #vis .profile table th,
.kin #vis .profile table td {
    color: #221815;
}



/* =================================
	
	contact
	
===================================*/

#contact.kin #vis {
    background: url("../images/contact_vis_kin.jpg") no-repeat top right;
    background-size: cover;
}
#contact.kin #vis .name {
    margin: 0 0 25px;
}
#contact.kin #vis .contsBox .tit {
    color: #221815;
}
#contact.kin #vis .contsBox .txt {
    color: #221815;
}
#contact.kin #vis .formArea table th,
#contact.kin #vis .formArea table td {
    color: #221815;
}













@media screen and (max-width: 768px) {

body {
	min-width: 100%;
}
#container {
	position: relative;
}
.pc {
	display: none;
}
.sp {
	display: block;
}


#top {
	background: none;
}

/* nav
===================================*/
.bgBlack {
	position: fixed;
	left: 0;
	width: 100%;
	height: 100%;
	overflow-y: hidden;
}
.navBtn {
	background: rgba(34,24,21,0.9);
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 45px;
    z-index: 300;
}	
.navBtn span {
	background: #fff;
	width: 30px;
	height: 3px;
	display: block;
	transition: all .6s;
	position: absolute;
	left: 10px;
}
.navBtn span:nth-child(1) { top: 10px; }
.navBtn span:nth-child(2) { top: 20px; }
.navBtn span:nth-child(3) { top: 30px; }
.bgBlack .navBtn span:nth-child(1) {
	transform: rotate(45deg);
	top: 20px;
}
.bgBlack .navBtn span:nth-child(2) {
    width: 0;
    left: 50%;
}
.bgBlack .navBtn span:nth-child(3) {
   transform: rotate(-45deg);
	top: 20px;
}
#spNav {
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 100;
}
#spNav .menu {
	background: rgba(34,24,21,0.9);
	padding: 15px 0;
	display: none;
	position: relative;
	top: 50px;
}	
#spNav .menu li {
	margin: 0 0 15px;
	padding: 0 6%;
}
#spNav .menu li:last-child {
	margin: 0;
}
#spNav .menu li a {
	display: block;
}		
#spNav .menu li img {
	width: 140px;
}		
	
	
	
	
	
/* vis
===================================*/
#vis {
	overflow: inherit;
	width: 100%;
	height: 60vh;
	/* background: url("../images/vis_yamasawa_sp.jpg?250910") no-repeat top center;
	background-size: cover; */
	padding: 6%;
	position: relative;
}
#top #vis {
	background: url("../images/vis_yamasawa_sp.jpg?250910") no-repeat top center;
	background-size: cover;
}
.profile .tit {
	color: #fff;
	font-size: 12px;
	margin: 0 0 5px;
}
.profile table th,
.profile table td {
	color: #fff;
	text-align: left;
	font-size: 12px;
}
.profile table th {
	padding: 0 15px 5px 0;
}
.nameK {
	position: absolute;
	bottom: 9%;
	left: 6%;
	width: 80px;
}



/* footer
===================================*/
#footer {
	background: #221815;
	height: auto;
	position: relative;
	padding: 6%;
}
#footer .name {
	position: static;
	text-align: center;
	margin: 0 0 20px;
}
#footer .name img {
	width: 100%;
}
.copy {
	background: #fff;
	text-align: center;
	padding: 15px;
}
.copy p {
	font-size: 11px;
}
#contact #footer {
	display: none;
}
	
	
	
	
	
	
/* =================================
	
	contact
	
===================================*/
#contact {
	background: url("../images/contact_vis_yamasawa_sp.jpg?250910") no-repeat top center;
	background-size: cover;
}
#contact #vis {
	height: auto;
	padding: 15% 6% 10%;
}
#contact.thanks #vis {
	height: 90vh;
	padding: 30% 6%;
}
#contact #vis .name {
    width: 100%;
    margin: 20px 0 20px;
}
#contact #vis .contsBox {
	width: 100%;
	margin: 0;
}
#contact.thanks #vis .contsBox {
	padding: 0;
}
#contact #vis .contsBox .tit {
	line-height: 1.6;
	font-size: 16px;
	font-weight: bold;
	margin: 0 0 10px;
}
#contact #vis .contsBox .txt {
	line-height: 1.6;
	font-size: 12px;
	margin: 0 0 20px;
}
#contact #vis .formArea {
	width: 100%;
}
#contact #vis .formArea table {
	width: 100%;
	margin: 10px 0 0;
}
#contact #vis .formArea table th,
#contact #vis .formArea table td {
	display: block;
	text-align: left;
	color: #fff;
	font-size: 12px;
}
#contact #vis .formArea table th {
	padding: 0 0 3px;
}
#contact #vis .formArea table td {
	padding: 0 0 15px;
}
#contact #vis .formArea .inputC {
	width: 100%;
	border: solid 1px #eee;
	border-radius: 0;
	padding: 3px;
	height: 35px;
	font-size: 12px;	
	-webkit-appearance: none;
}
#contact #vis .formArea textarea.inputC {
	width: 100%;
	border: solid 1px #eee;
	border-radius: 0;
	padding: 3px;
	height: 130px;
	font-size: 12px;
	-webkit-appearance: none;
}
#contact #vis .formArea .submitBtn {
	background: #910000;
	width: 200px;
	margin: 5px auto 0;
	border-radius: 10px;
	display: block;
}
#contact #vis .formArea .submitBtn input {
	background: #910000;
	color: #fff;
	text-align: center;
	border: none;
	font-weight: bold;
	font-size: 15px;
	width: 100%;
	letter-spacing: 1em;
	border-radius: 10px;
	padding: 12px 13px 10px 30px;
	-webkit-appearance: none;
}
#contact #vis .formArea .submitBtn input:hover {
	opacity: 1;
}
#contact #vis .formArea .submitBtn input[disabled] {
    background: #aaa;
    -webkit-text-fill-color: #fff;
	opacity: 1;
}

	
/* footer */
.footWrap.footVer01 {
    /* position: static; */
}
.footWrap.footVer01 #footer {
	display: none;
	padding: 6%;
}

	
	
	
	
/*
#################################################
 
	佐藤義人
 
#################################################
*/

.sato {
	position: relative;
	background: transparent;
}
.sato #container {
	padding: 0;
}
.sato .bigName {
	display: none;
}
.sato #vis {
    background: url("../images/vis_sato_sp.jpg") no-repeat top center;
    background-size: cover;
    padding: 50px;
	position: relative;
}
.sato #footer {
    background: #002870;
}

	
/* =================================
	
	contact
	
===================================*/	
#contact.sato #vis {
	background: url("../images/contact_vis_sato_sp.jpg") no-repeat top right;
	background-size: cover;
}	
#contact.sato #vis .name {
    width: 100%;
	position: static;
	margin: 0 0 20px;
}
#contact.sato #vis .contsBox {
    margin: 0;
}
#contact.thanks.sato #vis .contsBox {
    margin: 0;
}	
	
	
	
	
/*
#################################################
 
	堀江翔太
 
#################################################
*/	
	
.horie .bigName {
    display: none;
}
.horie #vis {
    background: url("../images/vis_horie_sp.jpg") no-repeat top center;
    background-size: cover;
    padding: 50px;
	height: 60vh;
}	
	
	
/* =================================
	
	contact
	
===================================*/	
#contact.horie #vis {
	background: url("../images/contact_vis_horie_sp.jpg") no-repeat top right;
	background-size: cover;
}	
	
	
	

	
	
/*
#################################################
 
	金 正奎
 
#################################################
*/

.kin .bigName {
    display: none;
}
.kin .footWrap.footVer01 #footer {
    display: block;
	background: #999;
}
.kin .profile .tit {
    color: #221815;
}
.kin .profile table th,
.kin .profile table td {
    color: #221815;
}	
	
	
/* =================================
	
	contact
	
===================================*/	
#contact.kin #vis {
    background: url("../images/contact_vis_kin_sp.jpg") no-repeat top right;
    background-size: cover;
}	
#contact.kin .footWrap.footVer01 #footer {
    display: none;
}	
	
}