
.body{
  margin: auto;
  box-sizing: border-box;
}

.body img{
  vertical-align: bottom;
}

.center{
  width: 100%;
  max-width: 900px;
  margin: auto;
}

.pro_wap0{
width: 100%;
display: flex;
}

.pro_wap{
  width: 60%;
  margin-right: 10px;
}
.pro_wap li{
  width: 100%;
  height: calc(100% - 10px) ;
  margin-bottom: 10px;
}
.pro_wap li a{
padding: 33px 0px !important;
}
.pro_wap1{
    width: 100%;
  display: flex;
  flex-direction: column;
}
.pro_wap1 li{
    width: 100%;
    margin-right:0 !important;
}

.pro_wap2{
  display: flex;
  justify-content: space-between;
}
.pro_wap2 li{
    width: 49%;
    margin-right:0 !important;
}

.header{
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200515/00_back2.png);
  position: relative;
  height: 430px;
}
.header .tama{
  position: absolute;
  bottom: -70px;
  height: 118px;
  width: 100%;
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200501/tokubetsushien/00_header_tama.png);
  background-repeat: repeat-x;
}

.header_img{
  background-color: #29abe2;
  padding: 20px 20px 70px 20px;
  text-align: center;
}

.menu_Button{
  margin-top: 80px;
}


.box{
  width: 540px;
  margin: 0 auto;
  border-radius: 15px 15px 0 0;
}

.box h2{
  padding: 28px 0;
  font-size: 25px;
  color: white;
  text-shadow: none;
  line-height: 1.5;
}


/*書画カメラ----------------------*/

.camera{
  margin-top: 30px;
  text-align: center;
}

.camera_kazari{
  margin: auto;
  height: 5px;
  width: 100%;
  background-color:#29abe2;
}


.camera_sabtitle{
  background-color: #fff;
  color: #29abe2;
  font-size: 22px;
  font-weight: bold;
  padding: 20px;
  line-height: 1.3;
}


.camera .box{
  background-color: #29abe2;
}

.camera_main{
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200501/tokubetsushien/00_back6.gif);
  padding: 20px 0 30px 0;
}

.camera_btn{
  display: flex;
  justify-content: space-between;
}

.camera_btn a{
  text-decoration: none;
  display: inline-block;
  padding: 12px 0;
  box-shadow: 1px 1px 3px  rgba(9,9,9,.4);
  background-color: white;
  width: 100%;
  max-width: 275px;
  border-radius: 50px;
  color: #29abe2;
  font-weight: bold;
  border: 3px solid #fff;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  transition: 0.4s;
}

.camera_btn a:hover{
  background-color: #fcee21;
  border: 3px solid #29abe2;
}

.camera_btn .hit{
  background-color: #fcee21;
  border: 3px solid #29abe2;
}

.camera_title{
  display: flex;
  margin-top: 40px;

}
.camera_title a{
  display: inline-block;
  background-color: #29abe2;
  padding: 15px 20px;
  margin-right: 10px;
  text-decoration: none;
  font-size: 20px;
  font-weight: bold;
  color: white;
  border-radius: 10px 10px 0 0;
  box-shadow: 1px 0px 3px  rgba(9,9,9,.4);

}

.camera_pic{
  background-color: white;
  box-shadow: 1px 1px 3px  rgba(9,9,9,.4);
  border-radius: 0 10px 10px 10px;
}

.camera_pic p{
  padding: 20px;
  text-align: left;
  font-size: 22px;
  color: #29abe2;
  font-weight: bold;
}

.camera_pic_img1{
  position: relative;
}

.camera_pic_btn1{
  position: absolute;
  top: 220px;
  left:130px;
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200515/01_btn1-2.png);
  background-repeat: no-repeat;
}
.camera_pic_btn1 a{
  display: inline-block;
}
.camera_pic_btn1 a:hover{
  background-color: transparent; /*IE6対応*/
}
.camera_pic_btn1 a:hover img{
  visibility: hidden;
}

.camera_pic_btn2{
  position: absolute;
  top: 0px;
  left:120px;
  text-align: left;
  width: 490px;
}

.camera_pic_btn2 ul li{
  text-indent:-1em;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.5;
}


.camera_pic2{
  background-color: #fff79f;
  padding: 10px 0 30px 0;
  border-radius: 0 0 10px 10px;
}

.camera_pic2 h3{
  color: #29abe2;
  font-size: 22px;
  margin: 40px 0 20px 0;
  text-shadow: none;
}

.camera_pic2 h3 i{
  padding: 0 10px;
  color: #a8cc06;
}

.camera_pic_img2{
  display: flex;
  justify-content: space-around;
}

.camera_pic_img2 div{
  background-color: white;
  width: 30%;
  border-radius: 10px;

}
.camera_pic_img2 div img{
  width: 100%;
  border-radius: 10px 10px 0 0;
}

.camera_pic_img2 div p{
  font-size: 15px;
  line-height: 1.5;
}

.camera_pic_img2 ul li {
  font-size: 15px;
  text-align: left;
  color: #29abe2;
  font-weight: bold;
  line-height: 1.5;
  text-indent:-1em;
  padding: 20px 15px 20px 0;
  padding-left:1em;
}

.camera_pic_img2 ul{
  padding: 45px 0;
}
.camera_pic_img3{
  background-color: white;
  padding: 10px;
  margin: 0 auto;
  width: 95%;
  border-radius: 10px;
}

.camera_pic_img3 h4{
  background-color: #a8cc06;
  border-radius: 10px;
  color: white;
  padding: 5px;
}

.camera_pic_img3-2 div{
  width: 40%;
  padding: 10px;
  border-radius: 5px;
}

.camera_pic_img3-2{
  display: flex;
  justify-content: space-around;
}

.kuhaku_top{
  padding: 30px 0 40px 0;
}

.camera_main{
  position: relative;
  z-index: 0;
}

.camera_illust{
  position: absolute;
  bottom: 60px;
  right: 30px;
}

.camera_illust2{
  position: absolute;
  top: 120px;
  left: 30px;
  z-index: -2;
}

.camera .procdbtn{
  background:  #29abe2;
}

/*アンプラグド------------------------------------*/

.ann{
  margin-top: 30px;
  text-align: center;
}

.ann .box{
  background-color: #41c479;
}

.ann_main{
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200501/tokubetsushien/00_back3.gif);
  padding: 20px 0 30px 0;
}

.ann_kazari{
  margin: auto;
  height: 5px;
  width: 100%;
  background-color: #41c479;
}

.ann_title{
  display: flex;
  margin-top: 40px;
}


.ann_sabtitle{
  background-color: #fff;
  color: #41c479;
  font-size: 22px;
  font-weight: bold;
  padding: 20px 30px;;
  line-height: 1.3;
}



.ann_title a{
  display: inline-block;
  background-color: #41c479;
  padding: 15px 20px;
  margin-right: 10px;
  text-decoration: none;
  font-size: 20px;
  font-weight: bold;
  color: white;
  border-radius: 10px 10px 0 0;
  box-shadow: 1px 0px 3px  rgba(9,9,9,.4);
}

.ann_pic{
  background-color: white;
  padding: 15px 0 0 0;
  border-radius: 0 10px 10px 10px;
  box-shadow: 1px 1px 3px  rgba(9,9,9,.4);
}

.ann_pic img{
  width: 100%;
}

.ann_pic .flex{
  display: flex;
  justify-content: space-around;
  margin: 0 20px;
}


.ann_pic p{
  padding: 20px;
  text-align: left;
  font-size: 22px;
  color:#41c479;
  font-weight: bold;
}

.ann_pic .ann_pic_img2 p{
  color: black;
  font-weight: bold;
  line-height: 1.5;
  font-size: 18px;
  font-weight: normal;
}
.ann_pic_img1{
  padding-right: 20px;
  position: relative;
}

.ann_pic_btn1{
  position: absolute;
  top: 480px;
  left:50px;
  background-image:url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200515/02_btn1-2.png);
  background-repeat: no-repeat;
}
.ann_pic_btn1 a{
  display: inline-block;
}
.ann_pic_btn1 a:hover{
  background-color: transparent; /*IE6対応*/
}
.ann_pic_btn1 a:hover img{
  visibility: hidden;
}

.ann_pic_setu{
  position: absolute;
  top: 200px;
  left: 0px;
  width: 450px;
}
.ann_pic_setu p{
    font-weight: bold;
    font-size: 16px;
    line-height: 1.25;
    color:black;
}

.ann_pic2{
  background-color: #fff79f;
  padding: 10px 0 30px 0;
  border-radius: 0 0 10px 10px;
}

.ann_pic2 h3{
  color: #41c479;
  font-size: 22px;
  margin: 40px 0 20px 0;
  text-shadow: none;
}

.ann_pic2 h3 i{
  padding: 0 10px;
  color: #a8cc06;
}

.ann_pic2 img{
  width: 80%;
  border-radius: 10px;
  margin: 0 auto;
}




.ann_main{
  position: relative;
  z-index: 0;
}

.ann_illust{
  position: absolute;
  bottom: 60px;
  right: 30px;
}

.ann_illust2{
  position: absolute;
  top: 120px;
  left: 30px;
  z-index: -2;
}

.ann .procdbtn{
  background: #41c479;
}

/*プログラミング教材------------------------------------*/

  .pro{
  margin-top: 30px;
  text-align: center;
}

.pro .box{
  background-color: #8cc63f;
}

.pro_main{
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200515/00_back4.gif);
  padding: 10px 0 40px 0;
}

.pro_kazari{
  margin: auto;
  height: 5px;
  width: 100%;
  background-color: #8cc63f;
}

.pro_title{
  display: flex;
  margin-top: 40px;
}
.pro_title a{
  display: inline-block;
  background-color: #8cc63f;
  padding: 15px 20px;
  margin-right: 10px;
  text-decoration: none;
  font-size: 20px;
  font-weight: bold;
  color: white;
  border-radius: 10px 10px 0 0;
  box-shadow: 1px 0px 3px  rgba(9,9,9,.4);
}

.pro_pic{
  background-color: white;
  padding: 15px 0 0 0;
  border-radius: 0 10px 10px 10px;
  box-shadow: 1px 1px 3px  rgba(9,9,9,.4);
}

.pro_pic img{
  width: 100%;
}

.pro_pic .flex{
  display: flex;
  justify-content: space-around;
  margin: 0 20px;
}


.pro_pic p{
  padding: 10px 20px 20px 20px;
  text-align: left;
  font-size: 22px;
  color:#8cc63f;
  font-weight: bold;
  line-height: 1.25;
}

.pro_pic p .span1{
  font-size: 15px;
  color: black;
  font-weight: bold;
}


.pro_pic_img1{
  position: relative;
}

.pro_pic_btn1{
  position: absolute;
  top: 650px;
  left: 50%;
  transform: translate(-50%);
  -webkit-transform: translate(-50%);
  -ms-transform: translate(-50%);

  background-image:url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200515/03_btn1-2.png);
  background-repeat: no-repeat;
}
.pro_pic_btn1 a{
  display: inline-block;
}
.pro_pic_btn1 a:hover{
  background-color: transparent; /*IE6対応*/
}
.pro_pic_btn1 a:hover img{
  visibility: hidden;
}




.pro_pic_img2{
  display: flex;
  justify-content: space-around;
  padding: 0 10px;
}

.pro_pic_img2 div{
  background-color: white;
  width: 30%;
  border-radius: 10px;
  padding: 10px;
}
.pro_pic_img2 div img{
  width: 80%;
  border-radius: 10px 10px 0 0;
}

.pro_pic_img2 div p{
  font-size: 17px;
  line-height: 1.5;
  padding: 5px 0;
}

.pro_pic2{
  background-color: #fff79f;
  padding: 10px 0 30px 0;
  border-radius: 0 0 10px 10px;
}

.pro_pic2 h3{
  color: #8cc63f;
  font-size: 22px;
  margin: 40px 0 20px 0;
  text-shadow: none;
}

.pro_pic2 h3 i{
  padding: 0 10px;
  color: #a8cc06;
}

.pro_sannkaku img{
  width: auto;
}

.pro_pic_img3{
  padding: 0 10px;
}

.pro_pic_img3 .img3{
  background-color: white;
  padding: 20px 0;
  border-radius: 10px;
}

.pro_pic_img3 .img3 div{
  display: flex;
  justify-content: space-around;
}

.pro_pic_img3 .img3 div img{
  width: 90%;
  padding: 0 10px;
}

.pro_pic_img3 .img3 .setsu p{
  color: black;
  font-size: 20px;
  line-height: 1.5;
  padding: 20px 30px;
}

.setsu p span{
  font-size: 16px;
}


.pro_main{
  position: relative;
  z-index: 0;
}

.pro_illust{
  position: absolute;
  bottom: 60px;
  right: 30px;
}

.pro_illust2{
  position: absolute;
  top: 60px;
  left: 30px;
  z-index: -2;
}

.pro .procdbtn{
  background: #8cc63f;
}


/*ロボット型-------------------------*/

.robo{
  margin-top: 30px;
  text-align: center;
}

.robo_kazari{
  margin: auto;
  height: 5px;
  width: 100%;
  background-color:  #26b7bc;
}
.robo .box{
  background-color: #26b7bc;
}

.robo_main{
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200501/tokubetsushien/00_back6.gif);
  padding: 10px 0 40px 0;
}

.robo_title{
  display: flex;
  margin-top: 40px;
}
.robo_title a{
  display: inline-block;
  background-color: #26b7bc;
  padding: 15px 20px;
  margin-right: 10px;
  text-decoration: none;
  font-size: 20px;
  font-weight: bold;
  color: white;
  border-radius: 10px 10px 0 0;
  box-shadow: 1px 0px 3px  rgba(9,9,9,.4);
}

.robo_pic{
  background-color: white;
  padding: 0 0 30px 0;
  border-radius: 0 10px 10px 10px;
  box-shadow: 1px 1px 3px  rgba(9,9,9,.4);
}

.robo_pic .p p{
  padding: 20px;
  text-align: left;
  font-size: 22px;
  color: #26b7bc;
  font-weight: bold;
}

.robo_setsu{
  text-align: left;
  background-color: #fff79f;
  border-radius: 0 10px 0 0;
  height: 350px;
  position: relative;
}

.setsu1{
  position: absolute;
  top: 20px;
  left: 25px;
}
.setsu2{
  position: absolute;
  top: 30px;
  left: 210px;
}

.setsu2 h3{
  font-size: 36px;
  font-weight: bold;
  color: #26b7bc;
  text-shadow: none;
}

.setsu3{
  position: absolute;
  top: 20px;
  right: 20px;
}
.setsu4{
  position: absolute;
  top: 90px;
  left: 200px;
  width: 68%;
  background-color: white;
  padding: 10px 30px;
  border-radius: 10px;
}

.setsu4 h4{
  font-size: 19px;
  padding: 10px 0 0 0;
  color: #26b7bc;
  line-height: 1.3;
}

.setsu4 p{
  padding: 10px 0;
  font-size: 18px;
  line-height: 1.3;
}

.robo_pic_img2 img{
width: 97%;
margin: 0px auto;
padding: 15px 0;
}


.robo_pic_img1{
  position: relative;
}
.robo_pic_btn1{
  position: absolute;
  top: 400px;
  left: 465px;
  background-image: url(https://d3t0ae4e2cnggp.cloudfront.net/resource/20200515/04_btn1-2.png);
  background-repeat: no-repeat;
}
.robo_pic_btn1 a{
  display: inline-block;
}
.robo_pic_btn1 a:hover{
  background-color: transparent; /*IE6対応*/
}
.robo_pic_btn1 a:hover img{
  visibility: hidden;
}


.robo_pic_setu{
  position: absolute;
  top: 25px;
  left: 200px;
}
.robo_pic_setu p{
    font-weight: bold;
    font-size: 18px;
    line-height: 1.25;
}
.robo_pic_setu2{
  position: absolute;
top: 400px;
  right: 20px;
  width: 200px;
  text-align: left;
}
.robo_pic_setu2 p{
    text-indent: -1em;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.5;
}


.robo_main{
  position: relative;
  z-index: 0;
}

.robo_illust{
  position: absolute;
  bottom: 60px;
  right: 30px;
}

.robo_illust2{
  position: absolute;
  top: 60px;
  left: 30px;
  z-index: -2;
}

.robo .procdbtn{
  background: #26b7bc;
}

/*フッター--------------------------*/
.footer_haikei{
  background-color: #29abe2;
  position: relative;
  height: 400px;
  padding: 50px;
}

.footer_haikei .center{
  filter: drop-shadow(3px 3px 5px rgba(0,0,0,0.6));
}

.footer_haikei .center :hover{
  opacity: 0.95;
}





/*リセット---------------*/
#contentInner{
  width: 100%;
  padding: 0px;
}
