@charset "utf-8";
/* CSS Document */

.ito_toparea{
  width:100%;
  padding: 0 0 10px;
  text-align:center;
  background:url("../img/02_ph_topbg.png") center top no-repeat;
  background-size:cover;
}
h1{
  margin-bottom: 30px;
  padding: 20px 0 10px;
  font-size: 1.5rem;
  font-weight: bold;
  color: #FFFFFF;
  background: url(../img/02_il_h1bg.png);
}
h1 p{
  font-family: Century Gothic, sans-serif;
  font-size: 0.75rem;
  color: #A9B8CB;
}
.ito_pagelink{margin-bottom: 40px;}
.ito_pagelink a{
  display: inline-block;
  width: 200px;
  padding: 7px 0;
  text-align: center;
  font-size: 0.875rem;
  color: #000000;
  border: 2px solid #000000;
  background-color: #FFFFFF;
}
.ito_pagelink a:first-of-type{border-right: none;}
.ito_pagelink a:hover{background-color: #CCCCCC;}

h2{
  display: inline-block;
  margin-bottom: 40px;
  line-height: 1.3;
  text-align: center;
  font-size: 1.375rem;
  font-weight: bold;
  text-shadow: 3px 0 0 white, 3px 1px 0 white, 3px 2px 0 white, 3px 3px 0 white, 2px 3px 0 white, 1px 3px 0 white, 0 3px 0 white, -1px 3px 0 white, -2px 3px 0 white, -3px 3px 0 white, -3px 2px 0 white, -3px 1px 0 white, -3px 0 0 white, -3px -1px 0 white, -3px -2px 0 white, -3px -3px 0 white, -2px -3px 0 white, -1px -3px 0 white, 0 -3px 0 white, 1px -3px 0 white, 2px -3px 0 white, 3px -3px 0 white, 3px -2px 0 white, 3px -1px 0 white;
}
h2 p{
  font-family: Century Gothic, sans-serif;
  font-size: 0.75rem;
  color: #3170BE;
  border-top: 1px solid #3170BE;
}
.ito_toptxt{
  margin-bottom: 10px;
  font-size: 1.125rem;
  text-shadow: 3px 0 0 white, 3px 1px 0 white, 3px 2px 0 white, 3px 3px 0 white, 2px 3px 0 white, 1px 3px 0 white, 0 3px 0 white, -1px 3px 0 white, -2px 3px 0 white, -3px 3px 0 white, -3px 2px 0 white, -3px 1px 0 white, -3px 0 0 white, -3px -1px 0 white, -3px -2px 0 white, -3px -3px 0 white, -2px -3px 0 white, -1px -3px 0 white, 0 -3px 0 white, 1px -3px 0 white, 2px -3px 0 white, 3px -3px 0 white, 3px -2px 0 white, 3px -1px 0 white;
}
.ito_productlist{
}
.ito_productlist li{
  display:inline-block;
  width: 320px;
  height: 140px;
  margin-right: 20px;
  margin-bottom: 20px;
  line-height: 1;
  vertical-align:top;
  font-size: 1.625rem;
  background-color: #FFFFFF;
}
.ito_productlist li:nth-of-type(n+4){
  width: 240px;
  margin-right: 13px;
}
.ito_productlist li:nth-of-type(3),
.ito_productlist li:nth-of-type(7){margin-right: 0;}
.ito_productlist li div{
  display: inline-block;
  margin-right: 20px;
  text-align: left;
  vertical-align: middle;
}
.ito_productlist li div p{
  padding-top: 10px;
  font-size: 0.875rem;
  font-weight: bold;
}
.ito_productlist li:nth-of-type(1){padding-top: 40px;}
.ito_productlist li:nth-of-type(2) div{padding-top: 10px;}
.ito_productlist li:nth-of-type(3){padding-top: 25px;}
.ito_productlist li:nth-of-type(4){padding-top: 20px;}
.ito_productlist li:nth-of-type(5){padding-top: 25px;}
.ito_productlist li:nth-of-type(5) div{margin-right: -10px;}
.ito_productlist li:nth-of-type(6){padding-top: 30px;}
.ito_productlist li:nth-of-type(7){padding-top: 35px;}

.ito_suport{
  margin-bottom: 40px;
  padding-top: 80px;
  text-align: center;
}
.ito_suport h3{font-size: 1.5rem;}


.ito_development{
  position: relative;
  margin-bottom: 120px;
  padding-top: 70px;
  text-align: center;
  background-color: #EEEEEE;
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
}
.ito_development h2{
  margin-bottom: 25px;
  text-shadow: none;
}
.ito_development h2 span{
  display: block;
  margin-bottom: 10px;
}
.ito_development h2 p{
  display: inline-block;
  padding-top: 5px;
}
.ito_development h3{
  margin-bottom: 280px;
  text-align: center;
  font-size: 1.125rem;
  font-weight: bold;
  text-shadow: 3px 0 0 white, 3px 1px 0 white, 3px 2px 0 white, 3px 3px 0 white, 2px 3px 0 white, 1px 3px 0 white, 0 3px 0 white, -1px 3px 0 white, -2px 3px 0 white, -3px 3px 0 white, -3px 2px 0 white, -3px 1px 0 white, -3px 0 0 white, -3px -1px 0 white, -3px -2px 0 white, -3px -3px 0 white, -2px -3px 0 white, -1px -3px 0 white, 0 -3px 0 white, 1px -3px 0 white, 2px -3px 0 white, 3px -3px 0 white, 3px -2px 0 white, 3px -1px 0 white;
}
.ito_circle{
  position: absolute;
  width:158px;
  height:158px;
  left: 50%;
  padding-top: 50px;
  text-align:center;
  background-image:url("./../img/02_il_circle.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-color: #FFFFFF;
  border-radius: 100%;
}
.ito_circle span{
  display:inline-block;
  text-align:center;
  font-size: 0.938rem;
  color: #00698C;
}
.ito_circle:first-of-type{
  top: 120px;
  margin-left: -500px;
  padding-top: 40px;
}
.ito_circle:nth-of-type(2){
  top: 240px;
  margin-left: -220px;
}
.ito_circle:nth-of-type(3){
  top: 240px;
  margin-left: 60px;
}
.ito_circle:last-of-type{
  top: 120px;
  margin-left: 330px;
}

.ito_workflow{}

h4{
  height:55px;
  margin-bottom:30px;
  text-align:center;
  background-image:url("./../img/02_il_line.png");
  background-repeat: repeat-x;
  background-position: center center;
}
h4 p{
  display:inline-block;
  vertical-align: bottom;
  background-color:white;
}
h4 p span{
  display:block;
  padding: 0 10px;
  line-height: 1;
  font-size:1.375rem;
  font-family:"Century Gothic";
  color: #BDB3B2;
}

h4 p b{
  display:block;
  padding: 0 10px;
  line-height: 1;
  font-size:1.25rem;
  color: #BDB3B2;
  background-color:white;
}
.ito_workflow ul{
  margin-bottom: 40px;
  text-align:center;
}
.ito_workflow ul li{
  display:inline-block;
  width:127px;
  height:126px;
  margin-right: 18px;
  line-height: 1.3;
  vertical-align:middle;
  font-size: 1.5rem;
  font-weight: bold;
  color: #3170BE;
  border: 6px solid #BDB4B3;
}
.ito_workflow ul li:last-of-type{margin-right: 0;}
.ito_workflow ul li p{
  margin-top:-40px;
  font-size: 3.125rem;
  text-shadow: 4px 4px 0 rgba(255,255,255,1), -4px 4px 0 rgba(255,255,255,1), 4px -4px 0 rgba(255,255,255,1), -4px -4px  0 rgba(255,255,255,1), 0 4px 0 rgba(255,255,255,1), 4px 0 0 rgba(255,255,255,1), 0 -4px 0 rgba(255,255,255,1), -4px 0 0 rgba(255,255,255,1);
}
.line1{margin-bottom: 15px;}
.ito_flowtxt{
  margin-bottom: 40px;
  padding:0 40px;
}
.ito_contactbox{
  width: 740px;
  height: 190px;
  margin: 0 auto 80px;
  text-align: center;
  border: 6px solid #BDB4B3;
}
.ito_contactttl{
  width: 280px;
  margin: 0 auto 20px;
  padding: 10px 0;
  font-size: 1.25rem;
  color: #BDB4B3;
  border-bottom: 4px solid #BDB4B3;
}
.ito_contactbox div{
  display: inline-block;
  vertical-align: middle;
}
.ito_contactbox div:first-of-type p{
  line-height: 1.2;
  font-size: 2.125rem;
  font-weight: bold;
  color: #3170BE;
  margin-right: 30px;
}
.ito_contactbox div:last-of-type{
  width: 276px;
  height: 80px;
}
.ito_contactbox div:last-of-type a{
  display: block;
  height: 100%;
  line-height: 70px;
  font-size: 1.375em;
  font-weight: bold;
  color: #3170BE;
  border: 4px solid #BDB4B3;
}
.ito_contactbox div:last-of-type a:hover{
  background-color: #BDB4B3;
  color: #FFFFFF;
}
