@charset "UTF-8";

@media(max-width: 767px) {
  .holdings-titlenav .holdings-header__sub__nav {
    display: none;
    height: 0px !important;
    border-bottom: none;
  }
}

:root {
  /*basic font size setting*/
  font-size: 16px;


  /*font size setting*/
  --txt10: 10px;
  --txt12: 12px;
  --txt16: 16px;
  --txt18: 18px;
  --txt20: 20px;
  --txt24: 24px;
  --txt28: 28px;
  --txt32: 32px;
  --txt36: 36px;
  --txt40: 40px;
  --txt48: 48px;
  --txt64: 64px;

  --font-waight-nomal: nomal;
  --font-waight-bold: bold;

  /*text color setting*/
  --text-color-normal: #1A1A1A;
  --text-color-normal-sub: #666;
  --text-color-normal-white: #fff;
  --dark-red: #B50000;

  /*border color setting*/
  --border-color-dark: #898989;
  --border-color-light: #B7B7B7;
  --border-color-white: #fff;

  /*background color setting*/
  --bg-color-dark-gray: #1f1f1f;
  --bg-color-light-dark-gray: #666;
  --bg-color-medium-gray: #ccc;
  --bg-color-light-medium-gray: #e5e5e5;
  --bg-color-pale-gray: #f2f2f2;
  --bg-color-light-pale-gray: #f9f9f9;
  --bg-color-white: #fff;
  --contents-blue: #2492B1;
  --contents-blue20: #DEEFF4;

  /*general color setting*/
  --primary-orange: hsl(25, 100%, 48%);
  --dark-red: hsl(0, 100%, 35%);
  --standard-red: hsl(358, 97%, 54%);
  --dark-green: hsl(102, 100%, 20%);
  --standard-green: hsl(102, 64%, 41%);
  --panasonic-blue: hsl(220, 100%, 38%);
  --corporate-blue: hsl(193, 80%, 30%);
}

/*general setting*/
/*general setting -- anchor*/
a:hover {
  opacity: .5
}

a[href^="tel:"] {
  text-decoration: underline;
}

/*general setting -- page link*/
.page_link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.page_link::after {
  content: "";
  width: 1rem;
  height: 1rem;
  background-image: url(/pct/common/resources/images/holdings-icn-arrowhead-r.svg);
  background-repeat: no-repeat;
  flex-shrink: 0;
  margin-top: .25rem;
}

.in-page_link {
  display: inline-flex !important;
  align-items: center;
}

.in-page_link::after {
  display: inline-block;
  background-image: url(/pct/common/images/shevron_lower.svg);
  background-repeat: no-repeat;
  content: "";
  width: 1rem;
  height: 1rem;
  margin: .125rem 0 0 .25rem
}

.out-page_link {
  display: inline-flex !important;
  align-items: center;
}

.out-page_link::after {
  display: inline-block;
  background-image: url(/pct/common/resources/images/holdings-icn-newtab.svg);
  background-repeat: no-repeat;
  content: "";
  width: 1rem;
  height: 1rem;
  margin: .125rem 0 0 .25rem
}

.out-page_link_white {
  display: inline-flex !important;
  align-items: center;
}

.out-page_link_white::after {
  display: inline-block;
  background-image: url(/pct/common/resources/images/holdings-icn-newtab_white.svg);
  background-repeat: no-repeat;
  content: "";
  width: 1rem;
  height: 1rem;
  margin: .125rem 0 0 .25rem
}

/*general setting -- button*/
.primary_button_white {
  display: inline-flex !important;
  align-items: center;
  background-color: var(--bg-color-white);
  box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.15);
  border-radius: 2rem;
  border: var(--border-color-dark) 1px solid;
  justify-content: center;
  padding: .5rem 2rem;
}

.primary_button_white::after {
  display: inline-block;
  background-image: url(/pct/common/resources/images/holdings-icn-search.svg);
  background-repeat: no-repeat;
  content: "";
  width: 1rem;
  height: 1rem;
  margin: .125rem 0 0 .25rem
}

.secondary_button_white {
  display: inline-flex !important;
  align-items: center;
  background-color: var(--bg-color-white);
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
  border-radius: .25rem;
  border: var(--border-color-light) 1px solid;
  justify-content: center;
  padding: .5rem 1rem;
}

.secondary_button_white::after {
  display: inline-block;
  background-image: url(/pct/common/images/shevron.svg);
  background-repeat: no-repeat;
  content: "";
  width: 1rem;
  height: 1rem;
  margin: .125rem 0 0 .25rem
}

/*general setting -- color*/
.text-corporate-blue {
  color: var(--corporate-blue);
}

.text-corporate-sub {
  font-weight: var(--font-waight-bold);
}

/*general setting -- text style*/
.subtext {
  font-size: var(--txt12);
  color: var(--text-color-normal-sub)
}

/*general setting -- text align*/
.text-right {
  text-align: right
}

.text-center {
  text-align: center
}

.text-pc_center-sp_left {
  text-align: left
}

.text-pc_left-sp_center {
  text-align: center
}

/*general setting -- text weight*/
.text_bold {
  font-weight: bold;
}

/*general setting -- text decoration*/
.underline {
  text-decoration: underline
}

/*general setting -- padding*/
.padding_bottom_8 {
  padding-bottom: .5rem;
}

/*general setting -- border*/
.border_top_light {
  border-top: var(--border-color-light) 1px solid;
}

.border_bottom_light {
  border-bottom: var(--border-color-light) 1px solid;
}

/*general setting -- br*/
/* spで改行 */
.br_sp {
  display: inline;
}

/* pcで改行 */
.br_pc {
  display: none;
}

/*general setting -- list style*/
.list-style-disc {
  list-style-type: disc;
  list-style-position: outside;
  padding-left: 1.25rem;
  line-height: 1.75;
}

.list-style-decimal {
  list-style-type: decimal;
  list-style-position: outside;
  padding-left: 1.25rem;
  line-height: 1.75;
}

.list-style-lower-alpha {
  list-style-type: lower-alpha;
  list-style-position: outside;
  padding-left: 1.25rem;
  line-height: 1.75;
}

.list-style-parentheses {
  list-style: none;
  list-style-position: outside;
  counter-reset: my-counter;
  padding-left: 1.25rem;
  line-height: 1.75;
}

.list-style-parentheses li {
  counter-increment: my-counter;
  position: relative;
}

.list-style-parentheses li::before {
  content: "(" counter(my-counter) ") ";
}

/*general setting -- container*/
.main {
  width: 100%;
  background-color: #fff;
}

.wrapper {
  padding-top: 2rem;
}

.wrapper_gray {
  padding-top: 2rem;
  background-color: var(--bg-color-pale-gray);
}

.SectionCompornent {
  padding: 0 1rem 6rem;
  display: flex;
  flex-direction: column;
  gap: 3rem;
  /*background-color: #666;*/
}

.ContentAreaL {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  /*background-color: #888;*/
}

.ContentAreaM {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  /*background-color: #aaa;*/
}

.ContentAreaS {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  /*background-color: #ccc;*/
}

.ContentAreaSS {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  /*background-color: #eee;*/
}

.FlexAreaM {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.FlexAreaS-Holizontal {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: .5rem;
}

.FlexAreaS-Vartical {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.card {
  border: var(--border-color-dark) 1px solid;
  border-radius: .25rem;
  padding: 1rem;
}

.display-inline {
  display: inline;
}

/*general setting -- healine*/
.headline1 {
  font-size: var(--txt32);
  font-weight: var(--font-waight-nomal);
  text-align: center;
}

.headline2 {
  font-size: var(--txt28);
  font-weight: var(--font-waight-nomal);
}

.headline3 {
  font-size: var(--txt24);
  font-weight: var(--font-waight-nomal);
}

.headline4 {
  font-size: var(--txt20);
  font-weight: var(--font-waight-nomal);
}

.headline5 {
  font-size: var(--txt18);
  font-weight: var(--font-waight-nomal);
}


@media screen and (min-width: 768px) {

  /*general setting*/
  /*general setting -- anchor*/
  a[href^="tel:"] {
    pointer-events: none;
    text-decoration: none;
  }

  /*general setting -- button*/
  .primary_button_white {
    width: fit-content;
    max-width: 600px;
    padding: .5rem 4rem;
  }

  .secondary_button_white {
    width: fit-content;
    max-width: 600px;
  }

  /*general setting -- text align*/
  .text-pc_center-sp_left {
    text-align: center
  }

  .text-pc_left-sp_center {
    text-align: left
  }

  /*general setting -- br*/
  .br_sp {
    display: none;
  }

  .br_pc {
    display: inline;
  }

  /*general setting -- container*/
  .wrapper {
    padding-top: 4rem;
  }

  .SectionCompornent {
    width: 61rem;
    padding: 0 0 8rem;
    margin: 0 auto;
  }

  .FlexAreaM {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 2rem;
  }

  .FlexAreaS-Holizontal {
    display: flex;
    flex-direction: row;
    gap: 1rem;
  }

  .FlexAreaS-Vartical {
    display: flex;
    flex-direction: row;
    gap: 1rem;
  }

  /*general setting -- healine*/
  .headline1 {
    font-size: var(--txt36);
    text-align: center;
  }

  .headline2 {
    font-size: var(--txt32);
  }

  .headline3 {
    font-size: var(--txt28);
  }

  .headline4 {
    font-size: var(--txt24);
  }

  .headline5 {
    font-size: var(--txt20);
  }
}

/* SP global header styles */
.holdings-header__nav.pulldown .holdings-header__rel {
  background-color: #333 !important;
  color: #B2B2B2 !important;
  font-size: 12px !important;
}

.holdings-header__nav.pulldown .holdings-header__nav__panel {
  background-color: #333 !important;
}

.holdings-header__nav.pulldown .holdings-header__nav__list {
  background-color: #1a1a1a !important;
}

.holdings-header__nav.pulldown .holdings-header__nav__list__item .item-box {
  min-height: 40px !important;
}

.holdings-header__nav.pulldown .holdings-header__nav__list__item {
  color: #999999 !important;
  border-top: 1px solid #333 !important;
  font-size: 14px !important;
}

.holdings-header__nav.pulldown .holdings-header__nav__list__item.l2>.item-box {
  padding-inline-start: 15px !important;
}

.out-page_link_old {
  display: inline-flex !important;
  align-items: center;
}

.out-page_link_old::after {
  display: inline-block;
  background-image: url(/etc/designs/panasonic/holdings/images/holdings-icn-blank-pc.svg);
  background-repeat: no-repeat;
  content: "";
  width: 14px;
  height: 14px;
  margin: .125rem 0 0 .25rem
}