@charset "utf-8";

@import url("base.css");

/* Selectbox Styles
=================================*/
#kibo_dammy{
width: 100%;
}

a.sctble_display {
position: relative;
height: 36px;
max-width: 300px;
padding: 7px 10px;
border: 1px solid #818181;
border-radius: 3px;
background: #fffae6;
box-sizing: border-box;
color: #333;
}
a.sctble_display::after{
display: inline-block;
position: absolute;
top: 50%;
right: 13px;
z-index: 1;
width: 0;
height: 0;
margin-top: -3px;
border-style: solid;
border-width: 10px 5px 0 5px;
border-color: #727272 transparent transparent transparent;
content: '';
}
a.sctble_display span {
  font-size: 14px;
  line-height: 1.5;
}
a.sctble_display:hover span { background-position: right -17px }
a.sctble_focus span { background-position: right -34px !important }


/* Pulldown Mat (Basis)
=================================*/
div#kibo_mat{
  width: calc(100% - 20px);
  margin: 10px 0 0;
  box-sizing: border-box;
}
div#kibo_mat dl dd{
  width: 100%;
}

div.sctble_mat {
  padding: 10px;
  border: none;
  background: #fff;
  font-size: 12px;
  text-align:left;
  box-shadow: 2px 2px 5px 0px rgba(7,1,2,0.30);
}
div.sctble_mat dl{
  border: none;
  padding: 0;
}
div.sctble_mat dl dt{
  float: none;
  width: 100%;
  padding: 2px 10px 0;
  color: #333;
  text-align: left;
  font-size: 14px;
}
div.sctble_mat dl dt.first-child,
div.sctble_mat dl dd:nth-of-type(1){
  display: none;
}
div.sctble_mat dl dt:nth-of-type(2){
  background: #f6cfad;
}
div.sctble_mat dl dt:nth-of-type(3){
  background: #a4deee;
}
div.sctble_mat dl dt:nth-of-type(4){
  background: #fecfcf;
}
div.sctble_mat dl dt:nth-of-type(5){
  background: #dcf4ab;
}
/* ▼▼▼20220623 enovate 区分削除に伴う色見変更▼▼▼ */
div.sctble_mat dl dt:nth-of-type(6){
  //background: #a4b7ee;
  background: #ff983d;
}
/* ▲▲▲20220623 enovate区分削除に伴う色見変更▲▲▲ */
/*
div.sctble_mat dl dt:nth-of-type(7){
  background: #ff983d;
}
*/
div.sctble_mat dl dd{
  overflow: hidden;
  margin: 3px 0 10px;
  padding: 0 5px;
  border-left: none;
  box-sizing: border-box;
}
div.sctble_mat dl dd a{
  width: 100%;
  margin-top: 5px;
  padding: 0 0 0 12px;
  /* ▼▼▼20220425 enovate 区分追加▼▼▼ */
  /*background: url(/sysform_parts/haa-pc/common/images/ico_dotted_5.png?v=2) no-repeat;*/
  background: url(/sysform_parts/haa-pc/common/images/ico_dotted_6.png?v=1) no-repeat;
  /* ▲▲▲20220425 enovate 区分追加▲▲▲ */
  box-sizing: border-box;
  font-size: 15px;
  text-decoration: none;
  color: #333;
}
div.sctble_mat dl dd:nth-of-type(2) a{
  background-position: 0 4px;
}
div.sctble_mat dl dd:nth-of-type(3) a{
  background-position: 0 -11px;
}
div.sctble_mat dl dd:nth-of-type(4) a{
  background-position: 0 -26px;
}
div.sctble_mat dl dd:nth-of-type(5) a{
  background-position: 0 -41px;
}
/* ▼▼▼20220623 enovate 区分削除に伴う色見変更▼▼▼ */
div.sctble_mat dl dd:nth-of-type(6) a{
  //background-position: 0 -56px;
  background-position: 0 -71px;
}
/* ▲▲▲20220623 enovate区分削除に伴う色見変更▲▲▲ */
/*
div.sctble_mat dl dd:nth-of-type(7) a{
  background-position: 0 -71px;
}
*/
@media screen and (min-width: 600px){
  div#kibo_mat{
    width: 810px;
  }
  div.sctble_mat dl dd{
    padding: 0 10px;
    white-space: nowrap;
  }
  div.sctble_mat dl dd a{
    width: calc(99% / 3);
    letter-spacing: -.5px;
  }
  div.sctble_mat dl dd a:hover{
    text-decoration: underline;
  }
}