@charset "utf-8";

/*===================================================================


　　　　　　　　　　　　　　　　1100px
├─────────────────────────────────┤

　　　　　360px　　　　　　　　　　　　　　　740px
├──────────┼──────────────────────┤


===================================================================*/
* {
	margin: 0;
	padding: 0;
}
ul, ol, li {
	list-style: none;
}
html {
	font-size: 100%;
	height: 100%;
}
body {
	background: #fff;
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", "Osaka", sans-serif ;
	line-height: 1.4;
	color: #666;
	/*1rem = 16px相当*/
	font-size: 1rem;
	height: 100%;
	margin: 0;
	/*overflow:hidden;*/
}
table {
	border-collapse: collapse;
}
img {
	max-width: 100%;
	vertical-align: bottom;
}
button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
}
a {
    text-decoration: none;
}
.explainMovie {
	border: 5px solid #fff;

	/* box-shadow */
	box-shadow:3px 3px 12px 2px #cfcfcf;

	/* border-radius */
	border-radius:12px;
}
.videoWrapp {
	margin: 0 0 30px 0;
}
video {
	width: 100%;
	background: rgba(0, 0, 0, 1);
}

.errorDisp {
	position: fixed;
	top: 50%;
	left: 0;
	width:100%;
	text-align: center;
	font-size: 0.75rem;
}
.caution {
	text-align: right;
	color: #000;
	margin: 10px 0;
}
.private:before {
	content: "[非公開]";
	color: #f00;
}
.pcDispNone{
    display:none;
}


/*------------------------------------------------------------------------ header TB */
@media all and (max-width: 820px) {


}

/*------------------------------------------------------------------------ header PC */
@media all and (min-width: 821px) {


}


}

/*----------------------------------------  .docBody */
.docBody {
	font-size: 0.75rem;
	position: relative;
	/*height: 100%;*/
	overflow: hidden;
	min-width: 1024px;
	max-width: 1900px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	/*margin: 0 auto;*/
}
body.challenge .docBody {
	max-width: 1280px;
}
body.beacon .docBody {
	max-width: 850px;
}

#btnPairing {
	position: fixed;
	top:30px;
	right: 30px;
	z-index: 100;
}
#btnPairing a {
	display: block;
	width:120px;
	height:120px;

	/*-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: #999;*/

	background-image:url(../img/common/btn_pair.png);
	background-position:center top;
	background-repeat:no-repeat;
	background-size:120px 120px;

	transition: all 300ms 0s ease;
}


#btnTopArea {
	position:fixed;
	top:40px;
	left:80px;
	width: 120px;
	height: 90px;
	z-index: 999;
}
#btnTopAreaRight {
	position:fixed;
	top: 0px;
	right: 0px;
	z-index: 20;
	width: 17%;
	max-width: 400px;
}
#btnTopAreaRight img {
	width:100%;
}
#btnTopArea p:nth-child(2) {
	margin-top:20px;
	width: 120px;
}
#btnTopArea p:nth-child(2) a {
	display:block;
	margin: 0 auto;
	padding: 7px 0;

	text-align: center;

	/* box-shadow */
	box-shadow:0px 0px 0px 0px #575daf;
	-moz-box-shadow:0px 0px 0px 0px #575daf;
	-webkit-box-shadow:0px 0px 0px 0px #575daf;

	/* border-radius */
	border-radius:15px 15px 15px 16px ;
	-moz-border-radius:15px 15px 15px 16px ;
	-webkit-border-radius:15px 15px 15px 16px ;

	background-color: rgba(220,220,220, 0.5);

	background-image:url(../img/common/arrow.svg);
	background-position:10px center;
	background-repeat:no-repeat;

	color: #333;
	width: 120px;
	text-decoration: none;

	transition: all 300ms 0s ease;
}


#contentWrapp #btnProf {
	position: absolute;
	top: 20px;
	right: 10px;
}
#contentWrapp #btnProf span {
	display:block;
	margin: 0 auto;
	padding: 7px 0;

	text-align: center;

	/* box-shadow */
	box-shadow:0px 0px 0px 0px #575daf;
	-moz-box-shadow:0px 0px 0px 0px #575daf;
	-webkit-box-shadow:0px 0px 0px 0px #575daf;

	/* border-radius */
	border-radius:15px 15px 15px 16px ;
	-moz-border-radius:15px 15px 15px 16px ;
	-webkit-border-radius:15px 15px 15px 16px ;

	background-color: #333;

	color: #fff;
	width: 170px;
	text-decoration: none;
	transition: all 300ms 0s ease;
}





#footerCopy {
	/*position: absolute;*/
	position:fixed;
	bottom:23px;
	left:79px;
}



/*----------------------------------------  #contentWrapp */

#bgBase {
	position: fixed;
	top: 0;
	left: 0;

	width: 100%;
	height: 100%;

	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment: fixed;
}


.bgHome {
	background-image:url(../img/home/bg_home.jpg);
}


.bgHomepanoramaphoto {
	background-image:url(../img/home/R0010393.jpg);
}




.bgChallenge {
	background-image: none;
	background-color: #000;
}
.bgCreative {
	background-image:url(../img/challenge/creative/bg_creative.jpg);
}
.bgShooting {
	background-image:url(../img/challenge/creative/shooting/bg_shooting.jpg);
}
.bgPanorama {
	background-image:url(../img/challenge/creative/shooting/panorama/bg_panorama.jpg);
}
.bgProduct {
	/*background-image:url(../img/challenge/creative/shooting/product/bg_product.jpg);*/
	background-image:url(../img/challenge/creative/shooting/bg_shooting.jpg);
}
.bgBeacon {
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}
.bgEddystone {
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}
.bgIbeacon {
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}
.bgGraph {
	background-image:url(../img/challenge/creative/graph/bg_graph.jpg);
}
.bgBargraph {
	background-image:url(../img/challenge/creative/graph/bg_graph.jpg);
}
.bgBargraph2 {
	background-image:url(../img/challenge/creative/graph/bg_graph.jpg);
}
.bgLinegraph {
	background-image:url(../img/challenge/creative/graph/bg_graph.jpg);
}
.bgLinegraph2 {
	background-image:url(../img/challenge/creative/graph/bg_graph.jpg);
}
.bgSurvey {
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}
.bgQr {
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}
.bgQuestionary {
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}
.bgVideoletter {
	/*background-image:url(../img/challenge/creative/questionar/videoletter.jpg);*/
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}
.bgVote {
	background-image:url(../img/challenge/creative/survey/bg_survey.jpg);
}




.bgEntertainment {
	background-image:url(../img/challenge/entertainment/bg_entertainment.jpg);
}
.bgCasualgame {
	background-image:url(../img/challenge/entertainment/bg_entertainment.jpg);
}
.bgBall {
	background-image:url(../img/challenge/entertainment/bg_entertainment.jpg);
}
.bgHighlow {
	background-image:url(/img/challenge/entertainment/casualgame/highlow/bg.png);
}
.bgToss {
}




.bgBusiness {
	background-image:url(../img/business/bg_business.jpg);
}
.bgField {
	background-image:url(../img/business/field/bg_field.jpg);
}




.bgManagementteam {
	background-image:url(../img/managementteam/bg_managementteam.jpg);
}
.bgManagementboard {
	background-image:url(../img/managementteam/managementboard/bg_managementboard.jpg);
}
.bgSeniorstaff {
	background-image:url(../img/managementteam/seniorstaff/bg_seniorstaff.jpg);
}




.bgKeystaff {
	background-image:url(../img/keystaff/bg_keystaff.jpg);
}
.bgMarketing {
	background-image:url(../img/keystaff/marketing/bg_marketing.jpg);
}
.bgCreativeandplanning {
	background-image:url(../img/keystaff/creativeandplanning/bg_creativeandplanning.jpg);
}
.bgNetworkandsystem {
	background-image:url(../img/keystaff/networkandsystem/bg_networkandsystem.jpg);
}
.bgOperation {
	background-image:url(../img/keystaff/operation/bg_operation.jpg);
}




.bgSecurity {
	background-image:url(../img/security/bg_security.jpg);
}


.bgDatanetwork {
	/*background-image:url(../img/security/datanetwork/bg_datanetwork.jpg);*/
	background-image:url(../img/security/servicelevel/serverload/bg_serverload.jpg);
}
.bgWeavenetwork {
	/*background-image:url(../img/security/datanetwork/bg_datanetwork.jpg);*/
	background-image:url(../img/security/servicelevel/serverload/bg_serverload.jpg);
}



.bgServicelevel {
	background-image:url(../img/security/servicelevel/bg_servicelevel.jpg);
}
.bgServerload {
	background-image:url(../img/security/servicelevel/serverload/bg_serverload.jpg);
}



.bgVulnerability {
	background-image:url(../img/security/vulnerability/bg_vulnerability.jpg);
}
.bgAbout {
	background-image:url(../img/security/vulnerability/bg_vulnerability.jpg);
}
.bgCase {
	background-image:url(../img/security/vulnerability/bg_vulnerability.jpg);
}
.bgFlow {
	background-image:url(../img/security/vulnerability/bg_vulnerability.jpg);
}
.bgOther {
	background-image:url(../img/security/vulnerability/bg_vulnerability.jpg);
}

.bgGradient{
	background: -moz-linear-gradient(top, #FFF, #d8dde2);
	background: -webkit-linear-gradient(top, #FFF, #d8dde2);
	background: linear-gradient(to bottom, #FFF, #d8dde2);
}


/*----------------------------------------  #contentWrapp */
#contentWrapp {
	min-width: 1007px;
	max-width: 1900px;
	/*height: 100%;*/
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment: fixed;
	overflow: hidden;
}
#contentWrapp > div {
	min-width: 1007px;
	max-width: 1900px;
	/*height: 100%;*/
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment: fixed;
	overflow: hidden;
}
body.challenge #contentWrapp,
body.challenge #contentWrapp > div {
	max-width: 1280px;
}
body.beacon #contentWrapp,
body.beacon #contentWrapp > div {
	max-width: 850px;
}

/*----------------------------------------  .content */
.content {
	position: relative;
	/*height: 100%;*/
	margin-left: 360px;
	line-height: 1.5;
	/*overflow: auto;*/
	overflow: hidden;
}
.content h1.cssanimation {

	/*font-family: 'Ubuntu', sans-serif;*/
	/*letter-spacing: -4px;*/
	font-size: 4.5rem;
	text-shadow: 2px 2px 4px #ccc;
	text-align: center;

	position: fixed;
	right: 15px;
	bottom: -9px;
	padding-bottom: -5px;

	filter:alpha(opacity=30);
	-moz-opacity: 0.3;
	opacity: 0.3;

	z-index: 0;
}
.content h1.pageTitle {
	position: absolute;
	right: 25px;
	top: 40px;
	color: #333;
}
.content div {
	z-index: 10;
}
.content h2.leadSentence {
	position: absolute;
	right: 25px;
	bottom: 100px;
	text-align: right;
}
.content h2.leadSentence:before,
.content h2.leadSentence:after {
	content: "-"
}


/*----------------------------------------  #phoneArea  */
#phoneArea {
	/*border: 1px solid #f00;*/

	position:fixed;
	/*position:absolute;*/

	/*top:50%;
	margin-top:-265px;*/
	
	top:150px;

	left:80px;
	width:260px;
	height:550px;
	text-align:center;

	z-index:900;

	background: url(../img/common/smartphone_frame.png) no-repeat left top;
}
#phoneArea #panelArea {
	/*border: 1px solid #ff0;*/

	margin:27px 0 0 16px;
	width:228px;
	height:509px;
	text-align:center;
	overflow-y: auto;
	font-size: 0.75rem;
}
#phoneArea #spLogo {
	display: none;
}
#realtimeClockArea {
	margin: 12px 0 0 16px;
	width:228px;
	height:18px;
	position:absolute;
	top:0px;
	left:0px;
	font-size:9px;
	color:white;
	/*border-top: 1px solid #f00;
	border-bottom: 1px solid #f00;*/

	background-image:url(../img/common/smartphone_indicator.png);
	background-position:center center;
	background-repeat:no-repeat;
}

#phoneArea ::-webkit-scrollbar {
	width: 3px;
}
#phoneArea ::-webkit-scrollbar-track {
	border-radius: 3px;
	box-shadow: inset 0 0 3px rgba(0, 0, 0, 0);
}
#phoneArea ::-webkit-scrollbar-thumb {
	background-color: rgba(255,255, 255, 0.5);
	border-radius: 3px;
	box-shadow:0 0 0 0 rgba(255, 255, 255, 0);
	width:3px;
}

.prevBtn {
	/*position: absolute;
	bottom: 45px;
	left: 50%;
	margin-left: -85px;*/
}
.prevBtn a {
	display:block;
	margin: 0 auto;
	padding: 7px 0;

	text-align: center;

	/* box-shadow */
	box-shadow:0px 0px 0px 0px #575daf;
	-moz-box-shadow:0px 0px 0px 0px #575daf;
	-webkit-box-shadow:0px 0px 0px 0px #575daf;

	/* border-radius */
	border-radius:15px 15px 15px 16px ;
	-moz-border-radius:15px 15px 15px 16px ;
	-webkit-border-radius:15px 15px 15px 16px ;

	background-color: rgba(255,255, 255, 1);

	background-image:url(../img/common/arrow.svg);
	background-position:10px center;
	background-repeat:no-repeat;

	color: #333;
	width: 170px;
	text-decoration: none;
	transition: all 300ms 0s ease;
}



.nav {
	/*border: 1px solid #f0f;*/
	min-height:325px;
	height: 100%;
	position: relative;
	padding-top: 30px;
	padding-bottom: 55px;
	color: #fff;
}
.nav#home-nav {
	display: block;
	padding-bottom: 0;
}

.nav ul {
	/*border: 1px solid #ff0;*/
	padding-right: 13px;
	padding-left: 13px;

	display: flex;
	display: -ms-flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap:         wrap;

}
.nav ul li {
	position: relative;
	width:50%;
	height: 110px;
	margin-bottom: 8px;
	box-pack: center;
	-webkit-box-pack: center;
	-moz-box-pack: center;
}


.nav ul li a {
	display: block;
	width:70px;
	height:70px;
	margin: 0 auto 5px auto;
	text-align:center;

	align-items:center;
	-webkit-align-items:center;
	-webkit-border-radius:22% ;

	border-radius:22% ;
	transition: all 300ms 0s ease;
}


.nav ul li span {
	position: absolute;
	top: -10px;
	right: 9px;
	display: inline-block;
	background: #FF0000;
	padding: 4px 6px 4px 6px;
	color: #FFFFFF;
	border-radius: 30px;
	font-size: 0.5rem;
	line-height: 1;
}


li.colorBlue a {
	/* Firefox v3.6+ */
	background-image:-moz-linear-gradient(50% 0% -90deg,rgb(31,231,255) 0%,rgb(20,109,229) 100%); 
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(31,231,255)),color-stop(1, rgb(20,109,229)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image:-webkit-linear-gradient(-90deg,rgb(31,231,255) 0%,rgb(20,109,229) 100%);
	/* IE v10+ */
	background-image:-ms-linear-gradient(-90deg,rgb(31,231,255) 0%,rgb(20,109,229) 100%);
	background-image:linear-gradient(180deg,rgb(31,231,255) 0%,rgb(20,109,229) 100%);
}

li.colorRed  a {
	/* Firefox v3.6+ */
	background-image:-moz-linear-gradient(50% 0% -90deg,rgb(251,80,98) 0%,rgb(222,1,46) 98%); 
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(251,80,98)),color-stop(0.98, rgb(222,1,46)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image:-webkit-linear-gradient(-90deg,rgb(251,80,98) 0%,rgb(222,1,46) 98%);
	/* IE v10+ */
	background-image:-ms-linear-gradient(-90deg,rgb(251,80,98) 0%,rgb(222,1,46) 98%);
	background-image:linear-gradient(180deg,rgb(251,80,98) 0%,rgb(222,1,46) 98%);
}

li.colorGreen a {
	/* Firefox v3.6+ */
	background-image:-moz-linear-gradient(50% 0% -90deg,rgb(183,248,37) 0%,rgb(0,204,102) 99%); 
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(183,248,37)),color-stop(0.99, rgb(0,204,102)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image:-webkit-linear-gradient(-90deg,rgb(183,248,37) 0%,rgb(0,204,102) 99%);
	/* IE v10+ */
	background-image:-ms-linear-gradient(-90deg,rgb(183,248,37) 0%,rgb(0,204,102) 99%);
	background-image:linear-gradient(180deg,rgb(183,248,37) 0%,rgb(0,204,102) 99%);
}

li.colorYellow a {
	/* Firefox v3.6+ */
	background-image:-moz-linear-gradient(50% 0% -90deg,rgb(255,204,0) 0%,rgb(255,127,0) 98%); 
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(255,204,0)),color-stop(0.98, rgb(255,127,0)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image:-webkit-linear-gradient(-90deg,rgb(255,204,0) 0%,rgb(255,127,0) 98%);
	/* IE v10+ */
	background-image:-ms-linear-gradient(-90deg,rgb(255,204,0) 0%,rgb(255,127,0) 98%);
	background-image:linear-gradient(180deg,rgb(255,204,0) 0%,rgb(255,127,0) 98%);
}

li.colorRedPurple a {
	/* Firefox v3.6+ */
	background-image:-moz-linear-gradient(50% 0% -90deg,rgb(255,51,204) 0%,rgb(173,51,163) 99%); 
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(255,51,204)),color-stop(0.99, rgb(173,51,163)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image:-webkit-linear-gradient(-90deg,rgb(255,51,204) 0%,rgb(173,51,163) 99%);
	/* IE v10+ */
	background-image:-ms-linear-gradient(-90deg,rgb(255,51,204) 0%,rgb(173,51,163) 99%);
	background-image:linear-gradient(180deg,rgb(255,51,204) 0%,rgb(173,51,163) 99%);
}

li.colorPurple a {
	/* Firefox v3.6+ */
	background-image:-moz-linear-gradient(50% 0% -90deg,rgb(166,19,228) 0%,rgb(88,30,253) 98%); 
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(166,19,228)),color-stop(0.98, rgb(88,30,253)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image:-webkit-linear-gradient(-90deg,rgb(166,19,228) 0%,rgb(88,30,253) 98%);
	/* IE v10+ */
	background-image:-ms-linear-gradient(-90deg,rgb(166,19,228) 0%,rgb(88,30,253) 98%);
	background-image:linear-gradient(180deg,rgb(166,19,228) 0%,rgb(88,30,253) 98%);
}

li.colorBronze a {
	/* Firefox v3.6+ */
	background-image: -moz-linear-gradient(50% 0% -90deg,rgb(255,204,153) 0%,rgb(204,102,0) 50%,rgb(154,52,0) 97%,rgb(153,51,0) 98%);
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image: -webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(255,204,153)),color-stop(0.5, rgb(204,102,0)),color-stop(0.97, rgb(154,52,0)),color-stop(0.98, rgb(153,51,0)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image: -webkit-linear-gradient(-90deg,rgb(255,204,153) 0%,rgb(204,102,0) 50%,rgb(154,52,0) 97%,rgb(153,51,0) 98%);
	/* IE v10+ */
	background-image: -ms-linear-gradient(-90deg,rgb(255,204,153) 0%,rgb(204,102,0) 50%,rgb(154,52,0) 97%,rgb(153,51,0) 98%);
	background-image: linear-gradient(180deg,rgb(255,204,153) 0%,rgb(204,102,0) 50%,rgb(154,52,0) 97%,rgb(153,51,0) 98%);
}

li.colorLightBlue a {
	/* Firefox v3.6+ */
	background-image:-moz-linear-gradient(50% 0% -90deg,rgb(153,204,255) 0%,rgb(72,123,174) 98%); 
	/* safari v4.0+ and by Chrome v3.0+ */
	background-image:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(153,204,255)),color-stop(0.98, rgb(72,123,174)));
	/* Chrome v10.0+ and by safari nightly build*/
	background-image:-webkit-linear-gradient(-90deg,rgb(153,204,255) 0%,rgb(72,123,174) 98%);
	/* IE v10+ */
	background-image:-ms-linear-gradient(-90deg,rgb(153,204,255) 0%,rgb(72,123,174) 98%);
	background-image:linear-gradient(180deg,rgb(153,204,255) 0%,rgb(72,123,174) 98%);
}

li.colorGray a {
	background-color: #dedfde;
}

li.colorGrayFilter a {
	filter: grayscale(100%);
}


/*----------------------------------------  effect  */
.fadeOut {
	-webkit-animation: fadeOut .5s cubic-bezier(.45,0,.1,1) both;
	animation: fadeOut .5s cubic-bezier(.45,0,.1,1) both;
}
@-webkit-keyframes fadeOut { to { opacity: 0; -webkit-transform: scale(1.25); }}
@keyframes fadeOut { to { opacity: 0; -webkit-transform: scale(1.25); transform: scale(1.25); }}

.fadeIn {
	-webkit-animation: fadeIn .5s cubic-bezier(.45,0,.1,1) both;
	animation: fadeIn .5s cubic-bezier(.45,0,.1,1) both;
}
@-webkit-keyframes fadeIn { from { opacity: 0; -webkit-transform: scale(.85); }}
@keyframes fadeIn { from { opacity: 0; -webkit-transform: scale(.85); transform: scale(.85); }}



/*----------------------------------------  menu  */
#header, .slidemenu {
	display: none;
}



/*----------------------------------------  common */
.bgAlphaWhite {
	background: rgba(255,255, 255, 0.45);
	color: #333;
}

.headlineL {
	font-size: 24px;
	font-weight: bold;
	color: #f00;
	padding: 15px;
}





/*----------------------------------------  */
/*----------------------------------------  #contentWrapp #home  */
#contentWrapp #home .content {
	height:100%;
}
#contentWrapp #home .content h1 {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 37%;
	margin-left: -370px;
	margin-top: -5%;
	font-size: 6rem;
	display:block;
}
#contentWrapp #home .content h1 img {
	width:100%;
	height:auto;
	vertical-align: middle;
}

#contentWrapp #home #btnTopPanorama {
	position: fixed;
	top:30px;
	right: 30px;
	z-index: 100;
}
#contentWrapp #home #btnTopPanorama a {
	display: block;
	width:120px;
	height:120px;

	/* 親要素に display: flex; */
	display: -webkit-flex; /* Safari */
	display: flex;

	/* ボックス内の子要素の縦方向の揃え位置 */
	-webkit-align-items: center; /* Safari */
	align-items: center;

	justify-content: center; /* 子要素をflexboxにより中央に配置する */

	text-align: center;
	font-size: 0.825rem;
	/*font-weight: bold;*/
	text-decoration: none;
	color: #fff;

	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: rgba(0,0,0, 0.8);
	

	transition: all 300ms 0s ease;
}

#contentWrapp #home .content .tlt {
	position: absolute;
	left: 50%;
	bottom: 15%;
	width: 37%;
	/*margin-left: -370px;*/
	padding-right: 370px;
	margin-top: -5%;
	font-size: 6rem;
	display:block;

	text-align: center;
	color: #fff;
	position: absolute;
	left: 0;
	/*bottom: 48%;*/
	width: 100%;
	font-size: 1.5rem;
}




/*----------------------------------------  #contentWrapp #homepanorama  */
#contentWrapp #homepanorama {
	/*background-image:url(../img/home/bg_home.jpg);*/
	background-image:none;
}
#contentWrapp #homepanorama .content {
	height: 100%;
	margin: 0;
}
#contentWrapp #homepanorama #theta-viewer {
	height: 100%;
	overflow: hidden;
}



/*----------------------------------------  #contentWrapp #homepanoramaphoto  */
#contentWrapp #homepanoramaphoto {
}
#contentWrapp #homepanoramaphoto .content {
	height: 100%;
	margin: 0;
}

#contentWrapp #homepanoramaphoto #btnTopPanorama {
	position: fixed;
	top:30px;
	right: 30px;
	z-index: 100;
}
#contentWrapp #homepanoramaphoto #btnTopPanorama a {
	display: block;
	width:120px;
	height:120px;

	/* 親要素に display: flex; */
	display: -webkit-flex; /* Safari */
	display: flex;

	/* ボックス内の子要素の縦方向の揃え位置 */
	-webkit-align-items: center; /* Safari */
	align-items: center;

	justify-content: center; /* 子要素をflexboxにより中央に配置する */

	text-align: center;
	font-size: 0.825rem;
	/*font-weight: bold;*/
	text-decoration: none;
	color: #fff;

	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: rgba(0,0,0, 0.8);
	

	transition: all 300ms 0s ease;
}



/*----------------------------------------  #contentWrapp #challenge  */
#contentWrapp #challenge, 
#contentWrapp .content {
	height: 100%;
}


/*----------------------------------------  #contentWrapp #shortmovie  */
#contentWrapp #shortmovie {
	height: 100%;
}
#contentWrapp #shortmovie section {
	padding-top: 150px;
	padding-bottom: 150px;
	color: #fff;
}


/*----------------------------------------  #contentWrapp #creative  */
#contentWrapp #creative {
	height: 100%;
}



/*----------------------------------------  #contentWrapp #shooting  */
#contentWrapp #shooting {
}



/*----------------------------------------  #contentWrapp #product  */
#contentWrapp #product {
}
#contentWrapp #product video {
	width: 100%;
	margin: 0 auto;
	z-index: 950;
}
#contentWrapp #product .content {
	height: 100%;

	/* 親要素に display: flex; */
	display: -webkit-flex; /* Safari */
	display: flex;

	/* ボックス内の子要素の縦方向の揃え位置 */
	-webkit-align-items: center; /* Safari */
	align-items: center;
}



/*----------------------------------------  #contentWrapp #panorama  */
#contentWrapp #panorama {
}

#contentWrapp #panorama section {
	padding-top: 150px;
	padding-bottom: 150px;
	color: #fff;
}

#contentWrapp #panorama .content {
	height: 100%;
}

#contentWrapp #panorama #btnTopPanorama {
	position: fixed;
	top:30px;
	right: 30px;
	z-index: 100;
}
#contentWrapp #panorama #btnTopPanorama a {
	display: block;
	width:120px;
	height:120px;

	/* 親要素に display: flex; */
	display: -webkit-flex; /* Safari */
	display: flex;

	/* ボックス内の子要素の縦方向の揃え位置 */
	-webkit-align-items: center; /* Safari */
	align-items: center;

	justify-content: center; /* 子要素をflexboxにより中央に配置する */

	text-align: center;
	font-size: 0.825rem;
	/*font-weight: bold;*/
	text-decoration: none;
	color: #fff;

	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: rgba(0,0,0, 0.8);
	

	transition: all 300ms 0s ease;
}




/*----------------------------------------  #contentWrapp #questionar  */
#contentWrapp #questionar {
}



/*----------------------------------------  #contentWrapp #questionary  */
#contentWrapp #questionary {
	background-size:cover;
	overflow: auto;
}
#contentWrapp #questionary section {
	padding-top: 150px;
	padding-bottom: 150px;
}
#contentWrapp #questionary .explainText {
	padding: 10px;
	margin-bottom: 10px;
}
#contentWrapp #questionary .imgEx {
	margin-top: 10px;
	text-align: center;
}
#contentWrapp #questionary ol {
	padding-left: 1.5rem;
	margin-bottom: 2.5rem;
}
#contentWrapp #questionary li {
	list-style-type: decimal;
	list-style-position: outside;
}


#contentWrapp #questionary .row {
	position: relative;
}

#contentWrapp #questionary #btnDemoQuestionary a, 
#contentWrapp #questionary #btnDemoAdmin a {
	display: block;
	width: 120px;
	height: 120px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: 0.825rem;
	/* font-weight: bold; */
	text-decoration: none;
	color: #fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: rgba(0,0,0, 0.8);
	transition: all 300ms 0s ease;
	position: absolute;
	top: 15px;
	right: 25px;
}

#contentWrapp #questionary #btnDemoQuestionary a {
	right: 160px;
}




/*----------------------------------------  #contentWrapp #vote  */
#contentWrapp #vote {
}

#contentWrapp #vote section {
	padding-top: 150px;
	padding-bottom: 150px;
	color: #fff;
}


/*----------------------------------------  #contentWrapp #qr  */
#contentWrapp #qr {
	background-size: cover;
	overflow: auto;
}

#contentWrapp #qr section {
	padding-top: 150px;
	padding-bottom: 150px;
	color: #fff;
}
#contentWrapp #qr .explainText {
	padding: 10px;
	margin-bottom: 10px;
}
#contentWrapp #qr .imgEx {
	margin-top: 10px;
	text-align: center;
}



/*----------------------------------------  #contentWrapp #turnround  */
#contentWrapp #turnround section {
	padding-top: 240px;
	padding-bottom: 150px;
}




/*----------------------------------------  #contentWrapp #3dcg  */
#contentWrapp #threedcg {

}

#contentWrapp #threedcg section {
	padding-top: 150px;
	padding-bottom: 150px;
	color: #fff;
}


/*----------------------------------------  #contentWrapp #graph  */
#contentWrapp #graph {
}



/*----------------------------------------  #contentWrapp #bargraph  */
#contentWrapp #bargraph {
}



/*----------------------------------------  #contentWrapp #linegraph  */
#contentWrapp #linegraph section.readText {
	margin-top:150px;
}
#contentWrapp #linegraph .explainText {
	padding: 10px;
	margin-bottom: 10px;
}
#contentWrapp #linegraph ol li {
	margin-left: 2rem;
	list-style-type: decimal;
}


/*----------------------------------------  #contentWrapp #bargraph2  */
#contentWrapp #bargraph2 {
}



/*----------------------------------------  #contentWrapp #linegraph2  */
#contentWrapp #linegraph2 {
}



/*----------------------------------------  #contentWrapp #ibeacon  */
#contentWrapp #ibeacon {
}
#contentWrapp #ibeacon video {
	width: 100%;
	margin: 0 auto;
	z-index: 950;
}
#contentWrapp #ibeacon .content {
	/* 親要素に display: flex; */
	display: -webkit-flex; /* Safari */
	display: flex;

	/* ボックス内の子要素の縦方向の揃え位置 */
	-webkit-align-items: center; /* Safari */
	align-items: center;
}



/*----------------------------------------  #contentWrapp #eddystone  */
#contentWrapp #eddystone {
	background-size:cover;
	overflow: auto;
}
#contentWrapp #eddystone section {
	padding-top: 140px;
	padding-bottom: 150px;
	color: #fff;
}
#contentWrapp #eddystone section section {
	padding: 10px 10px 10px 10px;
}
#contentWrapp #eddystone .explainText {
	padding: 10px;
	margin-bottom: 10px;
}
#contentWrapp #eddystone .imgEx {
	margin-top: 10px;
	text-align: center;
}




/*----------------------------------------  #contentWrapp #entertainment  */
#entertainment {
	height: 100%;
}


/*----------------------------------------  #contentWrapp #casualgame  */




/*----------------------------------------  #contentWrapp #jigsawpuzzle  */
#contentWrapp #jigsawpuzzle section {
	padding-top: 140px;
	padding-bottom: 150px;
}



/*----------------------------------------  #contentWrapp #beacon  */
#contentWrapp #beacon section {
	padding-top: 140px;
	padding-bottom: 150px;
	color: #fff;
}

/*----------------------------------------  #contentWrapp #scratch  */
#contentWrapp #scratch section {
	padding-top: 140px;
	padding-bottom: 150px;
	color: #fff;
}

/*----------------------------------------  #contentWrapp #videoletter  */
#contentWrapp #videoletter {
}
#contentWrapp #videoletter {
	height: 100%;
}
#contentWrapp #videoletter section {
	padding-top: 140px;
	padding-bottom: 150px;
	color: #fff;
}
#contentWrapp #videoletter video {
	width: 100%;
	margin: 0 auto;
	z-index: 950;
}
#contentWrapp #videoletter .content {
	height: 100%;

	/* 親要素に display: flex; */
	display: -webkit-flex; /* Safari */
	display: flex;

	/* ボックス内の子要素の縦方向の揃え位置 */
	-webkit-align-items: center; /* Safari */
	align-items: center;
}



/*----------------------------------------  #contentWrapp #toss  */


/*----------------------------------------  #contentWrapp #concentration  */





/*----------------------------------------  #contentWrapp #ball  */

#contentWrapp #ball .content {
	margin-left: 0;
}

#contentWrapp #ball #container {
	text-align: center;
}
#contentWrapp #ball #container canvas {
	display: block;
	/*margin: 0 auto;*/
}


#contentWrapp #ball #btnArea {
	width: 235px;
	height: 235px;
	position: absolute;
	bottom:120px;
	right:30px;
}
#contentWrapp #ball #btnArea div {
	text-align: center;
	position: relative;
}

#contentWrapp #ball #btnImg01 {
	position: absolute;
	top: 0px;
	left: 0px;
}
#contentWrapp #ball #btnImg02 {
	position: absolute;
	top: 0px;
	left: 88px;
}
#contentWrapp #ball #btnImg03 {
	position: absolute;
	top: 0px;
	left: 147px;
}

#contentWrapp #ball #btnImg04 {
	position: absolute;
	top: 88px;
	left: 0px;
}
#contentWrapp #ball #btnImg05 {
	position: absolute;
	top: 88px;
	left: 88px;
}
#contentWrapp #ball #btnImg06 {
	position: absolute;
	top: 88px;
	left: 147px;
}

#contentWrapp #ball #btnImg07 {
	position: absolute;
	top: 147px;
	left: 0px;
}
#contentWrapp #ball #btnImg08 {
	position: absolute;
	top: 147px;
	left: 88px;
}
#contentWrapp #ball #btnImg09 {
	position: absolute;
	top: 147px;
	left: 147px;
}



/*----------------------------------------  #contentWrapp #highlow  */
#contentWrapp #highlow #container {

	/*background: #000 url(/img/challenge/entertainment/casualgame/highlow/bg.png) repeat center top;*/

	width: 600px;

	position: absolute;
	left: 50%;
	top: 50%;

	margin-left: -300px;
	margin-top: -236px;

}
#contentWrapp #highlow #basicText {
	font-size:18px;
	font-weight:bold;
	text-align:center;
	margin:25px 0 20px 0;
	padding:15px 0;
	color:#FFD60A;
	background-image: url(/img/challenge/entertainment/casualgame/highlow/question.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size:280px 50px;
}
#contentWrapp #highlow #btnText {
	font-size:20px;
	font-weight:bold;
	text-align:center;
	margin-bottom:45px;
	color: #fff;
}
#contentWrapp #highlow #resultCount {
	font-size:20px;
	font-weight:bold;
	text-align:center;
	margin-bottom:15px;
	padding:20px;
	border:1px solid #CCCCCC;
	margin:0 10px;
}
#contentWrapp #highlow #resultCount span {
	font-size:40px;
	font-weight:bold;
	color:#FF0000;
}
#contentWrapp #highlow #resultText {
	padding:20px 0 10px 0;
	font-size:50px;
	font-weight:bold;
	text-align:center;
}
/* ボタン */
#contentWrapp #highlow #overFive, #minFive {
	padding: 15px 5px;
	border-radius: 12px 12px 12px 12px;
	-moz-border-radius: 12px 12px 12px 12px;
	-webkit-border-radius: 12px 12px 12px 12px;
	border: 3px solid #ffffff;
	color: #ffffff;
	font-size: 20px;
	font-weight: bold;
	margin-top: 20px;
	margin-bottom: 50px;
	cursor: pointer;
	width: 120px;
	background-color:#00401E;
	text-align: center;
	/* box-shadow */
	box-shadow:rgba(69, 69, 69, 0.63) 0px 4px 5px 0px;
	-webkit-box-shadow:rgba(69, 69, 69, 0.63) 0px 4px 5px 0px;
	-moz-box-shadow:rgba(69, 69, 69, 0.63) 0px 4px 5px 0px;
}
#contentWrapp #highlow #overFive {
	float:right;
	margin-right: 10px;
}
#contentWrapp #highlow #minFive {
	float:left;
	margin-left: 10px;
}
#contentWrapp #highlow #btn {
	width:320px;
	margin:0 auto;
}
#contentWrapp #highlow .invisible {
	display:none;
}
#contentWrapp #highlow .visible {
	display:block;
}
#contentWrapp #highlow #challengeBtn {
	clear:both;
	width:220px;
	margin:0 auto;
	padding: 15px 5px;
	border-radius: 12px 12px 12px 12px;
	-moz-border-radius: 12px 12px 12px 12px;
	-webkit-border-radius: 12px 12px 12px 12px;
	border: 3px solid #ffffff;
	color:#FFFFFF;
	text-align:center;
	font-weight:bold;
	font-size: 20px;
	cursor:pointer;
	background-color:#00401E;
	/* box-shadow */
	box-shadow:rgba(69, 69, 69, 0.63) 0px 4px 5px 0px;
	-webkit-box-shadow:rgba(69, 69, 69, 0.63) 0px 4px 5px 0px;
	-moz-box-shadow:rgba(69, 69, 69, 0.63) 0px 4px 5px 0px;
}


/*----------------------------------------  #contentWrapp #business  */
#business {
	height: 100%;
}



/*----------------------------------------  #contentWrapp #field  */
#contentWrapp #field .content {
	height: 100%;
	margin-left: 0;
}
#contentWrapp #field #container {
	/*background:#000000;*/
	/*border:1px solid #f00;*/
	position: absolute;
	top:0;
	/*left:50%;
	margin-left: -480px;*/
	/*left:16px;*/
	margin-left: 0px;
}
#contentWrapp #field #menu {
	position: absolute;
	left: 0px;
	bottom: 20px;
	width: 100%;
	text-align: center;
}


#contentWrapp #field .leadSentence {
	display: none;

}
#contentWrapp #field .pcLeadSentence {
	position: absolute;
	text-align: center;
	font-size: 28px;
	line-height: 28px;
	color: #fff;
	margin-top: -14px;
}
#contentWrapp #field .pcLeadSentence img {
	vertical-align:middle;
	padding-right: 10px;
}



/*----------------------------------------  #contentWrapp #security  */
#contentWrapp #security {
	/*background-image:url(../img/security/bg_security.jpg);*/
}



/*----------------------------------------  #contentWrapp #office  */

#contentWrapp #office {
	/*background-image:url(../img/office/bg_kyoto.jpg);*/
	/*border: 1px solid #f00;*/
	/*overflow: auto;*/
	background-size:cover;
}

#contentWrapp #office .content {
	/*border: 2px solid #ff0;*/

	/*margin-left: -360px;*/
	/*padding-left: 360px;*/
	/*padding-top: 50px;*/

	box-sizing: border-box;
	float: right;
	width: 100%;
	height: 100%;
}

#contentWrapp #office .float-left {
	float: left;	
	margin: 0;
	width: 100%;
}

#contentWrapp #office .float-right {
	float: right;
	margin: 0;
	width: 100%;
}

#contentWrapp #office .center {
	font-size: 2.5em;
	padding: 80px 0 0 0;
	text-align: center;
}

#contentWrapp #office #nav {
	list-style: none;
	position: fixed;
	right: 20px;
}

#contentWrapp #office #nav li {
	margin: 0 0 15px 0;
}

#contentWrapp #office #header, 
#contentWrapp #office #intro, 
#contentWrapp #office #tokyo, 
#contentWrapp #office #third, 
#contentWrapp #office #fifth {
	width: 100%;
	overflow:hidden;
}

#contentWrapp #office #intro {
	background:url(/img/office/bg_kyoto.jpg) 50% 0 no-repeat fixed;
	background-size:cover;
	/*height: 850px;*/
	/*min-height: 850px;
	height: 100vh;*/
	height: 1236px;
	margin: 0 auto;
	padding: 0;
}


#contentWrapp #office #intro .officeMap {
	margin-top: 150px;
}


/* 名古屋 */
#contentWrapp #office #third {
	background: url(/company/office/nagoya/lib/images/top/bg_top.jpg) 50% 0 no-repeat fixed;
	/*background-size: auto 120%;*/
	background-size:cover;
	background-color: #7bc3b5;
	/*height: 800px;*/
	/*min-height: 800px;
	height: 140vh;*/
	height: 1236px;
	margin: 0 auto;
	padding: 0;
}


#contentWrapp #office .story {
	color: #000;
	height: 100%;

	/*margin: 0 auto;*/
	overflow:hidden;
	padding-top: 150px;
	padding-left: 412px;
	/*min-width: 980px;
	width: 980px;*/
	/*border: 1px solid #f00;*/
}

#contentWrapp #office .story .float-left, 
#contentWrapp #office .story .float-right{
	/*padding: 100px 0 0 0;*/
	position: relative;
	/*width: 350px;*/
	/*border: 1px solid #fff;*/
}

#contentWrapp #office th {
	vertical-align:top;
} 
#contentWrapp #office th, 
#contentWrapp #office td {
	padding: 15px 5px;
} 
#contentWrapp #office table {
	width: 80%;
}

#contentWrapp #office .officeMap {
	margin-top: 250px;
	width: 100%;
}
#contentWrapp #office .officeMap .gmap {
	width: 98%;
	height:500px;
	position:relative;
	display:-webkit-flex;
	display:flex;
	-webkit-justify-content:flex-end;
	justify-content:flex-end;
	-webkit-align-items:flex-end;
	align-items:flex-end;
}
#contentWrapp #office .officeMap.kyoto .gmap {
	height:500px;
}
#contentWrapp #office .officeMap .btnScaleUp {/*周りの凹み*/
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: rgba(124, 195, 179, 0.8);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	text-align: center;
	background: #f7f7f7;
	box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.08);
	cursor:pointer;
}
#contentWrapp #office .officeMap .btnScaleUp .fa {/*ボタン自体*/
	position: absolute;
	content: '';
	width: 36px;
	height: 36px;
	line-height: 38px;
	vertical-align: middle; 
	left: 4px;
	top: 4px;
	border-radius: 50%;
	font-size: 20px;
	background-image: -webkit-linear-gradient(#efefef 0%, #d6d6d6 100%);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);
	border-bottom: solid 2px #d8d8d8;
}
#contentWrapp #office .officeMap .btnScaleUp .fa:before {
	display:block;
	content: "";
	background-image:url(/img/office/bg_loope.png);
	background-repeat:no-repeat;
	background-position:center 0;
	font-weight: bold;
	height: 20px;
	width:100%;
	margin-top: 8px;
}
#contentWrapp #office .officeMap .btnScaleUp.up .fa:before {
	background-image:url(/img/office/bg_loope.png);
	background-repeat:no-repeat;
	background-position:center -20px;
}
#contentWrapp #office .officeMap .box {
	position:absolute;
	bottom:0;
	right:60px;
	width: 150px;
	height: 150px;
}
#contentWrapp #office .officeMap .box .mapCanvas {
	width:100%;
	height:100%;
}
#contentWrapp #office .officeMap .scale-l-wrap {
	height:500px;
}
#contentWrapp #office .officeMap .scale-l-child {
	width:93%!important;
	height:500px!important;
}


.photoArea {
	margin: 10px 0 0 0 ;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	/*-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-pack: space-between;*/
}
.photoBox {
	width: 15%;
	margin: 0 0 10px 0;
	text-align: center;
}



/*top*/
#contentWrapp #office #third .float-left {
	height: 100%;
}
.topTextWrap {
	position:absolute;
	width:80%;
	top:50%;
	left: -412px;
}
#contentWrapp #office #third .topTextWrap .h1Wrap {
	border-bottom:5px solid #FFF;
	margin-bottom:15px;
}
#contentWrapp #office #third .topTextWrap .menuWrap {
	border-top:5px solid #FFF;
}
#contentWrapp #office #third .topTextWrap .menuWrap a {
	color:#fff;
}
#contentWrapp #office #third h1 {
	text-align:right;
	padding:0 20px 0 0;
	font-size:24px;
}
#contentWrapp #office #third ul{
	font-size:20px;
	padding:10px 20px 0 0;
	margin:0;
	list-style-type:none;
	text-align:left;
}
#contentWrapp #office #third ul li {
	float:right;
	margin-left:15px;
	font-size:18px;
}

#contentWrapp #office #third .galleryLink{
	color:#FFF;
	z-index:9999;
}

#contentWrapp #office #third .staffLink{
	color:#FFF;
	z-index:9998;
}
#contentWrapp #office #third .mapLink{
	color:#FFF;
	z-index:9998;
}
#contentWrapp #office #third .backLink{
	z-index:9998;
	float:left;
	margin-left:15px;
}
#contentWrapp #office #third .backLink a{
	color:#FFF;
	font-size:18px;
	text-decoration:none;
}



/*----------------------------------------  #contentWrapp #managementteam  */



/*----------------------------------------  #contentWrapp #managementboard  */
@charset "utf-8";
/* CSS Document */

#contentWrapp #managementboard {
	height:100%;
}
#contentWrapp #managementboard .content {
	height:100%;
}
#contentWrapp #managementboard .content .managementboardArea {
	width:720px;
	height:230px;

	position: fixed;
	left: 50%;
	top: 50%;

	margin-left: -360px;
	margin-left: -180px;
	margin-top: -115px;
}

#contentWrapp #managementboard .content .managementboardArea li {
	cursor : pointer;
}

#contentWrapp #managementboard #btn{
	display: none;

}
#contentWrapp #managementboard .open{
	width: 20px;
	height: 20px;
	background: url(img/btn_open.png) no-repeat top left;
	position: absolute;
	top:95px;
	right: 20px;
	z-index: 50;
	cursor:pointer;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;

}
#contentWrapp #managementboard .close{

	width: 20px;
	height: 20px;
	background: url(img/btn_close.png) no-repeat top left;
	position: absolute;
	top:-95px;
	z-index: 999;
	cursor:pointer;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;

}

#contentWrapp #managementboard .openMain{
	height: 230px;

	opacity: 1;
	-webkit-transition: all 1.8s ease-in-out;
	transition: all 1.7s ease-in-out;
}


#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(1):hover{
	width: 300%;
		-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(2):hover{
	width: 300%;
		-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(3):hover{
	width: 300%;
		-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(4):hover{
	width: 300%;
		-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

/***************************************************************************/
#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(1){
	margin-top:0;
		-webkit-transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(2){
	margin-top:0;
		-webkit-transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(3){
	margin-top:0;
		-webkit-transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #managementboard #main-nav ul li.openBox:nth-child(4){
	margin-top:0;
		-webkit-transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}






#contentWrapp #managementboard .closeMain{
	height: 230px;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease-in-out;
	transition: opacity 0.5s ease-in-out;
}
#contentWrapp #managementboard .openBtn{
	opacity: 1;
	-webkit-transition: opacity 1.8s ease-in-out;
	transition: opacity 1.8s ease-in-out;
}

#contentWrapp #managementboard .closeBtn{
	opacity:1;
	-webkit-transition: opacity 1.8s ease-in-out;
	transition: opacity 1.8s ease-in-out;
}

#contentWrapp #managementboard .closeBtnX{
	opacity:0;

}



#contentWrapp #managementboard #main-nav ul, #main-nav li {
	height: 100%;

}
#contentWrapp #managementboard #main-nav ul {
	list-style: none;
	display: -webkit-flex;
	display: flex;


	width: 720px;
}
#contentWrapp #managementboard #main-nav li {


	width: 100%;
	height: 100%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
	/* center */
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	overflow: hidden;
	position: relative;
}
#contentWrapp #managementboard #main-nav li:hover {
	width: 300%;
		-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav li:nth-child(1) {
	background:#000 url('../img/managementteam/managementboard/img_test1.jpg') no-repeat top left;
	background-position: left center;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
/*�ړ��p*/
	margin-top:70px;
}
#contentWrapp #managementboard #main-nav li:nth-child(1):hover {
	background-position: 0px;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav li:nth-child(2) {
	background: #000 url('../img/managementteam/managementboard/img_test2.jpg') no-repeat top left;
	background-position: left center;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	/*�ړ��p*/
	margin-top:70px;
}
#contentWrapp #managementboard #main-nav li:nth-child(2):hover {
background-position: 0px;		
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav li:nth-child(3) {
	background: #000 url('../img/managementteam/managementboard/img_test3.jpg') no-repeat top left;
	background-position: left center;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	/*�ړ��p*/
	margin-top:70px;
}
#contentWrapp #managementboard #main-nav li:nth-child(3):hover {
	background-position: 0px;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav li:nth-child(4) {
	background: #000 url('../img/managementteam/managementboard/img_test4.jpg') no-repeat top left;
	background-position: left center;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	/*�ړ��p*/
	margin-top:70px;
}
#contentWrapp #managementboard #main-nav li:nth-child(4):hover {
	background-position: 0px;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard #main-nav a {
	font-weight: normal;
	text-decoration: none;

	color: #fff;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#contentWrapp #managementboard main-nav a:hover {
	background: rgba(255,255,255,.2);
	background: #000;
}

#contentWrapp #managementboard .contentsWrap{	
	/*width: 960px;
	height: 540px;*/
	width:720px;
	height:230px;
	margin: 0 auto;
	background: url('../img/managementteam/managementboard/img_mainbg.jpg') top center no-repeat;
	background-size: contain;
	position: relative;
	overflow: hidden;
}
#contentWrapp #managementboard #main-nav img{
	width: 100%;
}
#contentWrapp #managementboard #main-nav .textBox{
	margin-top:318px;
	display: block;
	width: 100%;
	height: 100%;
	background:url('/img/managementteam/managementboard/textbg.png') repeat;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;

	position: relative;
}
#contentWrapp #managementboard #main-nav .textBox p{
	color: #ffffff;	
	
	margin-left:5px;
	margin-right: 5px;
}
#contentWrapp #managementboard #main-nav .textBox .posName{
	font-size: 0.6rem;
	/*margin-top:5px;*/
}
#contentWrapp #managementboard #main-nav .textBox .posName span{
	font-size:9px;

}
#contentWrapp #managementboard #main-nav .textBox .nameTtl{
	font-size: 0.75rem;
	margin-top:5px;
}
#contentWrapp #managementboard #main-nav .note{
	font-size: 0.5rem;
	margin-top:5px;
	margin-left: 5px;
	/*display: none;*/
	color: #ffffff;

	position: absolute;
	top:0;
	left:189px;
	width:190px;
}
#contentWrapp #managementboard #main-nav .note p{
		margin-top: 5px;
		margin-left: 0;
}
#contentWrapp #managementboard #main-nav .textBox.on{
	margin-top:210px;
	display: block;
	width: 100%;
	height: 100%;
	background:url('../img/textbg.png') repeat;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#contentWrapp #managementboard .cssanimation, .cssanimation span {
	animation-duration: 0.2s;
	animation-fill-mode: both;
}

#contentWrapp #managementboard .cssanimation {
	letter-spacing: -4px;
}
#contentWrapp #managementboard .cssanimation span {
	display: inline-block;
	margin-left: -4px;
}



#contentWrapp #managementboard .leFadeInRight span { animation-name: leFadeInRight }
@keyframes leFadeInRight {
	from {
		opacity: 0;
		transform: translateX(60px);
	}
	to { opacity: 1 }
}




/*----------------------------------------  #contentWrapp #seniorstaff  */

#contentWrapp #seniorstaff {
	overflow: auto;
	min-height: 950px;
	height:100%;
}
#contentWrapp #seniorstaff .content  {
	height:100%;
}
#contentWrapp #seniorstaff .content .seniorstaffArea {
	width:540px;
	height:710px;

	position: absolute;
	left: 50%;
	top: 50%;

	margin-left: -270px;
	margin-top: -355px;
}
#contentWrapp #seniorstaff .content .seniorstaffArea li {
	cursor : pointer;
}

#contentWrapp #seniorstaff #btn{
		display: none;
}
#contentWrapp #seniorstaff .open{
	width: 20px;
	height: 20px;
	background: url(img/btn_open.png) no-repeat top left;
	position: absolute;
	top:95px;
	right: 20px;
	z-index: 50;
	cursor:pointer;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
#contentWrapp #seniorstaff .close{

	width: 20px;
	height: 20px;
	background: url(img/btn_close.png) no-repeat top left;
	position: absolute;
	top:-95px;
	z-index: 999;
	cursor:pointer;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

#contentWrapp #seniorstaff #main-nav{
	
	position:reletive;
	/*opacity: 1;
	-webkit-transition: all 0.8s ease-in-out;
	transition: all 0.8s ease-in-out;*/
}
#contentWrapp #seniorstaff #main-nav{
		height: 230px;
		 /*opacity: 0;
		-webkit-transition: all 0.8s ease-in-out;
		transition: all 0.8s ease-in-out;*/
}

.keystaffAreaPhoto {
	display:none;
}

/***************************************************************************/
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(1){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);	
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(2){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(3){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}


/*二段目マウスオーバー*/
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(1):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(2):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(3):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}



#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li:nth-child(1){
	opacity: 0;
	margin-top:45px;
	
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li:nth-child(2){
	opacity: 0;
	margin-top:45px;
	
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li:nth-child(3){
	opacity: 0;
	margin-top:45px;
	
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);

}



#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(1){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);	
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(2){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(3){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}

/*三段目マウスオーバー*/
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(1):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(2):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(3):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}



#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li:nth-child(1){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li:nth-child(2){
	opacity: 0;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li:nth-child(3){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}


/**/
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(1){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);	
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(2){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(3){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}

/*�O�i�ڃ}�E�X�I�[�o�[*/
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(1):hover{
	width:740%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(2):hover{
	width:740%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(3):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}



#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li:nth-child(1){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li:nth-child(2){
	opacity: 0;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li:nth-child(3){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}



/***************************************************************************/



#contentWrapp #seniorstaff .openBtn{
	opacity: 1;
	-webkit-transition: all 0.8s ease-in-out;
	transition: all 0.8s ease-in-out;
}

#contentWrapp #seniorstaff .closeBtn{
	opacity:1;
	-webkit-transition: all 0.8s ease-in-out;
	transition: all 0.8s ease-in-out;
}

#contentWrapp #seniorstaff .closeBtnX{
	opacity:0;

}
#contentWrapp #seniorstaff #main-nav ul, #main-nav li {
	height: 100%;

}
#contentWrapp #seniorstaff #main-nav ul {
	list-style: none;
	display: -webkit-flex;
	display: flex;



	width:540px;

	margin-bottom: 10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) {
	margin-bottom: 0;
}

#contentWrapp #seniorstaff #main-nav li {
	background: #000;

	width: 100%;
	height: 100%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
	/* center */
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	overflow: hidden;
	position: relative;

	background-repeat: no-repeat;
	background-position: top left;
	
}




#contentWrapp #seniorstaff #main-nav li:hover {
	background-repeat: no-repeat;
	background-position: top left;
	width: 300%;
	

}
/*#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(1) {
	background-position: left center;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;

}
#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(1):hover {
	background-position: 0px;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}

#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(2) {
	background-position: left center;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}
#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(2):hover {
	background-position: 0px;		
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}

#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(3) {
	background-position: left center;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}
#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(3):hover {
	background-position: 0px;
	-webkit-transition: all 0.3s ease-out;
	transition: width 0.3s ease-out;
}
*/



#contentWrapp #seniorstaff #main-nav a {
	font-weight: normal;
	text-decoration: none;

	color: #fff;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#contentWrapp #seniorstaff main-nav a:hover {
	background: rgba(255,255,255,.2);
	background: #000;
}

#contentWrapp #seniorstaff .contentsWrap{
	width:540px;
	height:710px;
	margin: 0 auto;
	background: url('../img/managementteam/managementboard/img_mainbg.jpg') top center no-repeat;
	background-size: contain;
	position: relative;
	overflow: hidden;
}
#contentWrapp #seniorstaff #main-nav img{
	width: 100%;
}
#contentWrapp #seniorstaff #main-nav .textBox{
	margin-top:340px;
	display: block;
	width: 100%;
	height: 100%;
	background:url('/img/managementteam/managementboard/textbg.png') repeat;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;

	position: relative;
}
#contentWrapp #seniorstaff #main-nav .textBox p{
	color: #ffffff;	
	
	margin-left:5px;
		margin-right: 5px;
}
#contentWrapp #seniorstaff #main-nav .textBox .posName{
	font-size:8px; 
	/*margin-top:5px;*/
	white-space:nowrap;
}
#contentWrapp #seniorstaff #main-nav .textBox .posName span{
	font-size:6px;

}
#contentWrapp #seniorstaff #main-nav .textBox .namettl{
	font-size:12px; 
	margin-top:5px;
	
	white-space:nowrap;
}
#contentWrapp #seniorstaff #main-nav .note{
	font-size:8px; 
	margin-top:5px;
	margin-left: 5px;
	/*display: none;*/
	color: #ffffff;
	position: absolute;
	top:0;
	left:184px;
	width:125px;
}
#contentWrapp #seniorstaff #main-nav .textBox .note p{
	margin-top: 5px;
	margin-left: 0;
}
#contentWrapp #seniorstaff #main-nav .textBox.on{
	margin-top:210px;
	display: block;
	width: 100%;
	height: 100%;
	background:url('../img/textbg.png') repeat;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#contentWrapp #seniorstaff #bgText{
	font-family: Arial Black;
	color: #000;
	font-size: 75px;
	font-weight: bold;
	position: absolute;
	right:-3px;
	bottom:-10px;
	opacity: 0.5;
	text-shadow: 1px 1px 5px #ffffff;
}
/*.leFadeInRight span { animation-name: leFadeInRight }
@keyframes leFadeInRight {
	from {
		opacity: 0;
		transform: translateX(60px);
	}
	to { opacity: 1 }
}*/
#contentWrapp #seniorstaff .cssanimation, .cssanimation span {
	animation-duration: 0.2s;
	animation-fill-mode: both;
}

#contentWrapp #seniorstaff .cssanimation span { display: inline-block }

#contentWrapp #seniorstaff .leFadeInRight span { animation-name: leFadeInRight }
@keyframes leFadeInRight {
	from {
		opacity: 0;
		transform: translateX(60px);
	}
	to { opacity: 1 }
}




/*----------------------------------------  #contentWrapp #keystaff  */

#contentWrapp #seniorstaff {
	overflow: auto;
	min-height: 950px;
	height:100%;
}
#contentWrapp #seniorstaff .content  {
	height:100%;
}
#contentWrapp #seniorstaff .content .seniorstaffArea {
	width:540px;
	height:710px;

	position: absolute;
	left: 50%;
	top: 50%;

	margin-left: -270px;
	margin-top: -355px;
}
#contentWrapp #seniorstaff .content .seniorstaffArea li {
	cursor : pointer;
}

#contentWrapp #seniorstaff #btn{
		display: none;
}
#contentWrapp #seniorstaff .open{
	width: 20px;
	height: 20px;
	background: url(img/btn_open.png) no-repeat top left;
	position: absolute;
	top:95px;
	right: 20px;
	z-index: 50;
	cursor:pointer;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
#contentWrapp #seniorstaff .close{

	width: 20px;
	height: 20px;
	background: url(img/btn_close.png) no-repeat top left;
	position: absolute;
	top:-95px;
	z-index: 999;
	cursor:pointer;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

#contentWrapp #seniorstaff #main-nav{
	
	position:reletive;
	/*opacity: 1;
	-webkit-transition: all 0.8s ease-in-out;
	transition: all 0.8s ease-in-out;*/
}
#contentWrapp #seniorstaff #main-nav{
		height: 230px;
		 /*opacity: 0;
		-webkit-transition: all 0.8s ease-in-out;
		transition: all 0.8s ease-in-out;*/
}

.keystaffAreaPhoto {
	display:none;
}

/***************************************************************************/
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(1){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);	
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(2){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(3){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}


/*��i�ڃ}�E�X�I�[�o�[*/
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(1):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(2):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li.openList:nth-child(3):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}



#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li:nth-child(1){
	opacity: 0;
	margin-top:45px;
	
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li:nth-child(2){
	opacity: 0;
	margin-top:45px;
	
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(1) li:nth-child(3){
	opacity: 0;
	margin-top:45px;
	
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);

}



#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(1){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);	
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(2){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(3){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}

/*��i�ڃ}�E�X�I�[�o�[*/
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(1):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(2):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li.openList:nth-child(3):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}



#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li:nth-child(1){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li:nth-child(2){
	opacity: 0;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(2) li:nth-child(3){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}


/**/
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(1){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);	
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(2){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(3){
	opacity: 1;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:0px;
		-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius:10px;
}

/*二段目マウスオーバー*/
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(1):hover{
	width:740%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(2):hover{
	width:740%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li.openList:nth-child(3):hover{
	width:300%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;	
}



#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li:nth-child(1){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li:nth-child(2){
	opacity: 0;
	-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) li:nth-child(3){
	opacity: 0;
		-webkit-transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: opacity 1.2s cubic-bezier(0.215, 0.61, 0.355, 1), margin 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
	margin-top:45px;
}



/***************************************************************************/



#contentWrapp #seniorstaff .openBtn{
	opacity: 1;
	-webkit-transition: all 0.8s ease-in-out;
	transition: all 0.8s ease-in-out;
}

#contentWrapp #seniorstaff .closeBtn{
	opacity:1;
	-webkit-transition: all 0.8s ease-in-out;
	transition: all 0.8s ease-in-out;
}

#contentWrapp #seniorstaff .closeBtnX{
	opacity:0;

}
#contentWrapp #seniorstaff #main-nav ul, #main-nav li {
	height: 100%;

}
#contentWrapp #seniorstaff #main-nav ul {
	list-style: none;
	display: -webkit-flex;
	display: flex;



	width:540px;

	margin-bottom: 10px;
}
#contentWrapp #seniorstaff #main-nav ul:nth-child(3) {
	margin-bottom: 0;
}

#contentWrapp #seniorstaff #main-nav li {
	background: #000;

	width: 100%;
	height: 100%;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
	/* center */
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	overflow: hidden;
	position: relative;

	background-repeat: no-repeat;
	background-position: top left;
	
}




#contentWrapp #seniorstaff #main-nav li:hover {
	background-repeat: no-repeat;
	background-position: top left;
	width: 300%;
	

}
/*#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(1) {
	background-position: left center;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;

}
#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(1):hover {
	background-position: 0px;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}

#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(2) {
	background-position: left center;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}
#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(2):hover {
	background-position: 0px;		
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}

#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(3) {
	background-position: left center;
	-webkit-transition: width 0.3s ease-out;
	transition: width 0.3s ease-out;
}
#contentWrapp #seniorstaff #main-nav li.openBox:nth-child(3):hover {
	background-position: 0px;
	-webkit-transition: all 0.3s ease-out;
	transition: width 0.3s ease-out;
}
*/



#contentWrapp #seniorstaff #main-nav a {
	font-weight: normal;
	text-decoration: none;

	color: #fff;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#contentWrapp #seniorstaff main-nav a:hover {
	background: rgba(255,255,255,.2);
	background: #000;
}

#contentWrapp #seniorstaff .contentsWrap{
	width:540px;
	height:710px;
	margin: 0 auto;
	background: url('../img/managementteam/managementboard/img_mainbg.jpg') top center no-repeat;
	background-size: contain;
	position: relative;
	overflow: hidden;
}
#contentWrapp #seniorstaff #main-nav img{
	width: 100%;
}
#contentWrapp #seniorstaff #main-nav .textBox{
	margin-top:340px;
	display: block;
	width: 100%;
	height: 100%;
	background:url('/img/managementteam/managementboard/textbg.png') repeat;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;

	position: relative;
}
#contentWrapp #seniorstaff #main-nav .textBox p{
	color: #ffffff;	
	
	margin-left:5px;
		margin-right: 5px;
}
#contentWrapp #seniorstaff #main-nav .textBox .posName{
	font-size:8px; 
	/*margin-top:5px;*/
	white-space:nowrap;
}
#contentWrapp #seniorstaff #main-nav .textBox .posName span{
	font-size:6px;

}
#contentWrapp #seniorstaff #main-nav .textBox .namettl{
	font-size:12px; 
	margin-top:5px;
	
	white-space:nowrap;
}
#contentWrapp #seniorstaff #main-nav .note{
	font-size:8px; 
	margin-top:5px;
	margin-left: 5px;
	/*display: none;*/
	color: #ffffff;
	position: absolute;
	top:0;
	left:184px;
	width:125px;
}
#contentWrapp #seniorstaff #main-nav .textBox .note p{
	margin-top: 5px;
	margin-left: 0;
}
#contentWrapp #seniorstaff #main-nav .textBox.on{
	margin-top:210px;
	display: block;
	width: 100%;
	height: 100%;
	background:url('../img/textbg.png') repeat;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#contentWrapp #seniorstaff #bgText{
	font-family: Arial Black;
	color: #000;
	font-size: 75px;
	font-weight: bold;
	position: absolute;
	right:-3px;
	bottom:-10px;
	opacity: 0.5;
	text-shadow: 1px 1px 5px #ffffff;
}
/*.leFadeInRight span { animation-name: leFadeInRight }
@keyframes leFadeInRight {
	from {
		opacity: 0;
		transform: translateX(60px);
	}
	to { opacity: 1 }
}*/
#contentWrapp #seniorstaff .cssanimation, .cssanimation span {
	animation-duration: 0.2s;
	animation-fill-mode: both;
}

#contentWrapp #seniorstaff .cssanimation span { display: inline-block }

#contentWrapp #seniorstaff .leFadeInRight span { animation-name: leFadeInRight }
@keyframes leFadeInRight {
	from {
		opacity: 0;
		transform: translateX(60px);
	}
	to { opacity: 1 }
}




/*----------------------------------------  #contentWrapp #security  */




/*----------------------------------------  #contentWrapp #servicelevel  */




/*----------------------------------------  #contentWrapp #serverload  */
#contentWrapp #serverload {
	background-size:cover;
	overflow: auto;
}
#contentWrapp #serverload section {
	padding-top: 150px;
	padding-bottom: 150px;
	color: #fff;
}
#contentWrapp #serverload .explainText {
	padding: 10px;
	margin-bottom: 10px;
}
#contentWrapp #serverload .imgEx {
	margin-top: 10px;
	text-align: center;
}



/*----------------------------------------  #contentWrapp #vulnerability  */
#contentWrapp #vulnerability {
}







/*----------------------------------------  #contentWrapp #about  */
#contentWrapp #about {
	background-size:cover;
	overflow: auto;
}
#contentWrapp #about section {
	padding-top: 150px;
	padding-bottom: 150px;
	color: #fff;
}
#contentWrapp #about .explainText {
	padding: 10px;
	margin-bottom: 10px;
}
#contentWrapp #about .imgEx {
	margin-top: 10px;
	text-align: center;
}




/*----------------------------------------  #contentWrapp #case  */
#contentWrapp #case {
	overflow: auto;
}
#contentWrapp #case section {
	padding-top: 150px;
	padding-bottom: 0px;
	color: #fff;
}
#contentWrapp #case section:last-child {
	padding-bottom: 150px;
}
#contentWrapp #case .explainText {
	/*width: 440px;*/
	/*border-top: 2px solid #f00;*/
	padding: 10px;
}
#contentWrapp #case section .caseText {
	color: #333;

	/*width: 474px;*/
	padding: 10px;
}

/* ------ */
#contentWrapp #case .content section:nth-child(3) .caseText:nth-child(2) {
	margin: -5px 100px 0 50px;
}
#contentWrapp #case .content section:nth-child(3) .caseText:nth-child(3) {
	margin: -5px 0 0 150px;
}
#contentWrapp #case .content section:nth-child(3) .caseText:nth-child(4) {
	margin: 5px 130px 0 20px;
}
#contentWrapp #case .content section:nth-child(3) .caseText:nth-child(5) {
	margin: 5px 30px 0 120px;
}

/* ------ */
#contentWrapp #case .content section:nth-child(4) .caseText:nth-child(2) {
	margin: 5px 0 0 100px;
}
#contentWrapp #case .content section:nth-child(4) .caseText:nth-child(3) {
	margin: -5px 0 0 70px;
}

/* ------ */
#contentWrapp #case .content section:nth-child(5) .caseText:nth-child(2) {
	margin: 5px 0 0 100px;
}
#contentWrapp #case .content section:nth-child(5) .caseText:nth-child(2) img {
	margin-bottom: 10px;
}




/*----------------------------------------  #contentWrapp #flow  */
#contentWrapp #flow {
	overflow: auto;
}
#contentWrapp #flow section {
	padding-top: 150px;
	padding-bottom: 0px;
	color: #fff;
}
#contentWrapp #flow section:last-child {
	padding-bottom: 150px;
}
#contentWrapp #flow .explainText {
	/*width: 440px;*/
	/*border-top: 2px solid #f00;*/
	padding: 10px;
}
#contentWrapp #flow .imgEx {
	margin-top: 10px;
	text-align: center;
}
#contentWrapp #flow .checkList th, 
#contentWrapp #flow .checkList td {
	border: 1px solid #333;
}




/*----------------------------------------  #contentWrapp #other  */
#contentWrapp #other {
	overflow: auto;
}
#contentWrapp #other section {
	padding-top: 150px;
	padding-bottom: 0px;
	color: #fff;
}
#contentWrapp #other section:last-child {
	padding-bottom: 150px;
}
#contentWrapp #other .explainText {
	/*width: 440px;*/
	/*border-top: 2px solid #f00;*/
	padding: 10px;
}
#contentWrapp #other .imgEx {
	margin-top: 10px;
	text-align: center;
}



/*----------------------------------------  #contentWrapp #datanetwork  */
#contentWrapp #datanetwork {
}



/*----------------------------------------  #contentWrapp #weavenetwork  */
#contentWrapp #weavenetwork {
	/*overflow: auto;*/
}

#contentWrapp #weavenetwork section {
	padding-top: 150px;
	padding-bottom: 150px;
}
#contentWrapp #weavenetwork .explainText {
	padding: 10px;
	margin-bottom: 10px;
}
#contentWrapp #weavenetwork .imgEx {
	margin-top: 10px;
	padding: 10px;
	text-align: center;
}


/*----------------------------------------  #footMenu  */
#footMenu {
	z-index:100;
	position:fixed;
	bottom:-100%;
	left:0;
	width:100%;
	background-color:rgba(0,0,0,0.8);
	border-radius:15px 15px 0 0;
	transition: bottom .5s;
}
#footMenu.on {
	bottom:0% !important;
}
#footMenu div.menuBtn{
	height:60px;
	background-image:url(/img/company/ico/icon_arrow_up.png);
	background-size:30px auto;
	background-repeat:no-repeat;
	background-position:center 30px;
}
#footMenu.on div.menuBtn{
	background-image:url(/img/company/ico/icon_arrow_down.png);
	background-size:30px auto;
	background-repeat:no-repeat;
	background-position:center 30px;
}
#footMenu div.menuBtn div{
	color:#FFF;
	text-align:center;
	padding-top:10px;
	font-size:12px;
}
#footMenu .menuList{
	padding:15px 0 20px 0;
	overflow: hidden;
	width: 90%;
	margin: 0 auto;
}
#footMenu ul{
	display:flex;
	justify-content:space-between;
}
#footMenu li{
	text-align:center;
	white-space: nowrap
}
#footMenu ul li:nth-child(1) a{
	background-image:url(/img/company/ico/ico_01.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(2) a{
	background-image:url(/img/company/ico/ico_02.png);
	background-size: 85% auto;
}	
#footMenu ul li:nth-child(3) a{
	background-image:url(/img/company/ico/ico_03.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(4) a{
	background-image:url(/img/company/ico/ico_04.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(5) a{
	background-image:url(/img/company/ico/ico_05.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(6) a{
	background-image:url(/img/company/ico/ico_06.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(7) a{
	background-image:url(/img/company/ico/ico_07.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(8) a{
	background-image:url(/img/company/ico/ico_08.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(9) a{
	background-image:url(/img/company/ico/ico_09.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(10) a{
	background-image:url(/img/company/ico/ico_10.png);
	background-size: 85% auto;
}
#footMenu ul li:nth-child(11) a{
	background-image:url(/img/company/ico/ico_11.png);
	background-size: 85% auto;
}
body.security #footMenu ul li:nth-child(1) a {
	background: url(/img/security/ico/ico_datanetwork.png) 50% 15% no-repeat;
	background-size: 70% auto;
}	
body.security #footMenu ul li:nth-child(2) a{
	background-image:url(/img/security/ico/ico_security.png);
	background-size: 74% auto;
}
body.challenge #footMenu ul li:nth-child(1) a{
background-image:url(/img/challenge/ico/icon_01.png);
background-size: 62% auto;
}
body.challenge #footMenu ul li:nth-child(2) a{
	background-image:url(/img/challenge/ico/icon_02.png);
	background-size: 62% auto;
}
body.challenge #footMenu ul li:nth-child(3) a{
	background-image:url(/img/challenge/ico/icon_03.png);
	background-size: 83% auto;
}
body.challenge #footMenu ul li:nth-child(4) a{
	background-image:url(/img/challenge/ico/icon_04.png);
	background-size: 55% auto;
}
body.challenge #footMenu ul li:nth-child(5) a{
	background:url(/img/challenge/ico/icon_05.png) 50% 25% no-repeat;
	background-size: 74% auto;
}
body.challenge #footMenu ul li:nth-child(6) a{
	background-image:url(/img/challenge/ico/icon_06.png);
	background-size: 70% auto;
}
body.challenge #footMenu ul li:nth-child(7) a{
	background-image:url(/img/challenge/ico/icon_07.png);
	background-size: 60% auto;
}
body.challenge #footMenu ul li:nth-child(8) a{
	background-image:url(/img/challenge/ico/icon_08.png);
	background-size: 60% auto;
}
body.challenge #footMenu ul li:nth-child(9) a{
	background-image:url(/img/challenge/ico/icon_09.png);
	background-size: 60% auto;
}
#footMenu li a{
	color:#FFF;
	display:block;
	text-decoration:none;
	font-size:10px;
	background-repeat:no-repeat;
	background-position:center top;
	text-align:center;
	white-space: nowrap;
	width: 6vw;
	padding-top:85%;
}
body.company #footMenu .menuList{
	width: 95%;
}
body.security #footMenu .menuList{
	width: 18%;
}
body.security #footMenu li a {
	width: 8vw;
}

/* company footMenu */
body.company #footMenu .menuList {
	width: 43%;
}
body.company #footMenu ul {
	align-items: flex-end;
}
body.company #footMenu ul li:nth-child(1) a {
	background: url(/img/company/ico/ico_organization.png)no-repeat center center / contain;
	width: 8vw;
	margin-top: -1.1vw;
}
body.company #footMenu ul li:nth-child(2) a {
	background: url(/img/company/ico/ico_office.png)no-repeat center center / contain;
	width: 8vw;
	margin-top: -0.7vw;
}
body.company #footMenu ul li:nth-child(3) a {
	background-image: url(/img/company/ico/ico_10.png);
	background-size: 85% auto;
	background-position: 10px -10px;
	margin-top: -12px;
}
body.company #footMenu ul li:nth-child(4) a {
	background-image: url(/img/company/ico/ico_11.png);
	background-size: 85% auto;
	background-position: 10px -10px;
}


/*----------------------------------------  cssanimation  */

/**
 * cssanimation.css
 * https://www.cssanimatio.io
 * Created and maintained by: Pavel
 * Find me at: https://www.linkedin.com/in/yesiamrocks/
 * Email: hello@cssanimation.io
 * Github: https://github.com/yesiamrocks/cssanimation.io
 * Title: A CSS Animation Library for Developers and Ninjas
 * Copyright (c) 2017 Pavel
 * License: cssanimation.io is licensed under the MIT license
 **/

.cssanimation, .cssanimation span {
	animation-duration: 1s;
	animation-fill-mode: both;
}

.cssanimation span { display: inline-block }

.leFadeInRight span { animation-name: leFadeInRight }
@keyframes leFadeInRight {
	from {
		opacity: 0;
		transform: translateX(60px);
	}
	to { opacity: 1 }
}



/*----------------------------------------  minor break point  */
@media screen and (max-width: 1199px) {
	/* common */
	#phoneArea {
		left: 15px;
	}
	.content {
		margin-left: 295px;
	}
	.content h1.cssanimation {
		font-size: 2.5rem;
		/*letter-spacing: -3px;*/
		bottom: -5px;
	}


	
	/* #home */
	#contentWrapp #home .content h1 {
		left: 70%;
		margin-left: -370px;
	}

	/* #keystaffArea */
	#contentWrapp #marketing .content #keystaffArea,
	#contentWrapp #creativeandplanning .content #keystaffArea,
	#contentWrapp #networkandsystem .content #keystaffArea,
	#contentWrapp #operation .content #keystaffArea {
		margin-left: -230px;
	}

	/* #office */
	#contentWrapp #office .story {
		padding-left: 300px;
	}
}


/*----------------------------------------  minor break point (ipad) */
@media screen and (max-width: 1024px) {


	#btnTopArea {
		top: 15px;
		position: fixed;
	}
	#btnTopArea p:nth-child(2) {
		margin-top: 10px;
	}
	#phoneArea {
		top: 100px;
		position: fixed;
	}
	#footerCopy {
		bottom: 10px;
	}
	
	/* #home */
	#contentWrapp #home .content h1 {
		width: 40%;
		left: 80%;
		margin-left: -370px;
	}

	/* #managementboard */
	#contentWrapp #managementboard .content .managementboardArea {
		margin-left: -365px;
		position: absolute;
	}

	/* #keystaffArea */
	#contentWrapp #marketing .content #keystaffArea,
	#contentWrapp #creativeandplanning .content #keystaffArea,
	#contentWrapp #networkandsystem .content #keystaffArea,
	#contentWrapp #operation .content #keystaffArea {
		margin-left: -365px;
		position: absolute;
	}


	/* #linegraph */
	#linegraph .graphArea {
		transform: scale(0.75,0.75);
	}
	#linegraph .w900{
		width: 1000px;
		padding-right: 100px;
	}
	#linegraph #canvas{
		width: 700px;
	}



	/* #office */
	#contentWrapp #office #second {
		background-image: url(/img/office/bg_tokyo.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-attachment: scroll;
		background-size: cover;
		height: 800px;
		width: 100%;
		margin: 0 auto;
		padding: 0;
		/*border: 1px solid #f00;*/
	}
	#contentWrapp #office #third {
		background-image: url(/company/office/nagoya/lib/images/top/bg_top.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 100% auto;
		background-attachment: scroll;
		background-size: cover;
		height: 800px;
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}


}
