@charset "shift-jis";

.keyVisual{
  position: relative;
  /*margin: 0 0 16px;*/
  border-bottom: 1px solid #999;
}

.loading{
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 100;
  margin: -25px 0 0 -25px;
}

.bg{
  height: 480px;
  /*background: url("img/bg.jpg") left top no-repeat;*/
  /*display: none;*/
  background: #454B59;
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha(opacity=100)";
}

.bgBtm{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 250px;
  width: 100%;
  margin: 0 auto;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
  /*  background: #000;
  background: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1));
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,1)));
  background: -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1));
  background: linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,1));*/
  background: url("/img/logistics_solution/it/global-portal/v-process/bgBtm.png") center bottom no-repeat;
}

.txtStyle {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 480px;
  /*display: none;*/
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
}

.logo{
  position: absolute;
  left:0;
  top: 70px;
  background: #FFF;
  background: rgba(255,255,255,0.8);
  width: 100%;
  padding: 10px 0;
  text-align: center;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
}

.logo img{
  margin: 0 auto!important;
}

.copyStyle{
  position: absolute;
  top: 300px;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
}

.copy1{
  left: 130px;
}

.copy2{
  left: 340px;
}

.copy3{
  left: 550px;
}

.btn{
  position: absolute;
  left: 50%;
  top: 380px;
  margin: 0 0 0 -192px;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
}

.btnLogin{
  position: absolute;
  left: 50%;
  top: 460px;
  margin: 0 0 0 -65px;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";
}

.btnLogin a::after{
  content: none!important;
}

.cnt {
  margin: 0 0 30px;
}

.anchorWrap {
  background: #042F73;
}

ul.anchor {
  padding: 0;
  width: 678px;
  margin: 0 auto 24px;
}

ul.anchor li {
  margin: 0;
    /*opacity: 0;filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";*/
  list-style: none;
  width: calc(100% / 3);
}

ul.anchor li img {
  margin: 0;
}

ul.mapAnchor {
  margin: 0 0 32px!important;
  padding: 0;
  text-align: center;
}

ul.mapAnchor li {
  height: 74px;
  margin: 20px;
  /*opacity: 0;filter: alpha(opacity=0);
  -ms-filter: "alpha(opacity=0)";*/
  display: inline-block;
  list-style: none;
}

#CNT1{
  background-color: #042F73;
}

#CNT2{
  background-color: #36598F;
}

#CNT3{
  background-color: #79B8D3;
  padding: 0 0 16px;
}

#CNT3 > p {
  margin: 48px 0 16px;
  padding: 0;
}

#CNT3 .loading{
  display: none;
}

#CNT3 p.yusoAnchor {
  text-align: center;
  margin: 32px 0;
}

.start,
.stop {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -32px 0 0 -32px!important;
  padding: 0!important;
  z-index: 20;
}

.stop{
  display: none;
}

.slide {
  position: relative;
  cursor: pointer;
}

.slide .layer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  background:#000;
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
  width: 678px;
  height: 100%;
  z-index: 10;
}

.cnt3Txt {
  padding: 0 20px 20px;
}

.cnt3Txt p {
  color: #36598f;
  font-size: 16px;
  font-weight: bold;
  padding: 16px;
  background-color: #ffffff;
  font-family: "???C???I", Meiryo, "?q???M?m?p?S ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
}

#IMG{
  display: none;
}

@media screen and (max-width: 899px) {
	.copy1 {
		top: 235px;
		left: 0;
	}
	.copy2 {
		left: 0;
		right: 0;
	}
	.copy3 {
		left: auto;
		right: 0;
	}
	.btn {
		left: auto;
		width: 100%;
		margin: 0 auto;
	}
}

@media screen and (max-width: 599px) {
	.bg {
		height: 380px;
	}
	.bgTxt10 img {
		margin-top: 60px !important;
	}
	.btn {
		top: 260px !important;
	}
	.btnLogin {
		top: 340px !important;
	}
	.copy1 img, .copy2 img, .copy3 img {
		max-width: 120px;
	}
}