/* --------------------------
  デバイス共通スタイル
-------------------------- */

:root {
  --peac-color-base-1: #F4F4F4;
  --peac-color-base-2: #E4E4E4;
  --peac-color-base-3: #D4D4D4;
  --peac-color-base-4: #717171;
  --peac-color-base-5: #3F3F3F;
  --peac-color-base-6: #181818;
  --peac-color-primary-1: #F1F5F9;
  --peac-color-primary-2: #E2E8F0;
  --peac-color-primary-3: #CBD5E1;
  --peac-color-primary-4: #64748B;
  --peac-color-primary-5: #334155;
  --peac-color-primary-6: #0F172A;
  --peac-color-secondary-1: #DBEAFE;
  --peac-color-secondary-2: #BFDBFE;
  --peac-color-secondary-3: #93C5FD;
  --peac-color-secondary-4: #3B82F6;
  --peac-color-secondary-5: #1D4ED8;
  --peac-color-secondary-6: #1E3A8A;
  --peac-color-white: #FFFFFF;
  --peac-color-black: #000000;
}

body {
  --main-color: var(--peac-color-primary-4);
  --char-color: var(--peac-color-base-6);
  --base-back-color: var(--peac-color-base-2);
  --base-line-color: var(--peac-color-base-4);
  --base-char-color: var(--peac-color-base-6);
  --accent-color: var(--peac-color-secondary-4);
  --ms-back-color: var(--peac-color-secondary-3);
  --ms-line-color: var(--peac-color-secondary-5);
  --ms-char-color: var(--peac-color-base-6);
  --flow-back-color: var(--peac-color-secondary-5);
  --flow-char-color: var(--peac-color-primary-1);
}

/* --------------------------
  style override
-------------------------- */

/* common */
body {
  background-color: var(--peac-color-base-1);
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}
#gloval_navi {
  background-color: var(--peac-color-base-1);
}
.raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form,
.raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form select,
.raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form input[type='text'], 
.raku2_theme01 #header_wrap #header .block_outer #search_area form#search_form input[type='password'] {
  background-color: var(--peac-color-white);
}
.raku2_theme01 #header_wrap #header_benefits a {
  background-color: var(--peac-color-secondary-2);
}
.raku2_theme01 #header_wrap #header_benefits a h2 {
  color: var(--peac-color-white);
  border-radius: 8px !important;
}
.raku2_theme01 #header_wrap #header .block_outer #header_login_area #header_userarea .userarea_cart_btn .quantity {
  color: var(--peac-color-white);
}
#leftcolumn .raku2_theme01 .block_outer #category_area li.level1:nth-child(odd) {
  background-color: var(--peac-color-base-2);
}
#leftcolumn .raku2_theme01 .block_outer #category_area li.level1 p a:before {
  border-color: var(--peac-color-primary-4);
}
@supports (--css: variables) {
  #category_area li.level1 {
    border-color: var(--peac-color-primary-4);
  }
}
#leftcolumn .raku2_theme01 .block_outer #calender_area table .month {
  border: 1px solid var(--peac-color-primary-4);
  color: var(--peac-color-primary-4);
  background-color: transparent !important;
  font-weight: bold;
  border-radius: 0 !important;
}
#leftcolumn .raku2_theme01 .block_outer #calender_area .today {
  background: var(--peac-color-secondary-4);
  color: var(--peac-color-white);
}
#leftcolumn .raku2_theme01 .block_outer #calender_area .off {
  background: var(--peac-color-primary-2);
}
.raku2_theme01 #footer_wrap {
  background: var(--peac-color-primary-1);
}
.raku2_theme01 #footer_wrap #footer #info_area {
  border-radius: 0;
  border: 1px solid var(--peac-color-base-2);
}
#main_column h2.title_jp {
  color: var(--peac-color-primary-4) !important;
}
@supports (--css: variables) {
  .btn input {
    color: var(--peac-color-white);
  }
  .custom_page #faqarea h3 {
    color: var(--peac-color-white) !important;
  }
}
body div.env_message,
#close_message {
  background-color: var(--peac-color-primary-5) !important;
}
.raku2_theme01 header #header_wrapper #header_inner_right #headerInternalColumn #header_userarea .userarea_cart_btn .quantity {
  color: var(--peac-color-white) !important;
}
.raku2_theme01 #search_area form#search_form {
  background-color: var(--peac-color-white) !important;
}
#search_area input#search {
  background-color: var(--peac-color-white) !important;
}
.raku2_theme01 #search_area .submit_btn {
  background-image: url('../img/common/submit-img.png');
}
.raku2_theme01 #header_wrap #header .block_outer #search_area .submit_btn,
.raku2_theme01 #search_area .submit_btn {
  background-color: var(--peac-color-primary-4) !important;
}
.raku2_theme01 header #header_wrapper #header_inner_right #headerInternalColumn .drawer_menu .drawer_nav_wrapper .inner .nav_userarea .userarea_new_btn {
  background-color: var(--peac-color-secondary-4) !important;
}
.raku2_theme01 header #header_wrapper #header_inner_right #headerInternalColumn .drawer_menu .drawer_nav_wrapper .inner .nav_userarea .userarea_new_btn p {
  color: var(--peac-color-white) !important;
}
.raku2_theme01 header #header_wrapper #header_inner_right #headerInternalColumn .drawer_menu .drawer_nav_wrapper .outer .inner .shoppingt_btn li a,
.raku2_theme01 header #header_wrapper #header_inner_right #headerInternalColumn .drawer_menu .drawer_nav_wrapper .outer .inner .shoppingt_btn .nolink {
  background-color: var(--peac-color-base-2) !important;
}
#footer_utility #category_area li a, #main-content #mypagecolumn .sp_f_menu_mypage .mypage_btn > li > ul > li > a {
  border-bottom: 1px solid var(--peac-color-base-3) !important;
}
.raku2_theme01 header #header_wrapper #header_inner_right #headerInternalColumn .drawer_menu .drawer_nav_wrapper .outer .inner .shoppingt_btn > li > ul > li > a {
  background-color: var(--peac-color-base-1) !important;
}
.raku2_theme01 header #header_wrapper #header_inner_right #headerInternalColumn .drawer_menu .drawer_nav_wrapper .outer .inner .shoppingt_btn .accordionmenu, #main-content #mypagecolumn .sp_f_menu_mypage .mypage_btn .accordionmenu {
  background-color: var(--peac-color-base-1) !important;
}
#main-content .raku2_theme01 .benefitsarea a {
  background-color: var(--peac-color-secondary-3) !important;
}
#main-content .raku2_theme01 .benefitsarea a h2 {
  background-color: var(--peac-color-secondary-4) !important;
  color: var(--peac-color-white) !important;
  border-radius: 8px 8px 0 0 !important;
  margin: 0 0 8px 0 !important;
}
#news_area ul li {
  border-bottom: solid 1px var(--peac-color-base-3) !important;
} 
#footer_utility #category_area h2 {
  background-color: var(--peac-color-base-2) !important;
}
.raku2_theme01 footer .footer_info #info_area {
  border-radius: 0 !important;
  border: 1px solid var(--peac-color-base-2);
}
.raku2_theme01 footer .footer_info {
  background-color: var(--peac-color-primary-1) !important;
}
#footer_utility {
  background-color: var(--peac-color-white) !important;
}
.raku2_theme01 #nav_glovalarea .shoppingt_btn {
  margin-top: 16px !important;
}
input[type="submit"].btn, #reviews_area input[type="submit"].btn {
  color: var(--peac-color-white) !important;
  font-weight: bold !important;
}
#main-content #undercolumn h2.title {
  border-bottom: 3px solid var(--peac-color-primary-4) !important;
}
#main-content #undercolumn dl.form_entry dd input[type='text'], #main-content #undercolumn dl.form_entry dd input[type='password'], #main-content #undercolumn dl.form_entry dd input[type="tel"], #main-content #undercolumn dl.form_entry dd input[type="email"], #main-content #undercolumn dl.form_entry dd select {
  background-color: var(--peac-color-white) !important;
}
.custom_page h2.title_jp {
  color: var(--peac-color-primary-4) !important;
}

/* entry */
.raku2_theme01 .block_outer #exclusive_benefits_area #exclusive_benefits_contents figure img {
  background-color: var(--peac-color-white) !important;
}
#main_column #undercolumn #undercolumn_entry h2.title {
  border-bottom: 3px solid var(--peac-color-primary-4);
}
#main_column #undercolumn #undercolumn_entry .progressbar li.item {
  background-color: var(--peac-color-secondary-2) !important;
  color: var(--peac-color-secondary-4) !important;
}
#main_column #undercolumn #undercolumn_entry .progressbar li.active {
  background-color: var(--peac-color-secondary-4) !important;
  color: var(--peac-color-white) !important;
}
#main_column #undercolumn #undercolumn_entry .progressbar li:after {
  background-color: var(--peac-color-secondary-4) !important;
}

/* home */
.bx-wrapper {
  background-color: var(--peac-color-base-1);
}
#news_area dl.newslist,
#news_area dl.newslist:last-child {
  background-color: var(--peac-color-base-1);
}

/* login */
.btn_area.btn_type_def input, 
.btn_area.btn_type_def a.btn {
  color: var(--peac-color-white);
  font-weight: bold;
}

/* introduction */
#guide_area .contents_accordion button {
  background-color: transparent !important;
  border-radius: 0 !important;
  border: 1px solid var(--peac-color-base-4) !important;
}
#guide_area .contents_accordion .accordion-content__inner dl .circleNo {
  background-color: var(--peac-color-primary-3) !important;
}
#guide_area .contents_accordion .accordion-content__inner dl .circleNo span {
  color: var(--peac-color-primary-5) !important;
}
#guide_area .contents_accordion .accordion-content__inner dl dt {
  color: var(--peac-color-primary-4) !important;
}
#guide_area .contents_accordion .accordion-content__inner .info_4column div a {
  border: none !important;
}
#guide_area .contents_accordion .accordion-content__inner .info_4column div a img {
  filter: grayscale(100%);
}
#guide_area .contents_accordion .accordion-content__inner .infoWrap {
  border: 2px solid var(--peac-color-base-3) !important;
  border-radius: 0 !important;
}
#guide_area .contents_accordion .accordion-content__inner .infoWrap h3 {
  border-radius: 0 !important;
  background-color: var(--peac-color-base-3) !important;
  color: var(--peac-color-base-5) !important;
}
.heading {
  background-color: var(--peac-color-secondary-4) !important;
  color: var(--peac-color-white) !important;
}
#guide_area .contents_accordion .accordion-content__inner .infoWrap .atten_pc {
  color: var(--peac-color-secondary-4) !important;
  border: 2px solid var(--peac-color-secondary-4) !important;
}

/* detail */
#detailarea .cartin_btn a #cart,
.detailrightblock #cartbtn_default .btn_add_cart a {
  color: var(--peac-color-white) !important;
}
ul#fixed_link li a {
  color: var(--peac-color-white) !important;
}

/* mypage */
#mypagecolumn h3.title_mypage {
  color: var(--peac-color-white) !important;
}

/* order list */
.btn_area.btn_type_def li a, div[id^="raku2_close"],
.btn_sub, a.btn_sub, a.btn_sub:link, a.btn_sub:visited, a.btn_sub:hover,
a.btn, a.btn:link, a.btn:visited, a.btn:hover {
  color: var(--peac-color-white) !important;
}