@charset "utf-8";

/*ロゴイメージを設定*/
/*div#divFirstImage, div#delayimage {
    width:714px;
    height:139.5px;
    margin:auto; 
    text-align:center; 
    position:absolute;
    background:url(./images/logo_S.png); 
    background-size: 714px 139.5px;
    z-index:1;
    background-repeat:no-repeat;
}*/
/*ロゴにグラデーションをかけるアニメーション(フェードアウト)*/
/*div#gradation{
    animation: fadeOut 0.4s ease 1.5s forwards;
    -webkit-animation: fadeOut 0.4s ease 1.5s forwards;
    -moz-animation: fadeOut 0.4s ease 1.5s forwards;
    z-index: 2;
    position: absolute;
    width:714px;
    height:139.5px;
}*/
/*フェードアウト後のロゴを非表示にするアニメーション*/
/*div#divFadeout{
    animation: fadeOut2 0.4s ease 1.5s forwards;
    -webkit-animation: fadeOut2 0.4s ease 1.5s forwards;
    -moz-animation: fadeOut2 0.4s ease 1.5s forwards;
}*/
/*フェードアウト*/
/*@keyframes fadeOut {
    0%{background:linear-gradient(150deg, rgba(255,255,255,0) 100%,rgba(255,255,255,1) 100%);}
    5%{background:linear-gradient(150deg, rgba(255,255,255,0.05) 95%,rgba(255,255,255,1) 100%);}
    10%{background:linear-gradient(150deg, rgba(255,255,255,0.1) 90%,rgba(255,255,255,1) 100%);}
    15%{background:linear-gradient(150deg, rgba(255,255,255,0.15) 85%,rgba(255,255,255,1) 100%);}
    20%{background:linear-gradient(150deg, rgba(255,255,255,0.20) 80%,rgba(255,255,255,1) 100%);}
    25%{background:linear-gradient(150deg, rgba(255,255,255,0.25) 75%,rgba(255,255,255,1) 100%);}
    30%{background:linear-gradient(150deg, rgba(255,255,255,0.30) 70%,rgba(255,255,255,1) 100%);}
    35%{background:linear-gradient(150deg, rgba(255,255,255,0.35) 65%,rgba(255,255,255,1) 100%);}
    40%{background:linear-gradient(150deg, rgba(255,255,255,0.40) 60%,rgba(255,255,255,1) 100%);}
    45%{background:linear-gradient(150deg, rgba(255,255,255,0.45) 55%,rgba(255,255,255,1) 100%);}
    50%{background:linear-gradient(150deg, rgba(255,255,255,0.50) 50%,rgba(255,255,255,1) 100%);}
    55%{background:linear-gradient(150deg, rgba(255,255,255,0.55) 45%,rgba(255,255,255,1) 100%);}
    60%{background:linear-gradient(150deg, rgba(255,255,255,0.60) 40%,rgba(255,255,255,1) 100%);}
    65%{background:linear-gradient(150deg, rgba(255,255,255,0.65) 35%,rgba(255,255,255,1) 100%);}
    70%{background:linear-gradient(150deg, rgba(255,255,255,0.70) 30%,rgba(255,255,255,1) 100%);}
    75%{background:linear-gradient(150deg, rgba(255,255,255,0.75) 25%,rgba(255,255,255,1) 100%);}
    80%{background:linear-gradient(150deg, rgba(255,255,255,0.80) 20%,rgba(255,255,255,1) 100%);}
    85%{background:linear-gradient(150deg, rgba(255,255,255,0.85) 15%,rgba(255,255,255,1) 100%);}
    90%{background:linear-gradient(150deg, rgba(255,255,255,0.90) 10%,rgba(255,255,255,1) 100%);}
    95%{background:linear-gradient(150deg, rgba(255,255,255,0.95) 5%,rgba(255,255,255,1) 100%);}
    100%{background:linear-gradient(150deg, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);}
}
@-moz-keyframes fadeOut {
    0%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0) 100%,rgba(255,255,255,1) 100%);}
    5%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.05) 95%,rgba(255,255,255,1) 100%);}
    10%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.1) 90%,rgba(255,255,255,1) 100%);}
    15%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.15) 85%,rgba(255,255,255,1) 100%);}
    20%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.20) 80%,rgba(255,255,255,1) 100%);}
    25%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.25) 75%,rgba(255,255,255,1) 100%);}
    30%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.30) 70%,rgba(255,255,255,1) 100%);}
    35%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.35) 65%,rgba(255,255,255,1) 100%);}
    40%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.40) 60%,rgba(255,255,255,1) 100%);}
    45%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.45) 55%,rgba(255,255,255,1) 100%);}
    50%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.50) 50%,rgba(255,255,255,1) 100%);}
    55%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.55) 45%,rgba(255,255,255,1) 100%);}
    60%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.60) 40%,rgba(255,255,255,1) 100%);}
    65%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.65) 35%,rgba(255,255,255,1) 100%);}
    70%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.70) 30%,rgba(255,255,255,1) 100%);}
    75%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.75) 25%,rgba(255,255,255,1) 100%);}
    80%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.80) 20%,rgba(255,255,255,1) 100%);}
    85%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.85) 15%,rgba(255,255,255,1) 100%);}
    90%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.90) 10%,rgba(255,255,255,1) 100%);}
    95%{background:-moz-linear-gradient(150deg, rgba(255,255,255,0.95) 5%,rgba(255,255,255,1) 100%);}
    100%{background:-moz-linear-gradient(150deg, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);}
}
@-webkit-keyframes fadeOut {
    0%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0) 100%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0) 100%,rgba(255,255,255,1) 100%);}
    5%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.05) 95%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.05) 95%,rgba(255,255,255,1) 100%);}
    10%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.1) 90%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.1) 90%,rgba(255,255,255,1) 100%);}
    15%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.15) 85%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.15) 85%,rgba(255,255,255,1) 100%);}
    20%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.20) 80%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.20) 80%,rgba(255,255,255,1) 100%);}
    25%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.25) 75%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.25) 75%,rgba(255,255,255,1) 100%);}
    30%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.30) 70%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.30) 70%,rgba(255,255,255,1) 100%);}
    35%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.35) 65%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.35) 65%,rgba(255,255,255,1) 100%);}
    40%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.40) 60%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.40) 60%,rgba(255,255,255,1) 100%);}
    45%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.45) 55%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.45) 55%,rgba(255,255,255,1) 100%);}
    50%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.50) 50%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.50) 50%,rgba(255,255,255,1) 100%);}
    55%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.55) 45%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.55) 45%,rgba(255,255,255,1) 100%);}
    60%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.60) 40%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.60) 40%,rgba(255,255,255,1) 100%);}
    65%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.65) 35%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.65) 35%,rgba(255,255,255,1) 100%);}
    70%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.70) 30%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.70) 30%,rgba(255,255,255,1) 100%);}
    75%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.75) 25%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.75) 25%,rgba(255,255,255,1) 100%);}
    80%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.80) 20%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.80) 20%,rgba(255,255,255,1) 100%);}
    85%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.85) 15%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.85) 15%,rgba(255,255,255,1) 100%);}
    90%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.90) 10%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.90) 10%,rgba(255,255,255,1) 100%);}
    95%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,0.95) 5%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,0.95) 5%,rgba(255,255,255,1) 100%);}
    100%{background:-webkit-linear-gradient(150deg, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);background:-webkit-gradient(150deg, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 100%);}
}*/
/*フェードアウト後のロゴ非表示アニメーション*/
/*@keyframes fadeOut2 {
    0%{visibility:visible;}
    100%{visibility:hidden;}
}
@-moz-keyframes fadeOut {
    0%{visibility:visible;}
    100%{visibility:hidden;}
}
@-webkit-keyframes fadeOut {
    0%{visibility:visible;}
    100%{visibility:hidden;}
}*/

/*遅延画面ロード*/
/*div#divBody {
    animation: fadeIn 4s ease 0s 1 normal;
    -webkit-animation: fadeIn 4s ease 0s 1 normal;
    -moz-animation: fadeIn 4s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    50% {opacity: 0}
    100% {opacity: 1}
}
@-moz-keyframes fadeIn {
    0% {opacity: 0}
    50% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    50% {opacity: 0}
    100% {opacity: 1}
}*/

/*遅延画面ロード(ヘッダータグ)*/
/*header#header {
    animation: fadeIn 4s ease 0s 1 normal;
    -webkit-animation: fadeIn 4s ease 0s 1 normal;
    -moz-animation: fadeIn 4s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    50% {opacity: 0}
    100% {opacity: 1}
}
@-moz-keyframes fadeIn {
    0% {opacity: 0}
    50% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    50% {opacity: 0}
    100% {opacity: 1}
}*/

/**** content ****/

.container{
    overflow: hidden;
    margin-top:3%;
    margin-left:15%;
    text-align: center;
    vertical-align: middle;
}

.rotate {
  /*position: fixed;*/
  float: left;
  vertical-align:bottom;
  overflow: hidden;
  width: 300px;
  height: 380px;
  /*position: relative;*/
}

.rotate a.link {
  position: relative;
  display: block;
  margin: 0;
  width: 100%;
  height: auto;
}

.rotate a.link span.active {
  /*display: table;*/
  position: absolute;
  width: 100%;
  height: 100%;
  transform-origin: 50% 50% 50% ;
  -webkit-transform-origin: 50% 50% 50% ;
  -moz-transform-origin: 50% 50% 50% ;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link span.hover1,
.rotate a.link span.hover2,
.rotate a.link span.hover3,
.rotate a.link span.hover4,
.rotate a.link span.hover5,
.rotate a.link span.hover6,
.rotate a.link span.hover7,
.rotate a.link span.hover8,
.rotate a.link span.hover9
 {
  display: table;
  position: absolute;
  width: 100%;
  height: 100%;
  transform-origin: 50% 50% 50% ;
  -webkit-transform-origin: 50% 50% 50% ;
  -moz-transform-origin: 50% 50% 50% ;
  width:300px; 
  height:300px; 
  display:table-cell; 
  line-height:300px; 
  font-weight:bold; 
  font-size:18px;
}

.rotate a.link span.active {
  transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);
  left: 0;
  transition: all 300ms 0s ease;
}

.rotate a.link:hover span.active {
  transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,0.0003,0,-1,0.02,0,0,120,0,1);
  -webkit-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,0.0003,0,-1,0.02,0,0,120,0,1);
  -moz-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,0.0003,0,-1,0.02,0,0,120,0,1);
  transition: all 300ms 0s ease;
}

.rotate a.link span.active .vertical {
  color: #e74c3c;
}

.rotate a.link span.hover1,
.rotate a.link span.hover4,
.rotate a.link span.hover7 {
   transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  -webkit-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  -moz-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  transition: all 300ms 0s ease;
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/cloud_Trim.png");
  background-size: cover;
}

.rotate a.link span.hover2,
.rotate a.link span.hover5,
.rotate a.link span.hover8 {
  transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  -webkit-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  -moz-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  transition: all 300ms 0s ease;
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/security_Trim.png");
  background-size: cover;
}

.rotate a.link span.hover3,
.rotate a.link span.hover6,
.rotate a.link span.hover9 {
  transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  -webkit-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  -moz-transform: matrix3d(1.01,0,0.00,0,0.00,0.036000000000000004,1.00,-0.0003,0,-1,0.02,0,0,-120,0,1);
  transition: all 300ms 0s ease;
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/sample_deeplearning_Trim.jpg");
  background-size: cover;
}

.rotate a.link:hover span.hover1 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/cloud_Trim.png");
  background-size: auto;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover2 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/security_Trim.png");
  background-size: auto;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover3 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/sample_deeplearning_Trim.jpg");
  background-size: cover;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover4 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/cloud_Trim.png");
  background-size: auto;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover5 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/security_Trim.png");
  background-size: auto;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover6 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/sample_deeplearning_Trim.jpg");
  background-size: cover;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover7 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/cloud_Trim.png");
  background-size: auto;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover8 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/security_Trim.png");
  background-size: auto;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}

.rotate a.link:hover span.hover9 {
  transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -webkit-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  -moz-transform: matrix3d(1,0,0,0,0,1,0,0,0.00100,0,1,0,0,0,0,1);
  width: 300px;
  height: 300px;
  background-position: 0px 0px;
  background: url("../images/sample_deeplearning_Trim.jpg");
  background-size: cover;
  position: relative;
  transition: all 300ms 0s ease;
  cursor:pointer;
  top: 31.4px;
  bottom: 31.4px;
}
 .rotate span.hoveropacity{
    background-color: rgba(0,0,0,0.5);
    position: absolute;
    right: 0px;
    left: 0px;
    content: " ";
    cursor:pointer;
    height: 300px;
    width: 300px;
 }

.rotate label.lblTitle{
    color:white;
    position: absolute;
    cursor: pointer;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

.frame{
    transition: all 1000ms 0s ease;
    display: inline-block;
    position: relative;
}
.frame:after{
    position: absolute;
    display: block;
    content: "";
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset -350px 0 100px #fff;
}

.trConcept{
    height:300px;
}
.tdConcept{
    width:44%;
}
.pHeader{
    font-size:2.0vw;
    margin:0;
    line-height:225%;
}
.pBody{
    font-size:1.15vw;
    margin:0;
    line-height:225%;
}