@charset "UTF-8"; /* ====================================================== * index * ------------------------------------------------------ * Config * General * Base * Layout * Module ====================================================== */ /* ====================================================== * Config ====================================================== */ /* ====================================================== * basedesign * ------------------------------------------------------ * Path * View * Color * Font * Link * Animation ====================================================== */ /* ====================================================== * Path ====================================================== */ /*----- 背景画像用パス -----*/ /* ====================================================== * View ====================================================== */ /*----- ブレイクポイント -----*/ /*----- コンテンツ幅 -----*/ /*----- コンテンツ幅左右アキ -----*/ /* ====================================================== * Color ====================================================== */ /*----- テーマカラー -----*/ /*----- 背景カラー -----*/ /*----- テキストカラー -----*/ /*----- リンクテキストカラー -----*/ /*----- ボーダーカラー -----*/ /* ====================================================== * Font ====================================================== */ /*----- フォントファミリー -----*/ /*----- フォントサイズ -----*/ /*----- 行間 -----*/ /*----- フォントウェイト -----*/ /* ====================================================== * Link ====================================================== */ /*----- リンクタイプ -----*/ /*----- リンク矢印アイコン -----*/ /*----- 透過度 -----*/ /* ====================================================== * Heading Margin ====================================================== */ /* ====================================================== * Animation ====================================================== */ /*----- イージング（変化の度合い） -----*/ /*----- デュレーション（変化の開始から終了までの時間） -----*/ /*----- ディレイ（変化が始まるまでの時間） -----*/ /* ====================================================== * General ====================================================== */ /* ----- function ----- */ /* ====================================================== * function * ------------------------------------------------------ * gen-fetch-breakpoint ====================================================== */ /* ------------------------------------------------------ * gen-fetch-breakpoint ------------------------------------------------------ */ /* ----- mixin ----- */ /* ====================================================== * mixin * ------------------------------------------------------ * hover * hover-focus * plain-hover-focus * hover-focus-active * except-hover * any-link * all-link ====================================================== */ /* ------------------------------------------------------ * hover ------------------------------------------------------ */ /* ------------------------------------------------------ * hover-focus ------------------------------------------------------ */ /* ------------------------------------------------------ * plain-hover-focus ------------------------------------------------------ */ /* ------------------------------------------------------ * hover-focus-active ------------------------------------------------------ */ /* ------------------------------------------------------ * except-hover ------------------------------------------------------ */ /* ------------------------------------------------------ * any-link ------------------------------------------------------ */ /* ------------------------------------------------------ * all-link ------------------------------------------------------ */ /* ====================================================== * mixin * ------------------------------------------------------ * gen-media-breakpoint-up * gen-media-breakpoint-down * gen-media-breakpoint-between ====================================================== */ /* ------------------------------------------------------ * gen-media-breakpoint-up * @requires * - gen-fetch-breakpoint ------------------------------------------------------ */ /* ------------------------------------------------------ * gen-media-breakpoint-down * @requires * - gen-fetch-breakpoint ------------------------------------------------------ */ /* ------------------------------------------------------ * gen-media-breakpoint-between * @requires * - gen-fetch-breakpoint ------------------------------------------------------ */ /* ====================================================== * mixin * ------------------------------------------------------ * gen-child-margin-top * gen-child-margin-bottom ====================================================== */ /* ------------------------------------------------------ * gen-child-margin-top ------------------------------------------------------ */ /* ------------------------------------------------------ * gen-child-margin-bottom ------------------------------------------------------ */ /* ====================================================== * mixin * ------------------------------------------------------ * gen-modal-modaal ====================================================== */ /* ------------------------------------------------------ * gen-modal-modaal ------------------------------------------------------ */ /* ====================================================== * mixin * ------------------------------------------------------ * gen-clearfix ====================================================== */ /* ------------------------------------------------------ * gen-clearfix ------------------------------------------------------ */ /* ----- extend ----- */ /* ====================================================== * icon * ------------------------------------------------------ * gen-icon-arrow * gen-icon-arrow-tail * gen-icon-arrow-middle * gen-icon-sprite * gen-icon-sprite-tail * gen-icon-sprite-middle ====================================================== */ /* ------------------------------------------------------ * gen-icon-arrow ------------------------------------------------------ */ .main-breadcrumb > li:after, .main-lnav__link-list .main-lnav__link-list__type:after, .footer-snav__link-list .footer-snav__link-list__type:after, .heading2-v2__link .heading2-v2__title:after, .link-list > li > [class*="__type"]:before, .link-list__type:after, .link-list__type--nolink:after, .button-v2 .button-v2__type:after, .download__link-list__type:after, .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-next:before, .anchor-navi__label:after, .cmn-flow-arrow__inner:before, .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-prev:before { -webkit-backface-visibility: hidden; display: inline-block; position: relative; border-top: 1px solid #008eed; border-right: 1px solid #008eed; vertical-align: middle; content: ""; } .main-breadcrumb > li:after, .main-lnav__link-list .main-lnav__link-list__type:after, .footer-snav__link-list .footer-snav__link-list__type:after, .heading2-v2__link .heading2-v2__title:after, .link-list > li > [class*="__type"]:before, .link-list__type:after, .link-list__type--nolink:after, .button-v2 .button-v2__type:after, .download__link-list__type:after, .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-next:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); } .anchor-navi__label:after, .cmn-flow-arrow__inner:before { -webkit-transform: rotate(135deg); transform: rotate(135deg); } .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-prev:before { -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .header-megamenu__link-list .header-megamenu__link-list__type:after, .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after, .button .button__type:after { -webkit-backface-visibility: hidden; display: inline-block; position: relative; border-top: 1px solid; border-right: 1px solid; border-color: #fff; vertical-align: middle; content: ""; } .header-megamenu__link-list .header-megamenu__link-list__type:after, .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after, .button .button__type:after { -webkit-transform: rotate(45deg); transform: rotate(45deg); } /* ------------------------------------------------------ * gen-icon-arrow-tail ------------------------------------------------------ */ .header-megamenu__link-list .header-megamenu__link-list__type:after, .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after, .main-lnav__link-list .main-lnav__link-list__type:after, .heading2-v2__link .heading2-v2__title:after, .link-list__type:after, .link-list__type--nolink:after, .anchor-navi__label:after, .download__link-list__type:after { margin-left: 5px; } /* ------------------------------------------------------ * gen-icon-arrow-middle ------------------------------------------------------ */ .footer-snav__link-list .footer-snav__link-list__type:after, .button .button__type:after, .button-v2 .button-v2__type:after { position: absolute; top: 50%; } /* ------------------------------------------------------ * gen-icon-sprite ------------------------------------------------------ */ .util-link--blank:after, .main-lnav__link-list .main-lnav__link-list__type--blank:after, .link-list__type--blank:after, .button .button__type--blank:after, .button-v2 .button-v2__type--blank:after, .download__link-list__type--blank:after, .util-link--pdf:after, .link-list__type--pdf:after, .button .button__type--pdf:after, .button-v2 .button-v2__type--pdf:after, .download__link-list__type--pdf:after, .util-link--excel:after, .link-list__type--excel:after, .button .button__type--excel:after, .button-v2 .button-v2__type--excel:after, .download__link-list__type--excel:after, .util-link--word:after, .link-list__type--word:after, .button .button__type--word:after, .button-v2 .button-v2__type--word:after, .download__link-list__type--word:after, .util-link--powerpoint:after, .link-list__type--powerpoint:after, .button .button__type--powerpoint:after, .button-v2 .button-v2__type--powerpoint:after, .download__link-list__type--powerpoint:after, .util-link--zip:after, .link-list__type--zip:after, .button .button__type--zip:after, .button-v2 .button-v2__type--zip:after, .download__link-list__type--zip:after, .util-link--video:after, .link-list__type--video:after, .button .button__type--video:after, .button-v2 .button-v2__type--video:after, .download__link-list__type--video:after, .util-link--modal:after, .link-list__type--modal:after, .button .button__type--modal:after, .button-v2 .button-v2__type--modal:after, .download__link-list__type--modal:after, .util-link--rss:after, .link-list__type--rss:after, .button .button__type--rss:after, .button-v2 .button-v2__type--rss:after, .download__link-list__type--rss:after, .header-megamenu__link-list .header-megamenu__link-list__type--blank:after, .header-global .header-global__type:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after, .footer-link-list .footer-link-list__type--blank:after, .footer-link-list-v2 .footer-link-list-v2__type--blank:after, .footer-utility__link-list .footer-utility__link-list__type--blank:after, .footer-snav__link-list .footer-snav__link-list__type--blank:after, .figure a.figure__frame--modal:after { display: inline-block; position: relative; overflow: hidden; background: no-repeat center; background-size: contain; text-indent: 100%; vertical-align: middle; white-space: nowrap; content: ""; } .util-link--blank:after, .main-lnav__link-list .main-lnav__link-list__type--blank:after, .link-list__type--blank:after, .button .button__type--blank:after, .button-v2 .button-v2__type--blank:after, .download__link-list__type--blank:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#blank-usage"); } .util-link--pdf:after, .link-list__type--pdf:after, .button .button__type--pdf:after, .button-v2 .button-v2__type--pdf:after, .download__link-list__type--pdf:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#pdf-usage"); } .util-link--excel:after, .link-list__type--excel:after, .button .button__type--excel:after, .button-v2 .button-v2__type--excel:after, .download__link-list__type--excel:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#excel-usage"); } .util-link--word:after, .link-list__type--word:after, .button .button__type--word:after, .button-v2 .button-v2__type--word:after, .download__link-list__type--word:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#word-usage"); } .util-link--powerpoint:after, .link-list__type--powerpoint:after, .button .button__type--powerpoint:after, .button-v2 .button-v2__type--powerpoint:after, .download__link-list__type--powerpoint:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#powerpoint-usage"); } .util-link--zip:after, .link-list__type--zip:after, .button .button__type--zip:after, .button-v2 .button-v2__type--zip:after, .download__link-list__type--zip:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#zip-usage"); } .util-link--video:after, .link-list__type--video:after, .button .button__type--video:after, .button-v2 .button-v2__type--video:after, .download__link-list__type--video:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#video-usage"); } .util-link--modal:after, .link-list__type--modal:after, .button .button__type--modal:after, .button-v2 .button-v2__type--modal:after, .download__link-list__type--modal:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#modal-usage"); } .util-link--rss:after, .link-list__type--rss:after, .button .button__type--rss:after, .button-v2 .button-v2__type--rss:after, .download__link-list__type--rss:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#rss-usage"); } .header-megamenu__link-list .header-megamenu__link-list__type--blank:after, .header-global .header-global__type:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after, .footer-link-list .footer-link-list__type--blank:after, .footer-link-list-v2 .footer-link-list-v2__type--blank:after, .footer-utility__link-list .footer-utility__link-list__type--blank:after, .button .button__type--blank:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#blank2-usage"); } .footer-snav__link-list .footer-snav__link-list__type--blank:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#blank3-usage"); } .button .button__type--zip:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#zip2-usage"); } .button .button__type--modal:after, .figure a.figure__frame--modal:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#modal2-usage"); } /* ------------------------------------------------------ * gen-icon-sprite-tail ------------------------------------------------------ */ /* ------------------------------------------------------ * gen-icon-sprite-middle ------------------------------------------------------ */ .button .button__type--blank:after, .button .button__type--pdf:after, .button .button__type--excel:after, .button .button__type--word:after, .button .button__type--powerpoint:after, .button .button__type--zip:after, .button .button__type--video:after, .button .button__type--modal:after, .button .button__type--rss:after, .button-v2 .button-v2__type--blank:after, .button-v2 .button-v2__type--pdf:after, .button-v2 .button-v2__type--excel:after, .button-v2 .button-v2__type--word:after, .button-v2 .button-v2__type--powerpoint:after, .button-v2 .button-v2__type--zip:after, .button-v2 .button-v2__type--video:after, .button-v2 .button-v2__type--modal:after, .button-v2 .button-v2__type--rss:after { position: absolute; top: 50%; margin-top: -7px; } /* ====================================================== * table * ------------------------------------------------------ * gen-table-align ====================================================== */ /* ------------------------------------------------------ * gen-table-align ------------------------------------------------------ */ .table__cell--left-top, .table__cell--lv1--left-top, .table__cell--lv2--left-top { text-align: left !important; vertical-align: top !important; } .table__cell--left-middle, .table__cell--lv1--left-middle, .table__cell--lv2--left-middle { text-align: left !important; vertical-align: middle !important; } .table__cell--left-bottom, .table__cell--lv1--left-bottom, .table__cell--lv2--left-bottom { text-align: left !important; vertical-align: bottom !important; } .table__cell--center-top, .table__cell--lv1--center-top, .table__cell--lv2--center-top { text-align: center !important; vertical-align: top !important; } .table__cell--center-middle, .table__cell--lv1--center-middle, .table__cell--lv2--center-middle { text-align: center !important; vertical-align: middle !important; } .table__cell--center-bottom, .table__cell--lv1--center-bottom, .table__cell--lv2--center-bottom { text-align: center !important; vertical-align: bottom !important; } .table__cell--right-top, .table__cell--lv1--right-top, .table__cell--lv2--right-top { text-align: right !important; vertical-align: top !important; } .table__cell--right-middle, .table__cell--lv1--right-middle, .table__cell--lv2--right-middle { text-align: right !important; vertical-align: middle !important; } .table__cell--right-bottom, .table__cell--lv1--right-bottom, .table__cell--lv2--right-bottom { text-align: right !important; vertical-align: bottom !important; } /* ====================================================== * Base ====================================================== */ /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { /* 1 */ -webkit-text-size-adjust: 100%; line-height: 1.15; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Render the `main` element consistently in IE. */ main { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { margin: 0.67em 0; font-size: 2em; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { /* 2 */ -webkit-text-decoration: underline dotted; border-bottom: none; /* 1 */ text-decoration: underline; text-decoration: underline dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { /* 1 */ margin: 0; font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { padding: 0; border-style: none; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 1 */ color: inherit; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } /* ====================================================== * base * ------------------------------------------------------ * Fonts * Basic ====================================================== */ /* ====================================================== * Fonts ====================================================== */ /* ====================================================== * Basic ====================================================== */ html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; height: -webkit-fill-available; font-size: 62.5%; } body { word-wrap: break-word; min-height: 100vh; min-height: -webkit-fill-available; background-color: #fff; color: #303038; word-break: break-word; } body *, body *:before, body *:after { box-sizing: border-box; } /* ----- img ----- */ figure { margin: 0; } img { -webkit-backface-visibility: hidden; min-width: 1px; max-width: 100%; height: auto; backface-visibility: hidden; vertical-align: top; } [data-browser="chrome"] img { image-rendering: -webkit-optimize-contrast; } /* ----- a ----- */ a { transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } a:link { color: #008eed; text-decoration: none; } a:visited { color: #008eed; text-decoration: none; } a:hover { color: #008eed; text-decoration: none; } a:active { color: #008eed; text-decoration: none; } /* tel */ /* ----- form ----- */ input, select, textarea, button, pre { border-radius: 0; box-shadow: none; color: #303038; } input[type="text"], textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="submit"], button:not([disabled]) { cursor: pointer; } /* placeholder */ ::-webkit-input-placeholder { color: #999 !important; } :-moz-placeholder { color: #999 !important; } ::-moz-placeholder { color: #999 !important; opacity: 1; } :-ms-input-placeholder { color: #999 !important; } :placeholder-shown { color: #999 !important; } /* ----- aria-expanded ----- */ [aria-hidden="true"]:not(.header-megamenu) { display: none; } /* ====================================================== * util * ------------------------------------------------------ * Device * Text * Link ====================================================== */ /* ====================================================== * Device ====================================================== */ /* ====================================================== * Text ====================================================== */ /* ----- sup/sub ----- */ .util-sup, .util-sub { position: relative; font-size: 60%; line-height: 1; } .util-sup { top: -.6em; } .util-sub { bottom: -.1em; } /* ----- bold ----- */ /* ----- italic ----- */ .util-italic { font-style: italic !important; } /* ----- underline ----- */ .util-underline { text-decoration: underline !important; } /* ----- small ----- */ .util-small { font-size: .75em; } /* ----- color ----- */ .util-color--main { color: #004f8d !important; } .util-color--sub { color: #008eed !important; } .util-color--sub2 { color: #f7f7f8 !important; } .util-color--sub3 { color: #303038 !important; } .util-color--sub4 { color: #ad8e00 !important; } .util-color--sub5 { color: #f2faff !important; } .util-color--sub6 { color: #eaeaeb !important; } .util-color--sub7 { color: #c1c1c1 !important; } .util-color--accent { color: #005866 !important; } .util-color--accent2 { color: #cc0000 !important; } .util-color--base { color: #303038 !important; } .util-color--disable { color: #999 !important; } .util-color--disable2 { color: #7c7c85 !important; } .util-color--placeholder { color: #999 !important; } .util-color--bright { color: #fff !important; } .util-color--red { color: #cc0000 !important; } /* ----- highlight ----- */ .util-highlight--main { color: #cc0000 !important; } /* ----- text-align ----- */ .util-align-left { text-align: left !important; } .util-align-center { text-align: center !important; } .util-align-right { text-align: right !important; } /* ====================================================== * content ====================================================== */ /* ----- width ----- */ .util-width-auto { width: auto !important; } .util-width-0 { width: 0%!important; } .util-width-1 { width: 1%!important; } .util-width-2 { width: 2%!important; } .util-width-3 { width: 3%!important; } .util-width-4 { width: 4%!important; } .util-width-5 { width: 5%!important; } .util-width-6 { width: 6%!important; } .util-width-7 { width: 7%!important; } .util-width-8 { width: 8%!important; } .util-width-9 { width: 9%!important; } .util-width-10 { width: 10%!important; } .util-width-11 { width: 11%!important; } .util-width-12 { width: 12%!important; } .util-width-13 { width: 13%!important; } .util-width-14 { width: 14%!important; } .util-width-15 { width: 15%!important; } .util-width-16 { width: 16%!important; } .util-width-17 { width: 17%!important; } .util-width-18 { width: 18%!important; } .util-width-19 { width: 19%!important; } .util-width-20 { width: 20%!important; } .util-width-21 { width: 21%!important; } .util-width-22 { width: 22%!important; } .util-width-23 { width: 23%!important; } .util-width-24 { width: 24%!important; } .util-width-25 { width: 25%!important; } .util-width-26 { width: 26%!important; } .util-width-27 { width: 27%!important; } .util-width-28 { width: 28%!important; } .util-width-29 { width: 29%!important; } .util-width-30 { width: 30%!important; } .util-width-31 { width: 31%!important; } .util-width-32 { width: 32%!important; } .util-width-33 { width: 33%!important; } .util-width-34 { width: 34%!important; } .util-width-35 { width: 35%!important; } .util-width-36 { width: 36%!important; } .util-width-37 { width: 37%!important; } .util-width-38 { width: 38%!important; } .util-width-39 { width: 39%!important; } .util-width-40 { width: 40%!important; } .util-width-41 { width: 41%!important; } .util-width-42 { width: 42%!important; } .util-width-43 { width: 43%!important; } .util-width-44 { width: 44%!important; } .util-width-45 { width: 45%!important; } .util-width-46 { width: 46%!important; } .util-width-47 { width: 47%!important; } .util-width-48 { width: 48%!important; } .util-width-49 { width: 49%!important; } .util-width-50 { width: 50%!important; } .util-width-51 { width: 51%!important; } .util-width-52 { width: 52%!important; } .util-width-53 { width: 53%!important; } .util-width-54 { width: 54%!important; } .util-width-55 { width: 55%!important; } .util-width-56 { width: 56%!important; } .util-width-57 { width: 57%!important; } .util-width-58 { width: 58%!important; } .util-width-59 { width: 59%!important; } .util-width-60 { width: 60%!important; } .util-width-61 { width: 61%!important; } .util-width-62 { width: 62%!important; } .util-width-63 { width: 63%!important; } .util-width-64 { width: 64%!important; } .util-width-65 { width: 65%!important; } .util-width-66 { width: 66%!important; } .util-width-67 { width: 67%!important; } .util-width-68 { width: 68%!important; } .util-width-69 { width: 69%!important; } .util-width-70 { width: 70%!important; } .util-width-71 { width: 71%!important; } .util-width-72 { width: 72%!important; } .util-width-73 { width: 73%!important; } .util-width-74 { width: 74%!important; } .util-width-75 { width: 75%!important; } .util-width-76 { width: 76%!important; } .util-width-77 { width: 77%!important; } .util-width-78 { width: 78%!important; } .util-width-79 { width: 79%!important; } .util-width-80 { width: 80%!important; } .util-width-81 { width: 81%!important; } .util-width-82 { width: 82%!important; } .util-width-83 { width: 83%!important; } .util-width-84 { width: 84%!important; } .util-width-85 { width: 85%!important; } .util-width-86 { width: 86%!important; } .util-width-87 { width: 87%!important; } .util-width-88 { width: 88%!important; } .util-width-89 { width: 89%!important; } .util-width-90 { width: 90%!important; } .util-width-91 { width: 91%!important; } .util-width-92 { width: 92%!important; } .util-width-93 { width: 93%!important; } .util-width-94 { width: 94%!important; } .util-width-95 { width: 95%!important; } .util-width-96 { width: 96%!important; } .util-width-97 { width: 97%!important; } .util-width-98 { width: 98%!important; } .util-width-99 { width: 99%!important; } .util-width-100 { width: 100%!important; } /* ----- height ----- */ .util-height-auto { height: auto !important; } .util-height-0 { height: 0%!important; } .util-height-1 { height: 1%!important; } .util-height-2 { height: 2%!important; } .util-height-3 { height: 3%!important; } .util-height-4 { height: 4%!important; } .util-height-5 { height: 5%!important; } .util-height-6 { height: 6%!important; } .util-height-7 { height: 7%!important; } .util-height-8 { height: 8%!important; } .util-height-9 { height: 9%!important; } .util-height-10 { height: 10%!important; } .util-height-11 { height: 11%!important; } .util-height-12 { height: 12%!important; } .util-height-13 { height: 13%!important; } .util-height-14 { height: 14%!important; } .util-height-15 { height: 15%!important; } .util-height-16 { height: 16%!important; } .util-height-17 { height: 17%!important; } .util-height-18 { height: 18%!important; } .util-height-19 { height: 19%!important; } .util-height-20 { height: 20%!important; } .util-height-21 { height: 21%!important; } .util-height-22 { height: 22%!important; } .util-height-23 { height: 23%!important; } .util-height-24 { height: 24%!important; } .util-height-25 { height: 25%!important; } .util-height-26 { height: 26%!important; } .util-height-27 { height: 27%!important; } .util-height-28 { height: 28%!important; } .util-height-29 { height: 29%!important; } .util-height-30 { height: 30%!important; } .util-height-31 { height: 31%!important; } .util-height-32 { height: 32%!important; } .util-height-33 { height: 33%!important; } .util-height-34 { height: 34%!important; } .util-height-35 { height: 35%!important; } .util-height-36 { height: 36%!important; } .util-height-37 { height: 37%!important; } .util-height-38 { height: 38%!important; } .util-height-39 { height: 39%!important; } .util-height-40 { height: 40%!important; } .util-height-41 { height: 41%!important; } .util-height-42 { height: 42%!important; } .util-height-43 { height: 43%!important; } .util-height-44 { height: 44%!important; } .util-height-45 { height: 45%!important; } .util-height-46 { height: 46%!important; } .util-height-47 { height: 47%!important; } .util-height-48 { height: 48%!important; } .util-height-49 { height: 49%!important; } .util-height-50 { height: 50%!important; } .util-height-51 { height: 51%!important; } .util-height-52 { height: 52%!important; } .util-height-53 { height: 53%!important; } .util-height-54 { height: 54%!important; } .util-height-55 { height: 55%!important; } .util-height-56 { height: 56%!important; } .util-height-57 { height: 57%!important; } .util-height-58 { height: 58%!important; } .util-height-59 { height: 59%!important; } .util-height-60 { height: 60%!important; } .util-height-61 { height: 61%!important; } .util-height-62 { height: 62%!important; } .util-height-63 { height: 63%!important; } .util-height-64 { height: 64%!important; } .util-height-65 { height: 65%!important; } .util-height-66 { height: 66%!important; } .util-height-67 { height: 67%!important; } .util-height-68 { height: 68%!important; } .util-height-69 { height: 69%!important; } .util-height-70 { height: 70%!important; } .util-height-71 { height: 71%!important; } .util-height-72 { height: 72%!important; } .util-height-73 { height: 73%!important; } .util-height-74 { height: 74%!important; } .util-height-75 { height: 75%!important; } .util-height-76 { height: 76%!important; } .util-height-77 { height: 77%!important; } .util-height-78 { height: 78%!important; } .util-height-79 { height: 79%!important; } .util-height-80 { height: 80%!important; } .util-height-81 { height: 81%!important; } .util-height-82 { height: 82%!important; } .util-height-83 { height: 83%!important; } .util-height-84 { height: 84%!important; } .util-height-85 { height: 85%!important; } .util-height-86 { height: 86%!important; } .util-height-87 { height: 87%!important; } .util-height-88 { height: 88%!important; } .util-height-89 { height: 89%!important; } .util-height-90 { height: 90%!important; } .util-height-91 { height: 91%!important; } .util-height-92 { height: 92%!important; } .util-height-93 { height: 93%!important; } .util-height-94 { height: 94%!important; } .util-height-95 { height: 95%!important; } .util-height-96 { height: 96%!important; } .util-height-97 { height: 97%!important; } .util-height-98 { height: 98%!important; } .util-height-99 { height: 99%!important; } .util-height-100 { height: 100%!important; } /* ====================================================== * margin ====================================================== */ /* ----- margin-top ----- */ .util-margin-top-auto { margin-top: auto !important; } .util-margin-top-0 { margin-top: 0em !important; } .util-margin-top-1 { margin-top: 1em !important; } .util-margin-top-2 { margin-top: 2em !important; } .util-margin-top-3 { margin-top: 3em !important; } .util-margin-top-4 { margin-top: 4em !important; } .util-margin-top-5 { margin-top: 5em !important; } .util-margin-top-6 { margin-top: 6em !important; } .util-margin-top-7 { margin-top: 7em !important; } .util-margin-top-8 { margin-top: 8em !important; } .util-margin-top-9 { margin-top: 9em !important; } .util-margin-top-10 { margin-top: 10em !important; } /* ----- margin-right ----- */ .util-margin-right-auto { margin-right: auto !important; } .util-margin-right-0 { margin-right: 0em !important; } .util-margin-right-1 { margin-right: 1em !important; } .util-margin-right-2 { margin-right: 2em !important; } .util-margin-right-3 { margin-right: 3em !important; } .util-margin-right-4 { margin-right: 4em !important; } .util-margin-right-5 { margin-right: 5em !important; } .util-margin-right-6 { margin-right: 6em !important; } .util-margin-right-7 { margin-right: 7em !important; } .util-margin-right-8 { margin-right: 8em !important; } .util-margin-right-9 { margin-right: 9em !important; } .util-margin-right-10 { margin-right: 10em !important; } /* ----- margin-bottom ----- */ .util-margin-bottom-auto { margin-bottom: auto !important; } .util-margin-bottom-0 { margin-bottom: 0em !important; } .util-margin-bottom-1 { margin-bottom: 1em !important; } .util-margin-bottom-2 { margin-bottom: 2em !important; } .util-margin-bottom-3 { margin-bottom: 3em !important; } .util-margin-bottom-4 { margin-bottom: 4em !important; } .util-margin-bottom-5 { margin-bottom: 5em !important; } .util-margin-bottom-6 { margin-bottom: 6em !important; } .util-margin-bottom-7 { margin-bottom: 7em !important; } .util-margin-bottom-8 { margin-bottom: 8em !important; } .util-margin-bottom-9 { margin-bottom: 9em !important; } .util-margin-bottom-10 { margin-bottom: 10em !important; } /* ----- margin-left ----- */ .util-margin-left-auto { margin-left: auto !important; } .util-margin-left-0 { margin-left: 0em !important; } .util-margin-left-1 { margin-left: 1em !important; } .util-margin-left-2 { margin-left: 2em !important; } .util-margin-left-3 { margin-left: 3em !important; } .util-margin-left-4 { margin-left: 4em !important; } .util-margin-left-5 { margin-left: 5em !important; } .util-margin-left-6 { margin-left: 6em !important; } .util-margin-left-7 { margin-left: 7em !important; } .util-margin-left-8 { margin-left: 8em !important; } .util-margin-left-9 { margin-left: 9em !important; } .util-margin-left-10 { margin-left: 10em !important; } /* ====================================================== * padding ====================================================== */ /* ----- padding-top ----- */ .util-padding-top-0 { padding-top: 0em !important; } .util-padding-top-1 { padding-top: 1em !important; } .util-padding-top-2 { padding-top: 2em !important; } .util-padding-top-3 { padding-top: 3em !important; } .util-padding-top-4 { padding-top: 4em !important; } .util-padding-top-5 { padding-top: 5em !important; } .util-padding-top-6 { padding-top: 6em !important; } .util-padding-top-7 { padding-top: 7em !important; } .util-padding-top-8 { padding-top: 8em !important; } .util-padding-top-9 { padding-top: 9em !important; } .util-padding-top-10 { padding-top: 10em !important; } /* ----- padding-right ----- */ .util-padding-right-0 { padding-right: 0em !important; } .util-padding-right-1 { padding-right: 1em !important; } .util-padding-right-2 { padding-right: 2em !important; } .util-padding-right-3 { padding-right: 3em !important; } .util-padding-right-4 { padding-right: 4em !important; } .util-padding-right-5 { padding-right: 5em !important; } .util-padding-right-6 { padding-right: 6em !important; } .util-padding-right-7 { padding-right: 7em !important; } .util-padding-right-8 { padding-right: 8em !important; } .util-padding-right-9 { padding-right: 9em !important; } .util-padding-right-10 { padding-right: 10em !important; } /* ----- padding-bottom ----- */ .util-padding-bottom-0 { padding-bottom: 0em !important; } .util-padding-bottom-1 { padding-bottom: 1em !important; } .util-padding-bottom-2 { padding-bottom: 2em !important; } .util-padding-bottom-3 { padding-bottom: 3em !important; } .util-padding-bottom-4 { padding-bottom: 4em !important; } .util-padding-bottom-5 { padding-bottom: 5em !important; } .util-padding-bottom-6 { padding-bottom: 6em !important; } .util-padding-bottom-7 { padding-bottom: 7em !important; } .util-padding-bottom-8 { padding-bottom: 8em !important; } .util-padding-bottom-9 { padding-bottom: 9em !important; } .util-padding-bottom-10 { padding-bottom: 10em !important; } /* ----- padding-left ----- */ .util-padding-left-0 { padding-left: 0em !important; } .util-padding-left-1 { padding-left: 1em !important; } .util-padding-left-2 { padding-left: 2em !important; } .util-padding-left-3 { padding-left: 3em !important; } .util-padding-left-4 { padding-left: 4em !important; } .util-padding-left-5 { padding-left: 5em !important; } .util-padding-left-6 { padding-left: 6em !important; } .util-padding-left-7 { padding-left: 7em !important; } .util-padding-left-8 { padding-left: 8em !important; } .util-padding-left-9 { padding-left: 9em !important; } .util-padding-left-10 { padding-left: 10em !important; } /* ====================================================== * Link ====================================================== */ /* ----- link ----- */ .util-link:link, .util-link--blank:link, .util-link--pdf:link, .util-link--excel:link, .util-link--word:link, .util-link--powerpoint:link, .util-link--zip:link, .util-link--video:link, .util-link--modal:link, .util-link--rss:link { display: inline; text-decoration: underline; } .util-link__filesize { font-style: normal; } .util-link--blank:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--pdf:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--excel:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--word:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--powerpoint:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--zip:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--video:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--modal:after { position: relative; top: -2px; margin: 0 .5em; } .util-link--rss:after { position: relative; top: -2px; margin: 0 .5em; } /* ====================================================== * data-col * ------------------------------------------------------ * data-col-pc * data-col-sp ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * data-col-pc ====================================================== */ /* ====================================================== * data-col-sp ====================================================== */ /* ====================================================== * data-size * ------------------------------------------------------ * data-size-pc * data-size-sp ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * data-size-pc ====================================================== */ /* ====================================================== * data-size-sp ====================================================== */ /* ====================================================== * Layout ====================================================== */ /* ====================================================== * Header * ------------------------------------------------------ * vars * Header__guide * Header__head * Header__body * Header__foot * Print ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * Header ====================================================== */ .Header { z-index: 1000; width: 100%; background: linear-gradient(to right, #008eed 0%, #0055b0 100%); } .Header:not([data-header-layout="simple"]) { position: fixed; top: 0; left: 0; transition: box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s, top 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .Header[data-header-layout="simple"] { position: relative; } .Header > *:first-child, .Header > section:first-child > *:first-child, .Header > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .Header__inner { display: flex; position: relative; flex-flow: row nowrap; } .Header__inner > *:first-child, .Header__inner > section:first-child > *:first-child, .Header__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .Header .Header__inner { max-width: calc(1200px + 30px * 2); margin: 0 auto; } body.is-header-fixed .Header { box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); } body.is-scroll-down .Header:not([data-header-layout="simple"]) { box-shadow: none; } /* ------------------------------------------------------ * Header__guide ------------------------------------------------------ */ .Header__guide > *:first-child, .Header__guide > section:first-child > *:first-child, .Header__guide > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ------------------------------------------------------ * Header__head ------------------------------------------------------ */ .Header__head > *:first-child, .Header__head > section:first-child > *:first-child, .Header__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .header-logo { margin: 0; } .header-logo > a { display: flex; align-items: center; } .header-logo__image { flex-shrink: 0; line-height: 1; } .header-logo__tagline { flex-shrink: 0; color: #fff; } /* ------------------------------------------------------ * Header__body ------------------------------------------------------ */ .Header__body > *:first-child, .Header__body > section:first-child > *:first-child, .Header__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .Header__body__inner > *:first-child, .Header__body__inner > section:first-child > *:first-child, .Header__body__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .header-gnav__list { margin: 0; padding: 0; list-style: none; } .header-gnav .header-gnav__type--toggle { display: block; z-index: 1; position: relative; color: #fff; line-height: 1.4; } .header-megamenu__link-list { margin: 0; padding: 0; list-style: none; } .header-search__form { position: relative; } .header-search__input { width: 100%; border-radius: 9999px; background-color: #0549a4; color: #fff; } .header-search__submit { position: absolute; top: 0; right: 0; padding: 0; overflow: hidden; border: none; background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#search-usage") no-repeat center; background-size: 16px 16px; text-indent: -9999px; } /* ------------------------------------------------------ * Header__foot ------------------------------------------------------ */ .Header__foot > *:first-child, .Header__foot > section:first-child > *:first-child, .Header__foot > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ====================================================== * Main * ------------------------------------------------------ * Main__guide * Main__head * Main__body * Main__foot * Print ====================================================== */ /* ====================================================== * Main ====================================================== */ .Main { z-index: 0; overflow: hidden; } /* ------------------------------------------------------ * Main__guide ------------------------------------------------------ */ .Main__guide { display: block; width: 100%; border-bottom: 1px solid #d9dce4; background: #fff; } .main-breadcrumb { display: flex; flex-flow: row wrap; width: 100%; margin: 0 auto; list-style: none; } .main-breadcrumb > li { display: inline-block; position: relative; } .main-breadcrumb > li:after { position: absolute; top: .5em; width: 8px; height: 8px; content: ""; } .main-breadcrumb > li:last-of-type { margin-right: 0; padding-right: 0; } .main-breadcrumb > li:last-of-type:after { display: none; } .main-breadcrumb__type--nolink { color: #666; } /* ------------------------------------------------------ * Main__head ------------------------------------------------------ */ .Main__head > *:first-child, .Main__head > section:first-child > *:first-child, .Main__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ------------------------------------------------------ * Main__body ------------------------------------------------------ */ .Main__content { margin: 0 auto; } .Main__content > *:first-child, .Main__content > section:first-child > *:first-child, .Main__content > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ------------------------------------------------------ * Main__assist ------------------------------------------------------ */ /* ------------------------------------------------------ * Main__foot ------------------------------------------------------ */ .main-lnav__title { line-height: 1.4; text-align: center; } .main-lnav__card .main-lnav__card__type { display: block; position: relative; color: #fff; } .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after { text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); } .main-lnav__card__head { position: relative; } .main-lnav__card__head:before { display: inline-block; z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(28, 28, 28, 0.5); content: ""; } .main-lnav__card__body { -webkit-transform: translateY(-50%); z-index: 1; position: absolute; top: 50%; left: 0; width: 100%; transform: translateY(-50%); } .main-lnav__card__image { z-index: 0; position: relative; } .main-lnav__card__title { text-align: center; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); } .main-lnav__card__description { text-align: center; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); } .main-lnav__card-v2 { position: relative; } .main-lnav__card-v2__head { position: relative; } .main-lnav__card-v2__head:before { display: inline-block; z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(28, 28, 28, 0.5); content: ""; } .main-lnav__card-v2__body { -webkit-transform: translateY(-50%); z-index: 1; position: absolute; top: 50%; left: 0; width: 100%; transform: translateY(-50%); } .main-lnav__card-v2__image { z-index: 0; position: relative; } .main-lnav__card-v2__title { color: #fff; text-align: center; } .main-lnav__card-v2__list-wrap { display: flex; justify-content: center; margin-top: 1em; } .main-lnav__card-v2__link-list { margin: 0; padding: 0; list-style: none; } .main-lnav__card-v2__link-list > li { text-align: center; } .main-lnav__card-v2__link-list > li:first-child { margin-top: 0; } .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type { color: #fff; } .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank { color: #fff; } .main-lnav__list-wrap { display: flex; justify-content: center; } .main-lnav__list-wrap > *:first-child, .main-lnav__list-wrap > section:first-child > *:first-child, .main-lnav__list-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .main-lnav__link-list { margin: 0; padding: 0; list-style: none; } .main-lnav__link-list > li { text-align: center; } .main-lnav__link-list > li:first-child { margin-top: 0; } /* ====================================================== * overlay ====================================================== */ .main-overlay { display: none; z-index: 998; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; } /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ====================================================== * Footer * ------------------------------------------------------ * Footer__guide * Footer__head * Footer__body * Footer__foot * Print ====================================================== */ /* ====================================================== * Footer ====================================================== */ .Footer { background-color: #000; } .Footer > *:first-child, .Footer > section:first-child > *:first-child, .Footer > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .Footer__inner > *:first-child, .Footer__inner > section:first-child > *:first-child, .Footer__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ------------------------------------------------------ * Footer__guide ------------------------------------------------------ */ .Footer__guide > *:first-child, .Footer__guide > section:first-child > *:first-child, .Footer__guide > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ------------------------------------------------------ * Footer__head ------------------------------------------------------ */ .Footer__head { background-color: #f6f7fb; } .Footer__head > *:first-child, .Footer__head > section:first-child > *:first-child, .Footer__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .Footer__head__inner > *:first-child, .Footer__head__inner > section:first-child > *:first-child, .Footer__head__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .footer-snav__item > *:first-child, .footer-snav__item > section:first-child > *:first-child, .footer-snav__item > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .footer-snav__item .footer-snav__item__head { color: #303038; } .footer-snav__item__body > *:first-child, .footer-snav__item__body > section:first-child > *:first-child, .footer-snav__item__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .footer-snav__link-list { padding: 0; list-style: none; } .footer-snav__link-list .footer-snav__link-list__type, .footer-snav__link-list .footer-snav__link-list__type--blank { color: #303038; } .footer-snav__link-list__external-text { margin: 0; color: #7c7c85; } /* ------------------------------------------------------ * Footer__body ------------------------------------------------------ */ .footer-logo__image { line-height: 1; } .footer-link-list { display: flex; flex-flow: row wrap; margin: 0 0 -.5em; padding: 0; list-style: none; } .footer-link-list > li { margin-bottom: 0.5em; } .footer-link-list > li:last-child { margin-right: 0; } .footer-link-list .footer-link-list__type, .footer-link-list .footer-link-list__type--blank { color: #fff; } .footer-link-list-v2 { display: flex; flex-flow: row wrap; margin: 0 0 -.5em; padding: 0; list-style: none; } .footer-link-list-v2 > li { margin-bottom: 0.5em; } .footer-link-list-v2 > li:last-child { margin-right: 0; } .footer-link-list-v2 .footer-link-list-v2__type, .footer-link-list-v2 .footer-link-list-v2__type--blank { color: #fff; font-size: 1.2rem; } .footer-sns__list { display: flex; flex-flow: row wrap; margin: 0; padding: 0; list-style: none; } .footer-sns__list > li { flex-shrink: 0; } .footer-sns__list > li:first-child { margin-left: 0; } /* ------------------------------------------------------ * Footer__foot ------------------------------------------------------ */ .Footer__foot > *:first-child, .Footer__foot > section:first-child > *:first-child, .Footer__foot > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .Footer__foot__inner { display: flex; flex-flow: row nowrap; } .Footer__foot__inner > *:first-child, .Footer__foot__inner > section:first-child > *:first-child, .Footer__foot__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .footer-utility__link-list { margin: 0; padding: 0; list-style: none; } .Footer:not([data-footer-layout="simple"]) .footer-utility__link-list { display: flex; flex-flow: row wrap; } .footer-utility__link-list .footer-utility__link-list__type, .footer-utility__link-list .footer-utility__link-list__type--blank { color: #fff; font-size: 1.2rem; } .Footer:not([data-footer-layout="simple"]) .footer-copyright { line-height: 1; } .footer-copyright__label { color: #999; } /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ====================================================== * Assist * ------------------------------------------------------ * Assist__body * Print ====================================================== */ /* ====================================================== * Assist ====================================================== */ /* ------------------------------------------------------ * Assist__body ------------------------------------------------------ */ /* ----- assist-banner ----- */ .assist-banner { display: none; z-index: 998; position: fixed; } .assist-banner__type { display: block; width: 100%; height: 100%; background-color: #fff; } .assist-banner__close { position: absolute; padding: 0; overflow: hidden; border: none; border-radius: 50%; background-color: #008eed; text-indent: -9999px; } .assist-banner__close:before, .assist-banner__close:after { position: absolute; top: 50%; left: 50%; height: 1px; margin-top: -1px; background-color: #fff; content: ""; } .assist-banner__close:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); } .assist-banner__close:after { -webkit-transform: rotate(135deg); transform: rotate(135deg); } /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ====================================================== * Module ====================================================== */ /* ----- Heading ----- */ /* heading1 */ /* ====================================================== * H1-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * H1-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * heading1-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * heading1-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .heading1 { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .heading1--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .heading1__inner > *:first-child, .heading1__inner > section:first-child > *:first-child, .heading1__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .heading1__inner > *:last-child { margin-bottom: 0 !important; } .heading1__title { margin: 0; text-align: center; } .heading1__title > sup { font-size: 100%; } .heading1__subtitle { text-align: center; } /* heading2 */ /* ====================================================== * H2-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * H2-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * heading2-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * heading2-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .heading2 { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .heading2__filesize { font-style: normal; } .heading2--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .heading2--center__filesize { font-style: normal; } .heading2__inner { position: relative; padding-bottom: .7em; text-align: center; } .heading2__inner > *:first-child, .heading2__inner > section:first-child > *:first-child, .heading2__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .heading2__inner > *:last-child { margin-bottom: 0 !important; } .heading2__inner:before { -webkit-transform: translateX(-50%); position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); background-color: #008eed; content: ""; } .heading2__link { display: inline-block; color: #303038 !important; } .heading2__link--blank { display: inline-block; color: #303038 !important; } .heading2__link--pdf { display: inline-block; color: #303038 !important; } .heading2__link--excel { display: inline-block; color: #303038 !important; } .heading2__link--word { display: inline-block; color: #303038 !important; } .heading2__link--powerpoint { display: inline-block; color: #303038 !important; } .heading2__link--zip { display: inline-block; color: #303038 !important; } .heading2__link--video { display: inline-block; color: #303038 !important; } .heading2__link--modal { display: inline-block; color: #303038 !important; } .heading2__link--rss { display: inline-block; color: #303038 !important; } .heading2__title { margin: 0; line-height: 1.6; text-align: center; } .heading2__title > sup { font-size: 100%; } .heading2__subtitle { color: #004f8d; text-align: center; } .heading2__filesize { margin-left: .5em; vertical-align: top; } /* ====================================================== * H2-2 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * H2-2 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * heading2-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * heading2-0002 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .heading2-v2 { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .heading2-v2__filesize { font-style: normal; } .heading2-v2--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .heading2-v2--center__filesize { font-style: normal; } .heading2-v2__inner { position: relative; padding-bottom: .7em; text-align: center; } .heading2-v2__inner > *:first-child, .heading2-v2__inner > section:first-child > *:first-child, .heading2-v2__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .heading2-v2__inner > *:last-child { margin-bottom: 0 !important; } .heading2-v2__link { display: inline-block; color: #303038 !important; } .heading2-v2__link--blank { display: inline-block; color: #303038 !important; } .heading2-v2__link--pdf { display: inline-block; color: #303038 !important; } .heading2-v2__link--excel { display: inline-block; color: #303038 !important; } .heading2-v2__link--word { display: inline-block; color: #303038 !important; } .heading2-v2__link--powerpoint { display: inline-block; color: #303038 !important; } .heading2-v2__link--zip { display: inline-block; color: #303038 !important; } .heading2-v2__link--video { display: inline-block; color: #303038 !important; } .heading2-v2__link--modal { display: inline-block; color: #303038 !important; } .heading2-v2__link--rss { display: inline-block; color: #303038 !important; } .heading2-v2__title { margin: 0; line-height: 1.6; text-align: center; } .heading2-v2__title > sup { font-size: 100%; } .heading2-v2__subtitle { color: #004f8d; text-align: center; } .heading2-v2__filesize { margin-left: .5em; vertical-align: top; } /* heading3 */ /* ====================================================== * H3-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * H3-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * heading3-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * heading3-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .heading3 { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .heading3__filesize { font-style: normal; } .heading3--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .heading3--center__filesize { font-style: normal; } .heading3__inner { position: relative; text-align: center; } .heading3__link { display: inline-block; color: #303038 !important; } .heading3__link--blank { display: inline-block; color: #303038 !important; } .heading3__link--pdf { display: inline-block; color: #303038 !important; } .heading3__link--excel { display: inline-block; color: #303038 !important; } .heading3__link--word { display: inline-block; color: #303038 !important; } .heading3__link--powerpoint { display: inline-block; color: #303038 !important; } .heading3__link--zip { display: inline-block; color: #303038 !important; } .heading3__link--video { display: inline-block; color: #303038 !important; } .heading3__link--modal { display: inline-block; color: #303038 !important; } .heading3__link--rss { display: inline-block; color: #303038 !important; } .heading3__title { margin: 0; color: #303038; text-align: center; } .heading3__title > sup { font-size: 100%; } /* heading4 */ /* ====================================================== * H4-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * H4-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * heading4-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * heading4-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .heading4 { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .heading4__filesize { font-style: normal; } .heading4--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .heading4--center__filesize { font-style: normal; } .heading4__inner { position: relative; } .heading4__title { margin: 0; text-align: center; } .heading4__title > sup { font-size: 100%; } /* headingTitlepic */ /* ====================================================== * TITLE-pic * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * TITLE-pic * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * headingTitlepic-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * headingTitlepic-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .heading-title-pic { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .heading-title-pic__filesize { font-style: normal; } .heading-title-pic--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .heading-title-pic--center__filesize { font-style: normal; } .heading-title-pic__icon { text-align: center; } .heading-title-pic__title { margin: 0; color: #004f8d; } /* ----- Text ----- */ /* text */ /* ====================================================== * TX-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * TX-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * text-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * text-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .text { margin: 1em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .text--center { margin: 1em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .text--right { margin: 1em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: right; } .text--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .text--right { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } /* lead */ /* ====================================================== * LD-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * LD-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * lead-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * lead-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .lead { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ color: #303038; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .lead--center { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ text-align: center; } .lead--center { color: #303038; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } /* ----- List ----- */ /* note-list */ /* ====================================================== * NL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * NL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * list-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * list-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * note-list-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * note-list-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .list-wrap { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: .8em 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .list-wrap > *:first-child, .list-wrap > section:first-child > *:first-child, .list-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: center; margin: 2em 0 0 0; } .list-wrap--center > *:first-child, .list-wrap--center > section:first-child > *:first-child, .list-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--right { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: flex-end; margin: 2em 0 0 0; } .list-wrap--right > *:first-child, .list-wrap--right > section:first-child > *:first-child, .list-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--right > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--center { margin: .8em 0 0; } .list-wrap--right { margin: .8em 0 0; } .note-list { margin: 2em 0 0 0; padding: 0; list-style: none; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .note-list > *:first-child, .note-list > section:first-child > *:first-child, .note-list > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .note-list > *:last-child { margin-bottom: 0 !important; } .note-list > li { position: relative; color: #303038; list-style: none; } .note-list__mark { position: absolute; top: 0; left: 0; } .note-list__nest > *:first-child, .note-list__nest > section:first-child > *:first-child, .note-list__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .note-list__nest > *:last-child { margin-bottom: 0 !important; } .note-list > li { color: #303038; } .note-list__nest { color: #303038; } /* unorder-list */ /* ====================================================== * UL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * UL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * list-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * list-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * unorder-list-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * unorder-list-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .list-wrap { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: .8em 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .list-wrap > *:first-child, .list-wrap > section:first-child > *:first-child, .list-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: center; margin: 2em 0 0 0; } .list-wrap--center > *:first-child, .list-wrap--center > section:first-child > *:first-child, .list-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--right { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: flex-end; margin: 2em 0 0 0; } .list-wrap--right > *:first-child, .list-wrap--right > section:first-child > *:first-child, .list-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--right > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--center { margin: .8em 0 0; } .list-wrap--right { margin: .8em 0 0; } .unorder-list { margin: 2em 0 0 0; padding: 0; list-style: none; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .unorder-list > *:first-child, .unorder-list > section:first-child > *:first-child, .unorder-list > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .unorder-list > *:last-child { margin-bottom: 0 !important; } .unorder-list > li { position: relative; color: #303038; list-style: none; } .unorder-list__nest > *:first-child, .unorder-list__nest > section:first-child > *:first-child, .unorder-list__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .unorder-list__nest > *:last-child { margin-bottom: 0 !important; } .unorder-list > li { margin: 0; padding-left: 1.0em; } .unorder-list > li:before { display: inline-block; position: absolute; top: .5em; left: 0; width: 6px; height: 6px; border-radius: 50%; background-color: #303038; content: ""; } /* ====================================================== * UL-2 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * UL-2 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * list-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * list-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * unorder-list-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * unorder-list-0002 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .list-wrap { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: .8em 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .list-wrap > *:first-child, .list-wrap > section:first-child > *:first-child, .list-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: center; margin: 2em 0 0 0; } .list-wrap--center > *:first-child, .list-wrap--center > section:first-child > *:first-child, .list-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--right { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: flex-end; margin: 2em 0 0 0; } .list-wrap--right > *:first-child, .list-wrap--right > section:first-child > *:first-child, .list-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--right > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--center { margin: .8em 0 0; } .list-wrap--right { margin: .8em 0 0; } .unorder-list-v2 { margin: 2em 0 0 0; padding: 0; list-style: none; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .unorder-list-v2 > *:first-child, .unorder-list-v2 > section:first-child > *:first-child, .unorder-list-v2 > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .unorder-list-v2 > *:last-child { margin-bottom: 0 !important; } .unorder-list-v2 > li { position: relative; color: #303038; list-style: none; } .unorder-list-v2__nest > *:first-child, .unorder-list-v2__nest > section:first-child > *:first-child, .unorder-list-v2__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .unorder-list-v2__nest > *:last-child { margin-bottom: 0 !important; } .unorder-list-v2 > li { margin: .6em 0 0; padding-left: 1.0em; } .unorder-list-v2 > li:before { display: inline-block; position: absolute; top: .5em; left: 0; width: 6px; height: 6px; border-radius: 50%; background-color: #303038; content: ""; } /* order-list */ /* ====================================================== * OL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * OL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * list-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * list-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * order-list-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * order-list-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .list-wrap { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: .8em 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .list-wrap > *:first-child, .list-wrap > section:first-child > *:first-child, .list-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: center; margin: 2em 0 0 0; } .list-wrap--center > *:first-child, .list-wrap--center > section:first-child > *:first-child, .list-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--right { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: flex-end; margin: 2em 0 0 0; } .list-wrap--right > *:first-child, .list-wrap--right > section:first-child > *:first-child, .list-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--right > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--center { margin: .8em 0 0; } .list-wrap--right { margin: .8em 0 0; } .order-list { margin: 2em 0 0 0; padding: 0; list-style: none; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .order-list > *:first-child, .order-list > section:first-child > *:first-child, .order-list > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .order-list > *:last-child { margin-bottom: 0 !important; } .order-list > li { position: relative; color: #303038; list-style: none; } .order-list__mark { position: absolute; top: 0; left: 0; } .order-list__nest > *:first-child, .order-list__nest > section:first-child > *:first-child, .order-list__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .order-list__nest > *:last-child { margin-bottom: 0 !important; } .order-list > li { margin: 0; padding-left: 2.0em; } .order-list__mark { color: #303038; } .order-list__mark:after { content: "."; } /* link-list */ /* ====================================================== * LL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * LL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * list-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * list-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * link-list-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * link-list-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .list-wrap { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: .8em 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .list-wrap > *:first-child, .list-wrap > section:first-child > *:first-child, .list-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: center; margin: 2em 0 0 0; } .list-wrap--center > *:first-child, .list-wrap--center > section:first-child > *:first-child, .list-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--right { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: flex-end; margin: 2em 0 0 0; } .list-wrap--right > *:first-child, .list-wrap--right > section:first-child > *:first-child, .list-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--right > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--center { margin: .8em 0 0; } .list-wrap--right { margin: .8em 0 0; } .link-list { margin: 2em 0 0 0; padding: 0; list-style: none; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .link-list > *:first-child, .link-list > section:first-child > *:first-child, .link-list > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .link-list > *:last-child { margin-bottom: 0 !important; } .link-list > li { position: relative; color: #303038; list-style: none; } .link-list > li > [class*="__type"] { display: inline-block; position: relative; padding-left: 1.2em; } .link-list > li > [class*="__type"]:before { position: absolute; top: .45em; left: -3px; } .link-list__type--nolink { color: #999; } .link-list__type--nolink:before { display: none !important; } a[class*="--modal"] { outline: none !important; } [class*="modal--"].modaal-wrapper .modaal-container { box-shadow: none; } [class*="modal--"].modaal-wrapper .modaal-content-container { padding: 0; } [class*="modal--"].modaal-wrapper .modaal-content-container > *:first-child, [class*="modal--"].modaal-wrapper .modaal-content-container > section:first-child > *:first-child, [class*="modal--"].modaal-wrapper .modaal-content-container > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } [class*="modal--"].modaal-wrapper .modaal-close { position: absolute; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } [class*="modal--"].modaal-wrapper .modaal-close:before, [class*="modal--"].modaal-wrapper .modaal-close:after { display: none; } [class*="modal--"].modaal-wrapper .modaal-close > span { display: block; position: relative !important; width: 100% !important; height: 100% !important; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { -webkit-backface-visibility: hidden; position: absolute; top: 50%; left: 50%; background-color: #004f8d; content: ""; } [class*="modal--"].modaal-wrapper .modaal-close > span:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); } [class*="modal--"].modaal-wrapper .modaal-close > span:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } [class*="modal--iframe"].modaal-wrapper .modaal-container { overflow: visible !important; } .modaal-overlay { z-index: 1001 !important; } .link-list__filesize { margin-left: .5em; font-style: normal; } .link-list__nest { padding-left: 1.2em; } .link-list__nest > *:first-child, .link-list__nest > section:first-child > *:first-child, .link-list__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .link-list__nest > *:last-child { margin-bottom: 0 !important; } .link-list > li { margin: 0; } .link-list > li > [class*="__type"] { padding-left: 0; } .link-list > li > [class*="__type"]:before { display: none; } .link-list__type--nolink { color: #7c7c85; } .link-list__type--nolink:after { border-color: #7c7c85; } .link-list__nest > *:first-child, .link-list__nest > section:first-child > *:first-child, .link-list__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .link-list__nest > *:last-child { margin-bottom: 0 !important; } /* note-order-list */ /* ====================================================== * NOL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * NOL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * list-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * list-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * note-order-list-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * note-order-list-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .list-wrap { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: .8em 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .list-wrap > *:first-child, .list-wrap > section:first-child > *:first-child, .list-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: center; margin: 2em 0 0 0; } .list-wrap--center > *:first-child, .list-wrap--center > section:first-child > *:first-child, .list-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--center > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--right { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ display: flex; flex-flow: row wrap; justify-content: flex-end; margin: 2em 0 0 0; } .list-wrap--right > *:first-child, .list-wrap--right > section:first-child > *:first-child, .list-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .list-wrap--right > * { flex: 0 1 auto; min-width: 1px; } .list-wrap--center { margin: .8em 0 0; } .list-wrap--right { margin: .8em 0 0; } .note-order-list { margin: 2em 0 0 0; padding: 0; list-style: none; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .note-order-list > *:first-child, .note-order-list > section:first-child > *:first-child, .note-order-list > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .note-order-list > *:last-child { margin-bottom: 0 !important; } .note-order-list > li { position: relative; color: #303038; list-style: none; } .note-order-list__mark { position: absolute; top: 0; left: 0; } .note-order-list__nest > *:first-child, .note-order-list__nest > section:first-child > *:first-child, .note-order-list__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .note-order-list__nest > *:last-child { margin-bottom: 0 !important; } .note-order-list > li { margin: 0; color: #303038; } .note-order-list__nest { color: #303038; } /* ----- Button ----- */ /* button */ /* ====================================================== * BT-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * BT-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * button-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * button-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * button-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .button__type, .button .button__type--blank, .button .button__type--pdf, .button .button__type--excel, .button .button__type--word, .button .button__type--powerpoint, .button .button__type--zip, .button .button__type--video, .button .button__type--modal, .button .button__type--rss, .button-v2__type, .button-v2 .button-v2__type--blank, .button-v2 .button-v2__type--pdf, .button-v2 .button-v2__type--excel, .button-v2 .button-v2__type--word, .button-v2 .button-v2__type--powerpoint, .button-v2 .button-v2__type--zip, .button-v2 .button-v2__type--video, .button-v2 .button-v2__type--modal, .button-v2 .button-v2__type--rss { display: flex; text-decoration: none; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * button-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .button .button__type, .button .button__type--noIcon, .button .button__type--blank, .button .button__type--pdf, .button .button__type--excel, .button .button__type--word, .button .button__type--powerpoint, .button .button__type--zip, .button .button__type--video, .button .button__type--modal, .button .button__type--rss { display: flex; z-index: 1; position: relative; align-items: center; justify-content: center; border-radius: 25px; background-color: #008eed; color: #fff; text-align: center; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .button-wrap { display: flex; flex-flow: row wrap; margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .button-wrap--center { display: flex; flex-flow: row wrap; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ align-items: center; margin: 2em 0 0 0; } .button-wrap--center > * { justify-content: center; } .button-wrap--right { display: flex; flex-flow: row wrap; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ align-items: flex-end; margin: 2em 0 0 0; } .button-wrap--right > * { justify-content: flex-end; } .button-wrap--centering { display: flex; flex-flow: row wrap; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: center; margin: 2em 0 0 0; } .button { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .button__label { display: inline-block; } .button__filesize { font-style: normal; } .button .button__type:after { width: 8px; height: 8px; margin-top: -4px; } a[class*="--modal"] { outline: none !important; } [class*="modal--"].modaal-wrapper .modaal-container { box-shadow: none; } [class*="modal--"].modaal-wrapper .modaal-content-container { padding: 0; } [class*="modal--"].modaal-wrapper .modaal-content-container > *:first-child, [class*="modal--"].modaal-wrapper .modaal-content-container > section:first-child > *:first-child, [class*="modal--"].modaal-wrapper .modaal-content-container > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } [class*="modal--"].modaal-wrapper .modaal-close { position: absolute; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } [class*="modal--"].modaal-wrapper .modaal-close:before, [class*="modal--"].modaal-wrapper .modaal-close:after { display: none; } [class*="modal--"].modaal-wrapper .modaal-close > span { display: block; position: relative !important; width: 100% !important; height: 100% !important; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { -webkit-backface-visibility: hidden; position: absolute; top: 50%; left: 50%; background-color: #004f8d; content: ""; } [class*="modal--"].modaal-wrapper .modaal-close > span:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); } [class*="modal--"].modaal-wrapper .modaal-close > span:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } [class*="modal--iframe"].modaal-wrapper .modaal-container { overflow: visible !important; } .modaal-overlay { z-index: 1001 !important; } .button__filesize { margin-left: .5em; } /* ====================================================== * BT-2 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * BT-2 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * button-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * button-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * button-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .button__type, .button .button__type--blank, .button .button__type--pdf, .button .button__type--excel, .button .button__type--word, .button .button__type--powerpoint, .button .button__type--zip, .button .button__type--video, .button .button__type--modal, .button .button__type--rss, .button-v2__type, .button-v2 .button-v2__type--blank, .button-v2 .button-v2__type--pdf, .button-v2 .button-v2__type--excel, .button-v2 .button-v2__type--word, .button-v2 .button-v2__type--powerpoint, .button-v2 .button-v2__type--zip, .button-v2 .button-v2__type--video, .button-v2 .button-v2__type--modal, .button-v2 .button-v2__type--rss { display: flex; text-decoration: none; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * button-0002 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .button-v2 .button-v2__type, .button-v2 .button-v2__type--noIcon, .button-v2 .button-v2__type--blank, .button-v2 .button-v2__type--pdf, .button-v2 .button-v2__type--excel, .button-v2 .button-v2__type--word, .button-v2 .button-v2__type--powerpoint, .button-v2 .button-v2__type--zip, .button-v2 .button-v2__type--video, .button-v2 .button-v2__type--modal, .button-v2 .button-v2__type--rss { display: flex; z-index: 1; position: relative; align-items: center; justify-content: center; border: 1px solid #008eed; border-radius: 25px; background-color: #fff; text-align: center; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .button-wrap { display: flex; flex-flow: row wrap; margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .button-wrap--center { display: flex; flex-flow: row wrap; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ align-items: center; margin: 2em 0 0 0; } .button-wrap--center > * { justify-content: center; } .button-wrap--right { display: flex; flex-flow: row wrap; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ align-items: flex-end; margin: 2em 0 0 0; } .button-wrap--right > * { justify-content: flex-end; } .button-wrap--centering { display: flex; flex-flow: row wrap; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: center; margin: 2em 0 0 0; } .button-v2 { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .button-v2__label { display: inline-block; } .button-v2__filesize { font-style: normal; } .button-v2 .button-v2__type:after { width: 8px; height: 8px; margin-top: -4px; border-color: #008eed; } .button-v2__filesize { margin-left: .5em; } /* ----- Figure ----- */ /* figure */ /* ====================================================== * IM-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * IM-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * figure-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * figure-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * figure-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * figure-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .figure__frame, .figure a.figure__frame, .figure a.figure__frame--modal { display: inline-block; } .figure__caption, .figure__caption--center, .figure__caption--right { margin: .7em 0 0 0; text-align: left; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .figure-wrap { display: flex; margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .figure-wrap--center { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: center; margin: 2em 0 0 0; } .figure-wrap--right { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: flex-end; margin: 2em 0 0 0; } .figure-wrap--center > * { text-align: center; } .figure { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .figure__title { margin: 0 0 .8em; line-height: 1.4; text-align: left; } .figure a.figure__frame, .figure a.figure__frame--modal { position: relative; } .figure a.figure__frame--modal:before { display: inline-block; z-index: 2; position: absolute; right: 0; bottom: 0; width: 40px; height: 40px; background-color: #004f8d; content: ""; } .figure a.figure__frame--modal:after { z-index: 3; position: absolute; right: 10px; bottom: 10px; width: 20px; height: 20px; } a[class*="--modal"] { outline: none !important; } [class*="modal--"].modaal-wrapper .modaal-container { box-shadow: none; } [class*="modal--"].modaal-wrapper .modaal-content-container { padding: 0; } [class*="modal--"].modaal-wrapper .modaal-content-container > *:first-child, [class*="modal--"].modaal-wrapper .modaal-content-container > section:first-child > *:first-child, [class*="modal--"].modaal-wrapper .modaal-content-container > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } [class*="modal--"].modaal-wrapper .modaal-close { position: absolute; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } [class*="modal--"].modaal-wrapper .modaal-close:before, [class*="modal--"].modaal-wrapper .modaal-close:after { display: none; } [class*="modal--"].modaal-wrapper .modaal-close > span { display: block; position: relative !important; width: 100% !important; height: 100% !important; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { -webkit-backface-visibility: hidden; position: absolute; top: 50%; left: 50%; background-color: #004f8d; content: ""; } [class*="modal--"].modaal-wrapper .modaal-close > span:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); } [class*="modal--"].modaal-wrapper .modaal-close > span:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } [class*="modal--iframe"].modaal-wrapper .modaal-container { overflow: visible !important; } .modaal-overlay { z-index: 1001 !important; } .figure__caption--center { text-align: center; } .figure__caption--right { text-align: right; } /* ----- Video ----- */ /* video */ /* ====================================================== * VD-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * VD-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * video-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * video-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .video-wrap__caption, .video-wrap__caption--center, .video-wrap__caption--right { margin: .6em 0 0 0; } .video-wrap__caption > *:first-child, .video-wrap__caption--center > *:first-child, .video-wrap__caption--right > *:first-child, .video-wrap__caption > section:first-child > *:first-child, .video-wrap__caption--center > section:first-child > *:first-child, .video-wrap__caption--right > section:first-child > *:first-child, .video-wrap__caption > [class^="list-wrap"] > *:first-child, .video-wrap__caption--center > [class^="list-wrap"] > *:first-child, .video-wrap__caption--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap__caption > *:last-child, .video-wrap__caption--center > *:last-child, .video-wrap__caption--right > *:last-child { margin-bottom: 0 !important; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * video-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * video-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .video-wrap { display: flex; margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .video-wrap > *:first-child, .video-wrap > section:first-child > *:first-child, .video-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap > *:last-child { margin-bottom: 0 !important; } .video-wrap__inner { width: 100%; } .video-wrap__inner > *:first-child, .video-wrap__inner > section:first-child > *:first-child, .video-wrap__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap__inner > *:last-child { margin-bottom: 0 !important; } .video-wrap--center { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: center; margin: 2em 0 0 0; } .video-wrap--center > *:first-child, .video-wrap--center > section:first-child > *:first-child, .video-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--center > *:last-child { margin-bottom: 0 !important; } .video-wrap--center__inner { width: 100%; } .video-wrap--center__inner > *:first-child, .video-wrap--center__inner > section:first-child > *:first-child, .video-wrap--center__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--center__inner > *:last-child { margin-bottom: 0 !important; } .video-wrap--right { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: flex-end; margin: 2em 0 0 0; } .video-wrap--right > *:first-child, .video-wrap--right > section:first-child > *:first-child, .video-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--right > *:last-child { margin-bottom: 0 !important; } .video-wrap--right__inner { width: 100%; } .video-wrap--right__inner > *:first-child, .video-wrap--right__inner > section:first-child > *:first-child, .video-wrap--right__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--right__inner > *:last-child { margin-bottom: 0 !important; } .video-wrap__caption { text-align: left; } .video-wrap__caption--center { text-align: center; } .video-wrap__caption--right { text-align: right; } .video { display: block; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ width: 100%; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .video > *:first-child, .video > section:first-child > *:first-child, .video > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video > *:last-child { margin-bottom: 0 !important; } /* ====================================================== * IVD-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * IVD-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * video-wrap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * video-wrap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .video-wrap__caption, .video-wrap__caption--center, .video-wrap__caption--right { margin: .6em 0 0 0; } .video-wrap__caption > *:first-child, .video-wrap__caption--center > *:first-child, .video-wrap__caption--right > *:first-child, .video-wrap__caption > section:first-child > *:first-child, .video-wrap__caption--center > section:first-child > *:first-child, .video-wrap__caption--right > section:first-child > *:first-child, .video-wrap__caption > [class^="list-wrap"] > *:first-child, .video-wrap__caption--center > [class^="list-wrap"] > *:first-child, .video-wrap__caption--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap__caption > *:last-child, .video-wrap__caption--center > *:last-child, .video-wrap__caption--right > *:last-child { margin-bottom: 0 !important; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * iframe-video-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * iframe-video-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .video-wrap { display: flex; margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .video-wrap > *:first-child, .video-wrap > section:first-child > *:first-child, .video-wrap > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap > *:last-child { margin-bottom: 0 !important; } .video-wrap__inner { width: 100%; } .video-wrap__inner > *:first-child, .video-wrap__inner > section:first-child > *:first-child, .video-wrap__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap__inner > *:last-child { margin-bottom: 0 !important; } .video-wrap--center { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: center; margin: 2em 0 0 0; } .video-wrap--center > *:first-child, .video-wrap--center > section:first-child > *:first-child, .video-wrap--center > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--center > *:last-child { margin-bottom: 0 !important; } .video-wrap--center__inner { width: 100%; } .video-wrap--center__inner > *:first-child, .video-wrap--center__inner > section:first-child > *:first-child, .video-wrap--center__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--center__inner > *:last-child { margin-bottom: 0 !important; } .video-wrap--right { display: flex; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ justify-content: flex-end; margin: 2em 0 0 0; } .video-wrap--right > *:first-child, .video-wrap--right > section:first-child > *:first-child, .video-wrap--right > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--right > *:last-child { margin-bottom: 0 !important; } .video-wrap--right__inner { width: 100%; } .video-wrap--right__inner > *:first-child, .video-wrap--right__inner > section:first-child > *:first-child, .video-wrap--right__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .video-wrap--right__inner > *:last-child { margin-bottom: 0 !important; } .video-wrap__caption { text-align: left; } .video-wrap__caption--center { text-align: center; } .video-wrap__caption--right { text-align: right; } .iframe-video { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ position: relative; width: 100%; padding-top: 56.25%; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .iframe-video > iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; } /* ----- Table ----- */ /* table */ /* ====================================================== * TB-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * TB-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * table-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * table-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .table [class*="__cell"] { border-right: 1px solid #d9dce4; border-bottom: 1px solid #d9dce4; background-color: #fff; text-align: left; vertical-align: top; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .table { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .table__w--1per { width: 1% !important; } .table__w--2per { width: 2% !important; } .table__w--3per { width: 3% !important; } .table__w--4per { width: 4% !important; } .table__w--5per { width: 5% !important; } .table__w--6per { width: 6% !important; } .table__w--7per { width: 7% !important; } .table__w--8per { width: 8% !important; } .table__w--9per { width: 9% !important; } .table__w--10per { width: 10% !important; } .table__w--11per { width: 11% !important; } .table__w--12per { width: 12% !important; } .table__w--13per { width: 13% !important; } .table__w--14per { width: 14% !important; } .table__w--15per { width: 15% !important; } .table__w--16per { width: 16% !important; } .table__w--17per { width: 17% !important; } .table__w--18per { width: 18% !important; } .table__w--19per { width: 19% !important; } .table__w--20per { width: 20% !important; } .table__w--21per { width: 21% !important; } .table__w--22per { width: 22% !important; } .table__w--23per { width: 23% !important; } .table__w--24per { width: 24% !important; } .table__w--25per { width: 25% !important; } .table__w--26per { width: 26% !important; } .table__w--27per { width: 27% !important; } .table__w--28per { width: 28% !important; } .table__w--29per { width: 29% !important; } .table__w--30per { width: 30% !important; } .table__w--31per { width: 31% !important; } .table__w--32per { width: 32% !important; } .table__w--33per { width: 33% !important; } .table__w--34per { width: 34% !important; } .table__w--35per { width: 35% !important; } .table__w--36per { width: 36% !important; } .table__w--37per { width: 37% !important; } .table__w--38per { width: 38% !important; } .table__w--39per { width: 39% !important; } .table__w--40per { width: 40% !important; } .table__w--41per { width: 41% !important; } .table__w--42per { width: 42% !important; } .table__w--43per { width: 43% !important; } .table__w--44per { width: 44% !important; } .table__w--45per { width: 45% !important; } .table__w--46per { width: 46% !important; } .table__w--47per { width: 47% !important; } .table__w--48per { width: 48% !important; } .table__w--49per { width: 49% !important; } .table__w--50per { width: 50% !important; } .table__w--51per { width: 51% !important; } .table__w--52per { width: 52% !important; } .table__w--53per { width: 53% !important; } .table__w--54per { width: 54% !important; } .table__w--55per { width: 55% !important; } .table__w--56per { width: 56% !important; } .table__w--57per { width: 57% !important; } .table__w--58per { width: 58% !important; } .table__w--59per { width: 59% !important; } .table__w--60per { width: 60% !important; } .table__w--61per { width: 61% !important; } .table__w--62per { width: 62% !important; } .table__w--63per { width: 63% !important; } .table__w--64per { width: 64% !important; } .table__w--65per { width: 65% !important; } .table__w--66per { width: 66% !important; } .table__w--67per { width: 67% !important; } .table__w--68per { width: 68% !important; } .table__w--69per { width: 69% !important; } .table__w--70per { width: 70% !important; } .table__w--71per { width: 71% !important; } .table__w--72per { width: 72% !important; } .table__w--73per { width: 73% !important; } .table__w--74per { width: 74% !important; } .table__w--75per { width: 75% !important; } .table__w--76per { width: 76% !important; } .table__w--77per { width: 77% !important; } .table__w--78per { width: 78% !important; } .table__w--79per { width: 79% !important; } .table__w--80per { width: 80% !important; } .table__w--81per { width: 81% !important; } .table__w--82per { width: 82% !important; } .table__w--83per { width: 83% !important; } .table__w--84per { width: 84% !important; } .table__w--85per { width: 85% !important; } .table__w--86per { width: 86% !important; } .table__w--87per { width: 87% !important; } .table__w--88per { width: 88% !important; } .table__w--89per { width: 89% !important; } .table__w--90per { width: 90% !important; } .table__w--91per { width: 91% !important; } .table__w--92per { width: 92% !important; } .table__w--93per { width: 93% !important; } .table__w--94per { width: 94% !important; } .table__w--95per { width: 95% !important; } .table__w--96per { width: 96% !important; } .table__w--97per { width: 97% !important; } .table__w--98per { width: 98% !important; } .table__w--99per { width: 99% !important; } .table__w--100per { width: 100% !important; } .table__head > *:first-child, .table__head > section:first-child > *:first-child, .table__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .table__head > *:last-child { margin-bottom: 0 !important; } .table__body { overflow: hidden; } .table__body > *:first-child, .table__body > section:first-child > *:first-child, .table__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .table__body > *:last-child { margin-bottom: 0 !important; } .table__foot > *:first-child, .table__foot > section:first-child > *:first-child, .table__foot > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .table__foot > *:last-child { margin-bottom: 0 !important; } .table__title { line-height: 1.4; } .table__caption--center { text-align: center; } .table__caption--right { text-align: right; } .table__matrix { width: calc(100% + 1px); margin-right: -1px; border-top: 1px solid #d9dce4; border-collapse: collapse; border-spacing: 0; table-layout: fixed; } .table__matrix > caption > *:first-child, .table__matrix > caption > section:first-child > *:first-child, .table__matrix > caption > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .table__matrix > caption > *:last-child { margin-bottom: 0 !important; } .table [class*="__cell"] > *:first-child, .table [class*="__cell"] > section:first-child > *:first-child, .table [class*="__cell"] > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .table [class*="__cell"] > *:last-child { margin-bottom: 0 !important; } .table [class*="__cell--lv1"] { background-color: #eaeaeb; } .table [class*="__cell--lv2"] { background-color: #f7f7f8; } /* ----- Media ----- */ /* media */ /* ====================================================== * MD-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * MD-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * media-default * ------------------------------------------------------ * extend * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * media-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .media { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ } .media[data-media-wraparound="true"]:after { display: block; clear: both; content: ""; } .media__head > *:first-child, .media__head > section:first-child > *:first-child, .media__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .media__body { flex: 1 1; } .media__body > *:first-child, .media__body > section:first-child > *:first-child, .media__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .media__image { margin: 0; } .media__frame { text-align: center; } .media__caption--center { text-align: center; } .media__caption--right { text-align: right; } /* ----- Column ----- */ /* column */ /* ====================================================== * COL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * COL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * column-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * column-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .column { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .column__item > *:first-child, .column__item > section:first-child > *:first-child, .column__item > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .column__item > *:last-child { margin-bottom: 0 !important; } /* ====================================================== * HEADING-COL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * HEADING-COL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * heading-column-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * heading-column-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .heading-column { margin: 0 0 0 0 !important; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } [class^=heading] + .heading-column { margin-top: 0; } .heading-column__item > *:last-child { margin-bottom: 0 !important; } .heading-column[data-col-pc] > *, .heading-column[data-col-sp] > * { margin-top: 0 !important; } /* ----- Navi ----- */ /* anchor-navi */ /* ====================================================== * ANC-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * ANC-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * anchor-navi-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * anchor-navi-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .anchor-navi { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .anchor-navi--center { display: flex; flex-flow: row wrap; justify-content: center; } .anchor-navi--center > * { flex: 0 1 auto; min-width: 1px; text-align: center; } .anchor-navi__list { margin: 0; padding: 0; } .anchor-navi__list > li { display: flex; position: relative; list-style: none; } .anchor-navi__link { display: inline-block; } .anchor-navi__label { display: inline-block; position: relative; } .anchor-navi__label:after { margin-left: 10px; } /* ----- Accordion ----- */ /* accordion */ /* ====================================================== * ACC-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * ACC-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * accordion-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * accordion-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .accordion { margin: 2em 0 0 0; overflow: hidden; border: 1px solid #008eed; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ background: #fff; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .accordion__head { display: block; background-color: #fff; } .accordion__title { display: block; position: relative; color: #303038; } .accordion__title:after { position: absolute; top: 50%; right: 0; width: 15px; height: 15px; margin-top: -7px; border-radius: 50%; background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/93961_pic_down_blue.svg") no-repeat; content: ""; } .accordion__head.is-active .accordion__title:after { -webkit-transform: rotate(180deg); transform: rotate(180deg); background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/93961_pic_down_blue.svg"); } .accordion > [class*="__body"] { position: relative; border-top: 1px solid #008eed; background: #fff; } .accordion__body > *:first-child, .accordion__body > section:first-child > *:first-child, .accordion__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .accordion__nest { margin: -1px; } .accordion__nest > *:first-child, .accordion__nest > section:first-child > *:first-child, .accordion__nest > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .accordion__nest > .accordion .accordion__body { background-color: #f2faff; } /* ----- Tab ----- */ /* tab */ /* ====================================================== * TAB-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * TAB-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * tab-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * tab-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .tab { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .tab__list > li { list-style: none; } .tab__head { overflow: hidden; } .tab__list { display: flex; justify-content: space-between; padding: 0; border-bottom: 2px solid #008eed; } .tab__list > li { width: 100%; } .tab__button { display: flex; z-index: 1; position: relative; align-items: center; justify-content: center; height: 100%; border: 2px solid #008eed; border-bottom: none; border-radius: 4px 4px 0 0; background-color: #fff; line-height: 1.4; text-align: center; } .tab__list > li.is-current .tab__button { border-color: #008eed; background-color: #008eed; color: #fff; } .tab__detail > *:first-child, .tab__detail > section:first-child > *:first-child, .tab__detail > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ----- Modal ----- */ /* modal */ /* ====================================================== * MDL-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * MDL-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * modal-0001 * ------------------------------------------------------ * @vars * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ------------------------------------------------------ * Element ------------------------------------------------------ */ [class*="modal--"].modaal-wrapper .modaal-close { position: absolute; border-radius: 50%; background-color: #008eed; } [class*="modal--"].modaal-wrapper .modaal-close > span { overflow: hidden; text-indent: -9999px; } .modaal-overlay { opacity: .7 !important; } [class^=modal--] { display: none; } /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ .modal--image.modaal-wrapper .modaal-container { border-radius: 0; } /* ----- Other ----- */ /* gmap */ /* ====================================================== * GMAP-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * GMAP-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * gmap-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * gmap-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .gmap { margin: 2em 0 0 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ margin: 2em auto 0; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .gmap + * { margin-top: 1em; } .gmap__body { position: relative; width: 100%; padding-top: 56.25%; } .gmap__body > iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; } /* download */ /* ====================================================== * DLD-1 * ------------------------------------------------------ * vars * @import * @mixin ====================================================== */ /* ====================================================== * vars ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * DLD-1 * ------------------------------------------------------ * @import * @mixin ====================================================== */ /* ====================================================== * import ====================================================== */ /* ====================================================== * download-default * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * download-0001 * ------------------------------------------------------ * @mixin * - Element * - Modifier * - Print ====================================================== */ /* ====================================================== * extend ====================================================== */ .download__link-list__type, .download__link-list__type--blank, .download__link-list__type--pdf, .download__link-list__type--excel, .download__link-list__type--word, .download__link-list__type--powerpoint, .download__link-list__type--zip, .download__link-list__type--video, .download__link-list__type--modal, .download__link-list__type--rss { display: inline-block; position: relative; } /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ /* ====================================================== * mixin ====================================================== */ .download { /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ display: flex; justify-content: center; margin: 2em 0 0 0; border: 1px solid #d9dce4; background-color: #fff; /* ------------------------------------------------------ * Element ------------------------------------------------------ */ /* ------------------------------------------------------ * Print ------------------------------------------------------ */ /* ------------------------------------------------------ * Modifier ------------------------------------------------------ */ } .download__inner > *:first-child, .download__inner > section:first-child > *:first-child, .download__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .download__inner > *:last-child { margin-bottom: 0 !important; } .download__title { color: #004f8d; text-align: center; } .download__caption > *:first-child, .download__caption > section:first-child > *:first-child, .download__caption > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .download__description { margin: 1.0em 0 0 0; } .download__link-list-wrap { display: flex; } .download__link-list { margin: 0; padding: 0; } .download__link-list > li { list-style: none; } .download__banner { margin: 1.0em 0 0; text-align: center; } .download__bannerr__link-list { display: block; } /* ----- Add ----- */ /* ====================================================== * ADD-1 ====================================================== */ /* ====================================================== * ADD-2 ====================================================== */ /* ----- cmn-exchange-rate ----- */ .cmn-exchange-rate__list { margin: 0; padding: 0; list-style: none; } .cmn-exchange-rate__list > li { display: flex; justify-content: space-between; } .cmn-exchange-rate__list > li:first-child { margin-top: 0; } .cmn-exchange-rate__company { flex-shrink: 0; } .cmn-exchange-rate__jpy { position: relative; width: 100%; text-align: right; } .cmn-exchange-rate__jpy:before { -webkit-transform: translateY(-50%); position: absolute; top: 50%; left: 0; transform: translateY(-50%); font-size: 1.0em; content: "＝"; } /* ====================================================== * ADD-3 ====================================================== */ /* ----- cmn-line-horizon ----- */ .cmn-line-horizon { margin: 2.0em 0; border: none; border-bottom: 1px solid #c1c1c1; } /* ====================================================== * ADD-5 ====================================================== */ /* ----- cmn-notice-v2 ----- */ .cmn-notice-v2 { border: 1px solid #303038; } .cmn-notice-v2__item { margin-top: 2.0em; } .cmn-notice-v2__item:first-child { margin-top: 0; } .cmn-notice-v2__head > *:first-child, .cmn-notice-v2__head > section:first-child > *:first-child, .cmn-notice-v2__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-notice-v2__body > *:first-child, .cmn-notice-v2__body > section:first-child > *:first-child, .cmn-notice-v2__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-notice-v2__title { position: relative; color: #cc0000; line-height: 1.4; } .cmn-notice-v2__heading + * { margin-top: .8em; } .cmn-notice-v2__heading__title { margin: 0; line-height: 1.4; } /* ====================================================== * ADD-6 ====================================================== */ /* ----- cmn-related ----- */ .cmn-related__heading + * { margin-top: 0 !important; } .cmn-related__heading__title { margin: 0; text-align: center; } .cmn-related__title { color: #004f8d; text-align: center; } .cmn-related__media__head > *:first-child, .cmn-related__media__head > section:first-child > *:first-child, .cmn-related__media__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-related__media__body > *:first-child, .cmn-related__media__body > section:first-child > *:first-child, .cmn-related__media__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-related__media__frame { display: block; } /* ====================================================== * ADD-11 ====================================================== */ /* ----- cmn-accordion-image ----- */ .cmn-accordion-image__list { margin: 0; padding: 0; list-style: none; } .cmn-accordion-image__modal { display: none; } .cmn-accordion-image__carousel__item > *:first-child, .cmn-accordion-image__carousel__item > section:first-child > *:first-child, .cmn-accordion-image__carousel__item > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-accordion-image__carousel__item > *:last-child { margin-bottom: 0 !important; } .cmn-accordion-image__body { display: none; } .cmn-accordion-image__trigger { display: flex; position: relative; align-items: center; background-color: #f7f7f8; } .cmn-accordion-image__trigger:before { position: absolute; top: 50%; content: ""; } .cmn-accordion-image__trigger__head { display: flex; flex-shrink: 0; align-items: center; justify-content: center; height: 100%; background-color: #008eed; } .cmn-accordion-image__trigger__body { width: 100%; } .cmn-accordion-image__trigger__title { color: #303038; } .cmn-accordion-image__trigger__note { position: relative; color: #303038; } .cmn-accordion-image__trigger__note__mark { position: absolute; top: 0; left: 0; } /* ====================================================== * ADD-17 ====================================================== */ /* ----- cmn-products-jcbdebit ----- */ .cmn-products-jcbdebit__logo { display: flex; } .cmn-products-jcbdebit__pay-wrap { display: flex; align-items: center; justify-content: flex-end; } .cmn-products-jcbdebit__pay-wrap > *:first-child { margin-left: 0; } .cmn-products-jcbdebit__pay-wrap > [class*="__pay"] > img { vertical-align: middle; } .cmn-products-jcbdebit__tab__list { display: flex; position: relative; margin: 0; padding: 0; list-style: none; } .cmn-products-jcbdebit__tab__list > li:first-child { margin-left: 0; } .cmn-products-jcbdebit__tab__list > li:before { position: absolute; bottom: 0; height: 2px; background-color: #008eed; content: ""; opacity: 0.0; transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-products-jcbdebit__tab__list > li[data-tab-button="gold"]:before { background-color: #ad8e00; } .cmn-products-jcbdebit__tab__list > li.is-current:before { opacity: 1.0; } .cmn-products-jcbdebit__tab__button { display: flex; align-items: center; justify-content: center; width: 100%; overflow: hidden; border: 2px solid #008eed; border-radius: 4px 4px 0 0; background-color: #fff; color: #008eed; line-height: 1.4; text-align: center; } .cmn-products-jcbdebit__tab__list > li.is-current .cmn-products-jcbdebit__tab__button { background-color: #008eed; color: #fff; } .cmn-products-jcbdebit__tab__list > li[data-tab-button="gold"] .cmn-products-jcbdebit__tab__button { border-color: #ad8e00; color: #ad8e00; } .cmn-products-jcbdebit__tab__list > li[data-tab-button="gold"].is-current .cmn-products-jcbdebit__tab__button { background-color: #ad8e00; color: #fff; } .cmn-products-jcbdebit__tab__detail { overflow: hidden; } .cmn-products-jcbdebit__content__head > *:first-child, .cmn-products-jcbdebit__content__head > section:first-child > *:first-child, .cmn-products-jcbdebit__content__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-products-jcbdebit__content__body { background-color: #f7f7f8; } .cmn-products-jcbdebit__content__pay-wrap { display: flex; align-items: center; } .cmn-products-jcbdebit__content__pay-wrap > *:first-child { margin-left: 0; } .cmn-products-jcbdebit__content__pay-wrap > [class*="__pay"] > img { vertical-align: middle; } .cmn-products-jcbdebit__name { color: #004f8d; text-align: center; } .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-prev { left: 0; } .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-next { right: 0; } .cmn-products-jcbdebit__carousel__item { display: flex !important; align-items: center; justify-content: center; } .cmn-products-jcbdebit__app-download { display: flex; justify-content: center; margin: 1.0em 0 0; } .cmn-products-jcbdebit__app-download > *:first-child, .cmn-products-jcbdebit__app-download > section:first-child > *:first-child, .cmn-products-jcbdebit__app-download > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-products-jcbdebit__heading + * { margin-top: 0; } .cmn-products-jcbdebit__heading__inner { position: relative; } .cmn-products-jcbdebit__heading__inner:before { -webkit-transform: translateX(-50%); position: absolute; top: 0; left: 50%; width: 45px; height: 1px; transform: translateX(-50%); background-color: #d9dce4; content: ""; } .cmn-products-jcbdebit__heading__title { margin: 0; text-align: center; } .cmn-products-jcbdebit__heading__title > sup { font-size: 100%; } /* ----- products-jcbdebit-modal ----- */ .modal--products-jcbdebit .modaal-container { padding: 0 !important; } /* ====================================================== * ADD-18 ====================================================== */ /* ----- cmn-app-download-wrap ----- */ .cmn-app-download-wrap { display: flex; margin: 1.0em 0 0; } /* ----- cmn-app-download ----- */ /* ====================================================== * ADD-19 ====================================================== */ /* ----- cmn-index-navi ----- */ .cmn-index-navi { background-color: #f7f7f8; } .cmn-index-navi__title { text-align: center; } .cmn-index-navi__anchor__list { margin: 0; padding: 0; list-style: none; } .cmn-index-navi__anchor__list > li { border-bottom: 1px solid #d9dce4; } .cmn-index-navi__anchor__type { display: block; position: relative; } .cmn-index-navi__anchor__type:after { position: absolute; width: 14px; height: 14px; background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/93961_pic_down_blue.svg") no-repeat; content: ""; } /* ====================================================== * ADD-20 ====================================================== */ /* ----- cmn-search ----- */ .cmn-search__body { background-color: #f7f7f7; } .cmn-search__body__inner > *:first-child, .cmn-search__body__inner > section:first-child > *:first-child, .cmn-search__body__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-search__body__inner > *:last-child { margin-bottom: 0 !important; } .cmn-search__category__accordion { position: relative; } .cmn-search__category__accordion__body { background-color: #fff; } .cmn-search__category__accordion__trigger { display: block; position: relative; } .cmn-search__category__accordion__trigger:before, .cmn-search__category__accordion__trigger:after { position: absolute; top: 50%; width: 15px; height: 15px; margin-top: -8px; content: ""; } .cmn-search__category__accordion__trigger:before { opacity: 1.0; } .cmn-search__category__accordion__trigger:after { opacity: 0.0; } .cmn-search__category__accordion__trigger.is-active:before { opacity: 0.0; } .cmn-search__category__accordion__trigger.is-active:after { opacity: 1.0; } .cmn-search__category__list { margin: 0; padding: 0; list-style: none; } .cmn-search__category__button { display: block; width: 100%; height: 100%; border: none; background-color: #fff; text-align: left; } .cmn-search__control { display: flex; align-items: center; justify-content: space-between; } .cmn-search__sort { position: relative; } .cmn-search__sort > input { clip: rect(0, 0, 0, 0); position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; border: 0; } .cmn-search__sort > input + label { display: block; position: relative; line-height: 20px; cursor: pointer; } .cmn-search__sort > input + label:before, .cmn-search__sort > input + label:after { position: absolute; content: ""; } .cmn-search__sort > input + label:before { top: 0; left: 0; width: 20px; height: 20px; border: 1px solid #008eed; background-color: #fff; } .cmn-search__sort > input + label:after { -webkit-transform: rotate(-45deg); top: 4px; left: 4px; width: 12px; height: 8px; transform: rotate(-45deg); border-bottom: 2px solid #fff; border-left: 2px solid #fff; opacity: 0.0; } .cmn-search__sort > input:checked + label:before { border-color: #026cb2; background-color: #026cb2; } .cmn-search__sort > input:checked + label:after { opacity: 1.0; } .cmn-search__clear { margin-left: 1.0em; } .cmn-search__clear__trigger { display: block; border: 1px solid #008eed; border-radius: 25px; background-color: #fff; color: #008eed; } /* ====================================================== * ADD-21 ====================================================== */ /* ----- cmn-tel-wrap ----- */ .cmn-tel-wrap { margin: 0 0 1.0em; } .cmn-tel-wrap--center { text-align: center; } /* ----- cmn-tel ----- */ .cmn-tel__num { display: block; position: relative; } /* ====================================================== * ADD-22 ====================================================== */ /* ----- cmn-heading ----- */ .cmn-heading { position: relative; } .cmn-heading__image { position: relative; } .cmn-heading__image:after { z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(28, 28, 28, 0.3); content: ""; } .cmn-heading__detail { display: flex; z-index: 2; position: absolute; top: 0; left: 0; justify-content: center; width: 100%; height: 100%; } .cmn-heading__title { margin: 0; color: #fff; text-align: center; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); } .cmn-heading__subtitle { color: #fff; text-align: center; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); } /* ====================================================== * ADD-23 ====================================================== */ /* ----- cmn-wrap ----- */ .cmn-wrap { background-color: #f7f7f8; } .cmn-wrap__inner > *:first-child, .cmn-wrap__inner > section:first-child > *:first-child, .cmn-wrap__inner > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ====================================================== * ADD-24 ====================================================== */ /* ----- cmn-pulldown-navi-wrap ----- */ /* ----- cmn-pulldown-navi ----- */ .cmn-pulldown-navi__inner { position: relative; border: 1px solid #c1c1c1; border-radius: 5px; background-color: #fff; } .cmn-pulldown-navi__inner:after { z-index: 0; position: absolute; top: 50%; width: 0; height: 0; margin-top: -4px; border-style: solid; border-color: #7c7c85 transparent transparent transparent; content: ""; } .cmn-pulldown-navi__select { -webkit-appearance: none; -moz-appearance: none; appearance: none; z-index: 1; position: relative; width: 100%; height: 100%; border: none; outline: none; background: none; color: #303038; line-height: 1.4; cursor: pointer; } .cmn-pulldown-navi__select::-ms-expand { display: none; } .cmn-pulldown-navi__crawling { display: none; } .cmn-pulldown-navi__list { margin: 0; padding: 0; } .cmn-pulldown-navi__list > li { list-style: none; } /* ====================================================== * ADD-26 ====================================================== */ /* ----- cmn-use-category-wrap ----- */ .cmn-use-category-wrap { margin-top: 2.0em; } .cmn-use-category-wrap--center { margin-top: 2.0em; } .cmn-use-category-wrap--left { margin-top: 2.0em; } /* ----- cmn-use-category ----- */ .cmn-use-category { background-color: #f6f7fb; } .cmn-use-category__icon-list { display: flex; flex-flow: row wrap; margin: 0; padding: 0; list-style: none; } .cmn-use-category__icon-list > li { overflow: hidden; border: 1px solid #333333; border-radius: 15px; background-color: #fff; text-align: center; vertical-align: middle; } .cmn-use-category__icon-list > li.is-disabled { border-color: #c1c1c1; background-color: #f5f5f5; color: #999; } /* ====================================================== * ADD-27 ====================================================== */ /* ----- cmn-step ----- */ .cmn-step__list { margin: 0; padding: 0; list-style: none; } .cmn-step__list > li { position: relative; } .cmn-step__list > li:first-child { margin-top: 0; } .cmn-step__head { display: flex; z-index: 1; position: relative; background-color: #fff; } .cmn-step__body > *:first-child, .cmn-step__body > section:first-child > *:first-child, .cmn-step__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-step__body:before { position: absolute; top: 0; width: 1px; height: 100%; background-color: #c1c1c1; content: ""; } .cmn-step__num { flex-shrink: 0; color: #303038; font-size: 4.0rem; line-height: 1.1; text-align: center; } /* ====================================================== * ADD-28 ====================================================== */ /* ----- cmn-conversion ----- */ .cmn-conversion { position: relative; } .cmn-conversion__image { position: relative; } .cmn-conversion__detail { display: flex; z-index: 2; position: absolute; top: 0; left: 0; align-items: center; justify-content: center; width: 100%; height: 100%; } .cmn-conversion__title { margin: 0; text-align: center; } .cmn-conversion__subtitle { text-align: center; } .cmn-conversion__button > *:first-child, .cmn-conversion__button > section:first-child > *:first-child, .cmn-conversion__button > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } /* ====================================================== * ADD-29 ====================================================== */ /* ----- cmn-heading-column ----- */ /* ----- cmn-heading-v3 ----- */ .cmn-heading-v3__inner { display: flex; } .cmn-heading-v3__head { flex-shrink: 0; } .cmn-heading-v3__body { width: 100%; } .cmn-heading-v3__title { margin: 0; color: #004f8d; font-weight: normal; } /* ====================================================== * ADD-31 ====================================================== */ /* ----- cmn-flow-arrow ----- */ .cmn-flow-arrow { display: flex; justify-content: center; } .cmn-flow-arrow__inner { position: relative; } .cmn-flow-arrow__inner:before { position: absolute; bottom: 6px; left: 50%; width: 28px !important; height: 28px !important; margin-left: -14px !important; } .cmn-flow-arrow__title { text-align: center; } /* ====================================================== * ADD-32 ====================================================== */ /* ----- jcbdebit-lnav ----- */ .jcbdebit-lnav { background-color: #004f8d; } .jcbdebit-lnav__head { display: flex; position: relative; flex-flow: row nowrap; align-items: center; } .jcbdebit-lnav__image { width: 60px; } .jcbdebit-lnav__title { line-height: 1.4; } .jcbdebit-lnav__list { display: flex; margin: 0; padding: 0; list-style: none; } .jcbdebit-lnav__list .jcbdebit-lnav__list__type { display: flex; justify-content: center; color: #fff; line-height: 1.4; } /* ====================================================== * ADD-3 ====================================================== */ /* ----- cmn-media ----- */ .cmn-media { margin: 2em 0 0 0; } .cmn-media[data-media-wraparound="true"]:after { display: block; clear: both; content: ""; } .cmn-media__head > *:first-child, .cmn-media__head > section:first-child > *:first-child, .cmn-media__head > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-media__body { flex: 1 1; } .cmn-media__body > *:first-child, .cmn-media__body > section:first-child > *:first-child, .cmn-media__body > [class^="list-wrap"] > *:first-child { margin-top: 0 !important; } .cmn-media__image { margin: 0; } .cmn-media__frame { text-align: center; } .cmn-media__caption--center { text-align: center; } .cmn-media__caption--right { text-align: right; } @media print, screen and (min-width: 768px) { .main-breadcrumb > li:after, .main-lnav__link-list .main-lnav__link-list__type:after, .footer-snav__link-list .footer-snav__link-list__type:after, .heading2-v2__link .heading2-v2__title:after, .link-list > li > [class*="__type"]:before, .link-list__type:after, .link-list__type--nolink:after, .button-v2 .button-v2__type:after, .download__link-list__type:after, .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-next:before, .anchor-navi__label:after, .cmn-flow-arrow__inner:before, .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-prev:before { width: 10px; height: 10px; } .header-megamenu__link-list .header-megamenu__link-list__type:after, .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after, .button .button__type:after { width: 10px; height: 10px; } .header-megamenu__link-list .header-megamenu__link-list__type:after, .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after, .main-lnav__link-list .main-lnav__link-list__type:after, .heading2-v2__link .heading2-v2__title:after, .link-list__type:after, .link-list__type--nolink:after, .anchor-navi__label:after, .download__link-list__type:after { top: -2px; } .footer-snav__link-list .footer-snav__link-list__type:after, .button .button__type:after, .button-v2 .button-v2__type:after { margin-top: -6px; } .util-link--blank:after, .main-lnav__link-list .main-lnav__link-list__type--blank:after, .link-list__type--blank:after, .button .button__type--blank:after, .button-v2 .button-v2__type--blank:after, .download__link-list__type--blank:after, .util-link--pdf:after, .link-list__type--pdf:after, .button .button__type--pdf:after, .button-v2 .button-v2__type--pdf:after, .download__link-list__type--pdf:after, .util-link--excel:after, .link-list__type--excel:after, .button .button__type--excel:after, .button-v2 .button-v2__type--excel:after, .download__link-list__type--excel:after, .util-link--word:after, .link-list__type--word:after, .button .button__type--word:after, .button-v2 .button-v2__type--word:after, .download__link-list__type--word:after, .util-link--powerpoint:after, .link-list__type--powerpoint:after, .button .button__type--powerpoint:after, .button-v2 .button-v2__type--powerpoint:after, .download__link-list__type--powerpoint:after, .util-link--zip:after, .link-list__type--zip:after, .button .button__type--zip:after, .button-v2 .button-v2__type--zip:after, .download__link-list__type--zip:after, .util-link--video:after, .link-list__type--video:after, .button .button__type--video:after, .button-v2 .button-v2__type--video:after, .download__link-list__type--video:after, .util-link--modal:after, .link-list__type--modal:after, .button .button__type--modal:after, .button-v2 .button-v2__type--modal:after, .download__link-list__type--modal:after, .util-link--rss:after, .link-list__type--rss:after, .button .button__type--rss:after, .button-v2 .button-v2__type--rss:after, .download__link-list__type--rss:after, .header-megamenu__link-list .header-megamenu__link-list__type--blank:after, .header-global .header-global__type:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after, .footer-link-list .footer-link-list__type--blank:after, .footer-link-list-v2 .footer-link-list-v2__type--blank:after, .footer-utility__link-list .footer-utility__link-list__type--blank:after, .footer-snav__link-list .footer-snav__link-list__type--blank:after, .figure a.figure__frame--modal:after { width: 14px; height: 14px; } .header-megamenu__link-list .header-megamenu__link-list__type--blank:after, .header-global .header-global__type:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after, .main-lnav__link-list .main-lnav__link-list__type--blank:after, .footer-snav__link-list .footer-snav__link-list__type--blank:after, .footer-link-list .footer-link-list__type--blank:after, .footer-link-list-v2 .footer-link-list-v2__type--blank:after, .footer-utility__link-list .footer-utility__link-list__type--blank:after, .link-list__type--blank:after, .link-list__type--pdf:after, .link-list__type--excel:after, .link-list__type--word:after, .link-list__type--powerpoint:after, .link-list__type--zip:after, .link-list__type--video:after, .link-list__type--modal:after, .link-list__type--rss:after, .download__link-list__type--blank:after, .download__link-list__type--pdf:after, .download__link-list__type--excel:after, .download__link-list__type--word:after, .download__link-list__type--powerpoint:after, .download__link-list__type--zip:after, .download__link-list__type--video:after, .download__link-list__type--modal:after, .download__link-list__type--rss:after { top: -2px; margin-left: 10px; } body { min-width: calc(1200px + 30px * 2); max-width: 1920px; margin: 0 auto; font-family: Arial, Hiragino Sans, "ヒラギノ角ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", Meiryo, "メイリオ", sans-serif; font-size: 1.6rem; font-weight: 500; line-height: 1.6; } body.is-accordion-image-modal-open { overflow: hidden; } a[href^="tel:"] { display: inline-block !important; color: #303038; text-decoration: none; cursor: default; pointer-events: none; } input, select, textarea, button, pre { font-family: Arial, Hiragino Sans, "ヒラギノ角ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", Meiryo, "メイリオ", sans-serif; font-size: 1.6rem; line-height: 1.6; } .util-pc-hidden { display: none !important; } .util-bold { font-weight: 700 !important; } .util-highlight--main { font-weight: 700; } .util-pc-align-left { text-align: left !important; } .util-pc-align-center { text-align: center !important; } .util-pc-align-right { text-align: right !important; } .util-pc-margin-top-auto { margin-top: auto !important; } .util-pc-margin-top-0 { margin-top: 0em !important; } .util-pc-margin-top-1 { margin-top: 1em !important; } .util-pc-margin-top-2 { margin-top: 2em !important; } .util-pc-margin-top-3 { margin-top: 3em !important; } .util-pc-margin-top-4 { margin-top: 4em !important; } .util-pc-margin-top-5 { margin-top: 5em !important; } .util-pc-margin-top-6 { margin-top: 6em !important; } .util-pc-margin-top-7 { margin-top: 7em !important; } .util-pc-margin-top-8 { margin-top: 8em !important; } .util-pc-margin-top-9 { margin-top: 9em !important; } .util-pc-margin-top-10 { margin-top: 10em !important; } .util-pc-margin-right-auto { margin-right: auto !important; } .util-pc-margin-right-0 { margin-right: 0em !important; } .util-pc-margin-right-1 { margin-right: 1em !important; } .util-pc-margin-right-2 { margin-right: 2em !important; } .util-pc-margin-right-3 { margin-right: 3em !important; } .util-pc-margin-right-4 { margin-right: 4em !important; } .util-pc-margin-right-5 { margin-right: 5em !important; } .util-pc-margin-right-6 { margin-right: 6em !important; } .util-pc-margin-right-7 { margin-right: 7em !important; } .util-pc-margin-right-8 { margin-right: 8em !important; } .util-pc-margin-right-9 { margin-right: 9em !important; } .util-pc-margin-right-10 { margin-right: 10em !important; } .util-pc-margin-bottom-auto { margin-bottom: auto !important; } .util-pc-margin-bottom-0 { margin-bottom: 0em !important; } .util-pc-margin-bottom-1 { margin-bottom: 1em !important; } .util-pc-margin-bottom-2 { margin-bottom: 2em !important; } .util-pc-margin-bottom-3 { margin-bottom: 3em !important; } .util-pc-margin-bottom-4 { margin-bottom: 4em !important; } .util-pc-margin-bottom-5 { margin-bottom: 5em !important; } .util-pc-margin-bottom-6 { margin-bottom: 6em !important; } .util-pc-margin-bottom-7 { margin-bottom: 7em !important; } .util-pc-margin-bottom-8 { margin-bottom: 8em !important; } .util-pc-margin-bottom-9 { margin-bottom: 9em !important; } .util-pc-margin-bottom-10 { margin-bottom: 10em !important; } .util-pc-margin-left-auto { margin-left: auto !important; } .util-pc-margin-left-0 { margin-left: 0em !important; } .util-pc-margin-left-1 { margin-left: 1em !important; } .util-pc-margin-left-2 { margin-left: 2em !important; } .util-pc-margin-left-3 { margin-left: 3em !important; } .util-pc-margin-left-4 { margin-left: 4em !important; } .util-pc-margin-left-5 { margin-left: 5em !important; } .util-pc-margin-left-6 { margin-left: 6em !important; } .util-pc-margin-left-7 { margin-left: 7em !important; } .util-pc-margin-left-8 { margin-left: 8em !important; } .util-pc-margin-left-9 { margin-left: 9em !important; } .util-pc-margin-left-10 { margin-left: 10em !important; } .util-pc-padding-top-0 { padding-top: 0em !important; } .util-pc-padding-top-1 { padding-top: 1em !important; } .util-pc-padding-top-2 { padding-top: 2em !important; } .util-pc-padding-top-3 { padding-top: 3em !important; } .util-pc-padding-top-4 { padding-top: 4em !important; } .util-pc-padding-top-5 { padding-top: 5em !important; } .util-pc-padding-top-6 { padding-top: 6em !important; } .util-pc-padding-top-7 { padding-top: 7em !important; } .util-pc-padding-top-8 { padding-top: 8em !important; } .util-pc-padding-top-9 { padding-top: 9em !important; } .util-pc-padding-top-10 { padding-top: 10em !important; } .util-pc-padding-right-0 { padding-right: 0em !important; } .util-pc-padding-right-1 { padding-right: 1em !important; } .util-pc-padding-right-2 { padding-right: 2em !important; } .util-pc-padding-right-3 { padding-right: 3em !important; } .util-pc-padding-right-4 { padding-right: 4em !important; } .util-pc-padding-right-5 { padding-right: 5em !important; } .util-pc-padding-right-6 { padding-right: 6em !important; } .util-pc-padding-right-7 { padding-right: 7em !important; } .util-pc-padding-right-8 { padding-right: 8em !important; } .util-pc-padding-right-9 { padding-right: 9em !important; } .util-pc-padding-right-10 { padding-right: 10em !important; } .util-pc-padding-bottom-0 { padding-bottom: 0em !important; } .util-pc-padding-bottom-1 { padding-bottom: 1em !important; } .util-pc-padding-bottom-2 { padding-bottom: 2em !important; } .util-pc-padding-bottom-3 { padding-bottom: 3em !important; } .util-pc-padding-bottom-4 { padding-bottom: 4em !important; } .util-pc-padding-bottom-5 { padding-bottom: 5em !important; } .util-pc-padding-bottom-6 { padding-bottom: 6em !important; } .util-pc-padding-bottom-7 { padding-bottom: 7em !important; } .util-pc-padding-bottom-8 { padding-bottom: 8em !important; } .util-pc-padding-bottom-9 { padding-bottom: 9em !important; } .util-pc-padding-bottom-10 { padding-bottom: 10em !important; } .util-pc-padding-left-0 { padding-left: 0em !important; } .util-pc-padding-left-1 { padding-left: 1em !important; } .util-pc-padding-left-2 { padding-left: 2em !important; } .util-pc-padding-left-3 { padding-left: 3em !important; } .util-pc-padding-left-4 { padding-left: 4em !important; } .util-pc-padding-left-5 { padding-left: 5em !important; } .util-pc-padding-left-6 { padding-left: 6em !important; } .util-pc-padding-left-7 { padding-left: 7em !important; } .util-pc-padding-left-8 { padding-left: 8em !important; } .util-pc-padding-left-9 { padding-left: 9em !important; } .util-pc-padding-left-10 { padding-left: 10em !important; } .util-link:hover:link, .util-link--blank:hover:link, .util-link--pdf:hover:link, .util-link--excel:hover:link, .util-link--word:hover:link, .util-link--powerpoint:hover:link, .util-link--zip:hover:link, .util-link--video:hover:link, .util-link--modal:hover:link, .util-link--rss:hover:link { text-decoration: none; } [data-col-pc]:not([data-col-pc="1"]) { display: flex; flex-flow: row wrap; width: 100%; } [data-col-pc]:not([data-col-pc="auto"]) > * { margin-top: 2em; margin-left: 36px; } [data-col-pc="1"] > *:nth-child(-n+1) { margin-top: 0 !important; } [data-col-pc="1"] > *:nth-child(1n+1) { margin-left: 0 !important; } [data-col-pc="1"] > * { width: 100%; } [data-col-pc="2"] > *:nth-child(-n+2) { margin-top: 0 !important; } [data-col-pc="2"] > *:nth-child(2n+1) { margin-left: 0 !important; } [data-col-pc="2"] > * { width: calc(((100% - (36px)) / 2) - .1px); } [data-col-pc="3"] > *:nth-child(-n+3) { margin-top: 0 !important; } [data-col-pc="3"] > *:nth-child(3n+1) { margin-left: 0 !important; } [data-col-pc="3"] > * { width: calc(((100% - (72px)) / 3) - .1px); } [data-col-pc="4"] > *:nth-child(-n+4) { margin-top: 0 !important; } [data-col-pc="4"] > *:nth-child(4n+1) { margin-left: 0 !important; } [data-col-pc="4"] > * { width: calc(((100% - (108px)) / 4) - .1px); } [data-col-pc="5"] > *:nth-child(-n+5) { margin-top: 0 !important; } [data-col-pc="5"] > *:nth-child(5n+1) { margin-left: 0 !important; } [data-col-pc="5"] > * { width: calc(((100% - (144px)) / 5) - .1px); } [data-col-pc="6"] > *:nth-child(-n+6) { margin-top: 0 !important; } [data-col-pc="6"] > *:nth-child(6n+1) { margin-left: 0 !important; } [data-col-pc="6"] > * { width: calc(((100% - (180px)) / 6) - .1px); } [data-col-pc="auto"] { margin-right: -36px; margin-bottom: -1em; } [data-col-pc="auto"] > * { margin-top: 0 !important; margin-right: 36px; margin-bottom: 1em; margin-left: 0; } [data-size-pc="1col"] { width: 100%; } [data-size-pc="1col"] > * { width: 100%; } [data-size-pc="2col"] { width: calc(((100% - (36px * (2 - 1))) / 2) - .1px); } [data-size-pc="1/2col"] { width: calc(100% - (((100% - (36px * (2 - 1))) / 2) - .1px) - 36px) !important; } [data-size-pc="2col"] > * { width: 100%; } [data-size-pc="3col"] { width: calc(((100% - (36px * (3 - 1))) / 3) - .1px); } [data-size-pc="2/3col"] { width: calc(100% - (((100% - (36px * (3 - 1))) / 3) - .1px) - 36px) !important; } [data-size-pc="3col"] > * { width: 100%; } [data-size-pc="4col"] { width: calc(((100% - (36px * (4 - 1))) / 4) - .1px); } [data-size-pc="3/4col"] { width: calc(100% - (((100% - (36px * (4 - 1))) / 4) - .1px) - 36px) !important; } [data-size-pc="4col"] > * { width: 100%; } [data-size-pc="5col"] { width: calc(((100% - (36px * (5 - 1))) / 5) - .1px); } [data-size-pc="4/5col"] { width: calc(100% - (((100% - (36px * (5 - 1))) / 5) - .1px) - 36px) !important; } [data-size-pc="5col"] > * { width: 100%; } [data-size-pc="6col"] { width: calc(((100% - (36px * (6 - 1))) / 6) - .1px); } [data-size-pc="5/6col"] { width: calc(100% - (((100% - (36px * (6 - 1))) / 6) - .1px) - 36px) !important; } [data-size-pc="6col"] > * { width: 100%; } [data-size-pc="1per"] { width: 1% !important; } [data-size-pc="1per"] > * { width: 100%; } [data-size-pc="2per"] { width: 2% !important; } [data-size-pc="2per"] > * { width: 100%; } [data-size-pc="3per"] { width: 3% !important; } [data-size-pc="3per"] > * { width: 100%; } [data-size-pc="4per"] { width: 4% !important; } [data-size-pc="4per"] > * { width: 100%; } [data-size-pc="5per"] { width: 5% !important; } [data-size-pc="5per"] > * { width: 100%; } [data-size-pc="6per"] { width: 6% !important; } [data-size-pc="6per"] > * { width: 100%; } [data-size-pc="7per"] { width: 7% !important; } [data-size-pc="7per"] > * { width: 100%; } [data-size-pc="8per"] { width: 8% !important; } [data-size-pc="8per"] > * { width: 100%; } [data-size-pc="9per"] { width: 9% !important; } [data-size-pc="9per"] > * { width: 100%; } [data-size-pc="10per"] { width: 10% !important; } [data-size-pc="10per"] > * { width: 100%; } [data-size-pc="11per"] { width: 11% !important; } [data-size-pc="11per"] > * { width: 100%; } [data-size-pc="12per"] { width: 12% !important; } [data-size-pc="12per"] > * { width: 100%; } [data-size-pc="13per"] { width: 13% !important; } [data-size-pc="13per"] > * { width: 100%; } [data-size-pc="14per"] { width: 14% !important; } [data-size-pc="14per"] > * { width: 100%; } [data-size-pc="15per"] { width: 15% !important; } [data-size-pc="15per"] > * { width: 100%; } [data-size-pc="16per"] { width: 16% !important; } [data-size-pc="16per"] > * { width: 100%; } [data-size-pc="17per"] { width: 17% !important; } [data-size-pc="17per"] > * { width: 100%; } [data-size-pc="18per"] { width: 18% !important; } [data-size-pc="18per"] > * { width: 100%; } [data-size-pc="19per"] { width: 19% !important; } [data-size-pc="19per"] > * { width: 100%; } [data-size-pc="20per"] { width: 20% !important; } [data-size-pc="20per"] > * { width: 100%; } [data-size-pc="21per"] { width: 21% !important; } [data-size-pc="21per"] > * { width: 100%; } [data-size-pc="22per"] { width: 22% !important; } [data-size-pc="22per"] > * { width: 100%; } [data-size-pc="23per"] { width: 23% !important; } [data-size-pc="23per"] > * { width: 100%; } [data-size-pc="24per"] { width: 24% !important; } [data-size-pc="24per"] > * { width: 100%; } [data-size-pc="25per"] { width: 25% !important; } [data-size-pc="25per"] > * { width: 100%; } [data-size-pc="26per"] { width: 26% !important; } [data-size-pc="26per"] > * { width: 100%; } [data-size-pc="27per"] { width: 27% !important; } [data-size-pc="27per"] > * { width: 100%; } [data-size-pc="28per"] { width: 28% !important; } [data-size-pc="28per"] > * { width: 100%; } [data-size-pc="29per"] { width: 29% !important; } [data-size-pc="29per"] > * { width: 100%; } [data-size-pc="30per"] { width: 30% !important; } [data-size-pc="30per"] > * { width: 100%; } [data-size-pc="31per"] { width: 31% !important; } [data-size-pc="31per"] > * { width: 100%; } [data-size-pc="32per"] { width: 32% !important; } [data-size-pc="32per"] > * { width: 100%; } [data-size-pc="33per"] { width: 33% !important; } [data-size-pc="33per"] > * { width: 100%; } [data-size-pc="34per"] { width: 34% !important; } [data-size-pc="34per"] > * { width: 100%; } [data-size-pc="35per"] { width: 35% !important; } [data-size-pc="35per"] > * { width: 100%; } [data-size-pc="36per"] { width: 36% !important; } [data-size-pc="36per"] > * { width: 100%; } [data-size-pc="37per"] { width: 37% !important; } [data-size-pc="37per"] > * { width: 100%; } [data-size-pc="38per"] { width: 38% !important; } [data-size-pc="38per"] > * { width: 100%; } [data-size-pc="39per"] { width: 39% !important; } [data-size-pc="39per"] > * { width: 100%; } [data-size-pc="40per"] { width: 40% !important; } [data-size-pc="40per"] > * { width: 100%; } [data-size-pc="41per"] { width: 41% !important; } [data-size-pc="41per"] > * { width: 100%; } [data-size-pc="42per"] { width: 42% !important; } [data-size-pc="42per"] > * { width: 100%; } [data-size-pc="43per"] { width: 43% !important; } [data-size-pc="43per"] > * { width: 100%; } [data-size-pc="44per"] { width: 44% !important; } [data-size-pc="44per"] > * { width: 100%; } [data-size-pc="45per"] { width: 45% !important; } [data-size-pc="45per"] > * { width: 100%; } [data-size-pc="46per"] { width: 46% !important; } [data-size-pc="46per"] > * { width: 100%; } [data-size-pc="47per"] { width: 47% !important; } [data-size-pc="47per"] > * { width: 100%; } [data-size-pc="48per"] { width: 48% !important; } [data-size-pc="48per"] > * { width: 100%; } [data-size-pc="49per"] { width: 49% !important; } [data-size-pc="49per"] > * { width: 100%; } [data-size-pc="50per"] { width: 50% !important; } [data-size-pc="50per"] > * { width: 100%; } [data-size-pc="51per"] { width: 51% !important; } [data-size-pc="51per"] > * { width: 100%; } [data-size-pc="52per"] { width: 52% !important; } [data-size-pc="52per"] > * { width: 100%; } [data-size-pc="53per"] { width: 53% !important; } [data-size-pc="53per"] > * { width: 100%; } [data-size-pc="54per"] { width: 54% !important; } [data-size-pc="54per"] > * { width: 100%; } [data-size-pc="55per"] { width: 55% !important; } [data-size-pc="55per"] > * { width: 100%; } [data-size-pc="56per"] { width: 56% !important; } [data-size-pc="56per"] > * { width: 100%; } [data-size-pc="57per"] { width: 57% !important; } [data-size-pc="57per"] > * { width: 100%; } [data-size-pc="58per"] { width: 58% !important; } [data-size-pc="58per"] > * { width: 100%; } [data-size-pc="59per"] { width: 59% !important; } [data-size-pc="59per"] > * { width: 100%; } [data-size-pc="60per"] { width: 60% !important; } [data-size-pc="60per"] > * { width: 100%; } [data-size-pc="61per"] { width: 61% !important; } [data-size-pc="61per"] > * { width: 100%; } [data-size-pc="62per"] { width: 62% !important; } [data-size-pc="62per"] > * { width: 100%; } [data-size-pc="63per"] { width: 63% !important; } [data-size-pc="63per"] > * { width: 100%; } [data-size-pc="64per"] { width: 64% !important; } [data-size-pc="64per"] > * { width: 100%; } [data-size-pc="65per"] { width: 65% !important; } [data-size-pc="65per"] > * { width: 100%; } [data-size-pc="66per"] { width: 66% !important; } [data-size-pc="66per"] > * { width: 100%; } [data-size-pc="67per"] { width: 67% !important; } [data-size-pc="67per"] > * { width: 100%; } [data-size-pc="68per"] { width: 68% !important; } [data-size-pc="68per"] > * { width: 100%; } [data-size-pc="69per"] { width: 69% !important; } [data-size-pc="69per"] > * { width: 100%; } [data-size-pc="70per"] { width: 70% !important; } [data-size-pc="70per"] > * { width: 100%; } [data-size-pc="71per"] { width: 71% !important; } [data-size-pc="71per"] > * { width: 100%; } [data-size-pc="72per"] { width: 72% !important; } [data-size-pc="72per"] > * { width: 100%; } [data-size-pc="73per"] { width: 73% !important; } [data-size-pc="73per"] > * { width: 100%; } [data-size-pc="74per"] { width: 74% !important; } [data-size-pc="74per"] > * { width: 100%; } [data-size-pc="75per"] { width: 75% !important; } [data-size-pc="75per"] > * { width: 100%; } [data-size-pc="76per"] { width: 76% !important; } [data-size-pc="76per"] > * { width: 100%; } [data-size-pc="77per"] { width: 77% !important; } [data-size-pc="77per"] > * { width: 100%; } [data-size-pc="78per"] { width: 78% !important; } [data-size-pc="78per"] > * { width: 100%; } [data-size-pc="79per"] { width: 79% !important; } [data-size-pc="79per"] > * { width: 100%; } [data-size-pc="80per"] { width: 80% !important; } [data-size-pc="80per"] > * { width: 100%; } [data-size-pc="81per"] { width: 81% !important; } [data-size-pc="81per"] > * { width: 100%; } [data-size-pc="82per"] { width: 82% !important; } [data-size-pc="82per"] > * { width: 100%; } [data-size-pc="83per"] { width: 83% !important; } [data-size-pc="83per"] > * { width: 100%; } [data-size-pc="84per"] { width: 84% !important; } [data-size-pc="84per"] > * { width: 100%; } [data-size-pc="85per"] { width: 85% !important; } [data-size-pc="85per"] > * { width: 100%; } [data-size-pc="86per"] { width: 86% !important; } [data-size-pc="86per"] > * { width: 100%; } [data-size-pc="87per"] { width: 87% !important; } [data-size-pc="87per"] > * { width: 100%; } [data-size-pc="88per"] { width: 88% !important; } [data-size-pc="88per"] > * { width: 100%; } [data-size-pc="89per"] { width: 89% !important; } [data-size-pc="89per"] > * { width: 100%; } [data-size-pc="90per"] { width: 90% !important; } [data-size-pc="90per"] > * { width: 100%; } [data-size-pc="91per"] { width: 91% !important; } [data-size-pc="91per"] > * { width: 100%; } [data-size-pc="92per"] { width: 92% !important; } [data-size-pc="92per"] > * { width: 100%; } [data-size-pc="93per"] { width: 93% !important; } [data-size-pc="93per"] > * { width: 100%; } [data-size-pc="94per"] { width: 94% !important; } [data-size-pc="94per"] > * { width: 100%; } [data-size-pc="95per"] { width: 95% !important; } [data-size-pc="95per"] > * { width: 100%; } [data-size-pc="96per"] { width: 96% !important; } [data-size-pc="96per"] > * { width: 100%; } [data-size-pc="97per"] { width: 97% !important; } [data-size-pc="97per"] > * { width: 100%; } [data-size-pc="98per"] { width: 98% !important; } [data-size-pc="98per"] > * { width: 100%; } [data-size-pc="99per"] { width: 99% !important; } [data-size-pc="99per"] > * { width: 100%; } [data-size-pc="100per"] { width: 100% !important; } [data-size-pc="100per"] > * { width: 100%; } .Header { min-width: calc(1200px + 30px * 2); } .Header:not([data-header-layout="simple"]) { min-height: 116px; } .Header[data-header-layout="simple"] { min-height: 91px; } .Header__inner { align-items: flex-start; padding: 0 30px; } body.is-scroll-down .Header:not([data-header-layout="simple"]) { top: -116px; } .Header__head { flex-shrink: 0; } .header-logo { padding-top: 12px; } .header-logo > a { flex-direction: column; } .header-logo__image__pc-hidden { display: none; } .header-logo__tagline { margin-bottom: 7px; font-size: 1.3rem; font-weight: 500; line-height: 1.4; } .Header__body { width: 100%; padding-top: 10px; } .header-menu__button { display: none; } .header-menu__panel { display: flex !important; flex-flow: row wrap; align-items: flex-start; justify-content: flex-end; margin-left: 16px; } .header-gnav { order: 2; margin-top: 14px; width: 100%; } .header-gnav__list { display: flex; flex-flow: row nowrap; } .header-gnav__list > li { position: relative; width: calc(100% / 4); border-radius: 5px 5px 0 0; transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .header-gnav__list > li.is-active { background-color: rgba(255, 255, 255, 0.2); } .header-gnav .header-gnav__type--toggle { padding: 1.0em 1.7em 1.2em; border-radius: 5px 5px 0 0; font-size: 1.6rem; font-weight: 700; transition: none; } .header-gnav .header-gnav__type--toggle:hover { text-decoration: underline; } .header-megamenu { display: none; z-index: 1; position: relative; } .header-megamenu__inner { padding: .5em 1.7em 2.4em; } .header-megamenu__link-list > li { margin-top: .45em; } .header-megamenu__link-list > li:first-child { margin-top: 0; } .header-megamenu__link-list .header-megamenu__link-list__type, .header-megamenu__link-list .header-megamenu__link-list__type--blank { display: inline-block; color: #fff; font-size: 1.4rem; } .header-megamenu__link-list .header-megamenu__link-list__type:hover, .header-megamenu__link-list .header-megamenu__link-list__type--blank:hover { text-decoration: underline; } .header-megamenu__link-list .header-megamenu__link-list__type:after { width: 8px; height: 8px; } .header-megamenu__section .header-megamenu__section__title { font-size: 1.4rem; font-weight: 700; color: #fff; } .header-megamenu__section + .header-megamenu__section { margin-top: 1.7em; } .header-megamenu__section .header-megamenu__section__body { margin-top: .5em; } .header-search { margin-right: 20px; } .header-search__form { display: block !important; z-index: 2; width: 217px; overflow: hidden; } .header-search__input { height: 33px; padding: 0; padding: 0 2.5em 0 1.0em; border: none; outline: none; } .header-search__submit { z-index: 1; width: 40px; height: 33px; transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .header-search__submit:hover { opacity: 0.7; } .header-utility { display: flex; align-items: center; justify-content: flex-end; order: 1; width: 100%; } .header-global .header-global__type { display: inline-block; color: #fff; font-size: 1.4rem; } .header-global .header-global__type:hover { text-decoration: underline; } .Header:not([data-header-layout="simple"]) + .Main { margin-top: 116px; } .main-breadcrumb { width: 100%; max-width: calc(1200px + 30px * 2); margin: 0 auto; padding: 1em 30px 0.8em; } .main-breadcrumb > li { margin-right: 1.0em; padding-right: 1.4em; } .main-breadcrumb > li:after { right: 4px; } .main-breadcrumb > li:last-of-type > [class*="__type"] { font-weight: 700; } .main-breadcrumb__type:hover { text-decoration: underline; } .Main__content { max-width: calc(1200px + 30px * 2); padding: 3em 30px 5em; } .Main__foot .main-breadcrumb-wrap { display: none; } .main-lnav__inner { max-width: calc(1200px + 30px * 2); margin: 0 auto; padding: 0 30px 5em; } .main-lnav__title { font-size: 3.0rem; } .main-lnav__card-wrap { margin-top: 2.0em; } .main-lnav__card .main-lnav__card__type:hover .main-lnav__card__title { text-decoration: underline; } .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after { width: 8px; height: 8px; } .main-lnav__card__body { padding: 0 1.0em; } .main-lnav__card__title { font-size: 2.2rem; font-weight: 700; } .main-lnav__card__description { margin: .6em 0 0; font-size: 1.4rem; } .main-lnav__card-v2__body { padding: 0 1.0em .6em; } .main-lnav__card-v2__title { font-size: 2.2rem; } .main-lnav__card-v2__link-list > li { margin-top: .6em; } .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:hover { text-decoration: underline; } .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after { width: 8px; height: 8px; } .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:hover { text-decoration: underline; } .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after { top: -3px; } .main-lnav__list-wrap { margin-top: .8em; } .main-lnav__link-list > li { margin-top: .6em; } .main-lnav__link-list .main-lnav__link-list__type:hover, .main-lnav__link-list .main-lnav__link-list__type--blank:hover { text-decoration: underline; } .main-lnav__link-list .main-lnav__link-list__type:after { width: 8px; height: 8px; } .main-lnav__link-list .main-lnav__link-list__type--blank:after { top: -3px; margin-left: 7px; } .main-overlay { cursor: pointer; } .Footer__head__inner { max-width: calc(1200px + 30px * 2); margin: 0 auto; padding: 3em 30px 2.8em; } .footer-snav { display: flex; flex-flow: row nowrap; } .footer-snav__item { width: calc((100% - 35px)/4); margin-left: 35px; } .footer-snav__item:first-child { margin-left: 0; } .footer-snav__item .footer-snav__item__head { font-weight: 700; } .footer-snav__item .footer-snav__item__head:hover { text-decoration: underline; } .footer-snav__item__body { display: block !important; margin-top: 1.6em; } .footer-snav__link-list { margin: 1.6em 0 0; } .footer-snav__link-list > li { margin-top: .6em; } .footer-snav__link-list > li:first-child { margin-top: 0; } .footer-snav__link-list .footer-snav__link-list__type, .footer-snav__link-list .footer-snav__link-list__type--blank { font-size: 1.4rem; } .footer-snav__link-list .footer-snav__link-list__type:hover, .footer-snav__link-list .footer-snav__link-list__type--blank:hover { text-decoration: underline; } .footer-snav__link-list .footer-snav__link-list__type:after { content: none; } .footer-snav__link-list__external-text { margin: 2px 0 0; font-size: 1.2rem; } .footer-snav__section + .footer-snav__section { margin-top: 1.4em; } .footer-snav__section__title { font-size: 1.6rem; color: #7c7c85; line-height: 1.625; } .footer-snav__section__body { margin-top: .8em; } .footer-snav__section__body > *:first-child, .footer-snav__section__body > section:first-child > *:first-child { margin-top: 0 !important; } .Footer__body { max-width: calc(1200px + 30px * 2); margin: 0 auto; padding: 1.5em 30px 0; } .footer-logo { margin-right: 0.875em; } .footer-logo__image { width: 52px; } .footer-link-list > li { margin-right: 1.8em; } .footer-link-list .footer-link-list__type, .footer-link-list .footer-link-list__type--blank { font-size: 1.4rem; } .footer-link-list .footer-link-list__type:hover, .footer-link-list .footer-link-list__type--blank:hover { text-decoration: underline; } .footer-link-list-wrap-v2 { margin-top: 0.2em; } .footer-link-list-v2 > li { margin-right: 1.625em; } .footer-link-list-v2 .footer-link-list-v2__type:hover, .footer-link-list-v2 .footer-link-list-v2__type--blank:hover { text-decoration: underline; } .footer-sns { margin-top: 0.8em; } .footer-sns__list > li { width: 30px; margin-left: .75em; } .footer-sns__list__type:hover { opacity: 0.7; } .Footer__foot { padding: 0 30px; } .Footer .Footer__foot { max-width: calc(1200px + 30px * 2); margin: 0 auto; } .Footer__foot__inner { align-items: flex-end; } .Footer:not([data-footer-layout="simple"]) .Footer__foot__inner { padding: 1.2em 0 2.0em; } .Footer[data-footer-layout="simple"] .Footer__foot__inner { justify-content: space-between; padding: 1.2em 0 1.3em; } .footer-utility__link-list > li { margin-right: 1.625em; } .Footer[data-footer-layout="simple"] .footer-utility__link-list { display: flex; flex-flow: row wrap; } .footer-utility__link-list .footer-utility__link-list__type:hover, .footer-utility__link-list .footer-utility__link-list__type--blank:hover { text-decoration: underline; } .footer-copyright__label { font-size: 1.1rem; } .assist-banner { right: 58px; bottom: 50px; width: 173px; height: 148px; } .assist-banner__type { padding: 20px; border-radius: 4px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); } .assist-banner__type:hover > img { opacity: 0.7; } .assist-banner__type > img { transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .assist-banner__close { top: -8px; right: -8px; width: 29px; height: 29px; transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .assist-banner__close:hover { background-color: #026cb2; } .assist-banner__close:before, .assist-banner__close:after { width: 14px; margin-left: -7px; } .Main__content .heading1 + * { margin-top: 2.2em; } .heading1__title { font-size: 3.2rem; font-weight: 700; } .heading1__subtitle { font-size: 1.4rem; } .Main__content .heading1--center + * { margin-top: 2.2em; } .heading1--center__title { font-size: 3.2rem; font-weight: 700; } .heading1--center__subtitle { font-size: 1.4rem; } .heading1 { display: flex; align-items: center; width: 100vw; margin-left: calc(50% - 50vw); padding: 3.0em 0 0; } .heading1__inner { width: 100%; max-width: calc(1200px + 30px * 2); margin: 0 auto; padding: 0 30px; } .heading1__title { font-size: 3.8rem; font-weight: 700; } .heading1__title > sup { top: -1.2em; font-size: 1.6rem; font-weight: 500; } .heading1__subtitle { margin: .8em 0; font-size: 1.6rem; } .heading2 { margin: 5em 0 0; } .Main .heading2 + * { margin-top: 2.0em; } .heading2__title { font-size: 2.8rem; font-weight: 700; } .heading2__subtitle { font-size: 1.4rem; } .heading2--center { margin: 5em 0 0; } .Main .heading2--center + * { margin-top: 2.0em; } .heading2--center__title { font-size: 2.8rem; font-weight: 700; } .heading2--center__subtitle { font-size: 1.4rem; } .heading2 { margin: 5em 0 0; } .Main .heading2 + * { margin-top: 2.6em; } .heading2__inner:before { width: 240px; height: 2px; } .heading2__link:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--blank:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--pdf:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--excel:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--word:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--powerpoint:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--zip:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--video:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--modal:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__link--rss:hover .heading2__title { color: #008eed; text-decoration: underline; } .heading2__title { font-size: 3.4rem; font-weight: 700; } .heading2__title > sup { top: -.6em; font-size: 1.6rem; } .heading2__subtitle { margin: .4em 0 0; font-size: 1.6rem; font-weight: 700; } .heading2__filesize { font-size: 1.6rem; font-weight: 500; line-height: 2.25; } .heading2-v2 { margin: 5em 0 0; } .Main .heading2-v2 + * { margin-top: 2.0em; } .heading2-v2__title { font-size: 2.8rem; font-weight: 700; } .heading2-v2__subtitle { font-size: 1.4rem; } .heading2-v2--center { margin: 5em 0 0; } .Main .heading2-v2--center + * { margin-top: 2.0em; } .heading2-v2--center__title { font-size: 2.8rem; font-weight: 700; } .heading2-v2--center__subtitle { font-size: 1.4rem; } .heading2-v2 { margin: 5em 0 0; } .Main .heading2-v2 + * { margin-top: 2.6em; } .heading2-v2__link:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link .heading2-v2__title:after { top: -3px; width: 12px; height: 12px; margin-left: 10px; } .heading2-v2__link--blank:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--pdf:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--excel:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--word:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--powerpoint:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--zip:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--video:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--modal:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__link--rss:hover .heading2-v2__title { color: #008eed; text-decoration: underline; } .heading2-v2__title { font-size: 3.4rem; font-weight: 700; } .heading2-v2__title > sup { top: -.6em; font-size: 1.6rem; } .heading2-v2__subtitle { margin: .4em 0 0; font-size: 1.6rem; font-weight: 700; } .heading2-v2__filesize { font-size: 1.6rem; font-weight: 500; line-height: 2.25; } .heading3 { margin: 4em 0 0; } .Main .heading3 + * { margin-top: 1.6em; } .heading3__title { font-size: 2.4rem; font-weight: 700; } .heading3__subtitle { font-size: 1.4rem; } .heading3--center { margin: 4em 0 0; } .Main .heading3--center + * { margin-top: 1.6em; } .heading3--center__title { font-size: 2.4rem; font-weight: 700; } .heading3--center__subtitle { font-size: 1.4rem; } .heading3 { margin: 4em 0 0; } .Main .heading3 + * { margin-top: 2.4em; } .heading3__inner { padding-bottom: .7em; } .heading3__link:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--blank:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--pdf:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--excel:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--word:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--powerpoint:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--zip:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--video:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--modal:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__link--rss:hover .heading3__title { color: #008eed; text-decoration: underline; } .heading3__title { font-size: 3.2rem; font-weight: 700; } .heading3__title > sup { top: -.6em; font-size: 1.6rem; } .heading4 { margin: 3em 0 0; } .Main .heading4 + * { margin-top: 1.2em; } .heading4__title { font-size: 2.0rem; font-weight: 700; } .heading4__subtitle { font-size: 1.4rem; } .heading4--center { margin: 3em 0 0; } .Main .heading4--center + * { margin-top: 1.2em; } .heading4--center__title { font-size: 2.0rem; font-weight: 700; } .heading4--center__subtitle { font-size: 1.4rem; } .heading4 { margin: 3em 0 0; } .Main .heading4 + * { margin-top: 1.4em; } .heading4__inner { padding-bottom: .6em; } .heading4__title { font-size: 2.8rem; font-weight: 700; } .heading4__title > sup { top: -.3em; font-size: 1.6rem; } .heading-title-pic { margin: 2.6em 0 0; } .Main .heading-title-pic + * { margin-top: 1.2em; } .heading-title-pic__title { font-size: 1.8rem; font-weight: 700; } .heading-title-pic__subtitle { font-size: 1.4rem; } .heading-title-pic--center { margin: 2.6em 0 0; } .Main .heading-title-pic--center + * { margin-top: 1.2em; } .heading-title-pic--center__title { font-size: 1.8rem; font-weight: 700; } .heading-title-pic--center__subtitle { font-size: 1.4rem; } .heading-title-pic { margin: 2.6em 0 0; } .Main .heading-title-pic + * { margin-top: 1.0em; } .heading-title-pic__inner { display: flex; align-items: center; } .heading-title-pic__icon { flex-shrink: 0; width: 52px; margin-right: 1.4em; } .heading-title-pic__title { font-size: 2.2rem; font-weight: 500; } .text { font-size: 1.6rem; } .text--center { font-size: 1.6rem; } .text--right { font-size: 1.6rem; } .lead { font-weight: 700; } .lead--center { font-weight: 700; } .lead { margin: .8em 0 0; font-size: 2.0rem; font-weight: 700; } .lead--center { margin: .8em 0 0; font-size: 2.0rem; font-weight: 700; } .note-list > li { font-size: 1.6rem; } .note-list__nest { margin: .6em 0 0; } [class*="list__nest"] .note-list[data-col-pc] > li { margin-top: .6em; } [class*="list__nest"] .note-list[data-col-pc="auto"] > li { margin: 0 36px .6em 0; } [class*="list-v2__nest"] .note-list[data-col-pc] > li { margin-top: .4em; } [class*="list-v2__nest"] .note-list[data-col-pc="auto"] > li { margin: 0 36px .4em 0; } .note-list[data-col-pc] > li:first-child { margin-top: 0; } .note-list > li { margin: 0; padding-left: 1.4em; font-size: 1.4rem; } .note-list__nest { margin: .6em 0 .8em; font-size: 1.6rem; } .note-list__nest [data-col-pc="auto"] { margin-bottom: 0 !important; } .note-list[data-col-pc] > li { margin-top: 0; } .note-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } [class*="list__nest"] .note-list[data-col-pc] > li { margin-top: 0; } [class*="list__nest"] .note-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } .unorder-list > li { font-size: 1.6rem; } .unorder-list__nest { margin: .6em 0 0; } [class*="list__nest"] .unorder-list[data-col-pc] > li { margin-top: .6em; } [class*="list__nest"] .unorder-list[data-col-pc="auto"] > li { margin: 0 36px .6em 0; } [class*="list-v2__nest"] .unorder-list[data-col-pc] > li { margin-top: .4em; } [class*="list-v2__nest"] .unorder-list[data-col-pc="auto"] > li { margin: 0 36px .4em 0; } .unorder-list[data-col-pc] > li:first-child { margin-top: 0; } .unorder-list__nest { margin: .6em 0 .8em; } .unorder-list__nest [data-col-pc="auto"] { margin-bottom: 0 !important; } .unorder-list[data-col-pc] > li { margin-top: 0; } .unorder-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } [class*="list__nest"] .unorder-list[data-col-pc] > li { margin-top: 0; } [class*="list__nest"] .unorder-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } .unorder-list-v2 > li { font-size: 1.6rem; } .unorder-list-v2__nest { margin: .6em 0 0; } [class*="list__nest"] .unorder-list-v2[data-col-pc] > li { margin-top: .6em; } [class*="list__nest"] .unorder-list-v2[data-col-pc="auto"] > li { margin: 0 36px .6em 0; } [class*="list-v2__nest"] .unorder-list-v2[data-col-pc] > li { margin-top: .4em; } [class*="list-v2__nest"] .unorder-list-v2[data-col-pc="auto"] > li { margin: 0 36px .4em 0; } .unorder-list-v2[data-col-pc] > li:first-child { margin-top: 0; } .unorder-list-v2[data-col-pc] > li { margin-top: .8em; } .unorder-list-v2[data-col-pc="auto"] > li { margin: 0 36px .8em 0; } .order-list > li { font-size: 1.6rem; } .order-list__nest { margin: .6em 0 0; } [class*="list__nest"] .order-list[data-col-pc] > li { margin-top: .6em; } [class*="list__nest"] .order-list[data-col-pc="auto"] > li { margin: 0 36px .6em 0; } [class*="list-v2__nest"] .order-list[data-col-pc] > li { margin-top: .4em; } [class*="list-v2__nest"] .order-list[data-col-pc="auto"] > li { margin: 0 36px .4em 0; } .order-list[data-col-pc] > li:first-child { margin-top: 0; } .order-list__mark { font-weight: 700; } .order-list__nest { margin: .6em 0 .8em; } .order-list__nest [data-col-pc="auto"] { margin-bottom: 0 !important; } .order-list[data-col-pc] > li { margin-top: 0; } .order-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } [class*="list__nest"] .order-list[data-col-pc] > li { margin-top: 0; } [class*="list__nest"] .order-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } .link-list > li { font-size: 1.6rem; } .link-list > li > [class*="__type"]:hover { text-decoration: underline; } .link-list__type--nolink:hover { text-decoration: none !important; } .link-list__type--blank:hover { text-decoration: underline; } .link-list__type--pdf:hover { text-decoration: underline; } .link-list__type--excel:hover { text-decoration: underline; } .link-list__type--word:hover { text-decoration: underline; } .link-list__type--powerpoint:hover { text-decoration: underline; } .link-list__type--zip:hover { text-decoration: underline; } .link-list__type--video:hover { text-decoration: underline; } .link-list__type--modal:hover { text-decoration: underline; } [class*="modal--"].modaal-wrapper .modaal-container { padding: 60px 40px 40px; } [class*="modal--"].modaal-wrapper .modaal-close { top: 15px; right: 15px; width: 36px; height: 36px; } [class*="modal--"].modaal-wrapper .modaal-close:hover { opacity: 0.7; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 22px; height: 2px; margin: -1px 0 0 -11px; } .link-list__type--rss:hover { text-decoration: underline; } .link-list__filesize { font-weight: 500; } .link-list__nest { margin: .6em 0 0; } [class*="list__nest"] .link-list[data-col-pc] > li { margin-top: .6em; } [class*="list__nest"] .link-list[data-col-pc="auto"] > li { margin: 0 36px .6em 0; } [class*="list-v2__nest"] .link-list[data-col-pc] > li { margin-top: .4em; } [class*="list-v2__nest"] .link-list[data-col-pc="auto"] > li { margin: 0 36px .4em 0; } .link-list[data-col-pc] > li:first-child { margin-top: 0; } .link-list__nest { margin: .6em 0 .8em; } .link-list__nest [data-col-pc="auto"] { margin-bottom: 0 !important; } .link-list[data-col-pc] > li { margin-top: 0; } .link-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } [class*="list__nest"] .link-list[data-col-pc] > li { margin-top: 0; } [class*="list__nest"] .link-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } .note-order-list > li { font-size: 1.6rem; } .note-order-list__nest { margin: .6em 0 0; } [class*="list__nest"] .note-order-list[data-col-pc] > li { margin-top: .6em; } [class*="list__nest"] .note-order-list[data-col-pc="auto"] > li { margin: 0 36px .6em 0; } [class*="list-v2__nest"] .note-order-list[data-col-pc] > li { margin-top: .4em; } [class*="list-v2__nest"] .note-order-list[data-col-pc="auto"] > li { margin: 0 36px .4em 0; } .note-order-list[data-col-pc] > li:first-child { margin-top: 0; } .note-order-list > li { padding-left: 2.1em; font-size: 1.4rem; } .note-order-list__nest { margin: .6em 0 .8em; font-size: 1.6rem; } .note-order-list__nest [data-col-pc="auto"] { margin-bottom: 0 !important; } .note-order-list[data-col-pc] > li { margin-top: 0; } .note-order-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } [class*="list__nest"] .note-order-list[data-col-pc] > li { margin-top: .0; } [class*="list__nest"] .note-order-list[data-col-pc="auto"] > li { margin: 0 36px 0 0; } .button .button__type, .button .button__type--noIcon, .button .button__type--blank, .button .button__type--pdf, .button .button__type--excel, .button .button__type--word, .button .button__type--powerpoint, .button .button__type--zip, .button .button__type--video, .button .button__type--modal, .button .button__type--rss { padding: .8em 3.25em .75em; } .button .button__type:hover, .button .button__type--noIcon:hover, .button .button__type--blank:hover, .button .button__type--pdf:hover, .button .button__type--excel:hover, .button .button__type--word:hover, .button .button__type--powerpoint:hover, .button .button__type--zip:hover, .button .button__type--video:hover, .button .button__type--modal:hover, .button .button__type--rss:hover { background-color: #026cb2; } .button-wrap[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--center[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--right[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--centering[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--centering { flex-flow: row nowrap; } .button-wrap--centering > * { margin-right: 30px; } .button-wrap--centering > *:last-child { margin-right: 0; } .button-wrap { margin: 1.6em 0 0; } .button-wrap[data-col-pc]:not([data-col-pc="auto"]) > * { margin-top: 1.6em; } [class*="button-wrap"][data-col-pc]:not([data-col-pc="1"]) > .button > [class*="__type"] { width: 100%; } .button .button__type:after { right: 1.2em; } .button .button__type--blank:after { right: 1.2em; } .button .button__type--pdf:after { right: 1.2em; } .button .button__type--excel:after { right: 1.2em; } .button .button__type--word:after { right: 1.2em; } .button .button__type--powerpoint:after { right: 1.2em; } .button .button__type--zip:after { right: 1.2em; } .button .button__type--video:after { right: 1.2em; } .button .button__type--modal:after { right: 1.2em; } [class*="modal--"].modaal-wrapper .modaal-container { padding: 60px 40px 40px; } [class*="modal--"].modaal-wrapper .modaal-close { top: 15px; right: 15px; width: 36px; height: 36px; } [class*="modal--"].modaal-wrapper .modaal-close:hover { opacity: 0.7; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 22px; height: 2px; margin: -1px 0 0 -11px; } .button .button__type--rss:after { right: 1.2em; } .button__filesize { font-size: 1.6rem; font-weight: 500; line-height: 1.75; vertical-align: middle; } .button-v2 .button-v2__type, .button-v2 .button-v2__type--noIcon, .button-v2 .button-v2__type--blank, .button-v2 .button-v2__type--pdf, .button-v2 .button-v2__type--excel, .button-v2 .button-v2__type--word, .button-v2 .button-v2__type--powerpoint, .button-v2 .button-v2__type--zip, .button-v2 .button-v2__type--video, .button-v2 .button-v2__type--modal, .button-v2 .button-v2__type--rss { padding: .8em 3.25em .75em; } .button-v2 .button-v2__type:hover, .button-v2 .button-v2__type--noIcon:hover, .button-v2 .button-v2__type--blank:hover, .button-v2 .button-v2__type--pdf:hover, .button-v2 .button-v2__type--excel:hover, .button-v2 .button-v2__type--word:hover, .button-v2 .button-v2__type--powerpoint:hover, .button-v2 .button-v2__type--zip:hover, .button-v2 .button-v2__type--video:hover, .button-v2 .button-v2__type--modal:hover, .button-v2 .button-v2__type--rss:hover { border-color: #026cb2; background-color: #026cb2; color: #fff; } .button-wrap[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--center[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--right[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--centering[data-col-pc="1"] { flex-direction: column !important; } .button-wrap--centering { flex-flow: row nowrap; } .button-wrap--centering > * { margin-right: 30px; } .button-wrap--centering > *:last-child { margin-right: 0; } .button-wrap { margin: 1.6em 0 0; } .button-wrap[data-col-pc]:not([data-col-pc="auto"]) > * { margin-top: 1.6em; } [class*="button-wrap"][data-col-pc]:not([data-col-pc="1"]) > .button-v2 > [class*="__type"] { width: 100%; } .button-v2 .button-v2__type:hover:after { border-color: #fff; } .button-v2 .button-v2__type:after { right: 1.2em; } .button-v2 .button-v2__type--noIcon:hover:after { border-color: #fff; } .button-v2 .button-v2__type--blank:after { right: 1.2em; } .button-v2 .button-v2__type--blank:hover:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#blank2-usage"); } .button-v2 .button-v2__type--pdf:after { right: 1.2em; } .button-v2 .button-v2__type--excel:after { right: 1.2em; } .button-v2 .button-v2__type--word:after { right: 1.2em; } .button-v2 .button-v2__type--powerpoint:after { right: 1.2em; } .button-v2 .button-v2__type--zip:after { right: 1.2em; } .button-v2 .button-v2__type--zip:hover:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#zip2-usage"); } .button-v2 .button-v2__type--video:after { right: 1.2em; } .button-v2 .button-v2__type--modal:after { right: 1.2em; } .button-v2 .button-v2__type--modal:hover:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#modal2-usage"); } .button-v2 .button-v2__type--rss:after { right: 1.2em; } .button-v2__filesize { font-weight: 500; vertical-align: middle; } .figure__caption, .figure__caption--center, .figure__caption--right { font-size: 1.4rem; } .figure__title { font-weight: 700; } .figure a.figure__frame:hover, .figure a.figure__frame--modal:hover { opacity: 0.7; } [class*="modal--"].modaal-wrapper .modaal-container { padding: 60px 40px 40px; } [class*="modal--"].modaal-wrapper .modaal-close { top: 15px; right: 15px; width: 36px; height: 36px; } [class*="modal--"].modaal-wrapper .modaal-close:hover { opacity: 0.7; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 22px; height: 2px; margin: -1px 0 0 -11px; } .video-wrap__caption, .video-wrap__caption--center, .video-wrap__caption--right { font-size: 1.4rem; } .video-wrap__caption, .video-wrap__caption--center, .video-wrap__caption--right { font-size: 1.4rem; } .table__caption, .table__caption--center, .table__caption--right { margin: .7em 0 0 0; font-size: 1.4rem; } .table [class*="__cell"] { padding: .6em .8em; } .table__head { margin: 0 0 .8em; } .table__foot { margin: .8em 0 0; } .table__title { margin: 0 0 .5em; font-size: 2.0rem; font-weight: 700; } .table__note { font-size: 1.4rem; } .table__matrix > caption { margin: 0 0 .8em; } .table [class*="__cell--lv1"] { font-weight: 700; } .table [class*="__cell--lv2"] { font-weight: 700; } .media[data-media-wraparound="false"] { display: flex; flex-wrap: nowrap; } .media[data-media-wraparound="false"][data-media-pc="image-left"] { flex-direction: row; } .media[data-media-wraparound="false"][data-media-pc="image-right"] { flex-direction: row-reverse; } .media[data-media-wraparound="true"] .media__head { margin-bottom: 1.0em; } .media__caption, .media__caption--center, .media__caption--right { margin: .9em 0 0; font-size: 1.4rem; } .media[data-media-pc="image-left"] .media__head { margin-right: 36px; } .media[data-media-pc="image-left"][data-media-wraparound="true"] .media__head { float: left; } .media[data-media-pc="image-right"] .media__head { margin-left: 36px; } .media[data-media-pc="image-right"][data-media-wraparound="true"] .media__head { float: right; } .anchor-navi { margin-top: 1.4em; } .anchor-navi--center { margin-top: 1.4em; } .anchor-navi__list[data-col-pc] > li { margin-top: 0; } .anchor-navi__link:hover .anchor-navi__label { text-decoration: underline; } .anchor-navi__label:after { top: -4px; width: 8px; height: 8px; } .anchor-navi .anchor-navi__list[data-col-pc="auto"] > li { margin-right: 35px !important; margin-bottom: .8em !important; } .anchor-navi .anchor-navi__list[data-col-pc="2"] > li { width: calc(((100% - (36px * (2 - 1))) / 2) - .1px); margin-left: 36px !important; } .anchor-navi .anchor-navi__list[data-col-pc="2"] > li:nth-child(2n+1) { margin-left: 0 !important; } .anchor-navi .anchor-navi__list[data-col-pc="3"] > li { width: calc(((100% - (36px * (3 - 1))) / 3) - .1px); margin-left: 36px !important; } .anchor-navi .anchor-navi__list[data-col-pc="3"] > li:nth-child(3n+1) { margin-left: 0 !important; } .anchor-navi .anchor-navi__list[data-col-pc="4"] > li { width: calc(((100% - (36px * (4 - 1))) / 4) - .1px); margin-left: 36px !important; } .anchor-navi .anchor-navi__list[data-col-pc="4"] > li:nth-child(4n+1) { margin-left: 0 !important; } .anchor-navi .anchor-navi__list[data-col-pc="5"] > li { width: calc(((100% - (36px * (5 - 1))) / 5) - .1px); margin-left: 36px !important; } .anchor-navi .anchor-navi__list[data-col-pc="5"] > li:nth-child(5n+1) { margin-left: 0 !important; } .anchor-navi .anchor-navi__list[data-col-pc="6"] > li { width: calc(((100% - (36px * (6 - 1))) / 6) - .1px); margin-left: 36px !important; } .anchor-navi .anchor-navi__list[data-col-pc="6"] > li:nth-child(6n+1) { margin-left: 0 !important; } .accordion + .accordion { margin-top: 1.2em; } .accordion { margin: 1.6em 0 0; } .accordion + .accordion { margin-top: -1px; } .accordion__head { padding: 1em 1.4em; cursor: pointer; } .accordion__head:hover { background-color: #026cb2; color: #fff; } .accordion__head:hover .accordion__title { color: #fff; } .accordion__title { padding-right: 2.3em; font-size: 2rem; font-weight: 700; } .accordion__head:hover .accordion__title:after { background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/93977_pic_down_white.svg"); } .accordion__head.is-active:hover .accordion__title:after { -webkit-transform: rotate(180deg); transform: rotate(180deg); background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/93977_pic_down_white.svg"); } .accordion__body { padding: 1.6em 1.4em; } .accordion__nest > .accordion .accordion__head { padding: .8em 1.4em .8em 2.7em; } .accordion__nest > .accordion .accordion__head .accordion__title { padding-right: 2.875em; font-size: 1.6rem; } .accordion__nest > .accordion .accordion__body { padding-left: 2.7em; } .accordion__nest > .accordion .accordion__head:not(:hover) { background-color: #f2faff; } .tab { margin: 2.0em 0 0; } .tab__list { margin: 0 -5px; } .tab__list > li { padding: 0 5px; } .tab__button { padding: .8em 1.4em; font-weight: 700; } .tab__button:hover { border-color: #026cb2; background-color: #026cb2; color: #fff; } .tab__body { padding: 1.6em 0 0; } [class*="modal--"].modaal-wrapper .modaal-close { top: -22px; right: -22px; width: 44px; height: 44px; } [class*="modal--"].modaal-wrapper .modaal-close:hover { background-color: #026cb2; opacity: 1; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 16px; height: 2px; margin: -1px 0 0 -8px; background-color: #fff; } .modal--image.modaal-wrapper .modaal-container { width: 876px; padding: 61px; } .download__link-list__type:hover, .download__link-list__type--blank:hover, .download__link-list__type--pdf:hover, .download__link-list__type--excel:hover, .download__link-list__type--word:hover, .download__link-list__type--powerpoint:hover, .download__link-list__type--zip:hover, .download__link-list__type--video:hover, .download__link-list__type--modal:hover, .download__link-list__type--rss:hover { text-decoration: underline; } .download { margin: 3.2em 0 0; } .download__inner { padding: 2.0em; } .download__title { font-size: 2.0rem; } .download__caption { margin-top: 1.6em; } .download__link-list-wrap { justify-content: center; margin: .8em 0 0; } .table[data-table-sp="scroll"] .scroll-hint-icon { display: none; } .table[data-table-sp="scroll"] .scroll-hint-icon-wrap { display: none; } .cmn-exchange-rate { display: flex; } .cmn-exchange-rate__list > li { margin-top: .65em; } .cmn-exchange-rate__company { min-width: 14.5em; } .cmn-exchange-rate__jpy { margin-left: 1.0em; padding-left: 3.25em; } .cmn-notice-v2 { margin: 2.4em 0; padding: 1.6em 1.8em; } .cmn-notice-v2__head { margin: 0 0 1.6em; } .cmn-notice-v2__title { font-size: 2.0rem; font-weight: 700; } .cmn-notice-v2__heading { margin-top: 1.6em; } .cmn-notice-v2__heading__title { font-size: 2.0rem; font-weight: 700; } .cmn-related { margin: 5.0em 0 0; } .cmn-related__heading { margin: 0 0 2.6em; } .cmn-related__heading__title { font-size: 3.0rem; font-weight: 500; } .cmn-related__title { margin: 1.5em 0 0; font-size: 2.8rem; } .cmn-related__media { display: flex; flex-flow: row nowrap; margin: 2.4em 0 0; } .cmn-related__media__head { flex-shrink: 0; margin-right: 36px; } .cmn-related__media__body { width: 100%; } .cmn-related__media__frame:hover { opacity: 0.7; } .cmn-accordion-image { margin: 5.0em 0 0; } .cmn-accordion-image__list { display: flex; flex-flow: row wrap; } .cmn-accordion-image__list > li { width: calc((100% - 2px) / 2); margin-left: 2px; } .cmn-accordion-image__list > li:nth-child(2n+1) { margin-left: 0; } .cmn-accordion-image__list > li:nth-child(n+3) { margin-top: 2px; } .cmn-accordion-image__modal { z-index: 1001; position: fixed; top: 0; left: 0; width: 100%; height: 100%; padding: 60px 30px; overflow-x: hidden; overflow-y: auto; background-color: rgba(0, 0, 0, 0.7); } .cmn-accordion-image__modal__inner { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 100%; } .cmn-accordion-image__modal__panel { position: relative; width: 876px; margin: 0 auto; padding: 30px; background-color: #fff; } .cmn-accordion-image__modal__close { position: absolute; top: -23px; right: -23px; } .cmn-accordion-image__modal__close__trigger { display: block; position: relative; width: 44px; height: 44px; overflow: hidden; border-radius: 50%; background-color: #008eed; font-size: 0; text-indent: -9999em; } .cmn-accordion-image__modal__close__trigger:hover { background-color: #026cb2; } .cmn-accordion-image__modal__close__trigger:before, .cmn-accordion-image__modal__close__trigger:after { position: absolute; top: 21px; left: 13px; width: 18px; height: 2px; background-color: #fff; content: ""; } .cmn-accordion-image__modal__close__trigger:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); } .cmn-accordion-image__modal__close__trigger:after { -webkit-transform: rotate(135deg); transform: rotate(135deg); } .cmn-accordion-image__carousel__list { opacity: 0.0; transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-accordion-image__carousel .slick-arrow { -webkit-transform: translateY(-50%); display: block; z-index: 1; position: absolute; top: 50%; width: 32px; height: 56px; padding: 0; transform: translateY(-50%); border: none; outline: none; background: none; font-size: 0; text-indent: -9999em; transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-accordion-image__carousel .slick-arrow:hover { opacity: 0.7; } .cmn-accordion-image__carousel .slick-arrow:before { position: absolute; top: 50%; width: 34px; height: 34px; margin-top: -17px; border-top: 3px solid #fff; border-right: 3px solid #fff; content: ""; } .cmn-accordion-image__carousel .slick-arrow.slick-prev { left: -66px; } .cmn-accordion-image__carousel .slick-arrow.slick-prev:before { -webkit-transform: rotate(-135deg); left: 8px; transform: rotate(-135deg); } .cmn-accordion-image__carousel .slick-arrow.slick-next { right: -66px; } .cmn-accordion-image__carousel .slick-arrow.slick-next:before { -webkit-transform: rotate(45deg); right: 8px; transform: rotate(45deg); } .cmn-accordion-image__trigger:hover { opacity: 0.7; } .cmn-accordion-image__trigger:before { right: 1.2em; width: 19px; height: 19px; margin-top: -10px; background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#modal-usage") no-repeat; } .cmn-accordion-image__trigger:after { display: none; } .cmn-accordion-image__trigger__head { width: 90px; min-height: 90px; } .cmn-accordion-image__trigger__body { padding: 1.2em 3.6em 1.2em 1.4em; } .cmn-accordion-image__trigger__image { width: 90px; height: 90px; } .cmn-accordion-image__trigger__title { font-weight: 700; transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-accordion-image__trigger:hover .cmn-accordion-image__trigger__title { color: #008eed; text-decoration: underline; } .cmn-accordion-image__trigger__note { margin-top: .2em; padding-left: 1.4em; font-size: 1.4rem; } .cmn-products-jcbdebit__head { display: flex; position: relative; justify-content: space-between; padding: 1.1em 30px; } .cmn-products-jcbdebit__logo { flex-shrink: 0; align-items: center; margin-right: 30px; } .cmn-products-jcbdebit__logo__inner { width: 194px; } .cmn-products-jcbdebit__detail { display: flex; position: relative; justify-content: flex-end; width: 100%; } .cmn-products-jcbdebit__pay-wrap { position: absolute; top: 1.8em; right: 0; padding-right: calc((145px * 2) + 45px); } [data-layout="simple"] .cmn-products-jcbdebit__pay-wrap { top: inherit; bottom: 0; padding-right: calc((145px * 1) + 45px); } .cmn-products-jcbdebit__pay-wrap > * { margin-left: 1.0em; } .cmn-products-jcbdebit__pay--apple-pay { width: 42px; } .cmn-products-jcbdebit__pay--google-pay { width: 55px; } .cmn-products-jcbdebit__note { padding-right: .7em; padding-bottom: 3.0em; font-size: 1.4rem; text-align: center; } .cmn-products-jcbdebit__tab { margin-top: -3.2em; } .cmn-products-jcbdebit__tab__head { padding: 0 30px; } .cmn-products-jcbdebit__tab__list { justify-content: flex-end; } .cmn-products-jcbdebit__tab__list > li { width: 145px; margin-left: 10px; } .cmn-products-jcbdebit__tab__list > li:before { left: -30px; width: calc(100% + (30px * 2)); } .cmn-products-jcbdebit__tab__button { padding: .9em 1.0em .75em; font-weight: 700; } .cmn-products-jcbdebit__tab__button:hover { background-color: #008eed; color: #fff; } .cmn-products-jcbdebit__tab__list > li[data-tab-button="gold"] .cmn-products-jcbdebit__tab__button:hover { background-color: #ad8e00; color: #fff; } .cmn-products-jcbdebit__content { display: flex; flex-flow: row nowrap; } .cmn-products-jcbdebit__content__head { flex-shrink: 0; width: 356px; padding: 2.25em 1.875em 3.0em; } .cmn-products-jcbdebit__content__body { display: flex; align-items: center; justify-content: center; width: 100%; padding: 3.0em 1.875em 3.0em 1.75em; } .cmn-products-jcbdebit__content__pay-wrap { justify-content: center; margin: 0 0 1.875em; } .cmn-products-jcbdebit__content__pay-wrap > * { margin-left: 1.0em; } .cmn-products-jcbdebit__content__pay--logo { width: 30px; } .cmn-products-jcbdebit__content__pay--apple-pay { width: 35px; } .cmn-products-jcbdebit__content__pay--google-pay { width: 48px; } .cmn-products-jcbdebit__name { margin: 0 0 .9em; font-size: 2.0rem; line-height: 1.4; } .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-prev:before { display: none; } .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-next:before { display: none; } .cmn-products-jcbdebit__carousel__item { width: 250px; height: 250px; } .cmn-products-jcbdebit__carousel__item > img { max-width: 250px; max-height: 250px; } .cmn-products-jcbdebit__carousel__control { margin-top: 1.25em; } .cmn-products-jcbdebit__carousel__pager { display: flex; justify-content: center; width: 100%; padding: 0 .8em; } .cmn-products-jcbdebit__carousel__pager > .slick-dots { display: flex; flex-flow: row wrap; margin: 0 -5px -10px; padding: 0; list-style: none; } .cmn-products-jcbdebit__carousel__pager > .slick-dots > li { display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; margin: 0 5px 10px; } .cmn-products-jcbdebit__carousel__pager > .slick-dots > li > button { display: block; padding: 0; border: none; font-size: 0; text-indent: -9999em; opacity: .5; transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-products-jcbdebit__carousel__pager > .slick-dots > li > button:hover { opacity: 0.7; } .cmn-products-jcbdebit__carousel__pager > .slick-dots > li > button > img { max-width: 60px; max-height: 60px; } .cmn-products-jcbdebit__carousel__pager > .slick-dots > li.slick-active > button { opacity: 1.0; } .cmn-products-jcbdebit__carousel__count { display: none; } .cmn-products-jcbdebit__heading { margin: 0 0 1.5em; } .cmn-products-jcbdebit__heading__inner { padding-top: 1.125em; } .cmn-products-jcbdebit__heading__title { font-size: 2.2rem; font-weight: 500; line-height: 1.4; } .cmn-products-jcbdebit__heading__title > sup { top: -.3em; font-size: 1.6rem; } .modal--products-jcbdebit .modaal-container { width: 876px; } .cmn-app-download--appstore { width: 116px; } .cmn-app-download--googleplay { width: 142px; margin-left: .9em; } .cmn-app-download__type:hover { opacity: 0.7; } .cmn-index-navi { margin: 2.4em 0 0; } .cmn-index-navi__inner { display: flex; flex-flow: row nowrap; } .cmn-index-navi__head { display: flex; flex-shrink: 0; align-items: center; justify-content: center; width: 290px; margin-right: 1.25em; } .cmn-index-navi__body { width: 100%; padding: 1.6em 2.0em 1.6em 0; } .cmn-index-navi__title { font-size: 2.0rem; } .cmn-index-navi__anchor__type { padding: 1.0em 1.8em 1.0em 0; } .cmn-index-navi__anchor__type:hover { text-decoration: underline; } .cmn-index-navi__anchor__type:after { -webkit-transform: translateY(-50%); top: 50%; right: 0; transform: translateY(-50%); } .cmn-search__head { display: flex; align-items: center; justify-content: space-between; } .cmn-search__body { width: 100vw; margin-left: calc(50% - 50vw); padding: 2.2em 0; } .cmn-search__body__inner { width: calc(1200px + 30px * 2); margin: 0 auto; padding: 0 30px; } .cmn-search__category { width: 100%; } .cmn-search__category__head { display: none; } .cmn-search__category__accordion-wrap { display: flex; } .cmn-search__category__accordion-wrap > * { width: calc((100% - (10px * 3)) / 4); margin-left: 10px; } .cmn-search__category__accordion-wrap > *:first-child { margin-left: 0; } .cmn-search__category__accordion__body { display: none; z-index: 2; position: absolute; top: auto; left: 0; width: 100%; border: 1px solid #008eed; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1); } .cmn-search__category__accordion__trigger { padding: .8em 2.625em .7em; background-color: #008eed; color: #fff !important; text-align: center; } .cmn-search__category__accordion__trigger:hover { background-color: #026cb2; } .cmn-search__category__accordion__trigger:before, .cmn-search__category__accordion__trigger:after { right: 1.375em; } .cmn-search__category__accordion__trigger:before { background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94337_pic_plus_white.svg") no-repeat; } .cmn-search__category__accordion__trigger:after { background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94207_pic_minus_white.svg") no-repeat; } .cmn-search__category__list > li { border-top: 1px solid #008eed; } .cmn-search__category__list > li:first-child { border-top: none; } .cmn-search__category__button { padding: .5em 1.375em .48em; } .cmn-search__category__button:hover { color: #008eed; text-decoration: underline; } .cmn-search__control { flex-shrink: 0; width: 232px; margin-left: 10px; } .cmn-search__sort > input + label { padding-left: 1.875em; } .cmn-search__clear__trigger { padding: .75em 1.375em .6em; transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s, border-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s, color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-search__clear__trigger:hover { border-color: #026cb2; background-color: #026cb2; color: #fff; } .cmn-tel-wrap { display: flex; } .cmn-tel-wrap--center { display: flex; justify-content: center; margin: 0 0 1.0em; } .cmn-tel__num { font-size: 2.0rem; } .cmn-tel__caption { margin: .9em 0 0; font-size: 1.4rem; } .cmn-heading { width: 100vw; margin-left: calc(50% - 50vw); } .cmn-heading__image { height: 300px; } .cmn-heading__image img { -webkit-transform: translateX(-50%); position: absolute; top: 0; left: 50%; width: 1920px; max-width: inherit; transform: translateX(-50%); } .cmn-heading__detail { align-items: center; } .cmn-heading__inner { width: calc(1200px + 30px * 2); margin: 0 auto; padding: 0 30px; } .cmn-heading__title { font-size: 3.8rem; font-weight: 700; } .cmn-heading__subtitle { margin: .8em 0 0; } .cmn-wrap { width: 100vw; margin-top: 5.0em; margin-left: calc(50% - 50vw); padding: 3.0em 0; } .cmn-wrap__inner { width: calc(1200px + 30px * 2); margin: 0 auto; padding: 0 30px; } .cmn-pulldown-navi-wrap { display: flex; justify-content: center; margin: 1.6em 0 0; } .cmn-pulldown-navi-wrap > * { margin-left: 2.25em; } .cmn-pulldown-navi-wrap > *:first-child { margin-left: 0; } .cmn-pulldown-navi { display: flex; flex-flow: row wrap; align-items: center; } .cmn-pulldown-navi__inner { display: inline-block; order: 1; min-width: 273px; transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s, border-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-pulldown-navi__inner:hover { border-color: #008eed; } .cmn-pulldown-navi__inner:hover:after { border-color: #008eed transparent transparent transparent; } .cmn-pulldown-navi__inner:hover > .cmn-pulldown-navi__select { color: #008eed; } .cmn-pulldown-navi__inner:after { right: 20px; border-width: 6px 5px 0; } .cmn-pulldown-navi__select { padding: .8em 3.4em .8em 1.4em; } .cmn-pulldown-navi__select option { color: #303038; font-weight: 500; } .cmn-pulldown-navi__assist { order: 2; margin-left: 2.2em; } .cmn-use-category-wrap { display: flex; justify-content: flex-end; } .cmn-use-category-wrap--center { display: flex; justify-content: center; } .cmn-use-category-wrap--left { display: flex; justify-content: flex-start; } .cmn-use-category { display: flex; align-items: center; padding: .8em 1.2em; } .cmn-use-category__head { flex-shrink: 0; margin-right: 1.2em; } .cmn-use-category__body { width: 100%; } .cmn-use-category__title { font-size: 1.4rem; line-height: 1.4; } .cmn-use-category__icon-list > li { min-width: 140px; height: 30px; margin-left: 10px; font-size: 1.4rem; line-height: 30px; } .cmn-use-category__icon-list > li:first-child { margin-left: 0; } .cmn-step { margin: 2.0em 0 0; padding-left: 1.125em; } .cmn-step__list > li { margin-top: .8em; } .cmn-step__list > li[data-step-body="false"] { padding-bottom: 2em; } .cmn-step__list > li[data-step-body="true"] { padding-bottom: 0; } .cmn-step__body { padding: .35em 0 2em 3.125em; } .cmn-step__body:before { left: 24px; } .cmn-step__num { width: 50px; height: 50px; font-weight: 700; } .cmn-step__title { padding-top: .4em; font-size: 2.0rem; font-weight: 700; } .cmn-conversion { width: 100vw; margin-top: 3.0em; margin-left: calc(50% - 50vw); } .cmn-conversion__image { height: 337px; } .cmn-conversion__image img { -webkit-transform: translateX(-50%); position: absolute; top: 0; left: 50%; width: 1920px; max-width: inherit; transform: translateX(-50%); } .cmn-conversion__inner { width: calc(1200px + 30px * 2); margin: 0 auto; padding: 0 30px; } .cmn-conversion__title { font-size: 3.0rem; } .cmn-conversion__subtitle { margin: 2.2em 0 0; } .cmn-conversion__button { margin: 1.6em 0 0; } .cmn-heading-column { margin: 4.0em 0 0; } .cmn-heading-v3__head { width: 166px; margin-right: 2.0em; } .cmn-heading-v3__title { font-size: 2.8rem; } .cmn-heading-v3__subtitle { margin: 1.625em 0 0; } .cmn-flow-arrow { margin: 3.0em 0 2.4em; } .cmn-flow-arrow__inner { padding-bottom: 2.6em; } .cmn-flow-arrow__title { font-size: 2.4rem; } .jcbdebit-lnav__inner { display: flex; flex-flow: row nowrap; max-width: calc(1200px + 30px * 2); margin: 0 auto; padding: 0 30px; } .jcbdebit-lnav__head { flex-shrink: 0; justify-content: center; width: 20%; padding: .6875em; } .jcbdebit-lnav__head:hover .jcbdebit-lnav__title { text-decoration: underline; } .jcbdebit-lnav__head:before { display: inline-block; position: absolute; top: 50%; left: 0; width: 1px; height: 40px; margin-top: -20px; background-color: #4d94cb; content: ""; } .jcbdebit-lnav__body { width: 100%; } .jcbdebit-lnav__image { margin-right: 1.2em; } .jcbdebit-lnav__title { color: #fff; } .jcbdebit-lnav__list { flex-flow: row nowrap; } .jcbdebit-lnav__list > li { position: relative; width: 100%; } .jcbdebit-lnav__list > li:before, .jcbdebit-lnav__list > li:last-child:after { display: inline-block; position: absolute; top: 50%; width: 1px; height: 40px; margin-top: -20px; background-color: #4d94cb; content: ""; } .jcbdebit-lnav__list > li:before { left: 0; } .jcbdebit-lnav__list > li:last-child:after { right: 0; } .jcbdebit-lnav__list .jcbdebit-lnav__list__type { padding: 1.2em .5em; } .jcbdebit-lnav__list .jcbdebit-lnav__list__type:hover { text-decoration: underline; } .cmn-media[data-media-wraparound="false"] { display: flex; flex-wrap: nowrap; } .cmn-media[data-media-wraparound="false"][data-media-pc="image-left"] { flex-direction: row; } .cmn-media[data-media-wraparound="false"][data-media-pc="image-right"] { flex-direction: row-reverse; } .cmn-media[data-media-wraparound="true"] .cmn-media__head { margin-bottom: 1.0em; } .cmn-media__caption, .cmn-media__caption--center, .cmn-media__caption--right { margin: .9em 0 0; font-size: 1.4rem; } .cmn-media[data-media-pc="image-left"] .cmn-media__head { margin-right: 36px; } .cmn-media[data-media-pc="image-left"][data-media-wraparound="true"] .cmn-media__head { float: left; } .cmn-media[data-media-pc="image-right"] .cmn-media__head { margin-left: 36px; } .cmn-media[data-media-pc="image-right"][data-media-wraparound="true"] .cmn-media__head { float: right; } } @media only screen and (max-width: 767.98px) { .main-breadcrumb > li:after, .main-lnav__link-list .main-lnav__link-list__type:after, .footer-snav__link-list .footer-snav__link-list__type:after, .heading2-v2__link .heading2-v2__title:after, .link-list > li > [class*="__type"]:before, .link-list__type:after, .link-list__type--nolink:after, .button-v2 .button-v2__type:after, .download__link-list__type:after, .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-next:before, .anchor-navi__label:after, .cmn-flow-arrow__inner:before, .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-prev:before { width: 8px; height: 8px; } .header-megamenu__link-list .header-megamenu__link-list__type:after, .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after, .button .button__type:after { width: 8px; height: 8px; } .header-megamenu__link-list .header-megamenu__link-list__type:after, .main-lnav__card .main-lnav__card__type .main-lnav__card__title:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type:after, .main-lnav__link-list .main-lnav__link-list__type:after, .heading2-v2__link .heading2-v2__title:after, .link-list__type:after, .link-list__type--nolink:after, .anchor-navi__label:after, .download__link-list__type:after { top: -1px; } .footer-snav__link-list .footer-snav__link-list__type:after, .button .button__type:after, .button-v2 .button-v2__type:after { margin-top: -4px; } .util-link--blank:after, .main-lnav__link-list .main-lnav__link-list__type--blank:after, .link-list__type--blank:after, .button .button__type--blank:after, .button-v2 .button-v2__type--blank:after, .download__link-list__type--blank:after, .util-link--pdf:after, .link-list__type--pdf:after, .button .button__type--pdf:after, .button-v2 .button-v2__type--pdf:after, .download__link-list__type--pdf:after, .util-link--excel:after, .link-list__type--excel:after, .button .button__type--excel:after, .button-v2 .button-v2__type--excel:after, .download__link-list__type--excel:after, .util-link--word:after, .link-list__type--word:after, .button .button__type--word:after, .button-v2 .button-v2__type--word:after, .download__link-list__type--word:after, .util-link--powerpoint:after, .link-list__type--powerpoint:after, .button .button__type--powerpoint:after, .button-v2 .button-v2__type--powerpoint:after, .download__link-list__type--powerpoint:after, .util-link--zip:after, .link-list__type--zip:after, .button .button__type--zip:after, .button-v2 .button-v2__type--zip:after, .download__link-list__type--zip:after, .util-link--video:after, .link-list__type--video:after, .button .button__type--video:after, .button-v2 .button-v2__type--video:after, .download__link-list__type--video:after, .util-link--modal:after, .link-list__type--modal:after, .button .button__type--modal:after, .button-v2 .button-v2__type--modal:after, .download__link-list__type--modal:after, .util-link--rss:after, .link-list__type--rss:after, .button .button__type--rss:after, .button-v2 .button-v2__type--rss:after, .download__link-list__type--rss:after, .header-megamenu__link-list .header-megamenu__link-list__type--blank:after, .header-global .header-global__type:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after, .footer-link-list .footer-link-list__type--blank:after, .footer-link-list-v2 .footer-link-list-v2__type--blank:after, .footer-utility__link-list .footer-utility__link-list__type--blank:after, .footer-snav__link-list .footer-snav__link-list__type--blank:after, .figure a.figure__frame--modal:after { width: 14px; height: 14px; } .util-link--blank:after, .main-lnav__link-list .main-lnav__link-list__type--blank:after, .link-list__type--blank:after, .button .button__type--blank:after, .button-v2 .button-v2__type--blank:after, .download__link-list__type--blank:after { width: 15px; height: 15px; } .header-megamenu__link-list .header-megamenu__link-list__type--blank:after, .header-global .header-global__type:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after, .footer-link-list .footer-link-list__type--blank:after, .footer-link-list-v2 .footer-link-list-v2__type--blank:after, .footer-utility__link-list .footer-utility__link-list__type--blank:after, .button .button__type--blank:after { width: 15px; height: 15px; } .footer-snav__link-list .footer-snav__link-list__type--blank:after { width: 15px; height: 15px; } .header-megamenu__link-list .header-megamenu__link-list__type--blank:after, .header-global .header-global__type:after, .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after, .main-lnav__link-list .main-lnav__link-list__type--blank:after, .footer-snav__link-list .footer-snav__link-list__type--blank:after, .footer-link-list .footer-link-list__type--blank:after, .footer-link-list-v2 .footer-link-list-v2__type--blank:after, .footer-utility__link-list .footer-utility__link-list__type--blank:after, .link-list__type--blank:after, .link-list__type--pdf:after, .link-list__type--excel:after, .link-list__type--word:after, .link-list__type--powerpoint:after, .link-list__type--zip:after, .link-list__type--video:after, .link-list__type--modal:after, .link-list__type--rss:after, .download__link-list__type--blank:after, .download__link-list__type--pdf:after, .download__link-list__type--excel:after, .download__link-list__type--word:after, .download__link-list__type--powerpoint:after, .download__link-list__type--zip:after, .download__link-list__type--video:after, .download__link-list__type--modal:after, .download__link-list__type--rss:after { top: -1px; margin-left: 8px; } body { font-family: Arial, Hiragino Sans, "ヒラギノ角ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", Meiryo, "メイリオ", sans-serif; font-size: 1.4rem; font-weight: 400; line-height: 1.6; } input, select, textarea, button, pre { font-family: Arial, Hiragino Sans, "ヒラギノ角ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", Meiryo, "メイリオ", sans-serif; font-size: 1.6rem; line-height: 1.6; } .util-sp-hidden { display: none !important; } .util-bold { font-weight: 700 !important; } .util-highlight--main { font-weight: 700; } .util-sp-align-left { text-align: left !important; } .util-sp-align-center { text-align: center !important; } .util-sp-align-right { text-align: right !important; } .util-sp-margin-top-auto { margin-top: auto !important; } .util-sp-margin-top-0 { margin-top: 0em !important; } .util-sp-margin-top-1 { margin-top: 1em !important; } .util-sp-margin-top-2 { margin-top: 2em !important; } .util-sp-margin-top-3 { margin-top: 3em !important; } .util-sp-margin-top-4 { margin-top: 4em !important; } .util-sp-margin-top-5 { margin-top: 5em !important; } .util-sp-margin-top-6 { margin-top: 6em !important; } .util-sp-margin-top-7 { margin-top: 7em !important; } .util-sp-margin-top-8 { margin-top: 8em !important; } .util-sp-margin-top-9 { margin-top: 9em !important; } .util-sp-margin-top-10 { margin-top: 10em !important; } .util-sp-margin-right-auto { margin-right: auto !important; } .util-sp-margin-right-0 { margin-right: 0em !important; } .util-sp-margin-right-1 { margin-right: 1em !important; } .util-sp-margin-right-2 { margin-right: 2em !important; } .util-sp-margin-right-3 { margin-right: 3em !important; } .util-sp-margin-right-4 { margin-right: 4em !important; } .util-sp-margin-right-5 { margin-right: 5em !important; } .util-sp-margin-right-6 { margin-right: 6em !important; } .util-sp-margin-right-7 { margin-right: 7em !important; } .util-sp-margin-right-8 { margin-right: 8em !important; } .util-sp-margin-right-9 { margin-right: 9em !important; } .util-sp-margin-right-10 { margin-right: 10em !important; } .util-sp-margin-bottom-auto { margin-bottom: auto !important; } .util-sp-margin-bottom-0 { margin-bottom: 0em !important; } .util-sp-margin-bottom-1 { margin-bottom: 1em !important; } .util-sp-margin-bottom-2 { margin-bottom: 2em !important; } .util-sp-margin-bottom-3 { margin-bottom: 3em !important; } .util-sp-margin-bottom-4 { margin-bottom: 4em !important; } .util-sp-margin-bottom-5 { margin-bottom: 5em !important; } .util-sp-margin-bottom-6 { margin-bottom: 6em !important; } .util-sp-margin-bottom-7 { margin-bottom: 7em !important; } .util-sp-margin-bottom-8 { margin-bottom: 8em !important; } .util-sp-margin-bottom-9 { margin-bottom: 9em !important; } .util-sp-margin-bottom-10 { margin-bottom: 10em !important; } .util-sp-margin-left-auto { margin-left: auto !important; } .util-sp-margin-left-0 { margin-left: 0em !important; } .util-sp-margin-left-1 { margin-left: 1em !important; } .util-sp-margin-left-2 { margin-left: 2em !important; } .util-sp-margin-left-3 { margin-left: 3em !important; } .util-sp-margin-left-4 { margin-left: 4em !important; } .util-sp-margin-left-5 { margin-left: 5em !important; } .util-sp-margin-left-6 { margin-left: 6em !important; } .util-sp-margin-left-7 { margin-left: 7em !important; } .util-sp-margin-left-8 { margin-left: 8em !important; } .util-sp-margin-left-9 { margin-left: 9em !important; } .util-sp-margin-left-10 { margin-left: 10em !important; } .util-sp-padding-top-0 { padding-top: 0em !important; } .util-sp-padding-top-1 { padding-top: 1em !important; } .util-sp-padding-top-2 { padding-top: 2em !important; } .util-sp-padding-top-3 { padding-top: 3em !important; } .util-sp-padding-top-4 { padding-top: 4em !important; } .util-sp-padding-top-5 { padding-top: 5em !important; } .util-sp-padding-top-6 { padding-top: 6em !important; } .util-sp-padding-top-7 { padding-top: 7em !important; } .util-sp-padding-top-8 { padding-top: 8em !important; } .util-sp-padding-top-9 { padding-top: 9em !important; } .util-sp-padding-top-10 { padding-top: 10em !important; } .util-sp-padding-right-0 { padding-right: 0em !important; } .util-sp-padding-right-1 { padding-right: 1em !important; } .util-sp-padding-right-2 { padding-right: 2em !important; } .util-sp-padding-right-3 { padding-right: 3em !important; } .util-sp-padding-right-4 { padding-right: 4em !important; } .util-sp-padding-right-5 { padding-right: 5em !important; } .util-sp-padding-right-6 { padding-right: 6em !important; } .util-sp-padding-right-7 { padding-right: 7em !important; } .util-sp-padding-right-8 { padding-right: 8em !important; } .util-sp-padding-right-9 { padding-right: 9em !important; } .util-sp-padding-right-10 { padding-right: 10em !important; } .util-sp-padding-bottom-0 { padding-bottom: 0em !important; } .util-sp-padding-bottom-1 { padding-bottom: 1em !important; } .util-sp-padding-bottom-2 { padding-bottom: 2em !important; } .util-sp-padding-bottom-3 { padding-bottom: 3em !important; } .util-sp-padding-bottom-4 { padding-bottom: 4em !important; } .util-sp-padding-bottom-5 { padding-bottom: 5em !important; } .util-sp-padding-bottom-6 { padding-bottom: 6em !important; } .util-sp-padding-bottom-7 { padding-bottom: 7em !important; } .util-sp-padding-bottom-8 { padding-bottom: 8em !important; } .util-sp-padding-bottom-9 { padding-bottom: 9em !important; } .util-sp-padding-bottom-10 { padding-bottom: 10em !important; } .util-sp-padding-left-0 { padding-left: 0em !important; } .util-sp-padding-left-1 { padding-left: 1em !important; } .util-sp-padding-left-2 { padding-left: 2em !important; } .util-sp-padding-left-3 { padding-left: 3em !important; } .util-sp-padding-left-4 { padding-left: 4em !important; } .util-sp-padding-left-5 { padding-left: 5em !important; } .util-sp-padding-left-6 { padding-left: 6em !important; } .util-sp-padding-left-7 { padding-left: 7em !important; } .util-sp-padding-left-8 { padding-left: 8em !important; } .util-sp-padding-left-9 { padding-left: 9em !important; } .util-sp-padding-left-10 { padding-left: 10em !important; } [data-col-sp]:not([data-col-sp="1"]) { display: flex; flex-flow: row wrap; width: 100%; } [data-col-sp]:not([data-col-sp="auto"]) > * { margin-top: 1em; margin-left: 15px; } [data-col-sp="1"] > *:nth-child(-n+1) { margin-top: 0 !important; } [data-col-sp="1"] > *:nth-child(1n+1) { margin-left: 0 !important; } [data-col-sp="1"] > * { width: 100%; } [data-col-sp="2"] > *:nth-child(-n+2) { margin-top: 0 !important; } [data-col-sp="2"] > *:nth-child(2n+1) { margin-left: 0 !important; } [data-col-sp="2"] > * { width: calc((100% - (15px)) / 2); } [data-col-sp="3"] > *:nth-child(-n+3) { margin-top: 0 !important; } [data-col-sp="3"] > *:nth-child(3n+1) { margin-left: 0 !important; } [data-col-sp="3"] > * { width: calc((100% - (30px)) / 3); } [data-col-sp="auto"] { margin-right: -15px; margin-bottom: -0.5em; } [data-col-sp="auto"] > * { margin-top: 0 !important; margin-right: 15px; margin-bottom: 0.5em; margin-left: 0; } [data-size-sp="1col"] { width: 100%; } [data-size-sp="1col"] > * { width: 100%; } [data-size-sp="2col"] { width: calc((100% - (15px * (2 - 1))) / 2); } [data-size-sp="1/2col"] { width: calc(100% - ((100% - (15px * (2 - 1))) / 2) - 15px) !important; } [data-size-sp="2col"] > * { width: 100%; } [data-size-sp="3col"] { width: calc((100% - (15px * (3 - 1))) / 3); } [data-size-sp="2/3col"] { width: calc(100% - ((100% - (15px * (3 - 1))) / 3) - 15px) !important; } [data-size-sp="3col"] > * { width: 100%; } [data-size-sp="1per"] { width: 1% !important; } [data-size-sp="1per"] > * { width: 100%; } [data-size-sp="2per"] { width: 2% !important; } [data-size-sp="2per"] > * { width: 100%; } [data-size-sp="3per"] { width: 3% !important; } [data-size-sp="3per"] > * { width: 100%; } [data-size-sp="4per"] { width: 4% !important; } [data-size-sp="4per"] > * { width: 100%; } [data-size-sp="5per"] { width: 5% !important; } [data-size-sp="5per"] > * { width: 100%; } [data-size-sp="6per"] { width: 6% !important; } [data-size-sp="6per"] > * { width: 100%; } [data-size-sp="7per"] { width: 7% !important; } [data-size-sp="7per"] > * { width: 100%; } [data-size-sp="8per"] { width: 8% !important; } [data-size-sp="8per"] > * { width: 100%; } [data-size-sp="9per"] { width: 9% !important; } [data-size-sp="9per"] > * { width: 100%; } [data-size-sp="10per"] { width: 10% !important; } [data-size-sp="10per"] > * { width: 100%; } [data-size-sp="11per"] { width: 11% !important; } [data-size-sp="11per"] > * { width: 100%; } [data-size-sp="12per"] { width: 12% !important; } [data-size-sp="12per"] > * { width: 100%; } [data-size-sp="13per"] { width: 13% !important; } [data-size-sp="13per"] > * { width: 100%; } [data-size-sp="14per"] { width: 14% !important; } [data-size-sp="14per"] > * { width: 100%; } [data-size-sp="15per"] { width: 15% !important; } [data-size-sp="15per"] > * { width: 100%; } [data-size-sp="16per"] { width: 16% !important; } [data-size-sp="16per"] > * { width: 100%; } [data-size-sp="17per"] { width: 17% !important; } [data-size-sp="17per"] > * { width: 100%; } [data-size-sp="18per"] { width: 18% !important; } [data-size-sp="18per"] > * { width: 100%; } [data-size-sp="19per"] { width: 19% !important; } [data-size-sp="19per"] > * { width: 100%; } [data-size-sp="20per"] { width: 20% !important; } [data-size-sp="20per"] > * { width: 100%; } [data-size-sp="21per"] { width: 21% !important; } [data-size-sp="21per"] > * { width: 100%; } [data-size-sp="22per"] { width: 22% !important; } [data-size-sp="22per"] > * { width: 100%; } [data-size-sp="23per"] { width: 23% !important; } [data-size-sp="23per"] > * { width: 100%; } [data-size-sp="24per"] { width: 24% !important; } [data-size-sp="24per"] > * { width: 100%; } [data-size-sp="25per"] { width: 25% !important; } [data-size-sp="25per"] > * { width: 100%; } [data-size-sp="26per"] { width: 26% !important; } [data-size-sp="26per"] > * { width: 100%; } [data-size-sp="27per"] { width: 27% !important; } [data-size-sp="27per"] > * { width: 100%; } [data-size-sp="28per"] { width: 28% !important; } [data-size-sp="28per"] > * { width: 100%; } [data-size-sp="29per"] { width: 29% !important; } [data-size-sp="29per"] > * { width: 100%; } [data-size-sp="30per"] { width: 30% !important; } [data-size-sp="30per"] > * { width: 100%; } [data-size-sp="31per"] { width: 31% !important; } [data-size-sp="31per"] > * { width: 100%; } [data-size-sp="32per"] { width: 32% !important; } [data-size-sp="32per"] > * { width: 100%; } [data-size-sp="33per"] { width: 33% !important; } [data-size-sp="33per"] > * { width: 100%; } [data-size-sp="34per"] { width: 34% !important; } [data-size-sp="34per"] > * { width: 100%; } [data-size-sp="35per"] { width: 35% !important; } [data-size-sp="35per"] > * { width: 100%; } [data-size-sp="36per"] { width: 36% !important; } [data-size-sp="36per"] > * { width: 100%; } [data-size-sp="37per"] { width: 37% !important; } [data-size-sp="37per"] > * { width: 100%; } [data-size-sp="38per"] { width: 38% !important; } [data-size-sp="38per"] > * { width: 100%; } [data-size-sp="39per"] { width: 39% !important; } [data-size-sp="39per"] > * { width: 100%; } [data-size-sp="40per"] { width: 40% !important; } [data-size-sp="40per"] > * { width: 100%; } [data-size-sp="41per"] { width: 41% !important; } [data-size-sp="41per"] > * { width: 100%; } [data-size-sp="42per"] { width: 42% !important; } [data-size-sp="42per"] > * { width: 100%; } [data-size-sp="43per"] { width: 43% !important; } [data-size-sp="43per"] > * { width: 100%; } [data-size-sp="44per"] { width: 44% !important; } [data-size-sp="44per"] > * { width: 100%; } [data-size-sp="45per"] { width: 45% !important; } [data-size-sp="45per"] > * { width: 100%; } [data-size-sp="46per"] { width: 46% !important; } [data-size-sp="46per"] > * { width: 100%; } [data-size-sp="47per"] { width: 47% !important; } [data-size-sp="47per"] > * { width: 100%; } [data-size-sp="48per"] { width: 48% !important; } [data-size-sp="48per"] > * { width: 100%; } [data-size-sp="49per"] { width: 49% !important; } [data-size-sp="49per"] > * { width: 100%; } [data-size-sp="50per"] { width: 50% !important; } [data-size-sp="50per"] > * { width: 100%; } [data-size-sp="51per"] { width: 51% !important; } [data-size-sp="51per"] > * { width: 100%; } [data-size-sp="52per"] { width: 52% !important; } [data-size-sp="52per"] > * { width: 100%; } [data-size-sp="53per"] { width: 53% !important; } [data-size-sp="53per"] > * { width: 100%; } [data-size-sp="54per"] { width: 54% !important; } [data-size-sp="54per"] > * { width: 100%; } [data-size-sp="55per"] { width: 55% !important; } [data-size-sp="55per"] > * { width: 100%; } [data-size-sp="56per"] { width: 56% !important; } [data-size-sp="56per"] > * { width: 100%; } [data-size-sp="57per"] { width: 57% !important; } [data-size-sp="57per"] > * { width: 100%; } [data-size-sp="58per"] { width: 58% !important; } [data-size-sp="58per"] > * { width: 100%; } [data-size-sp="59per"] { width: 59% !important; } [data-size-sp="59per"] > * { width: 100%; } [data-size-sp="60per"] { width: 60% !important; } [data-size-sp="60per"] > * { width: 100%; } [data-size-sp="61per"] { width: 61% !important; } [data-size-sp="61per"] > * { width: 100%; } [data-size-sp="62per"] { width: 62% !important; } [data-size-sp="62per"] > * { width: 100%; } [data-size-sp="63per"] { width: 63% !important; } [data-size-sp="63per"] > * { width: 100%; } [data-size-sp="64per"] { width: 64% !important; } [data-size-sp="64per"] > * { width: 100%; } [data-size-sp="65per"] { width: 65% !important; } [data-size-sp="65per"] > * { width: 100%; } [data-size-sp="66per"] { width: 66% !important; } [data-size-sp="66per"] > * { width: 100%; } [data-size-sp="67per"] { width: 67% !important; } [data-size-sp="67per"] > * { width: 100%; } [data-size-sp="68per"] { width: 68% !important; } [data-size-sp="68per"] > * { width: 100%; } [data-size-sp="69per"] { width: 69% !important; } [data-size-sp="69per"] > * { width: 100%; } [data-size-sp="70per"] { width: 70% !important; } [data-size-sp="70per"] > * { width: 100%; } [data-size-sp="71per"] { width: 71% !important; } [data-size-sp="71per"] > * { width: 100%; } [data-size-sp="72per"] { width: 72% !important; } [data-size-sp="72per"] > * { width: 100%; } [data-size-sp="73per"] { width: 73% !important; } [data-size-sp="73per"] > * { width: 100%; } [data-size-sp="74per"] { width: 74% !important; } [data-size-sp="74per"] > * { width: 100%; } [data-size-sp="75per"] { width: 75% !important; } [data-size-sp="75per"] > * { width: 100%; } [data-size-sp="76per"] { width: 76% !important; } [data-size-sp="76per"] > * { width: 100%; } [data-size-sp="77per"] { width: 77% !important; } [data-size-sp="77per"] > * { width: 100%; } [data-size-sp="78per"] { width: 78% !important; } [data-size-sp="78per"] > * { width: 100%; } [data-size-sp="79per"] { width: 79% !important; } [data-size-sp="79per"] > * { width: 100%; } [data-size-sp="80per"] { width: 80% !important; } [data-size-sp="80per"] > * { width: 100%; } [data-size-sp="81per"] { width: 81% !important; } [data-size-sp="81per"] > * { width: 100%; } [data-size-sp="82per"] { width: 82% !important; } [data-size-sp="82per"] > * { width: 100%; } [data-size-sp="83per"] { width: 83% !important; } [data-size-sp="83per"] > * { width: 100%; } [data-size-sp="84per"] { width: 84% !important; } [data-size-sp="84per"] > * { width: 100%; } [data-size-sp="85per"] { width: 85% !important; } [data-size-sp="85per"] > * { width: 100%; } [data-size-sp="86per"] { width: 86% !important; } [data-size-sp="86per"] > * { width: 100%; } [data-size-sp="87per"] { width: 87% !important; } [data-size-sp="87per"] > * { width: 100%; } [data-size-sp="88per"] { width: 88% !important; } [data-size-sp="88per"] > * { width: 100%; } [data-size-sp="89per"] { width: 89% !important; } [data-size-sp="89per"] > * { width: 100%; } [data-size-sp="90per"] { width: 90% !important; } [data-size-sp="90per"] > * { width: 100%; } [data-size-sp="91per"] { width: 91% !important; } [data-size-sp="91per"] > * { width: 100%; } [data-size-sp="92per"] { width: 92% !important; } [data-size-sp="92per"] > * { width: 100%; } [data-size-sp="93per"] { width: 93% !important; } [data-size-sp="93per"] > * { width: 100%; } [data-size-sp="94per"] { width: 94% !important; } [data-size-sp="94per"] > * { width: 100%; } [data-size-sp="95per"] { width: 95% !important; } [data-size-sp="95per"] > * { width: 100%; } [data-size-sp="96per"] { width: 96% !important; } [data-size-sp="96per"] > * { width: 100%; } [data-size-sp="97per"] { width: 97% !important; } [data-size-sp="97per"] > * { width: 100%; } [data-size-sp="98per"] { width: 98% !important; } [data-size-sp="98per"] > * { width: 100%; } [data-size-sp="99per"] { width: 99% !important; } [data-size-sp="99per"] > * { width: 100%; } [data-size-sp="100per"] { width: 100% !important; } [data-size-sp="100per"] > * { width: 100%; } .Header:not([data-header-layout="simple"]) { left: 0 !important; } .Header__inner { align-items: center; justify-content: space-between; height: 55px; padding: 10px 15px; } body.is-scroll-down .Header:not([data-header-layout="simple"]) { top: -55px; } .header-logo > a { flex-direction: row-reverse; } .header-logo__image { width: 45px; } .header-logo__image__sp-hidden { display: none; } .header-logo__tagline { margin-left: 8px; font-size: 1.1rem; font-weight: 400; line-height: 1.4; } .header-menu__button { width: 35px; } .header-menu__button__type { display: block; position: relative; width: 100%; height: 100%; padding-top: 21px; line-height: 1; text-align: center; } .header-menu__button__type:before, .header-menu__button__type:after { display: inline-block; position: absolute; top: 50%; left: 50%; width: 30px; height: 1px; margin-left: -13px; background-color: #fff; content: ""; } .header-menu__button__type:before { margin-top: -16px; } .header-menu__button__type:after { margin-top: -4px; } .header-menu__button.is-active .header-menu__button__type:before { -webkit-transform: rotate(45deg); margin-top: 0; transform: rotate(45deg); } .header-menu__button.is-active .header-menu__button__type:after { -webkit-transform: rotate(135deg); margin-top: 0; transform: rotate(135deg); } .header-menu__button.is-active .header-menu__button__label { opacity: 0; } .header-menu__button__label { display: inline-block; font-size: 1rem; color: #fff; line-height: 1; text-align: center; white-space: nowrap; } .header-menu__button__label:before { display: inline-block; position: absolute; top: 50%; left: 50%; width: 30px; height: 1px; margin: -10px 0 0 -13px; background-color: #fff; content: ""; } .header-menu__button.is-active .header-menu__button__label:before { opacity: 0; } .header-menu__panel { display: none; position: absolute; top: 100%; left: 0; width: 100%; max-height: calc(100vh - 55px); padding-bottom: 5.0em; overflow-y: auto; background: linear-gradient(to right, #008eed 0%, #0055b0 100%); } .header-gnav__list { border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .header-gnav__list > li { border-top: 1px solid rgba(255, 255, 255, 0.1); } .header-gnav__list > li.is-active .header-gnav__type--toggle:before { -webkit-transform: rotate(0); transform: rotate(0); } .header-gnav .header-gnav__type--toggle { padding: 0.96em 30px 0.9em 15px; font-size: 1.6rem; } .header-gnav .header-gnav__type--toggle:before, .header-gnav .header-gnav__type--toggle:after { display: inline-block; position: absolute; top: 50%; right: 18px; width: 10px; height: 1px; margin: -1px 0 0; background-color: #fff; content: ""; transition: -webkit-transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s, -webkit-transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .header-gnav .header-gnav__type--toggle:before { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .header-megamenu__link-list > li { margin-top: 1px; } .header-megamenu__link-list > li:first-child { margin-top: 0; } .header-megamenu__link-list .header-megamenu__link-list__type, .header-megamenu__link-list .header-megamenu__link-list__type--blank { display: block; position: relative; width: 100%; padding: .87em 30px .87em 44px; background-color: #f6f7fb; } .header-megamenu__link-list .header-megamenu__link-list__type:after { position: absolute; top: 50%; right: 1.5em; width: 8px; height: 8px; margin-top: -4px; border-color: #008eed; } .header-megamenu__link-list .header-megamenu__link-list__type--blank:after { position: absolute; top: 50%; right: 15px; margin-top: -7px; background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#blank-usage"); } .header-megamenu__section .header-megamenu__section__head { margin-bottom: 1px; } .header-megamenu__section + .header-megamenu__section .header-megamenu__section__head { margin-top: 1px; } .header-megamenu__section .header-megamenu__section__title { padding: .86em 30px; font-size: 1.4rem; line-height: 1.6; background-color: #f6f7fb; } .header-search__input { height: 48px; padding: 0 3.4em 0 1.0em; border: 1px solid rgba(255, 255, 255, 0.1); } .header-search__submit { width: 54px; height: 48px; } .header-utility { margin-top: 15px; padding: 0 15px; } .header-global { margin-top: 15px; } .header-global .header-global__type { display: flex; position: relative; justify-content: center; padding: 1.0em 2.6em .8em; border-radius: 25px; background-color: #fff; font-size: 1.5rem; text-align: center; } .header-global .header-global__type:after { position: absolute; top: 50%; right: 1.3em; margin-top: -7px; background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#blank-usage"); } body.is-liquid { min-width: auto !important; } body.is-liquid .Main__content { max-width: 100% !important; } body.is-active-menu { overflow: hidden; } .Header:not([data-header-layout="simple"]) + .Main { margin-top: 55px; } .Main__guide { display: none; } .main-breadcrumb { padding: 15px 15px 6px; border-top: 1px solid #ecedf1; } .main-breadcrumb > li { flex-shrink: 0; margin-right: .6em; margin-bottom: .64em; padding-right: 1.0em; } .main-breadcrumb > li:after { right: 2px; } .main-breadcrumb > li:last-of-type > [class*="__type"] { font-weight: 700; } .Main__content { width: 100%; padding: 1.6em 15px 3em; } .main-lnav__inner { padding: 0 15px 3em; } .main-lnav__title { font-size: 2.0rem; } .main-lnav__card-wrap { margin-top: 1.5em; } .main-lnav__card__body { padding: 0 15px; } .main-lnav__card__title { font-size: 1.6rem; font-weight: 700; } .main-lnav__card__description { margin: .5em 0 0; font-size: 1.3rem; } .main-lnav__card-v2__body { padding: 0 15px; } .main-lnav__card-v2__title { font-size: 1.7rem; } .main-lnav__card-v2__link-list > li { margin-top: .5em; } .main-lnav__card-v2__link-list .main-lnav__card-v2__link-list__type--blank:after { top: -3px; } .main-lnav__list-wrap { margin-top: .6em; } .main-lnav__link-list > li { margin-top: .5em; } .main-lnav__link-list .main-lnav__link-list__type--blank:after { top: -3px; } .footer-snav__item { border-top: 1px solid #ebedf1; } .footer-snav__item:first-child { border-top: none; } .footer-snav__item__head { display: block; position: relative; width: 100%; padding: 1.1em 30px 1em 15px; border: none; background: none; font-size: 1.4rem; text-align: left; } .footer-snav__item__head:before, .footer-snav__item__head:after { display: inline-block; position: absolute; top: 50%; right: 18px; width: 10px; height: 1px; margin: -1px 0 0; background-color: #303038; content: ""; transition: -webkit-transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s, -webkit-transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .footer-snav__item__head:before { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .footer-snav__item__head.is-active:before { -webkit-transform: rotate(0); transform: rotate(0); } .footer-snav__item__body { display: none; } .footer-snav__link-list { margin: 0; } .footer-snav__link-list > li { border-top: 1px solid #ebedf1; } .footer-snav__link-list .footer-snav__link-list__type, .footer-snav__link-list .footer-snav__link-list__type--blank { display: block; position: relative; width: 100%; padding: .91em 30px .8em; font-size: 1.2rem; } .footer-snav__link-list .footer-snav__link-list__type:after { right: 1.75em; width: 8px; height: 8px; border-color: #303038; } .footer-snav__link-list .footer-snav__link-list__type--blank:after { position: absolute; top: 50%; right: 1.4em; margin: -7px 0 0; background-image: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94533_pic_sprite.svg#blank4-usage"); } .footer-snav__link-list__external-text { display: none; } .footer-snav__section { border-top: 1px solid #ebedf1; } .footer-snav__section__title { padding: .7em 30px .6em; font-size: 1.4rem; color: #7c7c85; } .Footer__body { padding: 0 15px; } .Footer__body__inner { padding: 1.8em 0 1.4em; } .footer-logo { margin-right: 1em; } .footer-logo__image { width: 55px; } .footer-logo__image > img { width: 100%; } .footer-link-list > li { margin-right: 2.0em; } .footer-link-list-wrap-v2 { margin-top: 1em; padding-top: 1.2em; border-top: 1px solid #333; } .footer-link-list-v2 > li { margin-right: 2.6em; } .footer-sns { margin-top: 1.2em; } .footer-sns__list > li { width: 36px; margin-left: 15px; } .Footer__foot { padding: 0 15px; } .Footer__foot__inner { align-items: center; } .Footer:not([data-footer-layout="simple"]) .Footer__foot__inner { padding: .6em 0 2.2em; } .Footer[data-footer-layout="simple"] .Footer__foot__inner { display: block; padding: 1.7em 0 1.6em; } .Footer:not([data-footer-layout="simple"]) .footer-utility__link-list > li { width: calc((100% - 15px)/2); margin-top: 1.0em; margin-left: 15px; } .Footer:not([data-footer-layout="simple"]) .footer-utility__link-list > li:nth-of-type(2n+1) { margin-left: 0; } .Footer:not([data-footer-layout="simple"]) .footer-utility__link-list > li:nth-of-type(-n+2) { margin-top: 0; } .Footer[data-footer-layout="simple"] .footer-utility__link-list > li { margin-top: .4em; } .Footer[data-footer-layout="simple"] .footer-utility__link-list > li:first-child { margin-top: 0; } .Footer[data-footer-layout="simple"] .footer-copyright { margin-top: .6em; } .footer-copyright__label { font-size: 1.0rem; } .assist-banner { right: 15px; bottom: 29px; width: 86px; height: 73px; } .assist-banner__type { padding: 10px; border-radius: 2px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); } .assist-banner__close { top: -13px; right: -13px; width: 22px; height: 22px; } .assist-banner__close:before, .assist-banner__close:after { width: 12px; margin-left: -6px; } .Main__content .heading1 + * { margin-top: 1.6em; } .heading1__title { font-size: 2.4rem; font-weight: 700; } .heading1__subtitle { font-size: 1.2rem; } .Main__content .heading1--center + * { margin-top: 1.6em; } .heading1--center__title { font-size: 2.4rem; font-weight: 700; } .heading1--center__subtitle { font-size: 1.2rem; } .heading1 { padding: 1.6em 0 0; } .heading1__inner { padding: 0 15px; } .heading1__title { font-size: 2.5rem; font-weight: 700; } .heading1__title > sup { top: -.9em; font-size: 1.1rem; font-weight: 400; } .heading1__subtitle { margin: 1.0em 0; font-size: 1.4rem; } .heading2 { margin: 3.4em 0 0; } .Main .heading2 + * { margin-top: 1.4em; } .heading2__title { font-size: 2.1rem; font-weight: 700; } .heading2__subtitle { font-size: 1.2rem; } .heading2--center { margin: 3.4em 0 0; } .Main .heading2--center + * { margin-top: 1.4em; } .heading2--center__title { font-size: 2.1rem; font-weight: 700; } .heading2--center__subtitle { font-size: 1.2rem; } .heading2 { margin: 3.4em 0 0; } .heading2__inner:before { width: 113px; height: 1px; } .heading2__title { font-size: 2.1rem; font-weight: 700; } .heading2__title > sup { top: -.7em; font-size: 1.1rem; } .heading2__subtitle { margin: .6em 0 0; font-size: 1.4rem; font-weight: 700; } .heading2__filesize { font-size: 1.4rem; font-weight: 400; line-height: 2.0; } .heading2-v2 { margin: 3.4em 0 0; } .Main .heading2-v2 + * { margin-top: 1.4em; } .heading2-v2__title { font-size: 2.1rem; font-weight: 700; } .heading2-v2__subtitle { font-size: 1.2rem; } .heading2-v2--center { margin: 3.4em 0 0; } .Main .heading2-v2--center + * { margin-top: 1.4em; } .heading2-v2--center__title { font-size: 2.1rem; font-weight: 700; } .heading2-v2--center__subtitle { font-size: 1.2rem; } .heading2-v2 { margin: 3.4em 0 0; } .heading2-v2__link .heading2-v2__title:after { top: -2px; width: 10px; height: 10px; margin-left: 5px; } .heading2-v2__title { font-size: 2.1rem; font-weight: 700; } .heading2-v2__title > sup { top: -.7em; font-size: 1.1rem; } .heading2-v2__subtitle { margin: .6em 0 0; font-size: 1.4rem; font-weight: 700; } .heading2-v2__filesize { font-size: 1.4rem; font-weight: 400; line-height: 2.0; } .heading3 { margin: 3.2em 0 0; } .Main .heading3 + * { margin-top: 1.4em; } .heading3__title { font-size: 2.0rem; font-weight: 700; } .heading3__subtitle { font-size: 1.2rem; } .heading3--center { margin: 3.2em 0 0; } .Main .heading3--center + * { margin-top: 1.4em; } .heading3--center__title { font-size: 2.0rem; font-weight: 700; } .heading3--center__subtitle { font-size: 1.2rem; } .heading3 { margin: 3.2em 0 0; } .heading3__inner { padding-bottom: .6em; } .heading3__title { font-size: 1.9rem; font-weight: 700; } .heading3__title > sup { top: -.5em; font-size: 1.1rem; } .heading4 { margin: 2.8em 0 0; } .Main .heading4 + * { margin-top: 1.0em; } .heading4__title { font-size: 1.8rem; font-weight: 700; } .heading4__subtitle { font-size: 1.2rem; } .heading4--center { margin: 2.8em 0 0; } .Main .heading4--center + * { margin-top: 1.0em; } .heading4--center__title { font-size: 1.8rem; font-weight: 700; } .heading4--center__subtitle { font-size: 1.2rem; } .heading4 { margin: 2.8em 0 0; } .heading4__inner { padding-bottom: .5em; } .heading4__title { font-size: 1.7rem; font-weight: 700; } .heading4__title > sup { top: -.5em; font-size: 1.1rem; } .heading-title-pic { margin: 2.2em 0 0; } .Main .heading-title-pic + * { margin-top: 1.0em; } .heading-title-pic__title { font-size: 1.6rem; font-weight: 700; } .heading-title-pic__subtitle { font-size: 1.2rem; } .heading-title-pic--center { margin: 2.2em 0 0; } .Main .heading-title-pic--center + * { margin-top: 1.0em; } .heading-title-pic--center__title { font-size: 1.6rem; font-weight: 700; } .heading-title-pic--center__subtitle { font-size: 1.2rem; } .heading-title-pic { margin: 2.2em 0 0; } .Main .heading-title-pic + * { margin-top: 1.0em; } .heading-title-pic__icon { width: 61px; margin: 0 auto 1.0em; } .heading-title-pic__title { font-size: 1.6rem; font-weight: 400; text-align: center; } .text { font-size: 1.4rem; } .text--center { font-size: 1.4rem; } .text--right { font-size: 1.4rem; } .lead { font-weight: 700; } .lead--center { font-weight: 700; } .lead { margin: .8em 0 0; font-size: 1.6rem; font-weight: 700; } .lead--center { margin: .8em 0 0; font-size: 1.6rem; font-weight: 700; } .note-list > li { font-size: 1.4rem; } .note-list__nest { margin: .4em 0 0; } [class*="list__nest"] .note-list[data-col-sp] > li { margin-top: .4em; } [class*="list__nest"] .note-list[data-col-sp="auto"] > li { margin: 0 15px .4em 0; } [class*="list-v2__nest"] .note-list[data-col-sp] > li { margin-top: .2em; } [class*="list-v2__nest"] .note-list[data-col-sp="auto"] > li { margin: 0 15px .2em 0; } .note-list[data-col-sp] > li:first-child { margin-top: 0; } .note-list > li { margin: 0; padding-left: 1.5em; font-size: 1.4rem; } .note-list__nest { margin: .6em 0 .8em; font-size: 1.4rem; } .note-list__nest [data-col-sp="auto"] { margin-bottom: 0 !important; } .note-list[data-col-sp] > li { margin-top: 0; } .note-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } [class*="list__nest"] .note-list[data-col-sp] > li { margin-top: 0; } [class*="list__nest"] .note-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } .unorder-list > li { font-size: 1.4rem; } .unorder-list__nest { margin: .4em 0 0; } [class*="list__nest"] .unorder-list[data-col-sp] > li { margin-top: .4em; } [class*="list__nest"] .unorder-list[data-col-sp="auto"] > li { margin: 0 15px .4em 0; } [class*="list-v2__nest"] .unorder-list[data-col-sp] > li { margin-top: .2em; } [class*="list-v2__nest"] .unorder-list[data-col-sp="auto"] > li { margin: 0 15px .2em 0; } .unorder-list[data-col-sp] > li:first-child { margin-top: 0; } .unorder-list__nest { margin: .6em 0 .8em; } .unorder-list__nest [data-col-sp="auto"] { margin-bottom: 0 !important; } .unorder-list[data-col-sp] > li { margin-top: 0; } .unorder-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } [class*="list__nest"] .unorder-list[data-col-sp] > li { margin-top: 0; } [class*="list__nest"] .unorder-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } .unorder-list-v2 > li { font-size: 1.4rem; } .unorder-list-v2__nest { margin: .4em 0 0; } [class*="list__nest"] .unorder-list-v2[data-col-sp] > li { margin-top: .4em; } [class*="list__nest"] .unorder-list-v2[data-col-sp="auto"] > li { margin: 0 15px .4em 0; } [class*="list-v2__nest"] .unorder-list-v2[data-col-sp] > li { margin-top: .2em; } [class*="list-v2__nest"] .unorder-list-v2[data-col-sp="auto"] > li { margin: 0 15px .2em 0; } .unorder-list-v2[data-col-sp] > li:first-child { margin-top: 0; } .unorder-list-v2__nest { margin-top: .6em; } .unorder-list-v2[data-col-sp] > li { margin-top: .8em; } .unorder-list-v2[data-col-sp="auto"] > li { margin: 0 15px .8em 0; } .order-list > li { font-size: 1.4rem; } .order-list__nest { margin: .4em 0 0; } [class*="list__nest"] .order-list[data-col-sp] > li { margin-top: .4em; } [class*="list__nest"] .order-list[data-col-sp="auto"] > li { margin: 0 15px .4em 0; } [class*="list-v2__nest"] .order-list[data-col-sp] > li { margin-top: .2em; } [class*="list-v2__nest"] .order-list[data-col-sp="auto"] > li { margin: 0 15px .2em 0; } .order-list[data-col-sp] > li:first-child { margin-top: 0; } .order-list__mark { font-weight: 700; } .order-list__nest { margin: .6em 0 .8em; } .order-list__nest [data-col-sp="auto"] { margin-bottom: 0 !important; } .order-list[data-col-sp] > li { margin-top: 0; } .order-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } [class*="list__nest"] .order-list[data-col-sp] > li { margin-top: 0; } [class*="list__nest"] .order-list[data-col-sp="auto"] > li { margin: 0 15px .4em 0; } .link-list > li { font-size: 1.4rem; } [class*="modal--"].modaal-wrapper .modaal-container { padding: 40px 14px; } [class*="modal--"].modaal-wrapper .modaal-inner-wrapper { padding-right: 14px; padding-left: 14px; } [class*="modal--"].modaal-wrapper .modaal-close { top: 10px; right: 10px; width: 22px; height: 22px; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 18px; height: 1px; margin: -1px 0 0 -9px; } [class*="modal--"].modaal-wrapper .modaal-video-wrap { margin: auto; } .link-list__filesize { font-weight: 400; } .link-list__nest { margin: .4em 0 0; } [class*="list__nest"] .link-list[data-col-sp] > li { margin-top: .4em; } [class*="list__nest"] .link-list[data-col-sp="auto"] > li { margin: 0 15px .4em 0; } [class*="list-v2__nest"] .link-list[data-col-sp] > li { margin-top: .2em; } [class*="list-v2__nest"] .link-list[data-col-sp="auto"] > li { margin: 0 15px .2em 0; } .link-list[data-col-sp] > li:first-child { margin-top: 0; } .link-list__nest { margin: .6em 0 .8em; } .link-list__nest [data-col-sp="auto"] { margin-bottom: 0 !important; } .link-list[data-col-sp] > li { margin-top: 0; } .link-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } [class*="list__nest"] .link-list[data-col-sp] > li { margin-top: 0; } [class*="list__nest"] .link-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } .note-order-list > li { font-size: 1.4rem; } .note-order-list__nest { margin: .4em 0 0; } [class*="list__nest"] .note-order-list[data-col-sp] > li { margin-top: .4em; } [class*="list__nest"] .note-order-list[data-col-sp="auto"] > li { margin: 0 15px .4em 0; } [class*="list-v2__nest"] .note-order-list[data-col-sp] > li { margin-top: .2em; } [class*="list-v2__nest"] .note-order-list[data-col-sp="auto"] > li { margin: 0 15px .2em 0; } .note-order-list[data-col-sp] > li:first-child { margin-top: 0; } .note-order-list > li { padding-left: 2.1em; font-size: 1.4rem; } .note-order-list__nest { margin: .6em 0 .8em; font-size: 1.4rem; } .note-order-list__nest [data-col-sp="auto"] { margin-bottom: 0 !important; } .note-order-list[data-col-sp] > li { margin-top: 0; } .note-order-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } [class*="list__nest"] .note-order-list[data-col-sp] > li { margin-top: 0; } [class*="list__nest"] .note-order-list[data-col-sp="auto"] > li { margin: 0 15px 0 0; } .button .button__type, .button .button__type--noIcon, .button .button__type--blank, .button .button__type--pdf, .button .button__type--excel, .button .button__type--word, .button .button__type--powerpoint, .button .button__type--zip, .button .button__type--video, .button .button__type--modal, .button .button__type--rss { padding: .9em 2.3em .9em 1.3em; font-size: 1.5rem; } .button-wrap--centering { flex-direction: column; align-items: center; } .button-wrap--centering > * { margin-top: 1em; } .button-wrap--centering > *:first-child { margin-top: 0; } .button-wrap { margin: 1.0em 0 0; } .button-wrap[data-col-sp]:not([data-col-sp="auto"]) > * { margin-top: 1.0em; } [class*="button-wrap"][data-col-sp]:not([data-col-sp="1"]) > .button > [class*="__type"] { width: 100%; } .button .button__type:after { right: 1.3em; } .button .button__type--blank { padding-right: 2.8em; } .button .button__type--blank:after { right: 1.3em; } .button .button__type--pdf { padding-right: 2.8em; } .button .button__type--pdf:after { right: 1.3em; } .button .button__type--excel { padding-right: 2.8em; } .button .button__type--excel:after { right: 1.3em; } .button .button__type--word { padding-right: 2.8em; } .button .button__type--word:after { right: 1.3em; } .button .button__type--powerpoint { padding-right: 2.8em; } .button .button__type--powerpoint:after { right: 1.3em; } .button .button__type--zip { padding-right: 2.8em; } .button .button__type--zip:after { right: 1.3em; } .button .button__type--video { padding-right: 2.8em; } .button .button__type--video:after { right: 1.3em; } .button .button__type--modal { padding-right: 2.8em; } .button .button__type--modal:after { right: 1.3em; } [class*="modal--"].modaal-wrapper .modaal-container { padding: 40px 14px; } [class*="modal--"].modaal-wrapper .modaal-inner-wrapper { padding-right: 14px; padding-left: 14px; } [class*="modal--"].modaal-wrapper .modaal-close { top: 10px; right: 10px; width: 22px; height: 22px; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 18px; height: 1px; margin: -1px 0 0 -9px; } [class*="modal--"].modaal-wrapper .modaal-video-wrap { margin: auto; } .button .button__type--rss { padding-right: 2.8em; } .button .button__type--rss:after { right: 1.3em; } .button .button__type--blank { padding-right: 2.9em; } .button__filesize { font-size: 1.4rem; font-weight: 400; vertical-align: top; } .button-v2 .button-v2__type, .button-v2 .button-v2__type--noIcon, .button-v2 .button-v2__type--blank, .button-v2 .button-v2__type--pdf, .button-v2 .button-v2__type--excel, .button-v2 .button-v2__type--word, .button-v2 .button-v2__type--powerpoint, .button-v2 .button-v2__type--zip, .button-v2 .button-v2__type--video, .button-v2 .button-v2__type--modal, .button-v2 .button-v2__type--rss { padding: .9em 2.3em .9em 1.3em; font-size: 1.5rem; } .button-wrap--centering { flex-direction: column; align-items: center; } .button-wrap--centering > * { margin-top: 1em; } .button-wrap--centering > *:first-child { margin-top: 0; } .button-wrap { margin: 1.0em 0 0; } .button-wrap[data-col-sp]:not([data-col-sp="auto"]) > * { margin-top: 1.0em; } [class*="button-wrap"][data-col-sp]:not([data-col-sp="1"]) > .button-v2 > [class*="__type"] { width: 100%; } .button-v2 .button-v2__type:after { right: 1.3em; } .button-v2 .button-v2__type--blank { padding-right: 2.8em; } .button-v2 .button-v2__type--blank:after { right: 1.3em; } .button-v2 .button-v2__type--pdf { padding-right: 2.8em; } .button-v2 .button-v2__type--pdf:after { right: 1.3em; } .button-v2 .button-v2__type--excel { padding-right: 2.8em; } .button-v2 .button-v2__type--excel:after { right: 1.3em; } .button-v2 .button-v2__type--word { padding-right: 2.8em; } .button-v2 .button-v2__type--word:after { right: 1.3em; } .button-v2 .button-v2__type--powerpoint { padding-right: 2.8em; } .button-v2 .button-v2__type--powerpoint:after { right: 1.3em; } .button-v2 .button-v2__type--zip { padding-right: 2.8em; } .button-v2 .button-v2__type--zip:after { right: 1.3em; } .button-v2 .button-v2__type--video { padding-right: 2.8em; } .button-v2 .button-v2__type--video:after { right: 1.3em; } .button-v2 .button-v2__type--modal { padding-right: 2.8em; } .button-v2 .button-v2__type--modal:after { right: 1.3em; } .button-v2 .button-v2__type--rss { padding-right: 2.8em; } .button-v2 .button-v2__type--rss:after { right: 1.3em; } .button-v2 .button-v2__type--blank { padding-right: 2.9em; } .button-v2__filesize { font-weight: 400; vertical-align: top; } .figure__caption, .figure__caption--center, .figure__caption--right { font-size: 1.2rem; } .figure-wrap { margin: 1.4em 0 0; } .figure-wrap--center { margin: 1.4em 0 0; } .figure__title { font-weight: 700; } [class*="modal--"].modaal-wrapper .modaal-container { padding: 40px 14px; } [class*="modal--"].modaal-wrapper .modaal-inner-wrapper { padding-right: 14px; padding-left: 14px; } [class*="modal--"].modaal-wrapper .modaal-close { top: 10px; right: 10px; width: 22px; height: 22px; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 18px; height: 1px; margin: -1px 0 0 -9px; } [class*="modal--"].modaal-wrapper .modaal-video-wrap { margin: auto; } .video-wrap__caption, .video-wrap__caption--center, .video-wrap__caption--right { font-size: 1.2rem; } .video-wrap { margin: 1.4em 0 0; } .video { border: 1px solid #d9dce4; } .video-wrap__caption, .video-wrap__caption--center, .video-wrap__caption--right { font-size: 1.2rem; } .video-wrap { margin: 1.4em 0 0; } .table__caption, .table__caption--center, .table__caption--right { margin: 1.1em 0 0 0; font-size: 1.2rem; } .table [class*="__cell"] { padding: .6em; } .table__head { margin: 0 0 .6em; } .table__foot { margin: .6em 0 0; } .table__title { margin: 0 0 .9em; font-size: 1.5rem; font-weight: 700; } .table__note { font-size: 1.2rem; } .table__matrix > caption { margin: 0 0 .6em; } .table [class*="__cell--lv1"] { font-weight: 700; } .table [class*="__cell--lv2"] { font-weight: 700; } .table[data-table-sp="scroll"] .table__body { padding-bottom: 24px; overflow-x: auto; } .table[data-table-sp="scroll"] .table__body::-webkit-scrollbar { height: 9px; } .table[data-table-sp="scroll"] .table__body::-webkit-scrollbar-track { border-radius: 9px; background-color: #ddd; } .table[data-table-sp="scroll"] .table__body::-webkit-scrollbar-thumb { border-radius: 9px; background-color: #666; } .table[data-table-sp="scroll"] .table__body .is-table-sticky--left { position: -webkit-sticky; position: sticky; left: 0; } .table[data-table-sp="scroll"] .table__body .is-table-sticky--left:after { position: absolute; top: 0; right: -1px; width: 1px; height: 100%; background-color: #d9dce4; content: ""; } .table[data-table-sp="scroll"] .table__matrix { width: 813px !important; } .table[data-table-sp="vertical"] col, .table[data-table-sp="vertical"] tbody, .table[data-table-sp="vertical"] tr, .table[data-table-sp="vertical"] th, .table[data-table-sp="vertical"] td { display: block; width: 100% !important; } .media[data-media-sp="row"][data-media-wraparound="false"] { display: flex; flex-wrap: nowrap; } .media[data-media-sp="row"][data-media-wraparound="false"][data-media-pc="image-left"] { flex-direction: row; } .media[data-media-sp="row"][data-media-wraparound="false"][data-media-pc="image-right"] { flex-direction: row-reverse; } .media[data-media-sp="col"] { display: flex; flex-direction: column !important; } .media[data-media-sp="col-reverse"] { display: flex; flex-direction: column-reverse !important; } .media__caption, .media__caption--center, .media__caption--right { margin: .7em 0 0; font-size: 1.2rem; } .media[data-media-sp="row"] .media__head { max-width: calc((100% - 15px * 1) / 2); } .media[data-media-sp="row"][data-media-pc="image-left"] .media__head { margin-right: 15px; } .media[data-media-sp="row"][data-media-pc="image-left"][data-media-wraparound="true"] .media__head { float: left; } .media[data-media-sp="row"][data-media-pc="image-right"] .media__head { margin-left: 15px; } .media[data-media-sp="row"][data-media-pc="image-right"][data-media-wraparound="true"] .media__head { float: right; } .media[data-media-sp="col"] .media__body, .media[data-media-sp="col-reverse"] .media__head { margin-top: .8em; } .media[data-media-sp="col"] .media__head, .media[data-media-sp="col-reverse"] .media__head { display: flex; flex-direction: column; justify-content: center; } .column { margin: 1.4em 0 0; } .column[data-col-sp]:not([data-col-sp="auto"]) > * { margin-top: 1em; } .anchor-navi { margin-top: 1.0em; } .anchor-navi--center { margin-top: 1.0em; } .anchor-navi__list[data-col-sp] > li { margin-top: 0; } .anchor-navi__label:after { top: -4px; width: 8px; height: 8px; } .anchor-navi .anchor-navi__list[data-col-sp="auto"] > li { margin-bottom: 1.0em !important; } .anchor-navi .anchor-navi__list[data-col-sp="2"] > li { width: calc((100% - (15px * (2 - 1))) / 2); margin-left: 15px !important; } .anchor-navi .anchor-navi__list[data-col-sp="2"] > li:nth-child(2n+1) { margin-left: 0 !important; } .accordion + .accordion { margin-top: .6em; } .accordion { margin: 1.8em 0 0; } .accordion + .accordion { margin-top: -1px; } .accordion__head { padding: .8em 1.0em .8em 1.4em; } .accordion__title { padding-right: 1.8em; font-size: 1.6rem; font-weight: 700; } .accordion__body { padding: 1.2em 1.4em; } .accordion__nest > .accordion .accordion__head { padding: .6em 1.0em .6em 2.3em; } .accordion__nest > .accordion .accordion__head .accordion__title { padding-right: 2em; font-size: 1.4rem; } .accordion__nest > .accordion .accordion__body { padding-left: 2.3em; } .accordion__nest > .accordion .accordion__head { background-color: #f2faff; } .tab { margin: 1.6em 0 0; } .tab__list { margin: 0 -2.5px; } .tab__list > li { padding: 0 2.5px; } .tab__button { padding: .5em; font-size: 1.6rem; font-weight: 700; } .tab__body { padding: 1.2em 0 0; } [class*="modal--"].modaal-wrapper .modaal-close { top: -59px; right: 15px; width: 44px; height: 44px; } [class*="modal--"].modaal-wrapper .modaal-close > span:before, [class*="modal--"].modaal-wrapper .modaal-close > span:after { width: 16px; height: 2px; margin: -1px 0 0 -8px; background-color: #fff; } .modal--image.modaal-wrapper .modaal-container { padding: 20px; } .download { margin: 1.4em 0 0; } .download__inner { padding: 1.6em 1.4em 1.4em; } .download__title { font-size: 1.6rem; } .download__caption { margin-top: 1.0em; } .download__link-list-wrap { margin: 1.0em 0 0; } @-webkit-keyframes scroll-hint-appear { 0% { -webkit-transform: translateX(40px); transform: translateX(40px); opacity: 0; } 10% { opacity: 1; } 50%, 100% { -webkit-transform: translateX(-40px); transform: translateX(-40px); opacity: 0; } } @keyframes scroll-hint-appear { 0% { -webkit-transform: translateX(40px); transform: translateX(40px); opacity: 0; } 10% { opacity: 1; } 50%, 100% { -webkit-transform: translateX(-40px); transform: translateX(-40px); opacity: 0; } } .table[data-table-sp="scroll"] .scroll-hint-icon { -webkit-transform: translate(-50%, -50%); position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; padding: .9em; transform: translate(-50%, -50%); border-radius: 4px; background: rgba(48, 48, 56, 0.5); text-align: center; opacity: 0; transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .table[data-table-sp="scroll"] .scroll-hint-icon:before { display: inline-block; width: 28px; height: 38px; background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94072_pic_hand_white.svg") no-repeat; background-position: center center; background-size: 100% auto; content: ""; } .table[data-table-sp="scroll"] .scroll-hint-icon-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-height: 100%; pointer-events: none; } .table[data-table-sp="scroll"] .scroll-hint-icon-wrap.is-active .scroll-hint-icon { opacity: .8; } .table[data-table-sp="scroll"] .scroll-hint-icon-wrap.is-active .scroll-hint-icon:before { -webkit-animation: scroll-hint-appear 1.2s linear; -webkit-animation-iteration-count: 2; animation: scroll-hint-appear 1.2s linear; animation-iteration-count: 2; } .table[data-table-sp="scroll"] .scroll-hint-text { color: #fff; font-size: 1.2rem; } .cmn-exchange-rate__list > li { margin-top: .6em; } .cmn-exchange-rate__company { width: calc((100% / 2) + 8px); font-size: 1.2rem; } .cmn-exchange-rate__company__caption { font-size: 1.0rem; } .cmn-exchange-rate__jpy { margin-left: .6em; padding-left: .6em; font-size: 1.2rem; } .cmn-exchange-rate__jpy__caption { font-size: 1.0rem; } .cmn-notice-v2 { margin: 1.4em 0; padding: 1.0em 1.0em 1.2em; } .cmn-notice-v2__head { margin: 0 0 1.0em; } .cmn-notice-v2__title { font-size: 1.5rem; font-weight: 700; } .cmn-notice-v2__heading { margin-top: 1.0em; } .cmn-notice-v2__heading__title { font-size: 1.5rem; font-weight: 700; } .cmn-related { margin: 1.8em 0 0; } .cmn-related__heading { margin: 0 0 1.6em; } .cmn-related__heading__title { font-size: 2.0rem; font-weight: 400; } .cmn-related__title { margin: 1.2em 0 0; font-size: 1.9rem; } .cmn-related__media { margin: 1.4em 0 0; } .cmn-related__media__head + .cmn-related__media__body { margin-top: 1.0em; } .cmn-accordion-image { margin: 1.8em 0 0; } .cmn-accordion-image__list > li:nth-child(n+2) { margin-top: 1px; } .cmn-accordion-image__body { padding: 1.2em 1.4em; border: 1px solid #ecedf1; } .cmn-accordion-image__trigger:before { right: .6em; width: 15px; height: 15px; margin-top: -8px; background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/93961_pic_down_blue.svg") no-repeat; opacity: 1.0; } .cmn-accordion-image__trigger:after { -webkit-transform: rotate(180deg); position: absolute; top: 50%; right: .6em; width: 15px; height: 15px; margin-top: -8px; transform: rotate(180deg); background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/93961_pic_down_blue.svg") no-repeat; content: ""; opacity: 0.0; } .cmn-accordion-image__trigger.is-active:before { opacity: 0.0; } .cmn-accordion-image__trigger.is-active:after { opacity: 1.0; } .cmn-accordion-image__trigger__head { width: 65px; min-height: 65px; } .cmn-accordion-image__trigger__body { padding: .7em 2.7em .7em .9em; } .cmn-accordion-image__trigger__image { width: 55px; height: 55px; } .cmn-accordion-image__trigger__title { font-weight: 700; } .cmn-accordion-image__trigger__note { padding-left: 1.5em; font-size: 1.2rem; } .cmn-products-jcbdebit { background-color: #fff; } .cmn-products-jcbdebit__head { padding: 1.8em 15px 0; } .cmn-products-jcbdebit__body { margin-top: 1.4em; } .cmn-products-jcbdebit__logo { justify-content: center; margin-bottom: 1.8em; } .cmn-products-jcbdebit__logo__inner { width: 40.53333vw; } .cmn-products-jcbdebit__pay-wrap { margin: 0 -15px; padding: 0.6em 15px; background-color: #f7f7f8; } .cmn-products-jcbdebit__pay-wrap > * { margin-left: .7em; } .cmn-products-jcbdebit__pay--apple-pay { width: 25px; } .cmn-products-jcbdebit__pay--google-pay { width: 34px; } .cmn-products-jcbdebit__note { margin: 1.4em 0 0; text-align: center; } .cmn-products-jcbdebit__tab__head { padding: 0 15px; } .cmn-products-jcbdebit__tab__list { justify-content: center; } .cmn-products-jcbdebit__tab__list > li { width: calc((100% - 5px) / 2); margin-left: 5px; } .cmn-products-jcbdebit__tab__list > li:before { left: -15px; width: calc(100% + (15px * 2)); } .cmn-products-jcbdebit__tab__button { padding: 1.125em 1.0em; font-size: 1.6rem; font-weight: 700; } .cmn-products-jcbdebit[data-layout="simple"] .cmn-products-jcbdebit__content__head { padding-top: 1.8em; padding-bottom: 1.0em; } .cmn-products-jcbdebit[data-layout="simple"] .cmn-products-jcbdebit__tab__list > li:before { display: none; } .cmn-products-jcbdebit[data-layout="simple"] .cmn-products-jcbdebit__tab__list > li .cmn-products-jcbdebit__tab__button { padding: 0; border: none; background: none; color: #303038; font-size: 2.0rem; font-weight: 400; } .cmn-products-jcbdebit__content__head { padding: 2.0em 1.0em 1.2em; } .cmn-products-jcbdebit__content__body { padding: 2.8em 1.0em 2.0em; } .cmn-products-jcbdebit__content__pay-wrap { justify-content: flex-end; margin: 0 0 2.0em; } .cmn-products-jcbdebit__content__pay-wrap > * { margin-left: .7em; } .cmn-products-jcbdebit__content__pay--logo { width: 22px; } .cmn-products-jcbdebit__content__pay--apple-pay { width: 25px; } .cmn-products-jcbdebit__content__pay--google-pay { width: 34px; } .cmn-products-jcbdebit__name { margin: 0 0 1.1em; font-size: 1.9rem; } .cmn-products-jcbdebit__carousel__list > .slick-list { width: calc((191 / 375) * 100vw); margin: 0 auto; } .cmn-products-jcbdebit__carousel__list > .slick-arrow { z-index: 2; position: absolute; top: 50%; width: 32px; height: 32px; margin-top: -16px; padding: 0; overflow: hidden; border: none; background: none; font-size: 0; text-indent: -9999em; } .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-prev:before { left: 0; width: 16px; height: 16px; border-color: #808085; } .cmn-products-jcbdebit__carousel__list > .slick-arrow.slick-next:before { right: 0; width: 16px; height: 16px; border-color: #808085; } .cmn-products-jcbdebit__carousel__item { width: calc((191 / 375) * 100vw); height: calc((191 / 375) * 100vw); } .cmn-products-jcbdebit__carousel__item > img { max-width: calc((191 / 375) * 100vw); max-height: calc((191 / 375) * 100vw); } .cmn-products-jcbdebit__carousel__control { margin-top: .5em; } .cmn-products-jcbdebit__carousel__pager { display: none; } .cmn-products-jcbdebit__carousel__count { display: flex; justify-content: center; } .cmn-products-jcbdebit__heading { margin: 0 0 1.0em; } .cmn-products-jcbdebit__heading__inner { padding-top: .8em; } .cmn-products-jcbdebit__heading__title { font-size: 1.7rem; font-weight: 400; } .cmn-products-jcbdebit__heading__title > sup { top: -.5em; font-size: 1.1rem; } .modal--products-jcbdebit .modaal-container { background: transparent; } .modal--products-jcbdebit .modaal-inner-wrapper { padding-top: 0; } .modal--products-jcbdebit .modaal-content-container { padding-top: 65px !important; } .modal--products-jcbdebit .modaal-close { top: 6px !important; } .modal--products-jcbdebit .modaal-close:before { -webkit-transform: none; display: block !important; position: absolute; top: -5px; left: calc(-100vw + 167%); width: 100vw; height: 65px; transform: none; border-radius: 0; background-color: transparent !important; content: ""; transition: none; } .cmn-app-download-wrap { justify-content: center; } .cmn-app-download--appstore { width: 110px; } .cmn-app-download--googleplay { width: 135px; margin-left: 1.0em; } .cmn-index-navi { margin: 2em -15px 0; } .cmn-index-navi__inner { padding: 2em 15px; } .cmn-index-navi__title { font-size: 1.6rem; } .cmn-index-navi__anchor__type { padding: 1.0em 2.5em 1.0em 0; } .cmn-index-navi__anchor__type:after { top: 1.2em; right: .5em; } .cmn-search__head { padding-bottom: 1.6em; } .cmn-search__body { margin: 0 -15px; padding: 1.0em 0; } .cmn-search__body__inner { padding: 0 15px; } .cmn-search__category { position: relative; } .cmn-search__category__body { display: none; z-index: 3; position: absolute; top: auto; left: 0; width: 100%; border: 1px solid #026cb2; border-top: none; background-color: #fff; } .cmn-search__category__trigger { display: block; position: relative; padding: .875em 2.7em .875em 1.2em; background-color: #008eed; color: #fff !important; font-size: 1.6rem; font-weight: 700; } .cmn-search__category__trigger:before, .cmn-search__category__trigger:after { position: absolute; top: 50%; right: .875em; width: 15px; height: 15px; margin-top: -8px; content: ""; transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s; } .cmn-search__category__trigger:before { background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94337_pic_plus_white.svg") no-repeat; opacity: 1.0; } .cmn-search__category__trigger:after { background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94207_pic_minus_white.svg") no-repeat; opacity: 0.0; } .cmn-search__category__trigger.is-active { background-color: #026cb2; } .cmn-search__category__trigger.is-active:before { opacity: 0.0; } .cmn-search__category__trigger.is-active:after { opacity: 1.0; } .cmn-search__category__accordion { border-top: 1px solid #026cb2; } .cmn-search__category__accordion:first-child { border-top: none; } .cmn-search__category__accordion__body { padding: .7em 0; border-top: 1px solid #026cb2; } .cmn-search__category__accordion__trigger { padding: .875em 2.7em .875em 1.2em; color: #000 !important; font-size: 1.6rem; font-weight: 700; } .cmn-search__category__accordion__trigger:before, .cmn-search__category__accordion__trigger:after { right: .875em; } .cmn-search__category__accordion__trigger:before { background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94328_pic_plus_blue.svg") no-repeat; } .cmn-search__category__accordion__trigger:after { background: url("https://jcb.sitecorecontenthub.cloud/api/public/content/94188_pic_minus_blue.svg") no-repeat; } .cmn-search__category__accordion__trigger.is-active { background-color: #f2faff; } .cmn-search__category__button { padding: .7em 1.4em; font-size: 1.4rem; line-height: 1.4; } .cmn-search__control { margin-top: 1.2em; } .cmn-search__sort > input + label { padding-left: 2.0em; font-size: 1.4rem; } .cmn-search__clear__trigger { width: 165px; padding: .4em 1.4em; font-size: 1.4rem; } .cmn-tel-wrap--center { margin: 0 0 1.0em; } .cmn-tel__num { font-size: 1.8rem; } .cmn-tel__caption { margin: .7em 0 0; font-size: 1.2rem; } .cmn-heading__detail { align-items: flex-end; padding: 2.0em 0; } .cmn-heading__inner { width: 100%; padding: 0 15px; } .cmn-heading__title { font-size: 2.5rem; font-weight: 700; } .cmn-heading__subtitle { margin: 1.0em 0 0; } .cmn-wrap { margin: 3.4em -15px 0; padding: 2.0em 0; } .cmn-wrap__inner { padding: 0 15px; } .cmn-pulldown-navi-wrap { margin: 1.4em 0 0; } .cmn-pulldown-navi-wrap > * { margin-top: 1.0em; } .cmn-pulldown-navi-wrap > *:first-child { margin-top: 0; } .cmn-pulldown-navi__inner { display: block; width: 100%; } .cmn-pulldown-navi__assist + .cmn-pulldown-navi__inner { margin-top: 1.0em; } .cmn-pulldown-navi__inner:after { right: 18px; border-width: 8px 6px 0; } .cmn-pulldown-navi__select { padding: .8em 3.6em .8em 1.4em; font-size: 1.4rem; } .cmn-pulldown-navi__select option { font-weight: 400; } .cmn-pulldown-navi__assist { text-align: right; } .cmn-use-category { margin: 0 -15px; } .cmn-use-category__head { padding: 0.6em 15px; } .cmn-use-category__body { padding: 0.6em 15px; } .cmn-use-category__head + .cmn-use-category__body { padding-top: 0; } .cmn-use-category__title { text-align: center; } .cmn-use-category__icon-list > li { width: calc((100% - (5px * 2)) / 3); height: 25px; margin-left: 5px; font-size: 1.1rem; line-height: 25px; } .cmn-use-category__icon-list > li:nth-child(3n+1) { margin-left: 0; } .cmn-use-category__icon-list > li:nth-child(n+4) { margin-top: 5px; } .cmn-step { margin: 3.0em 0 0; } .cmn-step__list > li[data-step-body="false"] { padding-bottom: 1.4em; } .cmn-step__list > li[data-step-body="true"] { padding-bottom: 0; } .cmn-step__body { padding: 1em 0 1.4em 2.28em; } .cmn-step__body:before { left: 10px; } .cmn-step__num { display: flex; width: 32px; height: 60px; font-weight: 700; } .cmn-step__title { padding-top: 10px; font-size: 1.6rem; font-weight: 700; line-height: 1.4; } .cmn-conversion { margin: 2em -15px 0; } .cmn-conversion__detail { padding: 2.0em 0; } .cmn-conversion__inner { padding: 0 15px; } .cmn-conversion__title { font-size: 2.0rem; } .cmn-conversion__subtitle { margin: 1.4em 0 0; } .cmn-conversion__button { margin: 1.0em 0 0; } .cmn-heading-column { margin: 2.4em 0 0; } .cmn-heading-column[data-col-sp]:not([data-col-sp="auto"]) > * { margin-top: 2.4em; } .cmn-heading-v3__head { width: 83px; margin-right: 1.0em; } .cmn-heading-v3__title { font-size: 1.9rem; } .cmn-heading-v3__subtitle { margin: 1.0em 0 0; } .cmn-flow-arrow { margin: 2.6em 0 1.0em; } .cmn-flow-arrow__inner { padding-bottom: 2.4em; } .cmn-flow-arrow__title { font-size: 1.7rem; line-height: 1.4; } .jcbdebit-lnav__head { padding: 0.8em 15px; background-color: #fff; } .jcbdebit-lnav__image { margin-right: .8em; } .jcbdebit-lnav__title { color: #004f8d; font-size: 1.6rem; } .jcbdebit-lnav__list { flex-flow: row wrap; } .jcbdebit-lnav__list > li { width: 50%; border-top: 1px solid #fff; border-left: 1px solid #fff; } .jcbdebit-lnav__list > li:nth-of-type(2n+1) { border-left: none; } .jcbdebit-lnav__list > li:nth-of-type(-n+2) { border-right: none; } .jcbdebit-lnav__list .jcbdebit-lnav__list__type { padding: 1.2em .5em 1.1em; font-size: 1.3rem; } .cmn-media[data-media-sp="row"][data-media-wraparound="false"] { display: flex; flex-wrap: nowrap; } .cmn-media[data-media-sp="row"][data-media-wraparound="false"][data-media-pc="image-left"] { flex-direction: row; } .cmn-media[data-media-sp="row"][data-media-wraparound="false"][data-media-pc="image-right"] { flex-direction: row-reverse; } .cmn-media[data-media-sp="col"] { display: flex; flex-direction: column !important; } .cmn-media[data-media-sp="col-reverse"] { display: flex; flex-direction: column-reverse !important; } .cmn-media__caption, .cmn-media__caption--center, .cmn-media__caption--right { margin: .7em 0 0; font-size: 1.2rem; } .cmn-media[data-media-sp="row"] .cmn-media__head { max-width: calc((100% - 15px * 1) / 2); } .cmn-media[data-media-sp="row"][data-media-pc="image-left"] .cmn-media__head { margin-right: 15px; } .cmn-media[data-media-sp="row"][data-media-pc="image-left"][data-media-wraparound="true"] .cmn-media__head { float: left; } .cmn-media[data-media-sp="row"][data-media-pc="image-right"] .cmn-media__head { margin-left: 15px; } .cmn-media[data-media-sp="row"][data-media-pc="image-right"][data-media-wraparound="true"] .cmn-media__head { float: right; } .cmn-media[data-media-sp="col"] .cmn-media__body, .cmn-media[data-media-sp="col-reverse"] .cmn-media__head { margin-top: .8em; } .cmn-media[data-media-sp="col"] .cmn-media__head, .cmn-media[data-media-sp="col-reverse"] .cmn-media__head { display: flex; flex-direction: column; justify-content: center; } } @media print, screen and (min-width: 1260px) { body.is-liquid { min-width: auto !important; } body.is-liquid .Main__content { max-width: 100% !important; } } @media print { body { page: print-width; width: 1260px !important; margin: 0 auto !important; } body[data-browser="chrome"] { zoom: .85; } .Header { position: static !important; top: 0 !important; } .Main { margin-top: 0 !important; } .heading1 { width: 100% !important; margin-left: 0 !important; } } @media only screen and (min-width: 768px) and (max-width: 1259.98px) { .heading1 { width: calc(100% + (30px * 2)); margin-right: -30px; margin-left: -30px; } .Main__head .heading1 { margin-right: 0; margin-left: 0; } .Main__head .heading1__inner { margin: 0; } } @media print, screen and (min-width: 768px) and (max-width: 1259.98px) { .cmn-search__body { width: calc(1200px + 30px * 2); margin-left: -30px; } .cmn-heading { width: calc(1200px + 30px * 2); margin-left: 0; } .cmn-wrap { width: calc(1200px + 30px * 2); margin-left: -30px; } .cmn-conversion { width: calc(1200px + 30px * 2); margin-left: -30px; } }