@charset "utf-8";

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

アヤハグループ採用情報
「事業」のこと

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

#business{
}

/*===== 事業スライド =====*/

.slide{
  padding-left: 0;
}

li.slick-slide{
  position: relative;
}
.slide img{
  vertical-align: bottom;
}
li.slick-slide p{
  margin: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  color: #FFF;
  font-weight: bold;
  background-color: rgba(31,44,92,0.85);
  filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#1F2C5C80,EndColorStr=#1F2C5C80);/*IE8以下用*/
}
.slick-prev {
  left: 0;
  top:50%;
  z-index: 100;
  width: 36px;
  height: 40px;
}
.slick-next {
  right: 0;
  top:50%;
  z-index: 99;
  width: 36px;
  height: 40px;
}
.slick-prev:before{
  content: url(../../js/slick/left.png);
}
.slick-next:before{
  content: url(../../js/slick/right.png);
}

/*===== グループツリー =====*/

#grp_tree{
  overflow: hidden;
  width: 900px;
  margin:0 auto;
}
#grp_tree ul{
  list-style: none;
  padding: 0;
  margin: 0 0 26px 0;
  width: 330px;
  background-color: #FFF;
}

#grp_tree li a{
  display: block;
  background: url(../images/blank.png) no-repeat right center;
  text-decoration: none;
  color: #333;
}

#grp_tree li a:hover{
  opacity: .4;
}

#grp_tree li{
  box-sizing: border-box;
  padding: 6px 10px;
  line-height: 1.7;
  margin: 0;
  margin-bottom: 1px;
  border:0;
}

#grp_tree h3{
  display: block;
  border-bottom: none;
  margin: 30px 0;
  padding: 0
}

#grp_tree .tree{
  position: relative;
  height: 1287px;
  background: url(../images/backline.png?v=2308) no-repeat top left;
}

#grp_tree .tree h3,
#grp_tree .tree h4{
  position: absolute;
  margin: 0;
  color: #333;
  width: 150px;
  line-height: 40px;
  font-weight: normal;
  font-size: 18px;
  text-align: center;
}

#grp_tree .tree h5{
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.7;
}

/* 座標位置 */
#grp_tree .tree .map1{
  top: 0px;
  left: -544px;
}
#grp_tree .tree .map2{
  position: absolute;
  top: 8px;
  right: 0;
}
#grp_tree .tree .map3,
#grp_tree .tree .map4{right: 520px ;}
#grp_tree .tree .map3{ top: 330px ;}
#grp_tree .tree .map4{ top: 816px ;}


#grp_tree .tree h4,
#grp_tree .tree h5{
  display: block;
  margin: 0;
}

#grp_tree .tree .top-margin{
  margin-top: 47px;
}

/* 各色 */
#grp_tree .tree .map1{background-color: #999999}
#grp_tree .tree .map3,
#grp_tree .tree .map4{background-color: #D9D9D9}

#grp_tree .tree h5 {color: #136EAB;}
#grp_tree .tree ul li {background-color: #E1E8F3;}

#grp_tree .tree .mint h5{color: #009E96;}
#grp_tree .tree .orange h5{color: #EE7800;}
#grp_tree .tree .pink h5{color: #EA545D;}
#grp_tree .tree .green h5{color: #22AC38;}
#grp_tree .tree .purpul h5{color: #710279;}

#grp_tree .tree .mint li{background-color: #E0F1F0;}
#grp_tree .tree .orange li{background-color: #FDEDDB;}
#grp_tree .tree .pink li{background-color: #FDEAE7;}
#grp_tree .tree .green li{background-color: #E9F3E3;}
#grp_tree .tree .purpul li{background-color: #EDE0EE;}



/*===== 数字で見るアヤハ =====*/

#data h3{
  margin-bottom: 40px;
}

.data_box{
  position: relative;
  height: 600px;
  width: 1000px;
  margin: 0 auto;
}

.data_box img{
  position: absolute;
}

.data_box img:hover{
  cursor: pointer;
  opacity: .7;
}

.data01{top:0; left:0px;}
.data02{top:0; left:190px;}
.data03{top:0; left:380px;}

.data04{top:165px; left:95px;}
.data05{top:165px; left:285px;}

.data06{top:330px; left:0px;}
.data07{top:330px; left:190px;}
.data08{top:330px; left:380px;}


.balloon{
  width: 300px;
  height: 500px;
  position: absolute;
  top: 0;
  right: 0;
  background-color: #EBEBEB;
  padding: 20px;
  border-radius: 20px;
}

.balloon:before {
    content: "";
    display: inline-block;
    border-top: 30px solid transparent;
    border-right: 80px solid #cdcdcd;
    border-bottom: 30px solid transparent;
    width:40px;
    border-right-color: #EBEBEB;
    position: absolute;
    left: -120px;
    top: 18%;
    margin-top: -9px;
}

.balloon h4{
  text-align: center;
  font-size: 1.6em;
  border-bottom: solid 4px #999999;
  margin: 0 0 10px 0;
}

.balloon h4 span{
  color: #E83817;
  font-size: 1.2em;
}

.dis_none{
  display: none;
}

.data-section-title{
  margin-top: 60px;
  text-align: center;
  color: #666;
  font-size: 1.5rem;
}

.data-imgbox{
  margin-top: 15px;
}

.data-3gridbox{
  display: grid;
  grid-template-columns: 586px 478px;
  grid-template-rows: auto auto;
  gap: 15px;
  margin-top: 15px;
}

.data-3gridbox img{
  width: 100%;
  height: auto;
}

.data-3gridbox-first{
  grid-column: 1 / 2;
  grid-row: 1 / 2;
}

.data-3gridbox-second{
  grid-column: 1 / 2;
  grid-row: 2 / 3;
}

.data-3gridbox-third{
  grid-column: 2 / 3;
  grid-row: 1 / 3;
}

.data-3gridbox.reverse{
  grid-template-columns: 478px 586px;
}

.reverse .data-3gridbox-first{
  grid-column: 1 / 2;
  grid-row: 1 / 3;
}

.reverse .data-3gridbox-second{
  grid-column: 2 / 3;
  grid-row: 1 / 2;
}

.reverse .data-3gridbox-third{
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}