@charset "UTF-8";

label.panel-label {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: block;
  width: 100%;
  color: #000000;
  cursor: pointer;
  background-color: #ffffff;
  -webkit-transition-property: background-color, color;
  transition-property: background-color, color;
  -webkit-transition-duration: 200ms;
  transition-duration: 200ms;
}

label.panel-label:hover {
  color: #003399;
}

/* #panels {
  margin-top: 50px;
} */

#panels section > div {
  max-height: 0;
  opacity: 0;
  overflow-y: hidden;
}

#panel-1-ctrl:checked ~ #panels #panel-1 > div {
  max-height: initial;
  opacity: 1;
  padding: 0;
  margin: 0;
}
#panel-2-ctrl:checked ~ #panels #panel-2 > div {
  max-height: initial;
  max-height: auto;
  opacity: 1;
  padding: 0;
  margin: 0;
}

#panel-3-ctrl:checked ~ #panels #panel-3 > div {
  max-height: initial;
  max-height: auto;
  opacity: 1;
  padding: 0;
  margin: 0;
}

/*IE*/
#panel-1-ctrl:checked ~ #panels #panel-1 > div,
#panel-2-ctrl:checked ~ #panels #panel-2 > div,
#panel-3-ctrl:checked ~ #panels #panel-3 > div {
  /* max-height: 2000px; */
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 {
  /* pointer-events: none; */ /*200127-1077 add anchor*/
  cursor: default;
  box-shadow: none;
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1.last {
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 + li {
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 label.panel-label {
  background-color: #c8c8c8;
  color: #000;
  padding-top: 6px;
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 label.panel-label::after {
  height: 6px;
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 {
  /* pointer-events: none; */
  cursor: default;
  box-shadow: none;
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2.last {
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 + li {
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 label.panel-label {
  background-color: #c8c8c8;
  color: #000;
  padding-top: 6px;
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 label.panel-label::after {
  height: 6px;
}

#li-for-panel-2 {
  border-left: dotted 1px #000;
  border-right: dotted 1px #000;
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 {
  /* pointer-events: none; */
  cursor: default;
  box-shadow: none;
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3.last {
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 + li {
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 label.panel-label {
  background-color: #c8c8c8;
  color: #000;
  padding-top: 6px;
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 label.panel-label::after {
  height: 6px;
}

#tabs-list #li-for-panel-1 label.panel-label::before {
  content: "";
  display: inline-block;
  width: 34px;
  height: 34px;
  background-image: url(../images/re_tab_icon01.png);
  background-size: cover;
  vertical-align: middle;
  margin-right: 6px;
}
#tabs-list #li-for-panel-2 label.panel-label::before {
  content: "";
  display: inline-block;
  width: 34px;
  height: 34px;
  background-image: url(../images/re_tab_icon02.png);
  background-size: cover;
  vertical-align: middle;
  margin-right: 6px;
}
#tabs-list #li-for-panel-3 label.panel-label::before {
  content: "";
  display: inline-block;
  width: 34px;
  height: 34px;
  background-image: url(../images/re_tab_icon03.png);
  background-size: cover;
  vertical-align: middle;
  margin-right: 6px;
}

ul#tabs-list {
  display: flex;
  list-style: none;
  text-align: center;
  margin: 0 auto -79px;
  width: 920px;
  position: relative;
  border-top: solid 5px #3456a0;
  top: -79px;
  background: #fff;
  -webkit-border-top-right-radius: 4px;
  -webkit-border-top-left-radius: 4px;
  -moz-border-radius-topright: 4px;
  -moz-border-radius-topleft: 4px;
}

ul#tabs-list li {
  text-align: center;
  font-size: 1.2em;
  width: 100%;
  position: relative;
}

ul#tabs-list li:hover {
  -webkit-transition: none;
  transition: none;
}

ul#tabs-list li:hover.last {
}

ul#tabs-list li:hover + li {
}

ul#tabs-list li label.panel-label {
  position: relative;
  display: table-cell;
  width: 33%;
  height: 74px;
  vertical-align: middle;
  font-family: "Noto Sans Japanese", sans-serif;
  font-weight: 700;
}

ul#tabs-list li label.panel-label:hover {
}

ul#tabs-list li label.panel-label:hover::after {
  height: 6px;
}

.panel_group {
  margin: 0 auto;
}

.panel-radios {
  display: none;
}

#li-for-panel-3,
#li-for-panel-2,
#li-for-panel-3 {
  padding-bottom: 0;
}

#tabs > nav > ul > li:last-child {
  padding-bottom: 0;
}

@media only screen and (max-width: 640px) {
  ul#tabs-list {
    display: block;
    width: 90%;
    margin: 20px auto 0 !important;
    top: 0px;
    padding: 0 !important;
    position: relative;
    border-top: solid 2px #969696;
    border-left: solid 2px #969696;
    border-right: solid 2px #969696;
    border-bottom: solid 2px #969696;
    background: #fff;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-topleft: 0px;
  }

  #li-for-panel-2 {
    border-left: none;
    border-right: none;
    border-top: dotted 1px #000;
    border-bottom: dotted 1px #000;
  }

  #panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 label.panel-label,
  #panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 label.panel-label,
  #panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 label.panel-label {
    padding-top: 0;
  }
  #panels section > div {
  }
  ul#tabs-list li label.panel-label {
    position: relative;
    display: table-cell;
    width: 33%;
    height: 66px;
    vertical-align: middle;
    font-family: "Noto Sans Japanese", sans-serif;
    font-weight: 700;
  }
}