<!-- start Simple Custom CSS and JS -->
<style type="text/css">
/*==============================================================

    スタイルガイドの内容を上書きしたいcssをここに記入
 
===============================================================*/

/*-----------------------------------------------
    GlobalNavi
-----------------------------------------------*/

.GlobalNaviListPosition {
    position: relative;
    height: 64px;
    background-color: #fff;
  }
  
  .GlobalNaviListBox {
    position: relative;
    width: 100%;
    background-color: #fff;
    box-shadow: 0px 6px 8px -6px #ccc;
  }
  
  /* GNavi固定用 */
  .GlobalNaviListBox--Fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
  }
  
  .GlobalNaviList {
    display: flex;
    align-items: stretch;
    width: 100%;
    max-width: 1060px;
    margin: 0 auto;
    list-style: none;
    padding: 8px 0;
  }
  
  /* GNavi 各リンク部分 */
  .GlobalNaviList__Item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% / 7);
    max-width: 353px;
    padding: 0;
    margin: 0;
    font-size: 1.5rem;
    text-align: center;
    border-left: #ccc 1px solid;
  }
  
  .GlobalNaviList__Item:last-child {
    border-right: #ccc 1px solid;
  }
  
  .GlobalNaviList__Item--Column4 {
    width: 25%;
  }
  
  .GlobalNaviList__Link {
    display: block;
    width: 100%;
    text-decoration: none;
  }
  
  .GlobalNaviList__Link:link,
  .GlobalNaviList__Link:visited {
    color: #333;
  }
  
  .GlobalNaviList__Link:hover,
  .GlobalNaviList__Link:active {
    color: #ccc;
  }
  
  /* アイコン */
  .Icon--GlobalNavi {
    display: block;
  }
  
  /* ピックアップ特価 強調 */
  .GlobalNaviList__Link--Highlight,
  .GlobalNaviList__Link--Highlight:link,
  .GlobalNaviList__Link--Highlight:visited {
    color: #d51b28;
    font-weight: bold;
  }
  
  .GlobalNaviList__CheckBadge {
    font-size: 1.0rem;
    background: #d51b28;
    border-radius: 4px;
    display: inline-block;
    color: #fff;
    padding: 2px 6px;
    line-height: 1;
  }
  
  
  /*==============================================================
    
      モノタロウブランド特設サイトCSS-PC
      
    ===============================================================*/
  
  /*-----------------------------------------------
      表示・非表示 
    -----------------------------------------------*/
  
  html .SpOnly {
    display: none;
  }
  
  html .PcOnly {
    display: block;
  }
  
  /*-----------------------------------------------
      視覚的に隠すユーティリティ
    -----------------------------------------------*/
  
  .VisuallyHidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  
  /*-----------------------------------------------
      パンくず部分調整 
    -----------------------------------------------*/
  
  .BreadCrumb--Adjustment {
    padding: 0 0 8px 8px;
  }
  
  
  /*-----------------------------------------------
      フローティングバナー
    -----------------------------------------------*/
  
  .FloatingBanner {
    position: fixed;
    bottom: 24px;
    right: 40px;
    width: 232px;
    font-weight: bold;
    text-align: center;
    background-color: #fff;
    border: #fff 8px solid;
    border-radius: 8px;
    line-height: 1;
    z-index: 10;
  }
  
  .FloatingBanner__List {
    display: inline-block;
  }
  
  
  /*-----------------------------------------------
      HeadArea(タイトル+MV) 
    -----------------------------------------------*/
  
  .HeadArea {
    width: auto;
    padding: 0;
    border-top: #d51b28 4px solid;
    border-bottom: #d51b28 4px solid;
    background: #e62222;
    display: flex;
    justify-content: center;
    align-items: flex-start;
  }
  
  /* 白背景 */
  .HeadArea__BackGround {
    display: block;
    width: 1060px;
  }
  
  
  /* タイトル *****/
  .PageTitle {
    margin: 0;
    font-size: 4.2rem;
    line-height: 1;
  }
  
  /* 画像 */
  .PageTitle__Image {
    width: 100%;
    max-width: 1060px;
    height: auto;
    display: block;
  }
  
  
  /*-----------------------------------------------
      GlobalNavi以降のBox
    -----------------------------------------------*/
  
  .Main {
    margin: 0;
    font-size: 1.3rem;
  }
  
  
  /*-----------------------------------------------
      項目別くくり
    -----------------------------------------------*/
  
  /* ContentsBox ********************/
  
  .ContentsBox {
    padding: 80px 16px 120px;
    text-align: center;
    margin: 0 auto;
  }
  
  /* Contents ********************/
  
  .Contents {
    display: block;
    width: 100%;
    max-width: 1060px;
    margin: 0 auto;
  }
  
  /*-----------------------------------------------
      公開日
    -----------------------------------------------*/
  
  .ReleaseDate {
    margin: 24px 0 0;
    text-align: right;
  }
  
  /* 共通タイトル（H2） */
  .Contents__Title {
    font-size: 3.2rem;
    font-weight: bold;
    text-align: center;
    color: #333333;
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  /* タイトル下の英語副題 */
  .Contents__UnderTitle {
    font-size: 1.7rem;
    color: #d51b28;
    font-weight: bold;
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 15px;
  }
  
  .Contents__UnderTitle::before,
  .Contents__UnderTitle::after {
    content: "";
    display: block;
    width: 60px;
    height: 1px;
    background-color: #e62222;
  }
  
  
  /*==============================================================
        1. BrandMessage (ブランドメッセージ)
    ===============================================================*/
  
  .ContentsBox--BrandMessage {
    background: #fafafa url(//cms-wp.ex-monotaro.com/app/uploads/2026/01/monotarobrand-brand-bg.png) center bottom no-repeat;
  }
  
  .BrandMessage {
    font-size: 1.9rem;
    line-height: 1.9;
  }
  
  /*==============================================================
        2. News (最新情報)
    ===============================================================*/
  
  .NewsList {
    list-style: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    gap: 24px;
  }
  
  .NewsList__Item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 800px;
    text-align: left;
  }
  
  .NewsList__ItemTime {
    font-size: 1.5rem;
    font-weight: bold;
    color: #D51B28;
    min-width: 140px;
    padding: 4px 0;
  }
  
  .NewsList__ItemText {
    font-size: 1.9rem;
    margin: 0;
    display: flex;
    align-items: baseline;
    gap: 8px;
  }
  
  .NewsList__ItemText--Next::before {
    content: "・";
  }
  
  /*==============================================================
        3. HighlyRated (口コミで好評なアイテム)
    ===============================================================*/
  
  .ContentsBox--HighlyRated {
    background-color: #fafafa;
  }
  
  .HighlyRated__Grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 40px;
  }
  
  .ProductCard {
    border: 1px solid #333;
    padding: 24px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
  }
  
  .ProductCard__Main {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    text-align: left;
  }
  
  .ProductCard__ImageWrapper {
    width: 150px;
    flex-shrink: 0;
    padding: 8px;
  }
  
  .ProductCard__ImageWrapperImage {
    width: 100%;
    height: auto;
  }
  
  .ProductCard__Title {
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.4;
    margin: 0 0 16px;
  }
  
  .ProductCard__Meta {
    margin: 0 0 8px;
  }
  
  .ProductCard__MetaText {
    font-size: 1.6rem;
    margin: 0;
  }
  
  .ProductCard__Stars {
    color: #ff9800;
    font-size: 1.2rem;
  }
  
  .ProductCard__Review {
    flex-grow: 1;
    margin-bottom: 24px;
    text-align: left;
  }
  
  .ProductCard__ReviewText {
    font-size: 1.6rem;
    line-height: 1.7;
    color: #333333;
    margin: 0;
  }
  
  .ProductCard__Action {
    display: flex;
    gap: 12px;
  }
  
  .ProductCard__Button {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 4px;
    font-size: 1.6rem;
    font-weight: bold;
    text-decoration: none;
    transition: opacity 0.2s;
  }
  
  .ProductCard__Button--Secondary {
    background-color: #fff;
    color: #333333;
    border: 1px solid #333;
    display: flex;
    gap: 8px;
  }
  
  .ProductCard__Button--Primary {
    background-color: #333333;
    color: #ffffff;
    border: 1px solid #333;
    display: flex;
    gap: 8px;
  }
  
  .ProductCard__Button--Primary:hover,
  .ProductCard__Button--Secondary:hover {
    opacity: 0.6;
  }
  
  /*==============================================================
        4. SpecialOffer (キャンペーンバナー・対象商品一覧)
    ===============================================================*/
  
  .CampaignBanner {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .CampaignBanner__Schedule {
    display: inline-flex;
    align-items: center;
    gap: 24px;
    justify-content: center;
    border-top: 3px solid #333;
    border-bottom: 3px solid #333;
    padding: 24px 0;
    margin: 24px auto;
  }
  
  .CampaignBanner__Label {
    padding: 4px 8px;
    background-color: #d51b28;
    color: #fff;
    font-size: 1.6rem;
  }
  
  .CampaignBanner__PeriodText {
    font-size: 4rem;
    font-weight: bold;
    margin: 0;
    line-height: 1.2;
  }
  
  .CampaignBanner__Lead {
    margin: 0 auto 16px;
    font-size: 1.6rem;
    font-weight: bold;
  }
  
  .CampaignBanner__LeadHighlight {
    font-size: 2rem;
  }
  
  /* キャンペーンコードパーツ */
  .CampaignLink {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    text-align: center;
  }
  
  .CampaignCode__Banner {
    background: none;
    border: none;
    font-family: inherit;
    line-height: 1.2;
    display: flex;
    width: 479px;
    padding: 0;
    border-radius: 0;
    position: relative;
    cursor: pointer;
    user-select: none;
    transition: all 0.3s;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
    color: #212529;
    margin: 0 0 16px;
    min-height: 113px;
  }
  
  .CampaignCode__Banner:before {
    position: absolute;
    top: 0;
    left: 124px;
    width: 2px;
    height: 10%;
    content: "";
    transition: all 1s;
    background: #f8f8f8;
  }
  
  .CampaignCode__Banner:focus-visible {
    outline: 3px solid #d51b28;
    outline-offset: 2px;
  }
  
  .CampaignCode__Icon {
    position: absolute;
    top: 0;
    left: calc(120px - 5px);
    width: 22px;
    height: 21px;
    transition: all 1s;
    transform: rotate(90deg) translateX(0.5rem) translateY(0);
    text-align: right;
    color: #fff;
  }
  
  .CampaignCode__LeftBox {
    width: 126px;
    padding: 16px 0;
    transition: all 0.3s;
    border-right: 2px dashed #fff;
    background: #d51b28;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px 0 0 8px;
  }
  
  .CampaignCode__RightBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
    background-color: #f8e861;
    background-image: url("//jp.images-monotaro.com/topic/sankonaire-service/img/sanko-campaign_bg04.png");
    background-size: 9px 9px;
    background-repeat: repeat;
    flex: 1;
    border-radius: 0 8px 8px 0;
    padding: 16px;
  }
  
  .CampaignCode__Explanation {
    font-size: 1.8rem;
    font-weight: bold;
    margin: 0;
  }
  
  .CampaignCode__Number {
    font-size: 1.5rem;
    display: inline-block;
    padding: 4px 8px;
    color: #333;
    border-radius: 100vh;
    background: #fff;
    box-sizing: border-box;
    margin: 8px 0 0;
    font-weight: bold;
    line-height: 1;
  }
  
  .CampaignCode__NumberClick,
  .CampaignCode__NumberHighlight {
    color: #d51b28;
    font-size: 1.8rem;
  }
  
  .CampaignCode__Usage {
    color: #333;
  }
  
  .CampaignCode__Usage:hover {
    opacity: 0.6;
  }
  
  .CampaignCode__Banner.is-Hovered:before {
    height: 100%;
  }
  
  .CampaignCode__Icon.is-Hovered {
    transform: rotate(90deg) translateX(7rem) translateY(0);
  }
  
  .CampaignCode__LeftBox.is-Hovered {
    background: #e24643;
  }
  
  .CampaignCode__RightBox.is-Hovered {
    background: #fdcabf;
  }
  
  .CampaignNotes {
    margin-top: 32px;
  }
  
  .CampaignNotes__Text {
    margin: 0;
  }
  
  .ProductSection {
    margin-top: 60px;
  }
  
  .ProductSection__Title {
    margin-bottom: 40px;
  }
  
  .ProductSection__TitleInner {
    text-align: center;
    font-weight: bold;
    font-size: 3.2rem;
    position: relative;
    padding-bottom: 16px;
    display: inline-block;
    border-bottom: 4px solid #333;
  }
  
  .ProductSection__TitleInner::before {
    content: "";
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #333;
    z-index: 1;
  }
  
  .ProductSection__TitleInner::after {
    content: "";
    position: absolute;
    bottom: -7px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #fff;
    z-index: 2;
  }
  
  .ProductGrid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 48px 16px;
  }
  
  .ProductItem {
    display: flex;
    gap: 15px;
  }
  
  .ProductItem__Thumbnail {
    width: 216px;
    height: 216px;
    position: relative;
    flex-shrink: 0;
  }
  
  .ProductItem__Image {
    width: 100%;
    height: auto;
  }
  
  .ProductItem__Badges {
    position: absolute;
    right: 0px;
    bottom: 5px;
    display: inline-flex;
    gap: 16px;
    align-items: end;
    flex-direction: column;
  }
  
  .ProductItem__BadgeDiscount {
    width: 68px;
    height: 61px;
    background-image: url('https://jp.images-monotaro.com/topic/monotarobrand/note/monotarobrand-icon01-special_offer-bg.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: 'メイリオ', Meiryo, sans-serif;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 1.1;
    box-sizing: border-box;
  }
  
  .ProductItem__BadgeRate {
    display: block;
    font-size: 1.7rem;
  }
  
  .ProductItem__BadgeOff {
    display: block;
    font-size: 1.2rem;
  }
  
  .ProductItem__Content {
    flex: 1;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
  }
  
  .ProductItem__Name {
    font-size: 2rem;
    font-weight: bold;
    line-height: 1.3;
    margin: 0 0 8px;
  }
  
  .ProductItem__Description {
    font-size: 1.5rem;
    margin: 0 0 8px;
  }
  
  .ProductItem__OrderCode {
    display: inline-flex;
    border: 1px solid #0066cc;
    justify-content: center;
    font-size: 1.5rem;
    gap: 8px;
    width: 100%;
    padding: 4px;
    margin-bottom: 8px;
  }
  
  .ProductItem__OrderCodeNumber {
    color: #0066cc;
    font-weight: bold;
  }
  
  .ProductItem__PriceArea {
    margin: 0 0 8px;
  }
  
  .ProductItem__PriceOriginal {
    font-size: 1.5rem;
    text-decoration: line-through;
    font-weight: bold;
  }
  
  .ProductItem__PriceValue {
    color: #e62222;
    font-weight: bold;
    font-size: 1.8rem;
  }
  
  .ProductItem__PriceTax {
    font-size: 1.5rem;
    color: #666;
  }
  
  .ProductItem__Standard {
    margin: 0 0 8px;
  }
  
  .ProductItem__SubmitButton {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #da1f28;
    color: #ffffff;
    text-decoration: none;
    padding: 8px;
    font-weight: bold;
    font-size: 1.4rem;
    border-radius: 4px;
    gap: 8px;
    box-shadow: 0 2px 0 #95131c;
  }
  
  .ProductItem__SubmitButton:hover {
    opacity: 0.6;
  }
  
  @media (max-width: 800px) {
    .ProductGrid {
      grid-template-columns: 1fr;
    }
  }
  
  /*==============================================================
        5. FablessProject (ファブレスプロジェクト)
    ===============================================================*/
  
  .ContentsBox--FablessProject {
    background: linear-gradient(195.73deg, #c7e3f0 5.27%, #c1f0f1 35.31%, #b8d3ea 78.32%);
  }
  
  .FablessProject__Header {
    margin-bottom: 56px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  
  .FablessProject__DecorativeTitle {
    text-align: center;
    margin-bottom: 24px;
    display: block;
    width: 100%;
  }
  
  .FablessProject__MainTitle {
    font-size: 3.2rem;
    font-weight: bold;
    text-align: center;
    position: relative;
    z-index: 1;
  }
  
  .FablessProject__SubTitleEnglish {
    font-size: 1.7rem;
    color: #338ac2;
    font-weight: bold;
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: center;
  }
  
  .FablessProject__SubTitleEnglish::before,
  .FablessProject__SubTitleEnglish::after {
    content: "";
    display: block;
    width: 60px;
    height: 1px;
    background-color: #0063aa;
  }
  
  .FablessProject__Description {
    font-size: 2.4rem;
  }
  
  .FablessProject__TitleArea {
    margin-bottom: 40px;
  }
  
  .FablessProject__SectionTitle {
    font-size: 2.8rem;
    margin: 0 0 8px;
  }
  
  .FablessProject__SectionTitleEnglish {
    color: #338ac2;
    font-weight: bold;
    font-size: 1.7rem;
    text-align: center;
    margin: 0;
  }
  
  .FablessProject__MovieGrid {
    display: flex;
    gap: 32px;
    margin-bottom: 56px;
  }
  
  .MovieCard {
    background: #fff;
    padding: 32px;
    text-align: left;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    border-radius: 8px;
    width: calc((100% - 32px)/2);
  }
  
  .MovieCard__Movie {
    width: 100%;
    height: 267px;
  }
  
  .MovieCard__Text {
    font-size: 1.9rem;
    margin: 24px 0;
  }
  
  .MovieCard__Button {
    display: flex;
    background: linear-gradient(90deg, #004e87 0%, #338ac2 37.02%, #00a7aa 100%);
    color: #fff;
    padding: 10px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.8rem;
    justify-content: center;
    align-items: center;
    gap: 8px;
  }
  
  .MovieCard__Button:hover {
    opacity: 0.6;
  }
  
  .FablessProject__ProductGrid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    width: 100%;
  }
  
  .FablessProductItem {
    width: calc(93% / 4);
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    text-decoration: none;
    color: #333;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  
  .FablessProductItem:hover {
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
    transform: translateY(-4px);
  }
  
  .FablessProductItem__Name {
    font-size: 1.7rem;
    margin: 16px auto;
    font-weight: bold;
  }
  
  .FablessProductItem__LinkText {
    font-size: 1.6rem;
    color: #0063aa;
    font-weight: bold;
  }
  
  /*==============================================================
        6. NamePrinting (名入れサービス)
    ===============================================================*/
  
  .ContentsBox--NamePrinting {
    background-color: #fff;
  }
  
  .NamePrinting__Lead {
    font-size: 2rem;
    font-weight: bold;
    margin: 0 auto 40px;
  }
  
  .NamePrinting__Grid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    width: 100%;
  }
  
  .NamePrintingItem {
    width: calc(93% / 4);
    background: #fff;
    /* 枠線分で折り返さないよう明示 */
    box-sizing: border-box;
    border: 2px solid #ddd;
    padding: 20px;
    border-radius: 8px;
    text-decoration: none;
    color: #333;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.3s ease;
    display: flex;
    flex-direction: column;
  }
  
  .NamePrintingItem:hover {
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
    border-color: #bbb;
    transform: translateY(-4px);
  }
  
  .NamePrintingItem__Category {
    font-size: 1.8rem;
    font-weight: bold;
    margin: 0 auto 4px;
  }
  
  /* NEWバッジの基準位置 */
  .NamePrintingItem__Image {
    position: relative;
    margin-bottom: 24px;
  }
  
  .NamePrintingItem__Image img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
  }
  
  .NamePrintingItem__Badge {
    position: absolute;
    top: 0;
    left: 0;
    padding: 2px 6px;
    background: #d51b28;
    border-radius: 4px;
    color: #fff;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1;
  }
  
  .NamePrintingItem__Description {
    font-size: 1.5rem;
    margin: 0 auto 16px;
  }
  
  .NamePrintingItem__LinkText {
    /* 余った高さはここに集めて、画像下の余白を24pxに固定する */
    margin-top: auto;
    font-size: 1.6rem;
    color: #333;
    font-weight: bold;
  }
  
  /*==============================================================
        7. Campaign (キャンペーンバナー一覧)
    ===============================================================*/
  
  .ContentsBox--Campaign {
    background-color: #fafafa;
  }
  
  .Campaign__BannerGrid {
    display: flex;
    gap: 16px;
    justify-content: center;
  }
  
  .Campaign__BannerItem {
    width: calc((100% - 32px) / 3);
  }
  
  .Campaign__BannerLink {
    display: block;
    transition: opacity 0.3s ease;
  }
  
  .Campaign__BannerLink:hover {
    opacity: 0.6;
  }
  
  .Campaign__BannerLinkImage {
    width: 100%;
    height: auto;
    vertical-align: bottom;
  }
  
  /*==============================================================
        8. BrandGuide (目印と返品保証)
    ===============================================================*/
  
  .ContentsBox--BrandGuide {
    padding: 60px 0;
    background-image: url(//cms-wp.ex-monotaro.com/app/uploads/2026/01/monotarobrand-bg-brand_guide.png);
    background-size: 17px 17px;
    background-color: #fff;
  }
  
  .BrandGuide__Layout {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
  }
  
  .BrandGuide__Search {
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    width: 659px;
    justify-content: center;
    align-items: center;
  }
  
  .BrandGuide__SearchTitle {
    font-size: 3.2rem;
    font-weight: bold;
    line-height: 1.4;
  }
  
  .BrandGuide__SearchTitle--Red {
    color: #e62222;
  }
  
  .BrandGuide__ExampleImage {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
    margin: 16px 0 0;
  }
  
  .BrandGuide__ExampleImageImg {
    width: 100%;
    height: auto;
    display: block;
  }
  
  .BrandGuide__Return {
    flex: 1;
  }
  
  .ReturnPolicy {
    background-color: #fff;
    border: 2px solid #4da74d;
    border-radius: 8px;
    padding: 56px 16px 24px;
    position: relative;
    text-align: center;
  }
  
  .ReturnPolicy__Badge {
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #008800;
    color: #ffffff;
    padding: 13px 30px 8px;
    border-radius: 25px;
    font-weight: bold;
    font-size: 2.4rem;
    white-space: nowrap;
    line-height: 1;
  }
  
  .ReturnPolicy__Icon {
    width: 120px;
    margin: 0 auto 20px;
  }
  
  .ReturnPolicy__IconImage {
    width: 100%;
    height: auto;
  }
  
  .ReturnPolicy__Title {
    font-size: 2.3rem;
    font-weight: bold;
    line-height: 1.4;
    margin: 0 0 16px;
  }
  
  .ReturnPolicy__Title--Green {
    color: #006700;
  }
  
  .ReturnPolicy__Description {
    font-size: 1.6rem;
    line-height: 1.6;
    margin: 0 0 16px;
  }
  
  .ReturnPolicy__Note {
    font-size: 1.3rem;
    color: #666;
  }
  
  
  /*==============================================================
        9. Categories (カテゴリ一覧)
    ===============================================================*/
  
  .ContentsBox--Categories {
    background: #fafafa;
  }
  
  .Categories {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
  }
  
  .CategoryItem {
    display: flex;
    align-items: center;
    padding: 8px;
    border: 1px solid #ddd;
    background-color: #fff;
    border-radius: 4px;
    text-decoration: none;
    color: #333;
    transition: box-shadow 0.2s;
  }
  
  .CategoryItem:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border-color: #bbb;
  }
  
  .CategoryItem__Icon {
    width: 43px;
    height: 43px;
    margin-right: 8px;
    flex-shrink: 0;
  }
  
  .CategoryItem__IconImage {
    width: 100%;
    height: auto;
  }
  
  .CategoryItem__Content {
    font-size: 1.3rem;
    line-height: 1.4;
    text-align: left;
  }
  
  .CategoryItem__Name {
    display: block;
    font-weight: bold;
  }
  
  .CategoryItem__Count {
    color: #888;
  }</style>
<!-- end Simple Custom CSS and JS -->
