


/************************** button *****************************/
.basic-page .button-area {
  margin-top: 15px;
  font-size: 0;
  display: inline-block;
  margin-right: 15px;
}

.basic-page .button-area:last-child {
  margin-right: 0;
}

.basic-page .button *[style="text-align:center"] .button-area,
.basic-page .button *[style*="center"] .button-area {
  margin-right: 7px;
  margin-left: 7px;
}

.basic-page .button *[style="text-align:right"] .button-area,
.basic-page .button *[style*="right"] .button-area {
  margin-right: 0;
  margin-left: 15px;
}

.basic-page .button *[style="text-align:right"] .button-area:first-child,
.basic-page .button *[style*="right"] .button-area:first-child {
  margin-left: 0;
}

.basic-page .button:first-child .button-area:first-child,
.basic-page .anchor:first-child + .button .button-area:first-child {
  margin-top: 0;
}

.basic-page .commonContents > .button:first-child .button-area:first-child {
  margin-top: 15px;
}

.basic-page :first-child > .commonContents > .button:first-child .button-area:first-child,
.basic-page :first-child > .commonContents > .anchor:first-child + .button .button-area:first-child {
  margin-top: 0;
}

.basic-page .button-area a {
  display: inline-block;
  height: 43px;
  padding: 0 16px 0 55px;
  border-radius: 3px;
  -pie-border-radius: 3px;
  position: relative;
  -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -mozbox-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -o-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -ms-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -pie-box-shadow: 0 0 2px 0 #666;
  behavior: url(/etc/designs/panasonic/common-clientlibs/css/PIE.htc);
}

.basic-page .button-area.typeA a {
  background: url(basicpage-clientlibs/images/common_button_icon01.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon01.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeB a {
  background: url(basicpage-clientlibs/images/common_button_icon02.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon02.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeC a {
  background: url(basicpage-clientlibs/images/common_button_icon03.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon03.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeD a {
  background: url(basicpage-clientlibs/images/common_button_icon04.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon04.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.noicon a {
  padding: 0 16px 0 16px;
  background: url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeA.lightgrey a {
  background: url(basicpage-clientlibs/images/common_button_icon01_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon01_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeB.lightgrey a {
  background: url(basicpage-clientlibs/images/common_button_icon02_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon02_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeC.lightgrey a {
  background: url(basicpage-clientlibs/images/common_button_icon03_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon03_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeD.lightgrey a {
  background: url(basicpage-clientlibs/images/common_button_icon04_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon04_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.noicon.lightgrey a {
  padding: 0 16px 0 16px;
  background: url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area a:before {
  display: inline-block;
  content: "";
  overflow: hidden;
  height: 43px;
  background-repeat: no-repeat;
  vertical-align: middle;
}

.basic-page .button-area a span {
  display: inline-block;
  font-family: 'Open Sans Condensed', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  vertical-align: middle;
  text-shadow: none;
}

.basic-page .button-area.lightgrey a span {
  color: #1f1f1f;
}




.basic-page .button-area p {
  display: inline-block;
  height: 43px;
  padding: 0 16px 0 55px;
  border-radius: 3px;
  -pie-border-radius: 3px;
  position: relative;
  -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -mozbox-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -o-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -ms-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  -pie-box-shadow: 0 0 2px 0 #666;
  behavior: url(/etc/designs/panasonic/common-clientlibs/css/PIE.htc);
}

.basic-page .button-area.typeA p {
  background: url(basicpage-clientlibs/images/common_button_icon01.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon01.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeB p {
  background: url(basicpage-clientlibs/images/common_button_icon02.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon02.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeC p {
  background: url(basicpage-clientlibs/images/common_button_icon03.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon03.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeD p {
  background: url(basicpage-clientlibs/images/common_button_icon04.png) no-repeat 0 50% #434343;
  background: url(basicpage-clientlibs/images/common_button_icon04.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.noicon p {
  padding: 0 16px 0 16px;
  background: url(basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeA.lightgrey p {
  background: url(basicpage-clientlibs/images/common_button_icon01_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon01_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeB.lightgrey p {
  background: url(basicpage-clientlibs/images/common_button_icon02_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon02_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeC.lightgrey p {
  background: url(basicpage-clientlibs/images/common_button_icon03_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon03_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.typeD.lightgrey p {
  background: url(basicpage-clientlibs/images/common_button_icon04_light.png) no-repeat 0 50% #dddddd;
  background: url(basicpage-clientlibs/images/common_button_icon04_light.png) no-repeat 0 50%, url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area.noicon.lightgrey p {
  padding: 0 16px 0 16px;
  background: url(basicpage-clientlibs/images/btn-lightgrey-1px.png) repeat-x;
}

.basic-page .button-area p:before {
  display: inline-block;
  content: "";
  overflow: hidden;
  height: 43px;
  background-repeat: no-repeat;
  vertical-align: middle;
}

.basic-page .button-area p input {
  display: inline-block;
  font-family: 'Open Sans Condensed', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  vertical-align: middle;
  text-shadow: none;
}

.basic-page .button-area.lightgrey p input {
  color: #1f1f1f;
}



@media only screen and (max-width: 640px) and (max-device-width: 1280px) {




  /************************** button *****************************/
  .basic-page .button-area {
    margin-top: 10px;
    margin-right: 8px;
    font-size: 0;
  }

  .basic-page .commonContents > .button:first-child .button-area:first-child {
    margin-top: 10px;
  }

  .basic-page .button *[style="text-align:center"] .button-area,
  .basic-page .button *[style*="center"] .button-area {
    margin-right: 4px;
    margin-left: 4px;
  }

  .basic-page .button *[style="text-align:right"] .button-area,
  .basic-page .button *[style*="right"] .button-area {
    margin-right: 0;
    margin-left: 8px;
  }

  .basic-page .button-area a {
    height: 31px;
    padding: 0 10px 0 48px;
  }

  .basic-page .button-area.noicon a {
    padding: 0 10px 0 10px;
  }

  .basic-page .button-area a:before,
  .basic-page .button-area a:after {
    height: 31px;
  }

  .basic-page .button-area a span {
    font-size: 0.813rem;
  }



  .basic-page .button-area p {
    height: 31px;
    padding: 0 10px 0 48px;
  }

  .basic-page .button-area.noicon p {
    padding: 0 10px 0 10px;
  }

  .basic-page .button-area p:before,
  .basic-page .button-area p:after {
    height: 31px;
  }

  .basic-page .button-area p input {
    font-size: 0.813rem;
  }







}
