@charset "UTF-8";

/*==========================================================
 【2019.04.22 更新】

※サステナ年次更新の際、TCIで作成するCSSをここに記述する。
※更新の際、不要となるCSSは削除すること。
============================================================*/

/* ---------- ---------- ----------
  :: index ::

01. Heading

---------- ---------- ---------- */

/* ---------- ---------- ----------
:: for large screen ::
@media only screen and (min-width: 1025px) {
}
:: for medium screen ::
@media only screen and (min-width: 641px) and (max-width: 1024px) {
}
:: for small screen ::
@media only screen and (max-width: 640px) {
}
---------- ---------- ---------- */

/* 01. Heading
---------- ---------- ---------- */
/* 01-1. Heading Lv1 : category top
---------- ---------- */
/* text position */
@media only screen and (min-width: 1025px) {
  .corp-cat-headingLv1-top .l-PageTitle__titleBlock__titleBox {
    top: 30%;
    left: 0%;
  }
}

@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .corp-cat-headingLv1-top .l-PageTitle__titleBlock__titleBox {
    top: 30%;
    left: 0%;
  }
}

@media only screen and (max-width: 640px) {
  .corp-cat-headingLv1-top .l-PageTitle__titleBlock__titleBox {
    top: 10%;
    left: 0%;
  }
}

/*---------------------------------------------------------------------------
サステナビリティ設定
※ 他の編集できないCSSの関係もあり、基本的に画面サイズに関わらず同じ内容の装飾を記述しています。
※ 不要な記述を見つけたら、削除してもOKです。
※ 編集前はバックアップを取ること
-----------------------------------------------------------------------------*/
/*--------------------------------------------------------------
2カラムテキスト部分の設定
----------------------------------------------------------------*/
/*------PCサイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .text_font_size_setting_01 {
    font-size: 23px;
    margin-top: 0 !important;
  }

  .text_font_size_setting_02 {
    font-size: 16px;
    margin-top: 0 !important;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .text_font_size_setting_01 {
    font-size: 23px;
    margin-top: 0 !important;
  }

  .text_font_size_setting_02 {
    font-size: 16px;
    margin-top: 0 !important;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .text_font_size_setting_01 {
    font-size: 23px;
    margin-top: 0 !important;
  }

  .text_font_size_setting_02 {
    font-size: 16px;
    margin-top: 0 !important;
  }
}

/*--------------------------------------------------------------
サブテキスト部分の設定
? position:aboslute; を付与している箇所の、top、left、right、bottomの値を調整すれば
緑矢印の位置を調整できます。
----------------------------------------------------------------*/
/*------PCサイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .sustainability_sub_text_setting .corp-button .is-leftIcon .l-ButtonUnit__link .cmn-richtext {
    padding-left: 0 !important;
  }

  .sustainability_sub_text_setting .is-equalWidth .g-ButtonUnit {
    color: #717173;
    position: relative;
  }

  .sustainability_sub_text_setting .corp-button .l-ButtonUnit .l-ButtonUnit__link .l-ButtonUnit__link__icon {
    position: absolute;
    left: -37px;
  }

  .sustainability_sub_text_setting .corp-button .l-ButtonUnit .l-ButtonUnit__link {
    border: 0;
    padding: 0;
  }

  .sustainability_sub_text_setting .g-ButtonP.is-gutter--none .g-ButtonP__list__item {
    width: auto;
    float: right;
  }

  .sustainability_sub_text_setting .g-ButtonUnit a:hover {
    background: transparent;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .sustainability_sub_text_setting .corp-button .is-leftIcon .l-ButtonUnit__link .cmn-richtext {
    padding-left: 0 !important;
  }

  .sustainability_sub_text_setting .is-equalWidth .g-ButtonUnit {
    color: #717173;
    position: relative;
  }

  .sustainability_sub_text_setting .corp-button .l-ButtonUnit .l-ButtonUnit__link .l-ButtonUnit__link__icon {
    position: absolute;
    left: -37px;
  }

  .sustainability_sub_text_setting .corp-button .l-ButtonUnit .l-ButtonUnit__link {
    border: 0;
    padding: 0;
  }

  .sustainability_sub_text_setting .g-ButtonP.is-gutter--none .g-ButtonP__list__item {
    width: auto;
    float: right;
  }

  .sustainability_sub_text_setting .g-ButtonUnit a:hover {
    background: transparent;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .sustainability_sub_text_setting .corp-button .is-leftIcon .l-ButtonUnit__link .cmn-richtext {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .sustainability_sub_text_setting .is-equalWidth .g-ButtonUnit {
    color: #717173;
    position: relative;
  }

  .sustainability_sub_text_setting .corp-button .l-ButtonUnit .l-ButtonUnit__link .l-ButtonUnit__link__icon {
    position: absolute;
    left: -37px;
  }

  .sustainability_sub_text_setting .corp-button .l-ButtonUnit .l-ButtonUnit__link {
    border: 0;
    padding: 0;
  }

  .sustainability_sub_text_setting .g-ButtonP.is-gutter--none .g-ButtonP__list__item {
    width: auto;
    float: right;
  }

  .sustainability_sub_text_setting .g-ButtonUnit a:hover {
    background: transparent;
  }
}

/*--------------------------------------------------------------
アコーディオン開閉ボタンの設定（閉じている時）
? アコーディオン部分を閉じている時に付与されるクラス「.is-radius--close」を起点に
   装飾を適用してます。
?「.close_button_img」が「閉じている時に表示されるべき画像」「.open_button_img」が「開いている時に表示されるべき画像」となってます。
----------------------------------------------------------------*/
/*------PCサイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .is-radius--close .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .close_button_img {
    display: block;
    max-width: 500px;
    margin-left: 30%;
  }

  .is-radius--close .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .open_button_img {
    display: none;
    max-width: 500px;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .is-radius--close .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .close_button_img {
    display: block;
    max-width: 50%;
    margin-left: 25%;
  }

  .is-radius--close .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .open_button_img {
    display: none;
    max-width: 50%;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .is-radius--close .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .close_button_img {
    display: block;
    max-width: 500px;
    margin-left: 0;
  }

  .is-radius--close .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .open_button_img {
    display: none;
    max-width: 500px;
  }
}

/*--------------------------------------------------------------
アコーディオン開閉ボタンの設定（開いている時）
? アコーディオン部分を閉じている時に付与されるクラス「.is-radius--close」を起点に
   装飾を適用してます。
?「.close_button_img」が「閉じている時に表示されるべき画像」「.open_button_img」が「開いている時に表示されるべき画像」となってます。
----------------------------------------------------------------*/
/*------PCサイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .is-radius--open .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .close_button_img {
    display: none;
    max-width: 500px;
  }

  .is-radius--open .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .open_button_img {
    display: block;
    max-width: 500px;
    margin-left: 30%;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .is-radius--open .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .close_button_img {
    display: none;
    max-width: 50%;
  }

  .is-radius--open .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .open_button_img {
    display: block;
    max-width: 50%;
    margin-left: 25%;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .is-radius--open .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .close_button_img {
    display: none;
    max-width: 500px;
  }

  .is-radius--open .g-AccordionUnit__titleBlock .g-HeadingTitle .g-HeadingTitle__titleBlock .g-HeadingTitle__titleBlock__titleBox .g-HeadingTitle__titleBlock__titleBox__title .g-HeadingTitle__h3 .cmn-richtext span.open_close_text .open_button_img {
    display: block;
    max-width: 500px;
    margin-left: 0;
  }
}

/*--------------------------------------------------------------
アコーディオンボタン周りの余白設定
? 背景色の設定と、デフォルトで付いているpaddingのリセット
? margin-topの値をいじりますと、ボタン部分とボタン上部画像との余白を調整できます。
----------------------------------------------------------------*/
/*------PC時サイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .g-AccordionUnit .open_close_setting {
    padding: 0;
    background: #f8f8f8;
    margin-top: 20px;
  }

  .open_close_setting .g-HeadingTitle {
    margin: 0;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .g-AccordionUnit .open_close_setting {
    padding: 0;
    background: #f8f8f8;
    margin-top: 20px;
  }

  .open_close_setting .g-HeadingTitle {
    margin: 0;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .g-AccordionUnit .open_close_setting {
    padding: 0;
    background: #f8f8f8;
    margin-top: 20px;
  }

  .open_close_setting .g-HeadingTitle {
    margin: 0;
  }
}

/*--------------------------------------------------------------
アコーディオン展開時の画像周りの余白削除
? 展開前の画像と同じサイズで表示するために、展開後画像周りに付与されているpaddingをリセットしてます。
----------------------------------------------------------------*/
/*------PC時サイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .open_padding_setting .g-AccordionUnit__contentBlock {
    padding: 0;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .open_padding_setting .g-AccordionUnit__contentBlock {
    padding: 0;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .open_padding_setting .g-AccordionUnit__contentBlock {
    padding: 0;
  }
}

/*--------------------------------------------------------------
カルーセルコンテンツ以外のコンテンツ表示幅の設定（H1が入っていないセクション）
? デフォルトでコンテンツ幅(max-width)が指定されているため、カルーセルに合わせる形の装飾変更記述
----------------------------------------------------------------*/
/*------PC時サイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .sustainability_section_setting .g-Section__inner {
    max-width: 1366px !important;
    margin-bottom: 0 !important;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .sustainability_section_setting .g-Section__inner {
    max-width: 1366px !important;
    margin-bottom: 0 !important;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .sustainability_section_setting .g-Section__inner {
    max-width: 1366px !important;
    margin-bottom: 0 !important;
  }
}

/*--------------------------------------------------------------
カルーセルコンテンツ以外のコンテンツ表示幅等の設定（H1が入ってるセクション）
? デフォルトでコンテンツ幅(max-width)が指定されているため、カルーセルに合わせる形の装飾変更記述
? デフォルトで付与されているH1のボーダー削除
----------------------------------------------------------------*/
/*------PC時サイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .sustainability_section_setting {
    border: 0 !important;
  }

  .sustainability_section_setting .corp-cat-headingLv1 .l-PageTitle__titleBlock {
    max-width: 1366px !important;
  }

  .sustainability_section_setting .corp-cat-headingLv1 .l-PageTitle__titleBlock__titleBox__title {
    border: 0;
    padding: 0;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .sustainability_section_setting {
    border: 0 !important;
  }

  .sustainability_section_setting .corp-cat-headingLv1 .l-PageTitle__titleBlock {
    max-width: 1366px !important;
  }

  .sustainability_section_setting .corp-cat-headingLv1 .l-PageTitle__titleBlock__titleBox__title {
    border: 0;
    padding: 0;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .sustainability_section_setting {
    border: 0 !important;
  }

  .sustainability_section_setting .corp-cat-headingLv1 .l-PageTitle__titleBlock {
    max-width: 1366px !important;
  }

  .sustainability_section_setting .corp-cat-headingLv1 .l-PageTitle__titleBlock__titleBox__title {
    border: 0;
    padding: 0;
  }
}

/*--------------------------------------------------------------
H1付近の余白調整設定
? H1上部の余白を、H1下の余白と合わせるための装飾記述です。
※ line-heightや、他CSSで付与されているっぽい余白の関係もありますので
余白を広げるだけならpadding-topの数値をいじれば良いですが、余白を削る場合はデベロッパーが確認しつつ調整してください。
----------------------------------------------------------------*/
/*------PC時サイズ---------------------------*/
@media only screen and (min-width: 1025px) {
  .sustainability_section_setting .g-Section__inner .g-Column .g-Column__inner .g-Column__cols {
    padding-top: 20px !important;
    padding-bottom: 0 !important;
  }
}

/*------タブレットサイズ---------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .sustainability_section_setting .g-Section__inner .g-Column .g-Column__inner .g-Column__cols {
    padding-top: 20px !important;
    padding-bottom: 0 !important;
  }
}

/*------スマホサイズ---------------------------*/
@media only screen and (max-width: 640px) {
  .sustainability_section_setting .g-Section__inner .g-Column .g-Column__inner .g-Column__cols {
    padding-top: 20px !important;
    padding-bottom: 0 !important;
  }
}

/*--------------------------------------------------------------
※ タブレット表示時限定の余白調整
----------------------------------------------------------------*/
@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .sustainability_section_setting .opt-mt10--imp {
    margin-top: 20px !important;
  }

  .sustainability_top_margin_bottom .l-Section__inner {
    margin-bottom: 0 !important;
  }
}

/*--------------------------------------------------------------
アコーディオンアイコン非表示
----------------------------------------------------------------*/
.Accordion-display-none .l-AccordionUnit__titleBlock__icon {
  display: none;
}

/*--------------------------------------------------------------
「カスタマー向け製品のお問い合わせ」のリンク設定
----------------------------------------------------------------*/

.accordion-h3link .cmn-icon {
  color: #333;
}

.accordion-h3link .g-HeadingTitle__icon {
  margin-top: -0.6em;
}

.accordion-h3link .cmn-richtext span {
  padding-right: 1em;
}

/*--------------------------------------------------------------
アコーディオンに似せている箇所の設定
2019.10.16 追記
----------------------------------------------------------------*/
/* カラム間の余白設定 ※PC、タブレット時のみ*/
@media only screen and (min-width: 641px) {

  /* 左カラム */
  .soudan-2column-outer .g-Column__cols:first-child {
    box-sizing: border-box;
    padding: 0 1% 0 0;
  }

  /* 右カラム */
  .soudan-2column-outer .g-Column__cols:last-child {
    box-sizing: border-box;
    padding: 0 0 0 1%;
  }

  /* 製品以外のお問い合わせの方 */
  /* 左カラム */
  .soudan-2column-outer-02 .g-Column__cols:first-child {
    box-sizing: border-box;
    padding: 0 2% 0 0;
  }

  /* 右カラム */
  .soudan-2column-outer-02 .g-Column__cols:last-child {
    box-sizing: border-box;
    padding: 0 0 0 2%;
  }
}

/* 灰色背景の見出し部分を囲むグループボックス */
.soudan-2column-unit .g-GroupBox:first-child {
  padding: 10px 1.875em 0 10px;
  background: #f8f8f8;
  border-bottom: 1px solid #d9d9d9;
}

.soudan-2column-unit .g-GroupBox:first-child .g-HeadingTitle__titleBlock__titleBox__title {
  margin-bottom: 0;
}

/* 灰色背景下のグループボックス */
.soudan-2column-unit .g-GroupBox:last-child {
  border: 0;
}

.soudan-2column-unit .g-GroupBox:last-child .corp-button .l-ButtonUnit .l-ButtonUnit__link {
  border-left: 0;
  border-right: 0;
}

/* スマホ時 カラム間の余白 */
@media only screen and (max-width: 640px) {
  .soudan-2column-unit {
    margin-top: 26px;
    /* お電話部分と余白数値を合わせる */
  }
}

/* 見出しアイコンとテキストが被らない設定 */
.g-HeadingTitle__h3 {
  padding-right: 1.3em;
}

.g-AccordionUnit__titleBlock {
  padding: 10px 0.5em 0 10px;
}

/* 簡体字を太字にする設定 */
.soudan-font-weight-bold {
  font-weight: bold;
}

.soudan-font-weight-bold-cn {
  font-family: "FP-Hiragino-Sans-GB-W6", "Neue-Helvetica-Paneuropean-Bold",
    sans-serif;
}

/* 簡体字のフォントを統一する設定 */
.soudan-font-family-cn {
  font-family: "FP-Hiragino-Sans-GB-W3", "Neue-Helvetica-Paneuropean-Light",
    sans-serif;
}

/* 「新型コロナウイルスに関するよくあるお問い合わせ」のアイコン色設定 */
.soudan-corona .cmn-icon {
  color: #00a582 !important;
}

/* リンクアイコン「＞」を非表示にする設定 */
.soudan-icon-Q .l-TileLinkTextUnit .l-TileLinkTextUnit__leadBlock {
  padding-left: 0px;
}

.soudan-icon-Q .l-TileLinkTextUnit .l-TileLinkTextUnit__leadBlock__title .l-Text:before {
  display: none;
}

@media only screen and (max-width: 640px) {
  .soudan-icon-Q .l-TileLinkTextUnit .l-TileLinkTextUnit__leadBlock:after {
    display: none;
  }

  .soudan-icon-Q .l-TileLinkTextUnit .l-TileLinkTextUnit__leadBlock {
    padding-right: 0px;
  }
}

/* 「家庭用品?化粧品に関するお問い合わせ（gopay钱包消費者相談室）」の設定 */

@media only screen and (min-width: 641px) {
  .products-mainbg {
    background-image: url(/content/dam/sites/kao/www-kao-com/jp/ja/support/products/image-01.jpg),
      url(/content/dam/sites/kao/www-kao-com/jp/ja/support/products/bg-01.jpg);
    background-repeat: no-repeat, repeat-y;
    background-size: 100%, 100%;
    background-position: center bottom, center;
    min-height: 432px;
  }
}

@media only screen and (max-width: 1024px) and (min-width: 641px) {
  .products-mainbg {
    background-image: url(/content/dam/sites/kao/www-kao-com/jp/ja/support/products/image-01-m.jpg),
      url(/content/dam/sites/kao/www-kao-com/jp/ja/support/products/bg-01-m.jpg);
    background-repeat: no-repeat, repeat-y;
    background-size: 100%, 100%;
    background-position: center bottom, center;
    min-height: 350px;
  }
}

@media only screen and (max-width: 640px) {
  .products-mainbg-s {
    background-image: url(/content/dam/sites/kao/www-kao-com/jp/ja/support/products/bg-01-s.jpg),
      url(/content/dam/sites/kao/www-kao-com/jp/ja/support/products/bg-01-s-02.jpg);
    background-repeat: no-repeat, repeat-y;
    background-size: 100%, 100%;
    background-position: center bottom, center;
  }
}

@media only screen and (min-width: 1025px) {
  .products-h1 {
    width: 52%;
  }
}

@media only screen and (max-width: 1024px) and (min-width: 641px) {
  .products-h1 {
    width: 70%;
  }
}

@media only screen and (min-width: 1025px) {
  .products-mainlink {
    width: 40%;
  }
}

@media only screen and (max-width: 1024px) and (min-width: 641px) {
  .products-mainlink {
    width: 48%;
  }
}

.products-bg-01 {
  background-color: #cceceb;
}

.products-bg-margin-01 {
  margin-top: -1px;
}

@media only screen and (max-width: 640px) {
  .products-linkicon-margin-01 .g-TextLinkUnit__link__icon {
    margin-top: -0.2em !important;
  }
}

.products-line {
  border-top: 1px solid #d9d9d9;
}

@media only screen and (min-width: 641px) {
  .products-heading-01 .cmn-richtext {
    font-size: 30px;
    letter-spacing: 0.1em;
  }
}

@media only screen and (max-width: 640px) {
  .products-heading-01 .cmn-richtext {
    font-size: 26px;
  }
}

@media only screen and (min-width: 1025px) {
  .products-topics-Column .l-Column__inner {
    padding: 0 45px !important;
  }
}

@media only screen and (max-width: 1024px) and (min-width: 641px) {
  .products-topics-Column .l-Column__inner {
    padding: 0 45px !important;
  }
}

@media only screen and (max-width: 640px) {
  .products-topics-Column .l-Column__inner {
    padding: 0 26px !important;
  }
}

.products-g-HeadingTitle .g-HeadingTitle__titleBlock__titleBox__title {
  margin-bottom: 0px !important;
}

.products-g-HeadingTitle .g-HeadingTitle__icon {
  top: 46% !important;
  right: 15px !important;
}

.products-g-HeadingTitle .l-HeadingTitle__p {
  font-size: 20px !important;
  letter-spacing: 0em !important;
  padding-right: 2em !important;
}

.products-g-HeadingTitle .g-HeadingTitle__titleBlock__imageBox {
  padding: 5px !important;
}

.products-g-HeadingTitle .g-HeadingTitle__titleBlock__titleBox {
  padding-left: 15px !important;
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.products-g-HeadingTitle,
.products-g-HeadingTitle .g-HeadingTitle__titleBlock {
  height: 100% !important;
}

.products-g-HeadingTitle-pink .g-HeadingTitle__titleBlock__imageBox {
  background-color: #ec7c95;
}

.products-g-HeadingTitle-pink02 .g-HeadingTitle__titleBlock__imageBox {
  background-color: #70d263;
}

.products-g-HeadingTitle-blue .g-HeadingTitle__titleBlock__imageBox {
  background-color: #78c3e0;
}

.products-g-HeadingTitle-orange .g-HeadingTitle__titleBlock__imageBox {
  background-color: #f29700;
}

.products-g-HeadingTitle-green .g-HeadingTitle__titleBlock__imageBox {
  background-color: #2ea7e0;
}

.products-g-HeadingTitle-green02 .g-HeadingTitle__titleBlock__imageBox {
  background-color: #e3c3d2;
}

.products-g-HeadingTitle-green03 .g-HeadingTitle__titleBlock__imageBox {
  background-color: #ec7c95;
}

.products-g-HeadingTitle-purple .g-HeadingTitle__titleBlock__imageBox {
  background-color: #9b8ee8;
}

@media only screen and (min-width: 641px) {
  .products-pc-display-none {
    display: none !important;
  }
}

@media only screen and (max-width: 640px) {
  .products-sp-display-none {
    display: none !important;
  }
}

.products-AccordionUnit .g-AccordionUnit__titleBlock {
  padding: 0px;
}

.products-AccordionUnit .g-HeadingTitle,
.products-AccordionUnit .g-HeadingTitle__titleBlock__titleBox__title {
  margin-bottom: 0px;
}


.products-AccordionUnit .g-HeadingTitle__titleBlock__imageBox {
  padding: 0px 7px !important;
  background-color: #00a481;
}


.consumer-room-image-item-bgnone.products-AccordionUnit .g-HeadingTitle__titleBlock__imageBox {
  padding: 0px 0px 0px 7px !important;
  background-color: transparent;
}

.products-AccordionUnit .l-AccordionUnit__titleBlock,
.products-AccordionUnit .l-AccordionUnit__contentBlock {
  border-color: #00a481 !important;
}

.products-AccordionUnit .g-HeadingTitle__titleBlock__titleBox {
  padding-left: 15px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.products-AccordionUnit .l-HeadingTitle__h3 {
  padding-right: 2em !important;
}

.products-AccordionUnit .g-HeadingTitle__icon {
  top: 45% !important;
  right: 13px !important;
}

.products-AccordionUnit .l-HeadingTitle.is-link:hover,
.l-HeadingTitle.is-link:focus,
.l-HeadingTitle.is-link:active {
  opacity: 1 !important;
}

.products-AccordionUnit-border .g-HeadingTitle__titleBlock {
  border: solid 1px;
  border-color: #00a481 !important;
}

.products-AccordionUnit-border02 .g-HeadingTitle__titleBlock {
  border: solid 2px;
  border-color: #d9d9d9 !important;
}

.products-opt-fontsize--s {
  font-size: 0.75em;
  font-family: "FP-ヒラギノUD角ゴ StdN W3", FP-HiraginoUDSansStdN-W3, sans-serif;
}

.products-opt-linkfontsize--s .cmn-richtext {
  font-size: 16px;
}

@media only screen and (max-width: 1024px) and (min-width: 641px) {
  .products-g-HeadingTitle .l-HeadingTitle__p {
    font-size: 16px !important;
  }
}

@media only screen and (max-width: 374px) {
  .products-opt-linkfontsize--s .cmn-richtext {
    font-size: 13px !important;
  }
}

.products-opt-linkfontsize--s .l-HeadingTitle__p {
  line-height: 1.4;
}

.products-phone-text-border {
  border-bottom: solid 1px #eeeeee;
}

.products-phone-imagetext .g-HeadingTitle__titleBlock__imageBox {
  padding: 0px !important;
  background-color: #fff;
}

.products-textlink-border .corp-textLink .l-TextLinkUnit__link .cmn-richtext span {
  border-bottom: none !important;
}

.products-textlink-border .g-TextLinkUnit__link__icon {
  top: 30% !important;
}

@media only screen and (max-width: 640px) {
  .products-margin-bottom5 .corp-textLink {
    margin-bottom: 5px !important;
  }
}

@media only screen and (max-width: 640px) {
  .products-phone-padding.g-GroupBox.is-border {
    padding: 5px 20px !important;
  }
}

.products-opt-h1fontsize--s .cmn-richtext {
  font-size: 28px;
}

@media only screen and (max-width: 1024px) and (min-width: 641px) {
  .products-opt-h1fontsize--s .cmn-richtext {
    font-size: 24px;
  }
}

@media only screen and (max-width: 640px) {
  .products-opt-h1fontsize--s .cmn-richtext {
    font-size: 20px;
  }
}

@media only screen and (max-width: 640px) {
  .products-opt-fontsize--s01 .cmn-richtext {
    font-size: 18px;
  }
}

.products-phone-underline .cmn-richtext {
  border-bottom: solid 1px #333;
}

.products-phone-underline .cmn-richtext {
  border-bottom: solid 1px #333;
}

.products-pdf-margin .corp-textLink {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.products-pdf-margin .cmn-icon {
  font-size: 2.5em !important;
}

.products-pdf-margin .g-TextLinkUnit__link__icon {
  top: 4% !important;
}

.products-pdf-margin .is-rightIcon .g-TextLinkUnit__link>.cmn-richtext {
  padding-right: 2.2em !important;
}

@media only screen and (max-width: 640px) {
  .products-pdf-margin .g-TextLinkUnit__link__icon {
    top: 14% !important;
  }
}

@media only screen and (min-width: 641px) {
  .products-pdf-margin .cmn-richtext {
    font-size: 18px !important;
  }
}

@media only screen and (max-width: 640px) {
  .products-pdf-margin .cmn-richtext {
    font-size: 16px !important;
  }
}

.products-telephone-text .g-Text {
  border-bottom: solid 1px #eeeeee;
  margin-bottom: 5px !important;
}

.products-telephone-text .g-Column__cols {
  padding: 0px !important;
}

.products-telephone-text .g-Column__inner {
  padding: 0 22.5px;
}

@media only screen and (max-width: 640px) {
  .products-telephone-text .g-Column__inner {
    padding: 0px 13px;
  }
}


@media only screen and (min-width: 1025px) {
  .products-textsize-17 .cmn-richtext {
    font-size: 17px !important;
  }

  .products-textsize-22 .cmn-richtext {
    font-size: 22px !important;
  }

  .products-phonetextsize-19 .l-TelephoneCall__item__number .cmn-richtext {
    font-size: 19px !important;
  }

  .products-faxiconsize-17 .l-TelephoneCall__item__fax:before {
    font-size: 17px !important;
  }
}

@media only screen and (min-width: 641px) {
  .products-textsize-18-15 {
    font-size: 18px !important;
  }
}

@media only screen and (max-width: 640px) {
  .products-textsize-18-15 {
    font-size: 15px !important;
  }
}

/* カネボウ化粧品関連リンク追加 */
.btn04 {
  box-sizing: border-box;
  padding: 15px 0 15px 15px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.btn04 .g-TileLinkTextUnit {
  padding: 0;
  border: 0;
}

.btn04 .g-Text {
  margin-bottom: 0;
}

.btn04 .cmn-icon {
  color: #00a582 !important;
}

.btn04 .g-TileLinkTextUnit__icon {
  position: relative;
  top: 0.4em;
  right: 0;
}

.btn04 .g-TileLinkTextUnit__leadBlock {
  padding-right: 0;
}

.btn04 .g-TileLinkTextP__list__tile-lg-2 {
  width: auto;
  margin-right: 0.5em;
}

.btn04 .g-TileLinkTextUnit .cmn-richtext {
  display: flex;
  align-items: center;
}

@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .btn04 .g-TileLinkTextP__list .l-Text {
    font-size: 15px;
  }
}

@media only screen and (max-width: 700px) {
  .btn04 .g-TileLinkTextP__list__tile-lg-2 {
    width: 100%;
  }

  .btn04 .g-TileLinkTextP__list .l-Text {
    font-size: 15px;
  }
}

/* アコーディオン内リンクボタン（メール） */
.products-Accordion-g-HeadingTitle .l-HeadingTitle__p {
  padding-right: 2em !important;
  letter-spacing: 0.05em !important
}


/* TOP改修のための設定 */

@media only screen and (min-width: 1025px) {
  .support-top-h1 .l-PageTitle__h1 {
    font-size: 36px !important;
  }
}

@media only screen and (max-width: 640px) {
  .support-top-h1 .l-PageTitle__h1 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
}

@media only screen and (min-width: 641px) {
  .support-top-h1-margin {
    margin-top: 20px !important;
    margin-bottom: 15px !important;
  }
}

@media only screen and (max-width: 640px) {
  .support-top-h1-margin {
    margin-top: 20px !important;
    margin-bottom: 15px !important;
  }
}

.support-top-letter-spacing0 .g-HeadingTitle__h3 {
  letter-spacing: 0em !important;
}

.support-top-h4 {
  border-bottom: 1px solid #d9d9d9;
}

.support-top-h4 .corp-headingLv4-01 {
  border-bottom: 0px !important;
}

@media only screen and (min-width: 1025px) {
  .support-top-include .l-Column__cols {
    width: 80%;
  }
}

/* PDFアイコンの設定 */
.corona_pdf_irregular .is-colorset--1 .l-TextLinkUnit__link>.cmn-icon {
  color: #999;
  font-size: 35px;
}

.corona_pdf_irregular .is-leftIcon .g-TextLinkUnit__link>.cmn-richtext {
  padding-left: 3em;
}


.corona-pdficon-margin-bottom .corp-textLink {
  margin-bottom: 0px !important;
}

@media only screen and (max-width: 640px) {
  .corona-pdficon-margin-bottom .corp-textLink {
    margin-bottom: 0px !important;
  }
}

/* テキストリンクのホバー設定 */
.support-products-TextLink-hover a:hover {
  opacity: 0.7;
}


/* TOPタイトル（H1）設定 */
@media only screen and (min-width: 1025px) {
  .support-headingLv1 .cmn-richtext {
    font-size: 35px;
    letter-spacing: .05em;
  }
}

@media only screen and (max-width: 1024px) and (max-width: 640px) {
  .support-headingLv1 .l-PageTitle__h1 {
    margin-bottom: 10px !important;
  }
}

@media only screen and (min-width: 641px) and (max-width: 1024px) {
  .support-headingLv1 .l-PageTitle__h1 {
    margin-bottom: 8px;
  }
}


/* チャットボット追加（SP表示での位置調整）
---------- ---------- ---------- */
#konnect-chat-initializer-wrap {
  right: 50px !important;
}

/* 「家庭用品?化粧品に関するお問い合わせ（gopay钱包消費者相談室）」内の「お問い合わせ先」改修設定
---------- ---------- ---------- */
@media only screen and (min-width: 641px) {
  .support-products-contact-2column-margin02 {
    margin-right: 22px;
  }

  .support-products-contact-btn-min-height01 .g-HeadingTitle__titleBlock {
    min-height: 104px;
  }
}

.support-products-contact-2column-height-auto01 .g-ColumnUnit {
  height: auto !important;
}

.products-contact-link-border .g-HeadingTitle__titleBlock {
  border: none !important;
}

.products-contact-link-border {
  border: solid 1px;
  border-color: #00a481 !important;
}


/* 「家庭用品?化粧品に関するお問い合わせ（gopay钱包消費者相談室）」内の「感染対策に関するお問い合わせ」PDFアイコン位置調整
---------- ---------- ---------- */
@media only screen and (min-width: 1091px) {
  .products-pdf-margin {
    padding-top: 10px;
  }

  .products-pdf-margin .g-TextLinkUnit__link__icon {
    top: -45% !important;
    right: -10%;
  }
}

@media only screen and (min-width: 796px) and (max-width: 1024px) {
  .products-pdf-margin {
    padding-top: 10px;
  }

  .products-pdf-margin .g-TextLinkUnit__link__icon {
    top: -45% !important;
    right: -10%;
  }
}

@media only screen and (min-width: 622px) and (max-width: 640px) {
  .products-pdf-margin {
    padding-top: 10px;
  }

  .products-pdf-margin .g-TextLinkUnit__link__icon {
    top: -45% !important;
    right: -5%;
  }
}

/* テキスト横のチャットボットアイコン画像設定 */
.support-chatbot-icon {
  width: 70px;
  padding-left: 1.2em;
  margin-bottom: -22px;
}

@media only screen and (min-width: 641px) {
  .support-chatbot-icon-br {
    display: none;
  }
}

@media only screen and (max-width: 640px) {
  .support-chatbot-icon {
    padding-left: 0em;
    margin-bottom: 0px;
    padding-top: 1.2em;
  }
}


/* 電話番号表示改修作業 */
.products-g-HeadingTitle-phone-blue,
.products-g-HeadingTitle-phone-pink {
  max-height: 90px;
}

@media only screen and (max-width: 1224px) and (min-width: 1025px) {

  .products-g-HeadingTitle-phone-blue,
  .products-g-HeadingTitle-phone-pink {
    max-height: 6.8vw;
  }
}

@media only screen and (max-width: 1024px) and (min-width: 641px) {

  .products-g-HeadingTitle-phone-blue,
  .products-g-HeadingTitle-phone-pink {
    max-height: 8.4vw;
  }
}

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

  .products-g-HeadingTitle-phone-blue,
  .products-g-HeadingTitle-phone-pink {
    max-height: 12vw;
  }

  .products-accordion-phoneText-spcenter {
    text-align: center;
  }
}

.products-g-HeadingTitle-phone-blue .g-HeadingTitle__titleBlock__imageBox {
  background-color: #2ea7e0 !important;
}

.products-g-HeadingTitle-phone-pink .g-HeadingTitle__titleBlock__imageBox {
  background-color: #ec7c95;
}

.products-accordion-phoneTitle .g-HeadingTitle__titleBlock__titleBox {
  padding: 0px !important;
}

.products-accordion-phoneBorder-blue-solid {
  border: #2ea7e0 solid 1px;
  padding: 18px 0 6px 0;
}

.products-accordion-phoneBorder-blue-dotted {
  border-bottom: #2ea7e0 dotted 1px;
}

.products-accordion-phoneBorder-pink-solid {
  border: #ec7c95 solid 1px;
  padding: 18px 0 6px 0;
}

.products-accordion-phoneBorder-pink-dotted {
  border-bottom: #ec7c95 dotted 1px;
}

.products-accordion-phoneBorder-blue-dotted .g-TelephoneCall__item,
.products-accordion-phoneBorder-pink-dotted .g-TelephoneCall__item {
  padding-bottom: 14px;
}

.products-accordion-phoneNumber span {
  font-size: 19px !important;
  color: #333333 !important;
}

.products-accordion-phoneNumber .cmn-icon--phone:before {
  display: none !important;
}


@media only screen and (min-width: 641px) {
  .products-accordion-phoneBorder-blue-dotted-PC {
    border-bottom: #2ea7e0 dotted 1px;
    margin-bottom: 12px;
  }

  .products-accordion-phoneBorder-pink-dotted-PC {
    border-bottom: #ec7c95 dotted 1px;
    margin-bottom: 12px;
  }

  .products-accordion-phonedisplay-table {
    display: table;
    margin: 0 auto;
  }

  .products-accordion-phonedisplay-table .products-accordion-phonedisplay-table-cell {
    display: table-cell;
    vertical-align: middle;
  }
}

@media only screen and (max-width: 640px) {
  .products-accordion-phoneBorder-blue-dotted-SP {
    border-bottom: #2ea7e0 dotted 1px;
  }

  .products-accordion-phoneBorder-pink-dotted-SP {
    border-bottom: #ec7c95 dotted 1px;
  }

  .products-accordion-phoneText,
  .products-accordion-phoneNumber {
    padding: 0 1em;
  }
}


/* 「感染対策に関するお問い合わせ」 1カラムボタン アイコン調整 202306 */
.products-g-HeadingTitle-100pc .g-HeadingTitle__titleBlock__imageBox {
  padding: 5px 3.4px !important;
}

@media only screen and (max-width: 640px) {
  .products-g-HeadingTitle-100pc .g-HeadingTitle__titleBlock__imageBox {
    padding: 5px !important;
  }
}

/* h3「お問い合わせいただく前にご確認ください」 pr 打ち消し 202306 */
.products-h3-pr0--imp .g-HeadingTitle__h3 {
  padding-right: 0 !important;
}

/* アコーディオン内LINE調整 */
.products-AccordionUnit.support-products-background-reset .g-HeadingTitle__titleBlock__imageBox {
  background-color: #FFF !important;
  border-right: 1px solid #00a481;
}

.products-AccordionUnit.support-products-background-reset .icon--r--border .g-HeadingTitle__titleBlock__imageBox {
  border-right: none;
}

/* アコーディオン内LINE　line-height調整用 */
.line-height__harf .l-HeadingTitle__titleBlock .l-HeadingTitle__p {
  line-height: 1.0 !important;
}<!--0.00012612342834473-->