/*======================================================================
 * main
======================================================================*//*! 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 {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 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 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  -webkit-box-sizing: content-box;
  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] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
  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 {
  font-size: 75%;
  line-height: 0;
  position: relative;
  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 {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 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 {
  border-style: none;
  padding: 0;
}

/**
 * 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 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 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] {
  -webkit-box-sizing: border-box;
  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;
}/**
 * Swiper 8.4.4
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2022 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: October 12, 2022
 */
@font-face {
  font-family: "swiper-icons";
  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
  font-weight: 400;
  font-style: normal;
}
:root {
  --swiper-theme-color: #007aff;
}

.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
}

.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}

.swiper-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}

.swiper-pointer-events {
  touch-action: pan-y;
}
.swiper-pointer-events.swiper-vertical {
  touch-action: pan-x;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}

.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* 3D Effects */
.swiper-3d, .swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}

.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
  -ms-scroll-snap-type: x mandatory;
  scroll-snap-type: x mandatory;
}

.swiper-vertical.swiper-css-mode > .swiper-wrapper {
  -ms-scroll-snap-type: y mandatory;
  scroll-snap-type: y mandatory;
}

.swiper-centered > .swiper-wrapper::before {
  content: "";
  flex-shrink: 0;
  order: 9999;
}
.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  -webkit-margin-start: var(--swiper-centered-offset-before);
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  width: var(--swiper-centered-offset-after);
}
.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  -webkit-margin-before: var(--swiper-centered-offset-before);
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  height: var(--swiper-centered-offset-after);
}
.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
}/*======================================================================
 * setting
======================================================================*/@font-face {
  font-family: "HanCode";
  font-weight: 700;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/source-han-code-jp-2.012R/OTF/SourceHanCodeJP-Bold.otf') format( opentype );
}
@font-face {
  font-family: "HanCode";
  font-weight: 500;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/source-han-code-jp-2.012R/OTF/SourceHanCodeJP-Medium.otf') format( opentype );
}
@font-face {
  font-family: "HanCode";
  font-weight: 400;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/source-han-code-jp-2.012R/OTF/SourceHanCodeJP-Regular.otf') format( opentype );
}
@font-face {
  font-family: "HanSans";
  font-weight: 700;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/SourceHanSansJP/SubsetOTF/JP/SourceHanSansJP-Bold.otf') format( opentype );
}
@font-face {
  font-family: "HanSans";
  font-weight: 500;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/SourceHanSansJP/SubsetOTF/JP/SourceHanSansJP-Medium.otf') format( opentype );
}
@font-face {
  font-family: "HanSans";
  font-weight: 400;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/SourceHanSansJP/SubsetOTF/JP/SourceHanSansJP-Normal.otf') format( opentype );
}
@font-face {
  font-family: "HanSans";
  font-weight: 300;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/SourceHanSansJP/SubsetOTF/JP/SourceHanSansJP-Regular.otf') format( opentype );
}
@font-face {
  font-family: "HanSans";
  font-weight: 200;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/SourceHanSansJP/SubsetOTF/JP/SourceHanSansJP-Light.otf') format( opentype );
}
@font-face {
  font-family: "LineSeed";
  font-weight: 200;
  src: url('//8598105.fs1.hubspotusercontent-na1.net/hubfs/8598105/raw_assets/public/Edu_2024/assets/fonts/LINESeedJP_20230831/Web/WOFF2/LINESeedJP_OTF_Rg.woff2') format( woff2 );
}
.ff-code {
  font-family: "HanCode";
}/*------------------------------------------------------------
 * tag setting
------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
  margin: 1.5em 0 0em;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
  margin-top: 0;
}

p, ul, ol, table {
  margin: 1em 0;
}
p:last-child, ul:last-child, ol:last-child, table:last-child {
  margin-bottom: 0;
}
p:first-child, ul:first-child, ol:first-child, table:first-child {
  margin-top: 0;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #000;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

* {
  box-sizing: border-box;
}

img {
  max-width: 100%;
  vertical-align: bottom;
}

html {
  font-size: 10px;
}

body {
  font-size: 1.6rem;
  color: #444;
  font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}

@media screen and (min-width: 769px) {
  a {
    transition: opacity 0.3s;
  }
  a:hover {
    opacity: 0.5;
  }
}@charset "UTF-8";
/*======================================================================
 * デフォルトのモジュールを拡張したい場合など、必要なものは要確認
======================================================================*/
@media screen and (max-width: 768px) {
  .hs_cos_wrapper_type_rich_text table td {
    display: block !important;
    width: 100% !important;
    height: auto !important;
  }
}@charset "UTF-8";
/*======================================================================
 * dndセクション初期設定
======================================================================*/
.dnd-section > .row-fluid {
  margin-left: auto;
  margin-right: auto;
}@charset "UTF-8";
/*======================================================================
 * layout初期設定
======================================================================*/
.row-fluid {
  width: 100%;
  *zoom: 1;
}
.row-fluid:before, .row-fluid:after {
  display: table;
  content: "";
}
.row-fluid:after {
  clear: both;
}
.row-fluid [class*=span] {
  display: block;
  float: left;
  width: 100%;
  min-height: 1px;
  margin-left: 2.127659574%;
}
.row-fluid [class*=span]:first-child {
  margin-left: 0;
}
.row-fluid .span12 {
  width: 100%;
}
.row-fluid .span11 {
  width: 91.489361693%;
}
.row-fluid .span10 {
  width: 82.978723396%;
}
.row-fluid .span9 {
  width: 74.468085099%;
}
.row-fluid .span8 {
  width: 65.957446802%;
}
.row-fluid .span7 {
  width: 57.446808505%;
}
.row-fluid .span6 {
  width: 48.936170208%;
}
.row-fluid .span5 {
  width: 40.425531911%;
}
.row-fluid .span4 {
  width: 31.914893614%;
}
.row-fluid .span3 {
  width: 23.404255317%;
}
.row-fluid .span2 {
  width: 14.89361702%;
}
.row-fluid .span1 {
  width: 6.382978723%;
}
@media screen and (max-width: 768px) {
  .row-fluid [class*=span] {
    display: block;
    float: none;
    width: auto;
    margin-left: 0;
  }
}/*======================================================================
 * adjust-width
======================================================================*/
.adjust-width {
  width: 95%;
  max-width: 1270px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 768px) {
  .adjust-width {
    width: 100%;
    padding-left: 5.33vw;
    padding-right: 5.33vw;
  }
}@charset "UTF-8";
/*======================================================================
 * ボタンスタイル
======================================================================*/
/*------------------------------------------------------------
 * c-button
------------------------------------------------------------*/
.c-button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto !important;
  min-height: 70px;
  margin: 0 auto;
  padding: 0 30px;
  text-align: center;
  text-decoration: none;
  background: #52c0eb;
  border: 2px solid #52c0eb;
  color: #fff;
  box-shadow: 4px 10px 20px rgba(0, 0, 0, 0.2);
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  z-index: 0;
  transition: background-color 0.25s, color 0.25s;
}
.c-button:link, .c-button:visited, .c-button:active {
  color: #fff;
}
.c-button::after {
  content: none !important;
}
.c-button > * {
  display: block;
  width: 100%;
}
.c-button svg {
  fill: #fff;
  transition: fill 0.25s;
}
.c-button:hover {
  opacity: 1;
  background: #fff;
  color: #52c0eb;
}
.c-button.-blue, .-blue .c-button {
  background: #52c0eb;
  border-color: #52c0eb;
}
.c-button.-blue:hover, .-blue .c-button:hover {
  background: #fff;
  color: #52c0eb;
}
.c-button.-blue:hover svg, .-blue .c-button:hover svg {
  fill: #52c0eb;
}
.c-button.-red, .-red .c-button {
  background: #e20001;
  border-color: #e20001;
}
.c-button.-red:hover, .-red .c-button:hover {
  background: #fff;
  color: #e20001;
}
.c-button.-red:hover svg, .-red .c-button:hover svg {
  fill: #e20001;
}
.c-button.-navy, .-navy .c-button {
  background: #332c6a;
  border-color: #332c6a;
}
.c-button.-navy:hover, .-navy .c-button:hover {
  background: #fff;
  color: #332c6a;
}
.c-button.-navy:hover svg, .-navy .c-button:hover svg {
  fill: #332c6a;
}
.c-button i {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
}
.c-button i::before {
  font-family: "Font Awesome 5 Free";
  font-size: 1.2em;
  font-weight: 900;
  font-style: normal;
}
.c-button i.-right {
  right: 15px;
}
.c-button i.-left {
  left: 15px;
}
.c-button i.-arrow.-right::before {
  content: "\f105";
  font-size: 26px;
}
.c-button i.-arrow.-left::before {
  content: "\f104";
  font-size: 26px;
}
@media screen and (max-width: 768px) {
  .c-button {
    min-height: 60px;
    font-size: 1.5rem;
  }
  .c-button i.-right {
    right: 10px;
  }
  .c-button i.-left {
    left: 10px;
  }
}

.c-visible-button {
  max-width: 600px;
  width: 100%;
  -webkit-appearance: none;
  appearance: none;
  border: none;
  background: none;
  display: block;
  margin: 0 auto;
  transition: opacity 0.3s;
  padding: 15px;
  font-weight: 700;
  cursor: pointer;
  background-color: #afafaf;
  border-radius: 24px;
  color: #fff;
}
.c-visible-button.u-pc-only {
  margin-top: 80px;
}
.c-visible-button.u-pc-only.-plus {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .c-visible-button {
    margin-top: 40px;
  }
}
.c-visible-button::before {
  display: none;
}
.c-visible-button:hover {
  opacity: 0.5;
}

.icon-plus {
  color: #fff;
  display: inline-block;
  width: 12px;
  height: 12px;
  position: relative;
}
.icon-plus::before, .icon-plus::after {
  content: "";
  position: absolute;
  top: 4px;
  width: 12px;
  height: 2px;
  background-color: #fff;
}
.icon-plus::after {
  transform: rotate(90deg);
}/*======================================================================
 * hs form
======================================================================*/
form fieldset {
  max-width: 100% !important;
  padding: 0;
}
form label {
  display: block;
}
form .form-columns-2 .hs-form-field {
  width: 48% !important;
}
form .form-columns-2 .hs-form-field:last-child {
  margin-left: 4%;
}
form .hs-form-field {
  margin-bottom: 2em;
}
form .hs-form-field .input {
  margin-right: 0 !important;
}
form .form-columns-0 .hs-richtext {
  margin-bottom: 2em;
}
form .hs-richtext {
  margin-bottom: 0.5em;
}
form .hs-richtext img {
  height: auto;
  max-width: 100% !important;
}
form .inputs-list {
  padding: 0;
  list-style: none;
}
form .inputs-list li {
  display: block;
  margin: 0.7rem 0;
}
form .hs-form-required {
  color: red;
}
form .hs-error-msg,
form .hs-error-msgs {
  color: red;
}
form .hs_error_rollup {
  margin: 3em auto -2em;
  text-align: center;
}
form .hs_error_rollup .inputs-list li {
  margin: 0;
}
form .hs-field-desc {
  margin-bottom: 0.2em;
  font-size: 1.4rem;
}
form select,
form textarea, form input[type=text], form input[type=email], form input[type=password], form input[type=tel], form input[type=number], form input[type=file], form input[type=search], form input[type=date] {
  width: 100% !important;
  outline: none;
  border-radius: 0;
  border: 1px solid #333;
  padding: 0.5em 1em;
}
form select::placeholder,
form textarea::placeholder, form input[type=text]::placeholder, form input[type=email]::placeholder, form input[type=password]::placeholder, form input[type=tel]::placeholder, form input[type=number]::placeholder, form input[type=file]::placeholder, form input[type=search]::placeholder, form input[type=date]::placeholder {
  color: #ccc;
}
form select:focus::placeholder,
form textarea:focus::placeholder, form input[type=text]:focus::placeholder, form input[type=email]:focus::placeholder, form input[type=password]:focus::placeholder, form input[type=tel]:focus::placeholder, form input[type=number]:focus::placeholder, form input[type=file]:focus::placeholder, form input[type=search]:focus::placeholder, form input[type=date]:focus::placeholder {
  color: transparent;
}
form .hs-fieldtype-select .input {
  position: relative;
}
form .hs-fieldtype-select .input:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 13px;
  width: 10px;
  height: 10px;
  margin-top: -9px;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  transform: rotate(135deg);
  z-index: 1;
  pointer-events: none;
}
form .hs-fieldtype-select .input select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 34px;
}
form .hs-fieldtype-select .input select::-ms-expand {
  display: none;
}
form textarea {
  resize: vertical;
}
form input[type=file] {
  padding: initial;
  border: initial;
  background-color: transparent;
  cursor: pointer;
}
form .fn-date-picker .pika-button {
  text-align: center;
  font-size: 14px;
  line-height: 24px;
}
form .fn-date-picker .pika-button:hover, form .fn-date-picker .pika-button:focus {
  background: #000 !important;
  color: #fff;
  border-radius: 0 !important;
}
form .fn-date-picker .is-today .pika-button {
  color: #000;
}
form .fn-date-picker .is-selected .pika-button {
  background: #000;
  box-shadow: none;
  border-radius: 0 !important;
}
form input[type=checkbox] {
  display: none;
}
form input[type=checkbox] + span {
  position: relative;
  display: inline-block;
  padding-left: 2.5rem;
  cursor: pointer;
}
form input[type=checkbox] + span::before, form input[type=checkbox] + span::after {
  content: "";
  display: block;
  position: absolute;
  box-sizing: border-box;
}
form input[type=checkbox] + span::before {
  left: 0;
  top: 0.3rem;
  width: 2rem;
  height: 2rem;
  border: 1px solid #000;
}
form input[type=checkbox] + span::after {
  left: 0.4rem;
  top: 0.8rem;
  width: 1.2rem;
  height: 0.7rem;
  border-left: 2px solid #000;
  border-bottom: 2px solid #000;
  transform: rotate(-45deg);
  opacity: 0;
}
form input[type=checkbox]:checked + span:after {
  opacity: 1;
}
form input[type=radio] {
  display: none;
}
form input[type=radio] + span {
  position: relative;
  display: inline-block;
  padding-left: 2.5rem;
  cursor: pointer;
}
form input[type=radio] + span::before, form input[type=radio] + span::after {
  content: "";
  display: block;
  position: absolute;
  box-sizing: border-box;
  border-radius: 50%;
}
form input[type=radio] + span::before {
  left: 0;
  top: 0.3rem;
  width: 2rem;
  height: 2rem;
  border: 1px solid #000;
}
form input[type=radio] + span::after {
  left: 0.5rem;
  top: 0.8rem;
  width: 1rem;
  height: 1rem;
  background: #000;
  opacity: 0;
}
form input[type=radio]:checked + span:after {
  opacity: 1;
}
form .legal-consent-container .hs-form-booleancheckbox-display > span {
  margin-left: 0 !important;
}
form .grecaptcha-badge {
  margin: 30px auto;
}
form .hs-submit {
  width: 90%;
  max-width: 350px;
  margin: 3em auto 0;
}
form input[type=submit] {
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0.5em 1em;
  outline: none;
  border: none;
  text-align: center;
  background: black;
  color: #fff;
  font-size: 1.8rem;
  line-height: 1.4;
  cursor: pointer;
}
form .submitted-message {
  text-align: center;
}

.form-title {
  margin: 0;
}@charset "UTF-8";
/*======================================================================
 * Header
======================================================================*/
.c-container {
  padding-top: 117px;
}
@media screen and (max-width: 768px) {
  .c-container {
    padding-top: 52px;
  }
}
.c-container.-hs-blog-post, .c-container.-hs-blog-listing, .c-container.-search-results, .c-container.-hs-site-page, .c-container.-hs-page {
  padding-top: 148px;
}
@media screen and (max-width: 1000px) {
  .c-container.-hs-blog-post, .c-container.-hs-blog-listing, .c-container.-search-results, .c-container.-hs-site-page, .c-container.-hs-page {
    padding-top: 52px;
  }
}

/*------------------------------------------------------------
 * header
------------------------------------------------------------*/
.c-header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
}
.header-brand-menu {
  display: flex;
  column-gap: 24px;
  align-items: stretch;
  justify-content: space-between;
  min-height: 76px;
  padding: 0 0 0 48px;
  background-color: #fff;
  border-bottom: 1px solid #000;
}
@media screen and (max-width: 1000px) {
  .header-brand-menu {
    height: 52px;
    min-height: auto;
    padding: 0 0 0 15px;
    background-color: #000;
    border-bottom: none;
  }
}
.header-brand-menu .brand-menu {
  padding: 25px 0;
}
@media screen and (max-width: 1000px) {
  .header-brand-menu .brand-menu {
    display: none;
  }
}
.header-brand-menu ul {
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 14px 24px;
  align-items: center;
}
.header-brand-menu li {
  line-height: 1;
}
.header-brand-menu li:first-of-type a::after, .header-brand-menu li:nth-child(2) a::after, .header-brand-menu li:nth-child(3) a::after, .header-brand-menu li:nth-child(4) a::after, .header-brand-menu li:nth-child(5) a::after, .header-brand-menu li:nth-child(6) a::after, .header-brand-menu li:nth-child(7) a::after {
  left: 50%;
  transition: transform 0.3s ease-out;
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
}
.header-brand-menu li:first-of-type a:hover::after, .header-brand-menu li:nth-child(2) a:hover::after, .header-brand-menu li:nth-child(3) a:hover::after, .header-brand-menu li:nth-child(4) a:hover::after, .header-brand-menu li:nth-child(5) a:hover::after, .header-brand-menu li:nth-child(6) a:hover::after, .header-brand-menu li:nth-child(7) a:hover::after {
  transform: translateX(-50%) scaleX(1);
}
.header-brand-menu li a {
  position: relative;
  padding: 0 0 6px;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.43;
  color: #343434;
  text-decoration: none;
}
.header-brand-menu li a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 2px;
  margin-top: 6px;
  content: "";
  background-color: #343434;
  border-radius: 2px;
}
.header-brand-menu li a:hover {
  opacity: 1;
}

.header-button-item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto;
  background-color: #343434;
}
@media screen and (max-width: 1000px) {
  .header-button-item {
    position: absolute;
    top: 12px;
    right: 50px;
    width: 120px;
    background-color: transparent;
  }
}
.header-button-item .header-button {
  display: block;
  height: 100%;
  padding: 30px 24px 31px;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
@media screen and (max-width: 1000px) {
  .header-button-item .header-button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    padding: 10px;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    background-color: #464646;
    border: 1px solid #464646;
    border-radius: 20px;
    transition: background-color 0.3s, color 0.3s, border-color 0.3s;
  }
  .header-button-item .header-button::before {
    display: block;
    width: 17px;
    height: 17px;
    margin-right: 11px;
    content: "";
    background-color: #fff;
    -webkit-mask-image: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/cta/icon_speech_bubble.svg");
    mask-image: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/cta/icon_speech_bubble.svg");
    -webkit-mask-size: cover;
    mask-size: cover;
    transition: all 0.3s;
  }
  .header-button-item .header-button:hover {
    background-color: #b59d37;
    border-color: #b59d37;
    opacity: 1;
  }
}

@media screen and (min-width: 1001px) {
  .header-main-menu {
    display: flex;
    flex-direction: column-reverse;
  }
}
@media screen and (max-width: 1000px) {
  .header-main-menu {
    display: none;
    color: #fff;
    background-color: #161f2e;
  }
}
.header-main-menu > a {
  color: #444444;
  text-decoration: none;
}
@media screen and (max-width: 1000px) {
  .header-main-menu > a {
    color: #fff;
  }
}
.header-main-menu .pc-menu {
  display: flex;
  justify-content: flex-end;
}
@media screen and (max-width: 1000px) {
  .header-main-menu .pc-menu {
    display: none;
  }
}
.header-main-menu .pc-menu ul {
  list-style: none;
}
.header-main-menu .pc-menu .hs-menu-wrapper > ul {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 10px 0 15px;
  margin-top: 0;
  background-color: #f3f3f3;
}
.header-main-menu .pc-menu .hs-menu-depth-1 {
  position: relative;
  margin-right: 30px;
  color: #707070;
}
.header-main-menu .pc-menu .hs-menu-depth-1:last-of-type {
  margin-right: 0;
}
.header-main-menu .pc-menu .hs-menu-depth-1:hover > a {
  opacity: 1;
}
.header-main-menu .pc-menu .hs-menu-depth-1:hover > a::after {
  visibility: visible;
  opacity: 1;
}
.header-main-menu .pc-menu .hs-menu-depth-1 > a {
  display: flex;
  align-items: center;
  height: 72px;
  padding: 0 10px 8px;
  color: #707070;
  text-decoration: none;
}
.header-main-menu .pc-menu .hs-menu-depth-1 > a::after {
  position: absolute;
  bottom: 14px;
  left: 50%;
  display: block;
  width: 37px;
  height: 0;
  visibility: hidden;
  content: "";
  border-top: 3px solid #464646;
  opacity: 0;
  transition: opacity 0.3s, visibility 0.3s;
  transform: translateX(-50%);
}
.header-main-menu .pc-menu .hs-menu-depth-1.hs-item-has-children {
  position: relative;
}
.header-main-menu .pc-menu .hs-menu-depth-1.hs-item-has-children > a {
  position: relative;
}
.header-main-menu .pc-menu .hs-menu-depth-1.hs-item-has-children:hover > .hs-menu-children-wrapper {
  visibility: visible;
  opacity: 1;
}
.header-main-menu .pc-menu .hs-menu-depth-1 > .hs-menu-children-wrapper {
  position: absolute;
  top: 100%;
  left: 0;
  padding: 15px 15px 22px;
  margin: -5px 0 0;
  color: #fff;
  white-space: nowrap;
  visibility: hidden;
  background-color: rgba(60, 59, 59, 0.9);
  opacity: 0;
  transition: opacity 0.3s, visibility 0.3s;
}
.header-main-menu .pc-menu .hs-menu-depth-2:not(:last-child) {
  margin-bottom: 0.5em;
}
.header-main-menu .pc-menu .hs-menu-depth-2 a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  color: #fff;
  text-decoration: none;
}
.header-main-menu .pc-menu .hs-menu-depth-2 a::after {
  margin-left: 22px;
  font-size: 10px;
  content: "→";
}
.header-main-menu .pc-menu .hs-menu-depth-2 a:hover {
  color: #464646;
  opacity: 1;
}
.header-main-menu .pc-menu .hs-menu-depth-2 .hs-menu-children-wrapper {
  padding: 0 0 0 10px;
  font-size: 13px;
}
.header-main-menu .pc-menu .hs-menu-depth-2 .hs-menu-children-wrapper li {
  display: flex;
  align-items: center;
}
.header-main-menu .pc-menu .hs-menu-depth-2 .hs-menu-children-wrapper li::before {
  display: block;
  margin-right: 1em;
  content: "ー";
}
@media screen and (min-width: 1001px) {
  .header-main-menu .sp-menu {
    display: none;
  }
}
.header-main-menu .sp-menu ul {
  padding: 0;
  list-style: none;
  margin-top: 0;
}
.header-main-menu .sp-menu .hs-menu-depth-1 {
  position: relative;
  width: 100%;
  margin-bottom: 5px;
}
.header-main-menu .sp-menu .hs-menu-depth-1 > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  padding: 0 32px 0 28px;
  font-weight: 500;
  color: #fff;
  text-decoration: none;
  background-color: #253244;
}
.header-main-menu .sp-menu .hs-menu-depth-1 > a span {
  position: relative;
  display: block;
  width: 19px;
  height: 19px;
  margin-left: 10px;
  font-size: 9px;
  line-height: 19px;
  text-align: center;
  background-color: #464646;
  border-radius: 50%;
}
.header-main-menu .sp-menu .hs-menu-depth-1 > a span::after {
  content: "→";
}
.header-main-menu .sp-menu .hs-menu-depth-1 .toggle {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 6.4rem;
  height: 6.4rem;
}
.header-main-menu .sp-menu .hs-menu-depth-1 .toggle span {
  position: relative;
  display: block;
  width: 19px;
  height: 19px;
  font-size: 9px;
  line-height: 19px;
  text-align: center;
  background-color: #464646;
  border-radius: 50%;
}
.header-main-menu .sp-menu .hs-menu-depth-1 .toggle span::after {
  content: "→";
}
.header-main-menu .sp-menu .hs-menu-depth-1:not(.hs-item-has-children) .toggle {
  pointer-events: none;
}
.header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children > a span::before, .header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children > a span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 10px;
  height: 0;
  margin-left: -5px;
  content: "";
  border-top: 1px solid;
}
.header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children > a span::after {
  transition: transform 0.3s;
  transform: rotate(90deg);
}
.header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children .toggle {
  cursor: pointer;
}
.header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children .toggle span::before, .header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children .toggle span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 10px;
  height: 0;
  margin-left: -5px;
  content: "";
  border-top: 1px solid;
}
.header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children .toggle span::after {
  transition: transform 0.3s;
  transform: rotate(90deg);
}
.header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children.-js-opened > a span::after {
  transform: rotate(0deg);
}
.header-main-menu .sp-menu .hs-menu-depth-1.hs-item-has-children.-js-opened .toggle span::after {
  transform: rotate(0deg);
}
.header-main-menu .sp-menu .hs-menu-depth-1 > .hs-menu-children-wrapper {
  display: none;
  padding: 0 28px;
  margin: 0;
}
.header-main-menu .sp-menu .hs-menu-depth-1:last-child > a {
  background-color: #343434;
}
.header-main-menu .sp-menu .hs-menu-depth-2 {
  font-size: 11px;
  font-weight: 300;
}
.header-main-menu .sp-menu .hs-menu-depth-2:not(:last-child) {
  border-bottom: 1px solid #253244;
}
.header-main-menu .sp-menu .hs-menu-depth-2 a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 33px;
  padding: 0;
  color: #fff;
  text-decoration: none;
}
.header-main-menu .sp-menu .hs-menu-depth-2 a::after {
  display: block;
  margin-left: 1em;
  content: "→";
}
.header-main-menu .sp-menu .hs-menu-depth-2.hs-item-has-children .hs-menu-children-wrapper {
  padding-left: 1em;
  margin: 0;
}
.header-main-menu .sp-menu .hs-menu-depth-3 {
  width: 100%;
}
.header-main-menu .sp-menu .hs-menu-depth-3 a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 28px;
  color: #fff;
  text-decoration: none;
}
.header-main-menu .sp-menu .hs-menu-depth-3 a::after {
  margin-left: auto;
}
.header-main-menu .sp-menu .hs-menu-depth-3 a::before {
  display: block;
  margin-right: 1em;
  content: "ー";
}
.header-main-menu .sp-menu .hs-menu-depth-3 a:hover {
  color: #464646;
  opacity: 1;
}

.c-header .header-logo {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
}
.c-header .header-logo a {
  display: flex;
}
@media screen and (max-width: 1000px) {
  .c-header .header-logo {
    width: 100%;
    max-width: 150px;
  }
}
.c-header .header-logo .logo-sp {
  display: none;
}
@media screen and (max-width: 1000px) {
  .c-header .header-logo .logo-sp {
    display: flex;
  }
}
@media screen and (max-width: 1000px) {
  .c-header .header-logo .logo-pc {
    display: none;
  }
}
.c-header .toggle-btn {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: flex-end;
  justify-content: center;
  width: 48px;
  height: 52px;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  font-size: 8px;
  color: #fff;
  cursor: pointer;
}
@media screen and (min-width: 1001px) {
  .c-header .toggle-btn {
    display: none;
  }
}
.c-header .toggle-btn.-js-opened i:nth-child(1) {
  margin-top: -6px;
  transform: rotate(45deg);
}
.c-header .toggle-btn.-js-opened i:nth-child(2) {
  margin-top: -6px;
  transform: rotate(-45deg);
}
.c-header .toggle-btn.-js-opened i:nth-child(3) {
  transform: scale(0, 1);
}
.c-header .toggle-btn.-js-opened::after {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 100%;
  margin-top: 7px;
  text-align: center;
  content: "CLOSE";
}
.c-header .toggle-btn i {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 23px;
  height: 3px;
  margin-left: -12px;
  background: #fff;
  transition: transform 0.2s ease-out, margin 0.2s ease-out;
}
.c-header .toggle-btn i:nth-child(1) {
  margin-top: -11px;
}
.c-header .toggle-btn i:nth-child(2) {
  margin-top: -1px;
}
.c-header .toggle-btn i:nth-child(3) {
  margin-top: 9px;
}

.banner-section,
.post-breadcrumbs {
  margin-top: 189px;
}
@media screen and (max-width: 1000px) {
  .banner-section,
  .post-breadcrumbs {
    margin-top: 52px;
  }
}

/* ------------------------------------------------------------
 * 管理画面用 css
------------------------------------------------------------ */
.hs-inline-edit .-hs-blog-post,
.hs-inline-edit .-hs-blog-listing,
.hs-inline-edit .-search-results,
.hs-inline-edit .-hs-site-page,
.hs-inline-edit .-hs-page {
  padding-top: 0;
}
@media screen and (max-width: 1000px) {
  .hs-inline-edit .-hs-blog-post,
  .hs-inline-edit .-hs-blog-listing,
  .hs-inline-edit .-search-results,
  .hs-inline-edit .-hs-site-page,
  .hs-inline-edit .-hs-page {
    padding-top: 0;
  }
}
.hs-inline-edit .c-header {
  position: static;
}@charset "UTF-8";
/* ======================================================================
 * footer
====================================================================== */
.c-footer {
  padding: 20px 0 0;
  color: #fff;
  background: rgba(87, 87, 87, 0.88);
}
.c-footer .copyright {
  padding: 11px 0;
  margin: 0 auto;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.88);
}
@media screen and (max-width: 768px) {
  .c-footer {
    padding: 0;
  }
}

.footer-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1200px;
  padding: 0;
  margin: 0 auto;
}
.footer-inner .footer-logo {
  width: 100%;
  margin-top: 78px;
  text-align: center;
}
@media screen and (max-width: 1000px) {
  .footer-inner .footer-logo {
    margin-bottom: 29px;
  }
}
@media screen and (max-width: 768px) {
  .footer-inner .footer-logo {
    margin-top: 42px;
    margin-bottom: 29px;
  }
}
@media screen and (max-width: 1000px) {
  .footer-inner .footer-logo img {
    max-width: 176px;
  }
}
.footer-inner .footer-nav-wrapper {
  flex: 0 0 auto;
  width: 100%;
  margin-top: 91px;
}
@media screen and (max-width: 1000px) {
  .footer-inner .footer-nav-wrapper {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .footer-inner {
    display: flex;
    padding-right: 41px;
    padding-left: 41px;
    margin-bottom: 20px;
  }
  .footer-inner .footer-left {
    width: 100%;
    margin-bottom: 20px;
  }
  .footer-inner .footer-left .logo {
    width: 200px;
  }
  .footer-inner .footer-right {
    width: 100%;
  }
}

.footer-nav ul {
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2em 5em;
  justify-content: center;
}
.footer-nav a {
  display: inline;
  padding: 0;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
}
.footer-nav .hs-item-has-children > a {
  position: relative;
}
.footer-nav .hs-item-has-children > a::after {
  position: absolute;
  top: 55%;
  left: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 37px;
  height: 37px;
  margin-left: 12px;
  content: "→";
  background-color: #565555;
  border: 1px solid #707070;
  border-radius: 50%;
  transform: translateY(-50%);
}
.footer-nav .hs-menu-children-wrapper {
  display: block;
  margin: 5px 0 0;
}
.footer-nav .hs-menu-children-wrapper li {
  width: 100%;
  margin-bottom: 0.5em;
}
.footer-nav .hs-menu-children-wrapper a {
  font-size: 13px;
  font-weight: normal;
  color: #fff;
}
.footer-nav .hs-menu-children-wrapper a::before {
  display: inline-block;
  margin-right: 0.5em;
  content: "ー";
}
@media screen and (max-width: 768px) {
  .footer-nav {
    width: 100%;
  }
  .footer-nav ul {
    width: 100%;
  }
  .footer-nav li {
    width: 100%;
    margin-bottom: 30px;
  }
  .footer-nav a {
    font-size: 1em;
  }
}

.sns-footer {
  width: 100%;
  margin-top: 96px;
}
@media screen and (max-width: 768px) {
  .sns-footer {
    order: 3;
    margin-top: 0;
  }
}

.footer-sub-nav {
  width: 100%;
  margin-top: 52px;
  margin-bottom: 98px;
}
@media screen and (max-width: 768px) {
  .footer-sub-nav {
    margin-top: 0;
    margin-bottom: 40px;
  }
}
.footer-sub-nav ul {
  padding: 0;
  list-style: none;
  display: flex;
  gap: 62px;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .footer-sub-nav ul {
    display: grid;
    grid-template-columns: auto auto;
    gap: 10px 41px;
    justify-content: center;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .footer-sub-nav ul li {
    width: auto;
  }
  .footer-sub-nav ul li:nth-of-type(1) {
    order: 1;
  }
  .footer-sub-nav ul li:nth-of-type(2) {
    order: 3;
  }
  .footer-sub-nav ul li:nth-of-type(3) {
    order: 2;
  }
  .footer-sub-nav ul li:nth-of-type(4) {
    order: 4;
  }
}
.footer-sub-nav ul li a {
  font-size: 12px;
  font-weight: 400;
  color: #fff;
  text-decoration: none;
}
@media screen and (max-width: 768px) {
  .footer-sub-nav ul li a {
    font-size: 12px;
  }
}

.pagetop {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 106px;
  height: 90px;
  margin: 0 auto 50px;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .pagetop {
    font-size: 12px;
  }
}
.pagetop::before {
  position: absolute;
  top: 52%;
  left: 42%;
  display: block;
  width: 30px;
  height: 30px;
  margin: -4px 0 0 -8px;
  content: "";
  border-top: 2px solid #020202;
  border-right: 2px solid #020202;
  transform: rotate(-45deg);
}
@media screen and (max-width: 768px) {
  .pagetop::before {
    width: 26px;
    height: 26px;
  }
}@charset "UTF-8";
/*======================================================================
* カスタムセクション
======================================================================*/
/*------------------------------------------------------------
 * ページタイトル用のセクション
------------------------------------------------------------*/
.page-title-section {
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .page-title-section {
    padding: 0 7px;
  }
}
.page-title-section h1 {
  text-align: center;
  font-size: 5rem;
  font-family: "HanSans";
  font-weight: 700;
  margin: 0 0 44px;
  line-height: 1.46;
  color: #444;
}
@media screen and (max-width: 1000px) {
  .page-title-section h1 {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 15px;
  }
}
.page-title-section p {
  margin: 0;
}
@media screen and (max-width: 1000px) {
  .page-title-section p {
    line-height: 1.6;
    font-size: 1.2rem;
  }
}

/*------------------------------------------------------------
 * Aboutページ角丸用セクション
------------------------------------------------------------*/
.page-border-radius-section > .row-fluid {
  border-radius: 24px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .page-border-radius-section > .row-fluid {
    border-radius: 0;
  }
}/*======================================================================
* pager
======================================================================*/
.c-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-bottom: 3.3rem;
  text-decoration: none;
  margin-top: 50px;
}
.c-pagination .inner {
  display: flex;
  align-items: center;
}
.c-pagination .number-link {
  display: inline-flex;
  padding: 0.6rem 0.96rem;
  margin: 0 0.24rem;
  color: #040000;
  text-decoration: none;
  border: 2px solid transparent;
  line-height: 1;
  border-radius: 7px;
  transition: all 0.15s linear;
}
@media screen and (max-width: 768px) {
  .c-pagination .number-link {
    font-size: 1.2rem;
  }
}
.c-pagination .number-link.-current {
  border: 2px solid #B0C1D4;
}
.c-pagination .number-link:hover, .c-pagination .number-link:focus {
  text-decoration: none;
  opacity: 1;
}
.c-pagination .number-link.number-link:hover, .c-pagination .number-link.number-link:focus {
  border: 2px solid #B0C1D4;
}
.c-pagination .prev-link,
.c-pagination .next-link {
  display: inline-flex;
  align-items: center;
  color: #040000;
  text-decoration: none;
  padding: 0.6rem 0.96rem;
}
.c-pagination .prev-link::before, .c-pagination .prev-link::after,
.c-pagination .next-link::before,
.c-pagination .next-link::after {
  display: flex;
  align-items: center;
  width: 13px;
  height: 20px;
  padding-top: 3px;
  background-repeat: no-repeat;
}
.c-pagination .prev-link .svg,
.c-pagination .next-link .svg {
  fill: #B0C1D4;
  margin: 0 5px;
}
.c-pagination .prev-link.-disabled,
.c-pagination .next-link.-disabled {
  color: #B0C1D4;
  pointer-events: none;
  cursor: default;
}
.c-pagination .prev-link.-disabled::before, .c-pagination .prev-link.-disabled::after,
.c-pagination .next-link.-disabled::before,
.c-pagination .next-link.-disabled::after {
  -webkit-mask-image: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/common/chevron-right-solid.svg");
  mask-image: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/common/chevron-right-solid.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: #B0C1D4;
  -webkit-mask-position: center;
  mask-position: center;
}
.c-pagination .prev-link {
  text-align: right;
  margin-right: 6px;
}
.c-pagination .prev-link::before {
  content: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/common/chevron-right-solid.svg");
  margin-right: 5px;
  transform: scale(-1, 1);
}
.c-pagination .prev-link.-disabled::before {
  content: "";
}
.c-pagination .next-link {
  text-align: left;
  margin-left: 6px;
}
.c-pagination .next-link::after {
  content: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/common/chevron-right-solid.svg");
  margin-left: 5px;
}
.c-pagination .next-link.-disabled::after {
  content: "";
}@charset "UTF-8";
/*======================================================================
* sidebar
======================================================================*/
/*======================================================================
* blog-sidebar
======================================================================*/
.col2-container .media-sidebar {
  max-width: 328px;
  margin-left: 116px;
  width: 100%;
}
@media screen and (max-width: 1270px) {
  .col2-container .media-sidebar {
    max-width: 280px;
    margin-left: 60px;
  }
}
@media screen and (max-width: 1000px) {
  .col2-container .media-sidebar {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
  }
}
.col2-container .media-sidebar .tags {
  margin-bottom: 53px;
}
@media screen and (max-width: 1000px) {
  .col2-container .media-sidebar .tags {
    display: none;
  }
}
.col2-container .media-sidebar .tags > p {
  font-size: 1.8rem;
  font-weight: 700;
  color: #464646;
  padding-bottom: 8px;
  margin-bottom: 0;
  border-bottom: 1px solid rgba(70, 70, 70, 0.88);
}
.col2-container .media-sidebar .tags .tag-list {
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  margin-top: 0;
}
.col2-container .media-sidebar .tags .tag-list li {
  width: 100%;
  padding: 23px 15px 23px 6px;
}
.col2-container .media-sidebar .tags .tag-list li:nth-of-type(n+2) {
  border-top: solid 1px rgba(135, 135, 135, 0.88);
}
.col2-container .media-sidebar .tags .tag-list li:last-of-type {
  border-bottom: solid 1px rgba(135, 135, 135, 0.88);
}
.col2-container .media-sidebar .tags .tag-list li a {
  font-size: 1.5rem;
  font-weight: 300;
  color: #000;
  text-decoration: none;
  display: flex;
  justify-content: space-between;
}
.col2-container .media-sidebar .tags .tag-list li a::after {
  content: "→";
  color: #464646;
}@charset "UTF-8";
/*======================================================================
 * CTAスタイル
======================================================================*/
/*------------------------------------------------------------
 * c-cta-footer
------------------------------------------------------------*/
.c-cta-footer {
  max-width: 1240px;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 57px;
  margin-top: 97px;
}
@media screen and (max-width: 1280px) {
  .c-cta-footer {
    margin-right: 64px;
    margin-left: 64px;
  }
}
.c-cta-footer .cmn02_cta-footer .cta-footer .desc h5 {
  text-align: center;
  font-size: 18px;
}
.c-cta-footer .cmn02_cta-footer .cta-footer .desc p {
  font-size: 13px;
}@charset "UTF-8";
.col2-container {
  display: flex;
  max-width: 1270px;
  margin: 50px auto 100px;
  justify-content: space-between;
}
@media screen and (max-width: 1270px) {
  .col2-container {
    width: 90%;
  }
}
@media screen and (max-width: 1000px) {
  .col2-container {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 60px;
  }
  .col2-container .sidebar {
    margin-top: 50px;
  }
}

/*======================================================================
 * 導入事例一覧レイアウト
======================================================================*/
.-hs-blog-listing .c-body,
.-search-results .c-body {
  overflow: hidden;
}
.-hs-blog-listing .title-section,
.-search-results .title-section {
  text-align: center;
  color: #353535;
  background-color: rgba(247, 245, 240, 0.88);
  background-image: url(https://www.macroman.jp/hubfs/IT/images/all/it_kv06.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  margin: 0;
  max-width: 100%;
  padding-top: 32.5px;
  padding-bottom: 74px;
}
@media screen and (max-width: 1000px) {
  .-hs-blog-listing .title-section,
  .-search-results .title-section {
    padding-bottom: 0;
  }
}
.-hs-blog-listing .title-section h1,
.-search-results .title-section h1 {
  margin: 0 0 36px;
  color: #343434;
}
@media screen and (max-width: 1000px) {
  .-hs-blog-listing .title-section h1,
  .-search-results .title-section h1 {
    margin: 0;
  }
}
.-hs-blog-listing .title-section h3,
.-search-results .title-section h3 {
  display: none;
}
.-hs-blog-listing .title-section .desc,
.-search-results .title-section .desc {
  font-size: 2.1rem;
  text-align: center;
  margin-top: 26.8px;
  padding: 0 20px;
}
@media screen and (max-width: 1000px) {
  .-hs-blog-listing .title-section .desc,
  .-search-results .title-section .desc {
    font-size: 1rem;
    margin-top: 10px;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {
  .-hs-blog-listing .title-section .desc,
  .-search-results .title-section .desc {
    font-size: 1.5rem;
    text-align: left;
  }
}

.-hs-blog-listing .col1-container {
  max-width: 1240px;
  margin-top: 80px;
}

@media screen and (max-width: 768px) {
  .case-list .post-data,
  .blog-list .post-data {
    display: flex;
    flex-wrap: wrap;
  }
}
.case-list .post-data article,
.blog-list .post-data article {
  padding-bottom: 60px;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article,
  .blog-list .post-data article {
    padding-bottom: 0;
    width: 100%;
  }
}
.case-list .post-data article:nth-of-type(n+2),
.blog-list .post-data article:nth-of-type(n+2) {
  padding-top: 60px;
  border-top: 1px solid rgba(24, 24, 24, 0.88);
}
@media screen and (max-width: 768px) {
  .case-list .post-data article:nth-of-type(n+2),
  .blog-list .post-data article:nth-of-type(n+2) {
    border-top: 1px solid rgba(206, 206, 206, 0.88);
    padding-top: 13px;
  }
}
@media screen and (max-width: 768px) {
  .case-list .post-data article:not(:last-child),
  .blog-list .post-data article:not(:last-child) {
    padding-bottom: 13px;
  }
}
.case-list .post-data article a,
.blog-list .post-data article a {
  display: flex;
  align-items: flex-start;
  gap: 0 62px;
  text-decoration: none;
  color: #000;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article a,
  .blog-list .post-data article a {
    flex-wrap: wrap;
  }
}
.case-list .post-data article img,
.blog-list .post-data article img {
  max-width: 312px;
  width: 100%;
  height: 207px;
  object-position: top;
}
.case-list .post-data article .text,
.blog-list .post-data article .text {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
.case-list .post-data article .tag-list,
.blog-list .post-data article .tag-list {
  padding: 0;
  list-style: none;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article .tag-list,
  .blog-list .post-data article .tag-list {
    flex-wrap: wrap;
    gap: 5px;
  }
}
.case-list .post-data article .tag-list li,
.blog-list .post-data article .tag-list li {
  color: #fff;
  padding: 4px 9px 4px 12px;
  background-color: #464646;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article .tag-list li,
  .blog-list .post-data article .tag-list li {
    font-size: 1rem;
    padding: 2px 5px 3px;
    display: block;
    color: rgba(255, 255, 255, 0.8);
  }
}
.case-list .post-data article h2,
.blog-list .post-data article h2 {
  width: 100%;
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.0015em;
  margin: 24px 0;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article h2,
  .blog-list .post-data article h2 {
    margin: 6px 0;
    font-size: 1.3rem;
    font-weight: 300;
    color: #464646;
  }
}
.case-list .post-data article p,
.blog-list .post-data article p {
  margin: 0;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article p,
  .blog-list .post-data article p {
    font-size: 1rem;
  }
}
.case-list .post-data article .more,
.blog-list .post-data article .more {
  display: inline-block;
  padding: 7px 38px;
  border: 1px solid #343434;
  font-size: 1.6rem;
  font-family: "HanSans";
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.0015em;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article .more,
  .blog-list .post-data article .more {
    font-size: 1rem;
    padding: 4px 12px;
    display: none;
  }
}
.case-list .post-data article .more::after,
.blog-list .post-data article .more::after {
  content: "→";
  display: inline-block;
  margin-left: 0.5em;
  font-size: 1.6rem;
  font-family: "HanSans";
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.0015em;
}
@media screen and (max-width: 768px) {
  .case-list .post-data article .more::after,
  .blog-list .post-data article .more::after {
    font-size: 1rem;
  }
}
.case-list .post-data #hs_cos_wrapper_list_cta,
.blog-list .post-data #hs_cos_wrapper_list_cta {
  margin-top: 106px;
}
@media screen and (max-width: 768px) {
  .case-list .post-data #hs_cos_wrapper_list_cta,
  .blog-list .post-data #hs_cos_wrapper_list_cta {
    width: 100%;
    margin-top: 34px;
    order: 9999999;
  }
}
@media screen and (max-width: 768px) {
  .case-list .post-data #hs_cos_wrapper_list_cta .cta-wrapper,
  .blog-list .post-data #hs_cos_wrapper_list_cta .cta-wrapper {
    margin-bottom: 0;
  }
}

.case-list .main-content {
  width: 100%;
}

.js-hide {
  display: none !important;
  opacity: 0;
}

.js-visible {
  display: block !important;
  opacity: 1;
  animation: fadeIn 0.3s ease-in 0s forwards;
}

@keyframes fadeIn {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}
.visible-button {
  -webkit-appearance: none;
  appearance: none;
  border: none;
  background: none;
  display: block;
  margin-left: auto;
  transition: opacity 0.3s;
  padding: 6px 12px;
  font-weight: 700;
  cursor: pointer;
}
.visible-button.u-pc-only {
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .visible-button {
    margin-top: 40px;
  }
}
.visible-button::before {
  content: ">>";
  display: inline-block;
  margin-right: 0.5em;
  font-size: 1.6rem;
  font-family: "HanSans";
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.0015em;
}
@media screen and (max-width: 768px) {
  .visible-button::before {
    font-size: 1.5rem;
  }
}
.visible-button:hover {
  opacity: 0.5;
}

/*======================================================================
 * ブログ一覧レイアウト
======================================================================*/
.blog-list-container .title-section {
  padding-bottom: 54px;
}
@media screen and (max-width: 768px) {
  .blog-list-container .title-section {
    padding-top: 20px;
    padding-bottom: 27px;
  }
}
.blog-list-container .title-section h1 {
  color: #343434;
  font-size: 3rem;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  .blog-list-container .title-section h1 {
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 10px;
  }
}

.search-wrapper {
  max-width: 370px;
  margin: 0 auto;
}

.blog-list {
  max-width: 825px;
}
@media screen and (max-width: 1000px) {
  .blog-list {
    max-width: 100%;
  }
}
.blog-list h2 {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.44;
  letter-spacing: 0.0015em;
  border-bottom: 1px solid rgba(24, 24, 24, 0.88);
  padding-bottom: 10px;
  margin-bottom: 24px;
}
@media screen and (max-width: 768px) {
  .blog-list h2 {
    font-size: 1.4rem;
    width: 100%;
  }
}
.blog-list .post-data article {
  padding-left: 6px;
  padding-bottom: 0;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article {
    padding-left: 0;
  }
}
.blog-list .post-data article:nth-of-type(n+2) {
  padding-top: 32px;
  border: none;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article:nth-of-type(n+2) {
    padding-top: 15px;
    padding-bottom: 0;
  }
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article:not(:last-child) {
    padding-bottom: 0;
  }
}
.blog-list .post-data article h3 {
  font-size: 2.3rem;
  line-height: 1.6;
  margin: 0 0 14px;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article h3 {
    font-size: 1.2rem;
    margin-bottom: 6px;
  }
}
.blog-list .post-data article .tag-list {
  margin-bottom: 15px;
  flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article .tag-list {
    margin-bottom: 5px;
  }
}
.blog-list .post-data article .tag-list li {
  font-size: 1rem;
  padding: 2px 9px;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article .tag-list li {
    padding: 3px 5px;
    line-height: 1em;
  }
}
.blog-list .post-data article img {
  max-width: 247px;
  height: 165px;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article img {
    max-width: 110px;
    height: 73px;
  }
}
.blog-list .post-data article a {
  gap: 0 22px;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article a {
    flex-wrap: nowrap;
    gap: 0 13px;
  }
}
.blog-list .post-data article .date {
  font-size: 1.5rem;
}
@media screen and (max-width: 768px) {
  .blog-list .post-data article .date {
    font-size: 1rem;
  }
}
.blog-list .post-data article .more {
  font-size: 1.4rem;
  padding: 4px 38px;
}
.blog-list .popular-posts {
  margin-top: 90px;
}
@media screen and (max-width: 768px) {
  .blog-list .popular-posts {
    margin-top: 50px;
  }
}

/*======================================================================
 * インタビュー一覧レイアウト
======================================================================*/
.interview-list-container .title-section {
  padding-bottom: 47px;
}
@media screen and (max-width: 1000px) {
  .interview-list-container .title-section {
    padding-top: 20px;
    padding-bottom: 12px;
  }
}
.interview-list-container .title-section h1 {
  margin-bottom: 40px;
}
@media screen and (max-width: 1000px) {
  .interview-list-container .title-section h1 {
    margin-bottom: 14px;
  }
}

.col1-container.interview-list-wrapper {
  max-width: 1240px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 108px;
}
@media screen and (max-width: 768px) {
  .col1-container.interview-list-wrapper {
    margin-top: 25px;
  }
}

.interview-list {
  width: 100%;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
}
.interview-list .post-data {
  display: flex;
  flex-wrap: wrap;
  gap: 47px 41px;
  max-width: 1240px;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 1280px) {
  .interview-list .post-data {
    margin-right: 64px;
    margin-left: 64px;
  }
}
@media screen and (max-width: 768px) {
  .interview-list .post-data {
    margin-right: 25px;
    margin-left: 25px;
    gap: 21px 0;
  }
}
.interview-list article {
  width: calc((100% - 82px) / 3);
  display: flex;
  overflow: hidden;
}
.interview-list article.js-visible {
  display: flex !important;
}
@media screen and (max-width: 1000px) {
  .interview-list article {
    width: calc((100% - 41px) / 2);
  }
}
@media screen and (max-width: 768px) {
  .interview-list article {
    width: 100%;
  }
}
.interview-list article a {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  text-decoration: none;
  position: relative;
}
@media screen and (max-width: 768px) {
  .interview-list article a {
    flex-wrap: nowrap;
    flex-direction: row;
  }
}
.interview-list article a .new {
  position: absolute;
  font-size: 24px;
  top: -17px;
  left: -65px;
  color: #363636;
  background-color: #ffd544;
  transform: rotate(-45deg);
  padding: 40px 60px 6px;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .interview-list article a .new {
    font-size: 1.2rem;
    top: -27px;
    left: -68px;
  }
}
.interview-list article a img {
  max-width: 100%;
  width: 100%;
  aspect-ratio: 171/146;
}
@media screen and (max-width: 768px) {
  .interview-list article a img {
    aspect-ratio: 100/121;
    height: 100%;
    max-width: 30%;
  }
}
.interview-list article a .text {
  background-color: #eee;
  padding: 25px 24px;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
}
@media screen and (max-width: 768px) {
  .interview-list article a .text {
    display: block;
    padding: 24px;
  }
}
.interview-list article a .text::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 13px;
  right: 13px;
  width: 0;
  height: 0;
  border-top: 0 solid transparent;
  border-right: 0 solid transparent;
  border-bottom: 44px solid #afafaf;
  border-left: 44px solid transparent;
}
@media screen and (max-width: 768px) {
  .interview-list article a .text::after {
    bottom: 12px;
    right: 12px;
    border-bottom: 24px solid #afafaf;
    border-left: 24px solid transparent;
  }
}
.interview-list article a .text h3 {
  color: #464646;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.0015em;
  margin: 0;
  width: 100%;
}
@media screen and (max-width: 460px) {
  .interview-list article a .text h3 {
    font-size: 1.3rem;
  }
}
.interview-list article a .text .join {
  font-size: 1.6rem;
  color: #000;
  margin-top: 16px;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  .interview-list article a .text .join {
    margin-top: 12px;
  }
}
@media screen and (max-width: 460px) {
  .interview-list article a .text .join {
    font-size: 1.3rem;
  }
}

/*======================================================================
 * ニュース一覧レイアウト
======================================================================*/
.news-list-container .title-section {
  background-color: #fff;
  padding-bottom: 0;
  padding-top: 59px;
}
@media screen and (max-width: 768px) {
  .news-list-container .title-section {
    padding-top: 21px;
  }
}
.news-list-container .title-section h1 {
  font-size: 5rem;
  line-height: 1.46;
}
@media screen and (max-width: 768px) {
  .news-list-container .title-section h1 {
    font-size: 1.8rem;
  }
}
.news-list-container .c-cta-footer {
  margin-top: 128px;
}

.col1-container.news-list-wrapper {
  max-width: 1110px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 46px;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper {
    margin-top: 20px;
  }
}
.col1-container.news-list-wrapper .news-button {
  padding: 0;
  list-style: none;
  display: flex;
  max-width: 826px;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 138px;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .news-button {
    max-width: 314px;
    margin-bottom: 75px;
  }
}
.col1-container.news-list-wrapper .news-button li {
  width: 50%;
  height: 92px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  max-width: 100%;
  color: #000;
  font-size: 2rem;
  background: #fff;
  border: solid 1px #707070;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .news-button li {
    font-size: 1rem;
    height: 34px;
  }
}
.col1-container.news-list-wrapper .news-button li:first-of-type {
  border-radius: 46px 0 0 46px;
  border-right: none;
}
.col1-container.news-list-wrapper .news-button li:first-of-type::before {
  left: 85px;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .news-button li:first-of-type::before {
    left: 25px;
  }
}
.col1-container.news-list-wrapper .news-button li:last-of-type {
  border-radius: 0 46px 46px 0;
  border-left: none;
}
.col1-container.news-list-wrapper .news-button li:last-of-type::before {
  right: 85px;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .news-button li:last-of-type::before {
    right: 25px;
  }
}
.col1-container.news-list-wrapper .news-button li:first-of-type {
  background-color: #444;
  border: none;
  color: #fff;
}
.col1-container.news-list-wrapper .news-button li:first-of-type::before {
  content: "";
  position: absolute;
  top: 100%;
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  border-top: 30px solid #444;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .news-button li:first-of-type::before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 11px solid #444;
  }
}
.col1-container.news-list-wrapper .news-button a {
  text-decoration: none;
  color: #000;
}
.col1-container.news-list-wrapper .tag-list {
  padding: 0;
  list-style: none;
  display: flex;
  gap: 0 15px;
  margin-bottom: 26px;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .tag-list {
    flex-wrap: wrap;
    gap: 15px 0;
    margin-bottom: 27px;
  }
}
@media screen and (max-width: 450px) {
  .col1-container.news-list-wrapper .tag-list {
    gap: 15px;
  }
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .tag-list > li {
    width: 33.3333333333%;
  }
}
@media screen and (max-width: 450px) {
  .col1-container.news-list-wrapper .tag-list > li {
    width: auto;
  }
}
.col1-container.news-list-wrapper .tag-list > li.active a::before {
  box-shadow: 0 0 0 1px #464646;
  background: #464646;
  border: 4px solid #fff;
}
.col1-container.news-list-wrapper .tag-list a {
  text-decoration: none;
  color: #000;
  font-size: 1.4rem;
  letter-spacing: 0.0015em;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .tag-list a {
    font-size: 1.4rem;
  }
}
.col1-container.news-list-wrapper .tag-list a::before {
  content: "";
  display: block;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #000;
  width: 17px;
  height: 17px;
  margin-right: 4px;
  box-sizing: border-box;
}
.col1-container.news-list-wrapper .post-data {
  padding-top: 25px;
  padding-bottom: 22px;
  border-top: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .post-data {
    padding: 16px 0;
  }
}
.col1-container.news-list-wrapper .post-data:last-of-type {
  border-bottom: 1px solid #707070;
}
.col1-container.news-list-wrapper .post-data a {
  text-decoration: none;
}
.col1-container.news-list-wrapper .post-data .text {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .post-data .text {
    flex-wrap: wrap;
  }
}
.col1-container.news-list-wrapper .post-data .text .tag-wrapper {
  text-wrap: nowrap;
}
.col1-container.news-list-wrapper .post-data .text .tag {
  background-color: #464646;
  padding: 3px 13px;
  font-size: 1rem;
  font-weight: 400;
  color: #fff;
  letter-spacing: 0.0015em;
  margin-right: 18px;
  display: inline-block;
}
.col1-container.news-list-wrapper .post-data .text .date {
  font-size: 1.4rem;
  font-weight: 400;
  color: #000;
  line-height: 1.78;
  letter-spacing: 0.0015em;
  margin-right: 15px;
}
@media screen and (max-width: 768px) {
  .col1-container.news-list-wrapper .post-data .text .date {
    width: 100%;
    margin-top: 6px;
    margin-bottom: 10px;
  }
}
.col1-container.news-list-wrapper .post-data .text h3 {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 400;
  color: #000;
  line-height: 1.78;
  letter-spacing: 0.0015em;
}

/*======================================================================
 * セミナー一覧レイアウト
======================================================================*/
.seminar-list-container .title-section {
  background-color: #fff;
  padding-top: 59px;
  padding-bottom: 0;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .title-section {
    padding-top: 21px;
  }
}
.seminar-list-container .title-section h1 {
  font-size: 5rem;
  color: #444;
  line-height: 1.46;
  letter-spacing: 0.0015em;
  font-family: "HanSans";
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .title-section h1 {
    font-size: 1.5rem;
    margin-bottom: 15px;
  }
}
.seminar-list-container .title-section .tag_label {
  text-align: center;
}
.seminar-list-container .title-section .intro-wrapper {
  font-size: 1.6rem;
  font-family: "HanSans";
  line-height: 1.43;
  letter-spacing: 0.0015em;
  padding-left: 27px;
  padding-right: 27px;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .title-section .intro-wrapper {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 768px) {
  .seminar-list-container .title-section .intro-wrapper p {
    line-height: 1.66;
  }
}
.seminar-list-container .seminar-list-wrapper {
  margin-top: 75px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1280px) {
  .seminar-list-container .seminar-list-wrapper {
    margin-right: 21px;
    margin-left: 21px;
    margin-top: 35px;
  }
}
.seminar-list-container .post-data {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 0;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data {
    gap: 0;
  }
}
.seminar-list-container .post-data article {
  width: 100%;
  border: 1px solid #828282;
  position: relative;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article {
    border: none;
    border-bottom: 1px solid #000;
  }
  .seminar-list-container .post-data article:first-child {
    border-top: 1px solid #000;
  }
}
.seminar-list-container .post-data article a {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto 1fr;
  gap: 0 26px;
  width: 100%;
  text-decoration: none;
  padding: 27px 23px;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article a {
    grid-template-columns: auto;
    grid-template-rows: auto auto 1fr;
    gap: 0;
    padding: 18px 0;
  }
}
.seminar-list-container .post-data article .image {
  aspect-ratio: 16/9;
  width: 336px;
  grid-area: 1/1/3/2;
  overflow: hidden;
}
@media screen and (max-width: 1000px) {
  .seminar-list-container .post-data article .image {
    width: 266px;
  }
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .image {
    max-width: 100%;
    width: 100%;
    grid-area: 2/1/3/2;
  }
}
.seminar-list-container .post-data article .image img {
  width: 100%;
}
.seminar-list-container .post-data article .tag-list {
  display: flex;
  align-items: top;
  grid-area: 1/2/2/3;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .tag-list {
    grid-area: 1/1/2/2;
    margin-bottom: 16.5px;
  }
}
.seminar-list-container .post-data article .tag-list .tag {
  font-size: 1.1rem;
  padding: 3px 11px;
  border-width: 1px;
  border-style: solid;
  line-height: 1.4;
}
.seminar-list-container .post-data article .tag-list .tag:nth-child(n+2) {
  margin-left: 8px;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .tag-list .tag {
    font-size: 0.8rem;
    padding: 3px 7px;
  }
}
.seminar-list-container .post-data article .text {
  background-color: #fff;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  grid-area: 2/2/3/3;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .text {
    grid-area: 3/1/4/2;
    margin-top: 19px;
  }
}
.seminar-list-container .post-data article .text h2 {
  width: 100%;
  color: #000;
  font-size: 2.6rem;
  margin: 15px 0 0;
  line-height: 1.42;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .text h2 {
    font-size: 1.6rem;
    font-weight: 300;
    margin: 0;
  }
}
.seminar-list-container .post-data article .text .date {
  color: #0ABAB5;
  font-size: 2.6rem;
  display: flex;
  align-items: center;
  margin-top: 26px;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .text .date {
    font-size: 1.4rem;
    margin-top: 15px;
  }
}
.seminar-list-container .post-data article .text .date .icon {
  background-image: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/common/calender_icon.svg");
  background-repeat: no-repeat;
  background-size: contain;
  width: 27px;
  height: 27px;
  display: inline-block;
  margin-right: 13px;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .text .date .icon {
    width: 18px;
    height: 18px;
  }
}
.seminar-list-container .post-data article .text::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 13px;
  right: 13px;
  width: 0;
  height: 0;
  border-top: 0 solid transparent;
  border-right: 0 solid transparent;
  border-bottom: 44px solid #828282;
  border-left: 44px solid transparent;
}
@media screen and (max-width: 768px) {
  .seminar-list-container .post-data article .text::after {
    bottom: 12px;
    right: 0;
    border-bottom: 24px solid #828282;
    border-left: 24px solid transparent;
  }
}@charset "UTF-8";/* ******************************************************************************
*********************************************************************************
This file contains all the neccessary styles for your blog. The styles included
are for the listing and post templates, featured images and pagination.
Also for the post meta infromation like tags, author and published date
*********************************************************************************
****************************************************************************** */

/* TODO: Find a better place for this */
.content-wrapper {
  margin: 0 auto;
}

.blog-header {
  background-color: ;
  text-align: center;
}

.blog-header__inner {
  max-width: 600px;
  margin: 0 auto;
  padding: 3.3rem 0;
}
.blog-header__title {
  font-size: 2rem;
}
.blog-header__subtitle {
  margin: 1rem 0 2rem;
}

.blog-header__form {
  margin: 0 1rem;
}

@media screen and (min-width: 768px) {
  .blog-header__form {
    width: 500px;
    margin: 0 auto;
  }
}

.blog-index {
  display: flex;
  flex-wrap: wrap;
  padding: 3.3rem 0;
}
.blog-index:after {
  content: "";
  flex: auto;
}
.blog-index__tag-header {
  flex: 1 0 100%;
  padding: 1rem;
}
.blog-index__tag-subtitle {
  font-size: 1.16rem;
  line-height: 1.1;
}
.blog-index__tag-heading {
  padding-bottom: 1rem;
  border-bottom: 3px solid #D1D6DC;
}
.blog-index__post {
  flex:  0 0 100%;
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .blog-index__post {
    flex:  0 0 calc(100%/2);
  }
}
@media screen and (min-width: 1000px) {
  .blog-index__post {
    flex:  0 0 calc(100%/3);
  }
}
@media screen and (min-width: 768px) {
  .blog-index__post--large {
    flex: 1 0 100%;
    display: flex;
    justify-items: space-between;
  }
}
.blog-post img {
  max-width: 100%;
}
.blog-index__post-image {
  display: block;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  padding-bottom: 63%;
  background-image: url('');
    }
@media screen and (min-width: 768px) {
  .blog-index__post-image--large {
    flex: 1 1 100%;
    padding-bottom: 0;
  }
  .blog-index__post-content--large {
    flex: 1 1 100%;
    padding-left: 2rem;
  }
  .blog-index__post-image--large {
    flex: 1 1 48%;
  }
  .blog-index__post-content--large {
    flex: 1 1 48%;
    padding-left: 2rem;
  }
}
.blog-index__post-content h2 {
  margin: .5rem 0;
}
.blog-index__post-content--small h2 {
  font-size: ;
}
.blog-index__post-content p {
  font-family: ;
}
.blog-index__post-content a {
  color: ;
}
.blog-index__post img {
  max-width: 100%;
  height: auto;
}

.blog-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-family: ;
  margin-bottom: 3.3rem;
}
.blog-pagination__link {
  display: inline-flex;
  padding: .25rem .4rem;
  margin: 0 .1rem;
  color: ;
  text-decoration: none;
  border: 2px solid transparent;
  line-height: 1;
  border-radius: 7px;
}
.blog-pagination__link--active {
  border: 2px solid #B0C1D4;
}
.blog-pagination__link:hover,
.blog-pagination__link:focus {
  text-decoration: none;
}
.blog-pagination__prev-link,
.blog-pagination__next-link {
  display: inline-flex;
  align-items: center;
}
.blog-pagination__prev-link {
  text-align: right;
  margin-right: .25rem;
}
.blog-pagination__next-link {
  text-align: left;
  margin-left: .25rem;
}
.blog-pagination__prev-link--disabled,
.blog-pagination__next-link--disabled {
  color: #B0C1D4;
  pointer-events: none;
  cursor: default;
}
.blog-pagination__prev-link svg,
.blog-pagination__next-link svg {
  fill: ;
  margin: 0 5px;
}
.blog-pagination__prev-link--disabled svg,
.blog-pagination__next-link--disabled svg {
  fill: #B0C1D4;
}
.blog-pagination__number-link:hover,
.blog-pagination__number-link:focus {
  border: 2px solid #B0C1D4;
}

.news-blog-post__body a:hover,
.media-blog-post__body a:hover{
  color: #00e;
}
.blog-header__author-avatar {
  height: 200px;
  width: 200px;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 50%;
  box-shadow: 0 0 12px 0 rgba(0,0,0,0.15);
  margin: 0 auto 1.5rem;
}
.blog-header__author-social-links a {
  display: inline-block;
  position: relative;
  background-color: #000;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin: 0 5px;
}
.media-blog-post__body img {
  width: auto;
  max-width: 100%;
}
.blog-header__author-social-links a:hover {
  background-color: ;
}
.blog-header__author-social-links svg {
  fill: #fff;
  height: 15px;
  width: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.blog-recent-posts {
  margin-top: 3rem;
  background-color: ;
  padding: 2rem 0;
}
.blog-recent-posts h2 {
  text-align: center;
}
.blog-recent-posts__list {
  display: flex;
}
.blog-recent-posts__post {
  display: block;
  flex:  0 0 100%;
  color: ;
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .blog-recent-posts__post {
    flex:  0 0 calc(100%/2);
  }
}
@media screen and (min-width: 1000px) {
  .blog-recent-posts__post {
    flex:  0 0 calc(100%/3);
  }
}
.blog-recent-posts__post:hover {
  text-decoration: none;
}
.blog-recent-posts__image {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  padding-bottom: 63%;
}
.blog-recent-posts__title {
  margin: 1rem 0 .5rem;
}

.blog-comments {
  max-width: 680px;
  margin: 0 auto;
}
.blog-comments form {
  max-width: 100%;
}
.blog-comments .hs-submit {
  text-align: center;
}

.blog-comments .comment-reply-to {
  border: 0 none;
}
.blog-comments .comment-reply-to:hover {
  background-color: transparent;
  text-decoration: underline;
  color: ;
}

/*             Blog Listing with Sidebar            */

.post-item .page-center{
  display: -webkit-flex; /* Safari */
  display: flex; /* Standard syntax */
  margin-bottom: 20px;
}
.post-item .page-center .span4, .post-item .page-center .span8 {
  -webkit-flex: 1; /* Safari */
  -ms-flex: 1; /* IE 10 */
  flex: 1; /* Standard syntax */
}
.post-item .page-center .span8 {
  flex-basis: 31.914893614%;

}
img.featured-image {
  height: 100% !important;
  width: 100% !important;
  object-fit: cover;
}
@media(max-width: 480px){
  .blog-post img {
    width: 100% !important;
    float: none !important;
  }
}

/*             Blog Grid Listing            */

.blog-index__post.blog-index__post--small {
  display: flex;
}

.blog-index__post-inner-card {
  display: flex;
  flex-flow: column nowrap;
  width: 100%;
  border-radius: 5px;
  background: #fff;
}

.blog-index__post-image {
  border-radius: 5px 5px 0 0;
}

.blog-index__post-inner-card .blog-index__post-content {
  display: flex;
  flex-direction: column;
  padding: 24px 30px 30px 30px;
  height: 100%;
}

.blog-post__tag-link,
.blog-post__tags {
  font-size: 12px;
  font-weight: 200;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: 0.01rem;
}

.blog-post__tag-link:hover{
  text-decoration: none;
}

.blog-index__post-content--small h2 {
  font-size: 18px;
  line-height: 26px;
}

.blog-index__post-content--small h2 a:hover {
  text-decoration: none;
  transition: all .5s;
}

.blog-post__meta-section {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: auto;
  padding-top: 30px;
  font-size: 14px;
}

.blog-post__read-more a:hover {
  text-decoration: none;
}

.read-more__arrow {
  position: relative;
  top: 3px;
  padding-left: 10px;
}

.blog-post__read-more svg {
  width: 15px;
  height: auto;
}

.blog-post__read-more a svg {
  -webkit-transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -o-transition: all 0.15s linear;
  transition: all 0.15s linear;
}

@media screen and (max-width: 767px) {
  .blog-index.sidebar {
    padding: 1rem 0;
    padding-bottom: 3.3rem;
  }
}

/*             Blog Grid Listing with Sidebar            */

.blog-index.sidebar {
  display:flex;
}

@media screen and (min-width: 1000px) {
  .blog-index.sidebar .blog-index__post {
    flex: 0 0 calc(100%/2);
  }
}

@media screen and (max-width: 999px) {
  .blog-index.sidebar .blog-index__post {
    flex: 0 0 calc(100%/1);
  }
}




.blog-pagination.span12 {
  display: flex;
  margin-left: 0;
}

/* Mobile Blog Sidebar */

@media(max-width: 767px) {
  .hs-blog-listing .content-wrapper > .row-fluid {
    display: flex;
    flex-direction: column;
  }

  .hs-blog-listing .span3 {
    order: 1;
  }

  .hs-blog-listing .span9 {
    order: 2;
  }

  .hs-blog-listing .blog-pagination {
    order: 3;
  }

  .blog-sidebar.mobile .blog-sidebar-topic-filter ul,
  .blog-sidebar.mobile .blog-sidebar-post-listing ul {
    visibility: hidden;
    opacity: 0;
    transition: all 5s;
    display: none;
  }

  .blog-sidebar.mobile .blog-sidebar-topic-filter h3,
  .blog-sidebar.mobile .blog-sidebar-post-listing h3 {
    cursor: pointer;
  }
  .blog-sidebar.mobile .blog-sidebar-topic-filter h3:after,
  .blog-sidebar.mobile .blog-sidebar-post-listing h3:after {
    content: "+";
    padding-left: 6px;
  }

  .blog-sidebar.mobile .blog-sidebar-topic-filter.clicked h3:after,
  .blog-sidebar.mobile .blog-sidebar-post-listing.clicked h3:after {
    content: "-";
    padding-left: 7px;
  }

  .blog-sidebar.mobile .clicked ul {
    display: block;
    visibility: visible;
    transition: all 1s;
    opacity: 1;
  }
}

/* Blog Subscription Section */

.subscription-form {
  display: block;
  margin: 0 auto;
  padding: 60px 0;
  width: 40%;
  text-align: center;
}

@media (max-width: 767px) {
  .subscription-form {
    width: 85%;
  }
}

.subscription-form label {
  text-align: center;
}


.blog-post.no-image {
  margin-top: 50px;
}
h2.blog-post__title {
  margin-bottom: 20px;
  font-size: 32px;
  font-family: "Noto Sans Japanese", sans-serif;
  color: #040000;
  line-height: 1.5;
  font-weight: normal;
  letter-spacing: 0;
}

.blog-post__meta a {
  text-decoration: none;
}

.blog-post__links {
  display: block;
  padding: 26px 0;
  margin-top: 20px;
}
.social-sharing-list ul {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}
.blogSingle__sns li a:hover img {
  opacity: 0.8;
}
.social-sharing-list ul li {
  margin-right: 5px;
}
.social-sharing-list ul li a{
  display:block; 
}
.social-sharing-list ul li a img {
  transition: .2s;
  max-width: 35px;
  vertical-align: middle;
}
.blog-post__back-to-blog {
  text-decoration: none;
}

.blog-post__back-to-blog svg {
  position: relative;
  top: 6px;
  margin-right: 10px;
  width: 20px;
  -webkit-transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -o-transition: all 0.15s linear;
  transition: all 0.15s linear;
}

@media (max-width: 767px) {
  .blog-post {
    width: 90%;
    padding: 30px;
  }
}

/* Blog Comments */

.blog-comments {
  max-width: 100%;
}

.comment.depth-0:first-child {
  margin-top: 2em;
}

.comment.depth-1 {
  padding-left: 2em;
  padding-top: 1em;
  margin-top: 1em;
}

.blog-comments form {
  margin-top: 2em;
  padding-top: 2em;
}

/* Related Articles */

.blog-recent-posts__list {
  flex-wrap: wrap;
}

.blog-recent-posts .blog-index__post-content h2 {
  text-align: left;
}

.blog-recent-posts .blog-post__meta-section {
  justify-content: flex-end;
}


.banner-area-mdl.blog-banner {
  min-height: 199px;
  background-size: cover;
  text-align: center;
  padding-top: 49px;
  background-color: #eef7fc;
  position: relative;
}
.banner-area-mdl.blog-banner .banner-content h1 {
  font-weight: bold;
  font-size: 20px;
  line-height: 1.4;
  letter-spacing: 0;
  font-family: "Noto Sans Japanese", sans-serif;
}
.banner-area-mdl.blog-banner .banner-content h1 span {
  font-size: 48px;
  letter-spacing: 0.2em;
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  display: block;
}
.banner-area-mdl.blog-banner .breadcrumbs,
.media-banner .breadcrumbs{
  font-size: 14px;
  font-family: "Noto Sans Japanese", sans-serif;
  width: fit-content;
  position: absolute;
  top: 13px;
  left: 19px;
}
.banner-area-mdl.blog-banner .breadcrumbs li.hs-breadcrumb-menu-item,
.media-banner .breadcrumbs li.hs-breadcrumb-menu-item{
  padding: 0;
  color: #222222;
}
.banner-area-mdl.blog-banner .breadcrumbs li.hs-breadcrumb-menu-item a,
.media-banner .breadcrumbs li.hs-breadcrumb-menu-item a{
  color: #222222;
  text-decoration: underline;
}
.banner-area-mdl.blog-banner .hs-breadcrumb-menu-divider:before,
.media-banner .breadcrumbs .hs-breadcrumb-menu-divider:before{
  content: " > ";
  padding-left: 0;
  padding-right: 3px;
}
.banner-area-mdl.blog-banner.mobile-banner,
.media-banner .mobile-banner{
  display: none;
}
.news-post-grp {
  border-top: 1px solid #cccccc;
  margin-bottom: 120px;
}

.news-post-item {
  border-bottom: 1px solid #cccccc;
}

.news-post-item a {
  width: 100%;
  align-items: baseline;
  display: flex;
  padding: 13px 0;
  line-height: 1.5;
  color: inherit;
  text-decoration: none;
  transition: .2s;
}

.news-post-item__tag {
  min-width: 60px;
  background: #0081cc;
  font-size: 12px;
  padding: 2px;
  color: #fff;
  text-align: center;
  flex: none;
}

time.news-post-item__date {
  margin: 0 15px;
  white-space: nowrap;
  flex: none;
}

p.news-post-item__text {
  margin: 0;
}
.custom-categories  ul {
  margin: 0;
  padding: 0;
}

.custom-categories ul li {
  display: inline-block;
  margin-right: 8px;
  border: 2px solid #0081cc;
  position: relative;
  margin-bottom: 15px;
  font-size: 14px;
}

.custom-categories ul li a {
  text-decoration: none;
  color: #fff;
  background-color: #0081cc;
  padding: 8px 16px;
  display: inline-block;
  transition: .2s;
}

.custom-categories ul li:hover a,
.custom-categories ul li.active a,
.media-categories ul li:first-child > a{
  background-color: #fff;
  color: #0081cc;
}

.custom-categories ul li:hover:after,
.custom-categories ul li.active a:after,
.media-categories ul li:first-child > a:after{
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  position: absolute;
  border-color: rgba(0, 153, 255, 0);
  border-top-width: 10px;
  border-bottom-width: 10px;
  border-left-width: 10px;
  border-right-width: 10px;
  margin-left: -10px;
  border-top-color: #0081cc;
  top: 100%;
  left: 50%;
}
.news-posts-wrap{
  padding-top: 80px;
  margin-bottom: 24px;
  padding-left: 15px;
  padding-right: 15px;
}
.case-posts-wrap{
  padding-top: 80px;
  margin-bottom: 24px;
  padding-left: 15px;
  padding-right: 15px;
}

.custom-categories {
  margin-bottom: 25px;
}
.news-post-item a:hover {
  background-color: #f2f2f2;
  color: #040000;
}
.blog-banner-mobile-img {
  display: none;
}
.newsSingle__tag {
  line-height: 28px;
  font-size: 14px;
  color: #fff;
  background-color: #0081cc;
  padding: 0 14px;
  margin-bottom: 20px;
}
h2.news-blog-post__title {
  font-size: 32px;
  line-height: 1.5;
  margin-bottom: 20px;
  font-family: "Noto Sans Japanese", sans-serif;
  color: #040000;
  font-weight: normal;
  letter-spacing: 0;
}
time.newsSingle__date {
  display: block;
  text-align: right;
  font-size: 16px;
  margin-bottom: 20px;
  line-height: 1.5;
}

.news-blog-post__body img {
  margin-bottom: 80px;
  display: block;
  max-width: 100%;
  width: auto;
}
.news-blog-post__body h2,
.case-blog-post__body h2,
.media-blog-post__body h2{
  margin-top: 60px;
  margin-bottom: 30px;
  font-size: 26px;
  padding-top: 16px;
  position: relative;
  font-family: "Noto Sans Japanese", sans-serif;
  color: #040000;
  line-height: 1.5;
  font-weight: normal;
  letter-spacing: 0;
}
.news-blog-post__body h2:before,
.case-blog-post__body h2:before,
.media-blog-post__body h2:before{
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, #0081cc 0%, #0081cc 50%, #004567 50%, #004567 100%);
}
.news-blog-post__body p,
.case-blog-post__body p,
.media-blog-post__body p{
  margin-bottom: 1.5em;
}
.news-blog-post__body,
.media-blog-post__body{
  line-height: 2;
  margin-bottom: 50px;
}
.case-blog-post__body {
  margin-bottom: 79px;
  line-height: 2;
}
.news-post-pagination {
  text-align: center;
  font-weight: bold;
  padding-bottom: 118px;
}
.singlePager__prev {
  display: inline-block;
  padding-right: 1em;
  border-right: 1px solid #0081cc;
  min-width: 84px;
  white-space: nowrap;
}
.singlePager__center {
  display: inline-block;
  margin: 0 1em;
}
.singlePager__next {
  display: inline-block;
  padding-left: 1em;
  border-left: 1px solid #0081cc;
  min-width: 84px;
  white-space: nowrap;
}
.singlePager__prev a:before {
  content: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_page_prev.png');
    margin-right: 0.5em;
    vertical-align: -2px;
    }
.singlePager__next a:after {
  content: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_page_next.png');
    margin-left: 0.5em;
    vertical-align: -2px;
    }
.worksSingle__tag span{
  padding: 6px 16px;
  margin-bottom: 5px;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  background-color: #0081cc;
  line-height: 1;
}
h2.worksSingle__title {
  font-size: 40px;
  line-height: 1.25;
  margin-bottom: 15px;
  font-family: "Noto Sans Japanese", sans-serif;
  color: #040000;
  font-weight: normal;
  letter-spacing: 0;
}
time.worksSingle__date {
  display: block;
  text-align: right;
  margin-bottom: 15px;
  font-size: 14px;
  line-height: 1.5;
}
.worksSingleDesc {
  display: flex;
  margin-bottom: 60px;
  justify-content: space-between;
}
.worksSingleDesc__left {
  width: 365px;
}
.worksSingleDesc__left img {
  width: 100%;
  max-width: 353px;
  display: block;
}
.worksSingleDesc__right {
  width: 580px;
}
.worksSingleDesc__right p {
  line-height: 1.9;
  margin: 0;
}
.worksSingleDesc__excerpt p {
  font-size: 18px;
  line-height: 1.4;
  padding-top: 23px;
  margin-top: 20px;
  border-top: 1px solid #cccccc;
}
.newsTagScroll {
  display: none;
}
.post-three-col > ul {
  padding: 0;
  display: flex;
  list-style: none;
  justify-content: space-between;
  margin: 0 -1px 80px;
}
.post-three-col > ul > li {
  flex: 1;
  background-image:url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/ptn_blue.png');
    padding: 20px 25px;
    margin: 0 1px;
    }
.post-three-col>ul>li p {
  color: #fff;
  background-color: #0081cc;
  width: 92px;
  height: 28px;
  padding-top: 3px;
  font-size: 14px;
  border-radius: 14px;
  font-weight: bold;
  text-align: center;
  margin: 0 auto 15px;
}
.post-three-col>ul  ul {
  margin-bottom: -5px;
  padding: 0;
  list-style: none;
}
.post-three-col>ul ul li {
  margin-bottom: 5px;
  font-size: 14px;
  position: relative;
  padding-left: 1em;
}
.post-three-col>ul ul li:before {
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  left: 0px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #0081cc;
}
.hs-responsive-embed-wrapper.hs-responsive-embed {
  max-width: 100% !important;
  max-height: 100% !important;
}
.works-post-item {
  border-bottom: 1px solid #cccccc;
  position: relative;
}
.works-post-item a {
  display: flex;
  justify-content: space-between;
  width: 100%;
  text-decoration: none;
  color: inherit;
  padding: 30px 0;
  transition: .2s;
}
.worksListArchiveItem__left {
  width: 280px;
}
.worksListArchiveItem__thumb {
  overflow: hidden;
}
.worksListArchiveItem__thumb img {
  transition: .2s;
  -webkit-transform-origin: center;
  transform-origin: center;
  width: 100%;
  display: block;
}
.worksListArchiveItem__right {
  width: 670px;
}
.works-posts-grp {
  border-top: 1px solid #cccccc;
  margin-bottom: 120px;
}
.case-post__tags span{
  padding: 8px 17px;
  line-height: 1;
  font-size: 14px;
  margin-bottom: 10px;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  background-color: #0081cc;
}
p.worksListArchiveItem__title {
  margin-bottom: 25px;
  font-size: 32px;
  line-height: 1.4;
}
time.worksListArchiveItem__date {
  margin-bottom: 15px;
  display: block;
  text-align: right;
  font-size: 14px;
}
.works-post-item:nth-child(2n) a {
  flex-direction: row-reverse;
}
.works-post-item a:hover {
  background-color: #f2f2f2;
}
.works-post-item a:hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.works-post-item a:hover p.worksListArchiveItem__title {
  color: #040000;
}
.works-post-item a:hover {
  color: #1c1c1c;
}
.case-post-pg-wrap {
  padding-top: 50px;
  padding-bottom: 24px;
  padding-left: 15px;
  padding-right: 15px;
}
.worksSingleDesc__client {
  line-height: 1.9;
  color: #040000;
}
.worksSingleDesc__excerpt {
  color: #040000;
}
.listing-summary {
  color: #040000;
  line-height: 1.8;
  margin-top: -2px;
}
.media-posts-grp .content-wrapper {
  max-width: 1714px;
}
.media-posts-grp {
  padding-top: 60px;
  padding-bottom: 120px;
  padding-left: 10px;
  padding-right: 10px;
}
.media-posts-grp .row-fluid {
  display: flex;
  justify-content: space-between;
}
.media-posts-wrap {
  width: 1490px;
}
.blog-sidebar {
  width: 180px;
}
.blogArchiveListItem__thumb img {
  width: 100%;
  transition: .2s;
  -webkit-transform-origin: center;
  transform-origin: center;
  display: block;
  min-height: 142px;
  object-fit: cover;
  height: 100%;
}
.media-banner {
  background-size: cover;
  padding-top: 94px;
  background-repeat: no-repeat;
  background-position: center;
  min-height: 300px;
  position: relative;
  margin-top: -1px;
}
.blogArchiveListItem a {
  display: block;
}
.blogArchiveListItem.post-item:first-child .blogArchiveListItem__thumb {
  max-height: unset;
}
.blogArchiveListItem__thumb {
  width: 100%;
  height: auto;
  max-height: 142px;
  overflow: hidden;
}
p.blogArchiveListItem__title {
  font-size: 16px;
  line-height: 1.4;
  color: #040000;
  width: 200px;
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
  height: 45px;
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0 auto;
}
.title-wrap {
  width: 200px;
}
time.blogArchiveListItem__date {
  font-size: 12px;
  position: absolute;
  bottom: 10px;
  color: #040000;
  line-height: 1.5;
  right: 18px;
}
.blogArchiveListItem a:hover {
  opacity: 0.8;
}
.blogArchiveListItem a:hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
.media-banner .banner-content h1 {
  width: 290px;
  margin: 0 auto;
  color: #fff;
  position: relative;
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  border: 1px solid #fff;
  border-top-style: none;
  font-size: 39px;
  text-align: center;
  line-height: 1;
  padding: 24px 0;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.media-banner .banner-content h1 span {
  position: absolute;
  width: 100%;
  left: 0px;
  top: -10px;
  display: flex;
  align-items: center;
  font-family: "Noto Sans Japanese", sans-serif;
  font-size: 20px;
  letter-spacing: 0.05em;
}
.media-banner .banner-content h1 span:before {
  height: 1px;
  flex: 1;
  background-color: #fff;
  content: "";
  display: block;
  margin-right: 8px;
}
.media-banner .banner-content h1 span:after {
  height: 1px;
  flex: 1;
  background-color: #fff;
  content: "";
  display: block;
  margin-left: 8px;
}
.blogTagNav {
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  padding: 10px 10px 8px;
  display: flex;
  margin-bottom: 60px;
}
.blogTagNav__left {
  font-size: 14px;
  font-weight: bold;
  flex: none;
  color: #040000;
  line-height: 1.5;
}
.blogTagNav__right {
  display: inline;
  line-height: 1.5;
}
.blogTagNav__right h3 {
  display: none;
}
.blogTagNav__right ul {
  margin: 0;
  padding: 0;
  display: block;
}
.blogTagNav__right ul li {
  display: inline-block;
  margin-right: 13px;
  padding-left: 1.2em;
  position: relative;
  font-size: 14px;
  vertical-align: top;
}
.blogTagNav__right ul li a {
  text-decoration: none;
  color: inherit;
  font-size: 14px;
  line-height: 1.5;
}
.blogTagNav__right span.filter-link-count {
  display: none;
}
.blogTagNav__right ul li:before {
  display: inline-block;
  content: "";
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_tag.png') no-repeat center;
    background-size: contain;
    position: absolute;
    top: 3px;
    left: 0px;
    width: 13px;
    height: 13px;
    }
.blogTagNav__right ul li a:hover {
  color: #0081cc;
}
.blogArchiveListGrid {
  display: flex;
  flex-wrap: wrap;
  margin-left: -22px;
  position: relative;
}
.blogArchiveListItem {
  width: 230px;
  background-color: #fff;
  margin-bottom: 20px;
  margin-left: 22px;
}
.blogArchiveListItem.post-item:first-child {
  width: 734px;
}
.blogArchiveListItem__tagArea {
  background-color: #0081cc;
  height: 22px;
}
.blogArchiveListItem__tag {
  padding: 3px 0 0 17px;
  font-size: 10px;
  color: #fff;
}
.blogArchiveListItem__inner {
  padding: 12px 15px 30px;
  min-height: 104px;
  position: relative;
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/ptn_gray.png');
    }
.blogArchiveListItem.post-item:first-child p.blogArchiveListItem__title {
  font-size: 24px;
  text-overflow: unset;
  height: auto;
  width: 100%;
}
.blogArchiveListItem.post-item:first-child .title-wrap {
  width: 100%;
}
.blogArchiveListItem.post-item:first-child time.blogArchiveListItem__date {
  font-size: 14px;
}
.media-posts-grp .contact-card {
  max-width: 980px;
  margin: 0 auto;
}
.blogPopular {
  margin-top: 80px;
  padding-bottom: 120px;
}
h2.blogPopular__h2 {
  text-align: center;
  position: relative;
  line-height: 1.5;
  margin-bottom: 30px;
  font-family: "Noto Sans Japanese", sans-serif;
  letter-spacing: 0;
}
h2.blogPopular__h2 span {
  display: inline-block;
  background-color: #fff;
  color: #0081cc;
  font-weight: bold;
  font-size: 24px;
  padding-left: 10px;
  padding-right: 10px;
  font-family: "Noto Sans Japanese", sans-serif;
  line-height: 1.5;
}
.blogPopular__h2 span:before {
  content: "";
  display: inline-block;
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_crown.png') no-repeat center;
    background-size: contain;
    width: 25px;
    height: 20px;
    margin-right: 14px;
    }
.blogPopular__h2 span:after {
  content: "";
  display: inline-block;
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_crown.png') no-repeat center;
    background-size: contain;
    width: 25px;
    height: 20px;
    margin-left: 14px;
    }
.blogPopular__h2:after {
  width: 100%;
  height: 1px;
  content: "";
  background-color: #0081cc;
  position: absolute;
  top: 50%;
  left: 0px;
  z-index: -1;
}
.blogArchiveList {
  display: flex;
  flex-wrap: wrap;
  margin-left: -22px;
  margin-bottom: -20px;
}
.blogRecent {
  margin-top: 80px;
}
.blogRecent__h2 {
  text-align: center;
  position: relative;
  line-height: 1.5;
  margin-bottom: 30px;
  font-family: "Noto Sans Japanese", sans-serif;
  letter-spacing: 0;
}
.blogRecent__h2 span {
  display: inline-block;
  background-color: #fff;
  color: #0081cc;
  font-weight: bold;
  font-size: 24px;
  padding-left: 10px;
  padding-right: 10px;
}
.blogRecent__h2 span:before {
  content: "";
  display: inline-block;
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_flag.png') no-repeat center;
    background-size: contain;
    width: 20px;
    height: 22px;
    margin-right: 14px;
    }
.blogRecent__h2 span:after {
  content: "";
  display: inline-block;
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_flag.png') no-repeat center;
    background-size: contain;
    width: 20px;
    height: 22px;
    margin-left: 14px;
    }
.blogRecent__h2:after {
  width: 100%;
  height: 1px;
  content: "";
  background-color: #0081cc;
  position: absolute;
  top: 50%;
  left: 0px;
  z-index: -1;
}
.blog-sidebar-inner {
  padding-left: 20px;
  border-left: 2px solid #0081cc;
  margin-bottom: 20px;
  padding-bottom: 30px;
}
.blog-sidebar h3 {
  font-size: 14px;
  padding-bottom: 10px;
  margin-bottom: 30px;
  font-weight: bold;
  line-height: 1.5;
  border-bottom: 1px solid #cccccc;
  color: #040000;
  font-family: "Noto Sans Japanese", sans-serif;
}
.blog-side-menu .submenu.level-1>li {
  display: block;
}
.blog-side-menu .submenu.level-1>li a {
  color: #040000;
  text-decoration: none;
  white-space: normal;
}
.blog-side-menu .submenu.level-1>li {
  margin-bottom: 16px;
}
.blog-side-menu .submenu.level-1>li a:hover,
.blog-sidebar-topic-filter ul li a:hover,
.blog-sidebar-post-listing ul li a:hover{
  color: #0081cc;
}
.blog-side-menu {
  margin-bottom: 50px;
}
.blog-sidebar-topic-filter {
  margin-bottom: 50px;
}
.blog-sidebar-post-listing {
  margin-bottom: 50px;
}
.blog-side-menu .submenu.level-1>li:last-child {
  margin-bottom: 0;
}
.blog-sidebar-topic-filter ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.blog-sidebar-topic-filter ul li {
  display: inline-block;
  border: 1px solid #cccccc;
  border-radius: 3px;
  margin-left: 5px;
  margin-bottom: 5px;
}
.blog-sidebar-topic-filter ul li a {
  display: block;
  padding: 7px 8px 7px 20px;
  text-decoration: none;
  position: relative;
  font-family: "Noto Sans Japanese", sans-serif;
  color: #040000;
  line-height: 1.5;
  font-size: 12px;
}
.blog-sidebar-topic-filter ul li a span.filter-link-count {
  display: none;
}
.blog-sidebar-topic-filter ul li a:before {
  width: 13px;
  height: 13px;
  content: "";
  display: inline-block;
  position: absolute;
  top: 9px;
  left: 4px;
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_tag.png') no-repeat center;
    background-size: contain;
    }
.blog-sidebar-post-listing ul {
  margin: 0;
  padding: 0 0 0 0px;
  list-style: none;
  color: #fff;
  font-size: 14px;
  counter-reset: section;
}
.blog-sidebar-post-listing ul li {
  margin-bottom: 17px;
  font-size: 14px;
  padding-left: 0;
  position: relative;

  color: #040000;
}
.blog-sidebar-post-listing ul li a {
  text-decoration: none;
  display: inline-block;
  text-decoration: none;
  color: inherit;
  width: calc(100% - 28px);
  padding-top: 1px;
}
.blog-sidebar-post-listing ul li:before{
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_rank.png') no-repeat left top;
    background-size: contain;
    display: inline-block;
    width: 28px;
    background-size: 18px 20px;
    color: #fff;
    padding-top: 3px;
    padding-left: 5px;
    font-size: 12px;
    vertical-align: top;
    counter-increment: section;
    content: counter(section);
    float: left;
    }
.media-posts-grp .row-fluid:before,.media-posts-grp .row-fluid:after {
  content: none;
}
.media-posts-grp .contact-card .homeContactRow {
  padding-bottom: 24px;
}

.blogArchiveListItem.post-item:first-child .blogArchiveListItem__inner {
  padding: 20px 28px 0;
  height: 117px;
}
.media-post-banner .banner-content {
  padding-top: 24px;
}
.media-posts-pg-grp {
  padding-top: 80px;
  margin-bottom: 100px;
  padding-left: 15px;
  padding-right: 15px;
}

.blogSingleWrapper {
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

.post-left-sec {
  width: 760px;
}
.blogSingleTagArea {
  margin-bottom: 25px;
}

p.blogSingleTagArea__category {
  background-color: #0081cc;
  color: #fff;
  padding: 5px 10px;
  font-size: 11px;
  line-height: 1.5;
  margin: 0;
}

.blogSingleTagArea__tagList {
  border: 1px solid #cccccc;
  padding: 5px 10px;
}

.blogSingleTagArea h3 {
  display: none;
}

.blogSingleTagArea ul {
  margin: 0;
  line-height: 1.5;
  padding: 0;
}

.blogSingleTagArea ul li {
  display: inline-block;
  margin-right: 13px;
  padding-left: 1.2em;
  position: relative;
  font-size: 14px;
  vertical-align: top;
}

.blogSingleTagArea ul li a {
  text-decoration: none;
  color: inherit;
}

.blogSingleTagArea ul li span.filter-link-count {
  display: none;
}

.blogSingleTagArea ul li:before {
  display: inline-block;
  content: "";
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_tag.png') no-repeat center;
    background-size: contain;
    position: absolute;
    top: 3px;
    left: 0px;
    width: 13px;
    height: 13px;
    }
.blogSingleTagArea ul li a:hover{
  color: #0081cc;
}

.blogRelation {
  margin-top: 80px;
}
.blogRelation__h2 {
  text-align: center;
  position: relative;
  margin-bottom: 30px;
  line-height: 1.2;
  letter-spacing: 0;
}
.blogRelation__h2 span {
  display: inline-block;
  background-color: #fff;
  color: #0081cc;
  font-weight: bold;
  font-size: 24px;
  padding-left: 10px;
  padding-right: 10px;
}
.blogRelation__h2:after {
  width: 100%;
  height: 1px;
  content: "";
  background-color: #0081cc;
  position: absolute;
  top: 50%;
  left: 0px;
  z-index: -1;
}
.blogRelation__h2 span:before {
  content: "";
  display: inline-block;
  background:url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_relation.png') no-repeat center;
    background-size: contain;
    width: 22px;
    height: 22px;
    margin-right: 14px;
    }
.blogRelation__h2 span:after {
  content: "";
  display: inline-block;
  background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_relation.png') no-repeat center;
    background-size: contain;
    width: 22px;
    height: 22px;
    margin-left: 14px;
    }

.blogArchiveList_middle {
  margin-left: -20px;
}
.media-posts-pg-grp .contact-card .homeContactRow {
  padding-bottom: 44px;
}
a.filter-expand-link {
  display: none;
}
.topic-page .media-categories ul li:first-child>a {
  color: #fff;
  background-color: #0081cc;
}

.topic-page .media-categories ul li:first-child>a:hover {
  background-color: #fff;
  color: #0081cc;
}
.blogTagNav__right ul li.active a {
  color: #0081cc;
} 
.blogSingle__DateArea {
  display: flex;
  justify-content: space-between;
  margin-bottom: 25px;
}

time.blogSingle__date {
  font-size: 14px;
  color: #040000;
  position: relative;
  top: -1px;
}
.blog-side-menu .submenu.level-1>li:first-child {
  display: none;
}
.blog-pagination.span12 {
  padding-top: 50px;
}
.comment-date {
  display: block !important;
}
.news-blog-post__body .marker13,
.media-blog-post__body .marker13{
  background: linear-gradient(transparent 20%, #ffc1e0 20%);
  font-weight: bold;
  border-radius: 6px;
}
.news-blog-post__body h3,
.media-blog-post__body h3{
  padding: 13px 20px;
  font-size: 20px;
  font-weight: bold;
  background-color: #f2f2f2;
  border-top: 3px solid #0081cc;
  margin-bottom: 30px;
  margin-top: 60px;
  color: #040000;
  line-height: 1.5;
  font-family: "Noto Sans Japanese", sans-serif;
}
.news-blog-post__body a,
.media-blog-post__body a{
  color: #0000EE;
  text-decoration: underline;
}
.news-blog-post__body h4,
.media-blog-post__body h4{
  margin-top: 40px;
  margin-bottom: 15px;
  padding-left: 8px;
  border-left: 6px solid #0081cc;
  font-size: 18px;
  font-weight: bold;
  font-family: "Noto Sans Japanese", sans-serif;
  color: #040000;
  line-height: 1.5;
}
.cst-feature-image-grp img {
  width: 100%;
}
.cst-feature-image-grp {
  width: 100%;
  height: 468px;
  position: relative;
}

.cst-feature-image-grp img {
  width: 100%;
  vertical-align: middle;
  object-fit: cover;
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  height: 100%;
}
.simple-menu-grp {
  margin-bottom: 80px;
  padding: 24px 30px 22px;
  background: url(//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/ptn_blue.png);
}
.simple-menu-grp .hs-menu-wrapper ul {
  margin: 0;
  display: block!important;
  padding: 0;
  list-style: none;
  margin-bottom: -5px;
}
.simple-menu-grp .hs-menu-wrapper ul li a:after {
  content: "";
  background: url(//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/arrow_down_pink.png) no-repeat center;
  background-size: contain;
  width: 12px;
  height: 10px;
  display: inline-block;
  transition: .2s;
  margin-left: 5px;
}
.simple-menu-grp .hs-menu-wrapper ul li a {
  color: #0081cc;
  font-weight: bold;
  text-decoration: none;
  transition: .2s;
  font-size: 14px;
  padding: 0;
}
.simple-menu-grp .hs-menu-wrapper ul li {
  margin-bottom: 5px;
  line-height: 24px;
}
.simple-menu-grp .hs-menu-wrapper ul li a:hover {
  opacity: 0.8;
}
.simple-menu-grp .hs-menu-wrapper ul li a:hover:after {
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
}
.media-blog-post__body {
  color: #000;
}
.newsSingle__img img {
  vertical-align: middle;
}
.newsSingle__img {
  margin-bottom: 25px;
}
.newsSingle__img {
  margin-bottom: 25px;
}
.newsSingle__text *:last-child {
  margin: 0;
}
.newsSingle__text {
  line-height: 2;
  margin-bottom: 30px;
}
img.wp-smiley, img.emoji {
  display: inline !important;
  border: none !important;
  box-shadow: none !important;
  height: 1em !important;
  width: 1em !important;
  margin: 0 .07em !important;
  vertical-align: -0.1em !important;
  background: none !important;
  padding: 0 !important;
}
.newsSingle__rows.newsSingle__rows_imgRight {
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
}
.newsSingle__rows.newsSingle__rows_imgRight .newsSingle__text.text {
  width: 612px;
  line-height: 2;
}
.homeContactRow__large {
  font-size: 20px;
  font-weight: bold;
}
body.remove-menu .simple-menu-grp {
  display: none;
}
.newsSingle__rows.newsSingle__rows_imgRight .img {
  width: 320px;
  margin-left: 20px;
}
..newsSingle__rows.newsSingle__rows_imgLeft {
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
  flex-direction: row-reverse;
}
.newsSingle__rows.newsSingle__rows_imgLeft .newsSingle__text.text {
  width: 612px;
  line-height: 2;
}
.newsSingle__rows.newsSingle__rows_imgLeft .img {
  margin-left: 0px;
  margin-right: 20px;
  width: 320px;
}
@media only screen and (min-width: 1714px){
  .blogArchiveListItem.post-item:nth-child(5) {
    position: absolute;
    right: 504px;
    top: 284px;
  }
  .blogArchiveListItem.post-item:nth-child(6) {
    position: absolute;
    right: 252px;
    top: 284px;
  }
  .blogArchiveListItem.post-item:nth-child(7) {
    position: absolute;
    right: 0px;
    top: 284px;
  }

}


@media only screen and (max-width: 1713px) and (min-width: 1462px){
  .media-posts-grp .content-wrapper {
    max-width: 1462px;
  }
  .blogArchiveListItem.post-item:nth-child(4) {
    position: absolute;
    right: 252px;
    top: 284px;
  }
  .blogArchiveListItem.post-item:nth-child(5){
    position: absolute;
    right: 0;
    top: 284px;
  }
  .media-posts-wrap {
    width: 1238px;
  }




} 


@media only screen and (max-width: 1461px) and (min-width: 1210px){
  .media-posts-grp .content-wrapper {
    max-width: 1210px;
  }
  .media-posts-wrap {
    width: 986px;
  }
  .blogArchiveListItem.post-item:nth-child(2){
    position: absolute;
    right: 0;
    top: 284px;
  }

}


@media only screen and (max-width: 1209px){
  .media-posts-grp .content-wrapper {
    max-width: 958px;
  }
  .media-posts-wrap  {
    width: 734px;
  }
}


@media (max-width: 1024px){
  .post-left-sec {
    width: calc(100% - 220px);
  }
}

@media (max-width: 980px){
  .worksSingleDesc__left img {
    max-width: 100%;
  }
  .worksSingleDesc__left {
    max-width: 365px;
    padding-right: 20px;
  }
  .media-posts-grp .contact-card {
    max-width: 330px;
  } 
  .media-posts-wrap {
    width: calc(100% - 220px);
  }
  .blogArchiveListItem.post-item {
    width: 29.7%;
  }
  p.blogArchiveListItem__title {
    width: 100%;
  }

  .title-wrap {
    width: 100%;
  }
  .media-posts-grp {
    overflow: hidden;
  }

}

@media (max-width: 850px){
  .blogArchiveListItem.post-item {
    width: 45.8%;
  }
}
@media (max-width: 767px){
  .blogArchiveListItem.post-item:first-child {
    width: 100%;
    margin-bottom: 2vw;
    margin-left: 0;
  }

  .blogArchiveListGrid {
    margin-left: 0;
    justify-content: space-between;
    padding-left: 25px;
    padding-right: 25px;
  }
  .media-posts-wrap {
    width: 100%;
  }
  .media-posts-grp {
    padding-left: 0;
    margin-right: 0;
    padding-right: 0;
  } 
  h2.blogRecent__h2,h2.blogPopular__h2 {
    margin-left: 25px;
    margin-right: 25px;
  }
  .blogRecent__h2 span,h2.blogPopular__h2 span {
    font-size: 21px;
  }
  .blogArchiveList {
    justify-content: space-between;
    margin-left: 0;
    padding-left: 25px;
    padding-right: 25px;
  }
  .blogArchiveListItem {
    width: 49%;
    margin-bottom: 2vw;
    margin-left: 0;
  }
  .blog-sidebar {
    width: 100%;
    margin-top: 60px;
    padding-left: 25px;
    padding-right: 25px;
  }
  .blogPopular {
    padding-bottom: 0;
  }

  .blogArchiveListItem.post-item {
    width: 49%;
    margin-bottom: 2vw; 
    margin-left: 0;
    position: static !important;
  }
  .blogArchiveListItem.post-item:first-child .blogArchiveListItem__inner {
    height: auto;
    padding: 15px 20px;
  }
  .blogArchiveListItem.post-item:first-child p.blogArchiveListItem__title {
    font-size: 19px;
  }
  .blogArchiveListItem.post-item:first-child time.blogArchiveListItem__date {
    font-size: 12px;
  }
  p.blogArchiveListItem__title {
    font-size: 13px;
    width: 100%;
    height: 38px;
  }
  .title-wrap {
    width: 89%;
  }
  time.blogArchiveListItem__date {
    font-size: 9px;
  }
  .blogSingleWrapper {
    display: block;
  }

  .post-left-sec {
    width: 100%;
    padding-left: 25px;
    padding-right: 25px;
  }

  .media-posts-pg-grp {
    padding-top: 40px;
    padding-left: 0;
    padding-right: 0;
  }
  .media-posts-pg-grp .news-post-pagination {
    margin-top: 75px;
  }



}


@media (max-width: 750px){
  .banner-area-mdl.blog-banner .breadcrumbs,
  .media-banner .breadcrumbs{
    display: none;
  }
  .banner-area-mdl.blog-banner {
    min-height: 150px;
    padding-top: 35px;
    padding-left: 25px;
    background-position: right center;
    text-align: left;
  }
  .banner-area-mdl.blog-banner .banner-content h1 {
    font-size: 15px;
  }
  .banner-area-mdl.blog-banner .banner-content h1 span {
    font-size: 36px; 
  }
  .banner-area-mdl.blog-banner .desktop-banner{
    display: none;
  }
  .banner-area-mdl.blog-banner.mobile-banner{
    display: block;
  }   
  .news-posts-wrap,
  .case-posts-wrap{
    padding-top: 40px;
    padding-left: 25px;
    padding-right: 25px;
  }
  .custom-categories {
    margin-bottom: 47px;
  }
  .news-post-item a {
    flex-wrap: wrap;
  }
  p.news-post-item__text {
    width: 100%;
    margin-top: 10px;
  }
  .news-post-grp {
    margin-bottom: 60px;
  } 
  .banner-area-mdl.blog-banner {
    background: none !important;
  }
  .blog-banner-mobile-img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-position: right center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    z-index: -1;
  }
  .newsSingle__tag {
    font-size: 12px;
    margin-bottom: 15px;
    line-height: 20px;
    padding: 0 9px;
  }
  h1.news-blog-post__title {
    font-size: 28px;
    margin-bottom: 10px;
  }
  time.newsSingle__date {
    font-size: 14px;
  }
  .news-blog-post__body img {
    margin-bottom: 60px;
  }
  .news-blog-post__body h2,
  .case-blog-post__body h2,
  .media-blog-post__body h2{
    font-size: 21px;
  }
  .news-blog-post__body,
  .case-blog-post__body,
  .media-blog-post__body{
    font-size: 14px;
  }
  .news-post-pagination {
    padding-bottom: 57px;
  }
  .news-blog-post__body h3,
  .media-blog-post__body h3{
    padding: 10px 20px;
    font-size: 17px;
    margin-bottom: 25px;
  }
  .news-blog-post__body h4,
  .media-blog-post__body h4{
    font-size: 16px;
  }
  .newsTagScroll {
    margin-top: 10px;
    display: block;
    background: url('//digima.cocoo.co.jp/hubfs/raw_assets/public/ItInfra_2021/images/icon_scroll.png') no-repeat right center;
      height: 12px;
      background-size: contain;
      }
  .news-post-grp {
    margin-top: 30px;
  }
  h1.worksSingle__title {
    font-size: 28px;
    line-height: 1.5;
    margin-bottom: 10px;
  }
  .worksSingle__tag span {
    font-size: 14px;
    padding: 6px 10px;
    margin-bottom: 10px;
  }
  .worksSingleDesc__left {
    width: 100%;
    padding-right: 0;
    margin-bottom: 25px;
  }
  .worksSingleDesc__right {
    width: 100%;
  }
  .worksSingleDesc {
    flex-direction: column;
    margin-bottom: 25px;
  }
  .worksSingleDesc__client{
    font-size: 14px;
  }
  .worksSingleDesc__excerpt p{
    font-size: 16px;
    padding-top: 10px;
    margin-bottom: 10px;
    line-height: 1.75;
  }
  .post-three-col>ul {
    flex-direction: column;
    margin: 0 0 50px;
  }
  .post-three-col>ul>li {
    margin-bottom: 10px;
    padding: 20px;
  }
  .worksSingleDesc__left img {
    max-width: 353px;
  } 
  time.worksSingle__date {
    margin-bottom: 10px;
  }
  .case-post-pg-wrap {
    padding-top: 39px;
    padding-left: 25px;
    padding-right: 25px;
  }
  .case-blog-post__body {
    margin-bottom: 54px;
  }
  .case-posts-wrap .custom-categories {
    margin-bottom: 22px;
  }
  .works-posts-grp {
    margin-top: 30px;
    margin-bottom: 60px;
  }
  .case-post__tags span{
    max-width: 50%;
    padding: 6px 10px;
    margin-bottom: 10px;
  }
  p.worksListArchiveItem__title {
    font-size: 17px;
    line-height: 1.5;
    margin-bottom: 10px;
  }
  time.worksListArchiveItem__date {
    margin-bottom: 18px;
    font-size: 13px;
    text-align: left;
  }
  .listing-summary {
    font-size: 13px;
  }
  .works-post-item a {
    display: block;
  }
  .worksListArchiveItem__left {
    margin-bottom: 15px;
  }
  .worksListArchiveItem__right {
    width: 100%;
  }

  .media-categories {
    overflow-y: hidden;
    overflow-x: auto;
    padding-left: 25px;
    padding-right: 25px;
  } 
  .blogTagNav {
    margin: 20px 25px 30px;
    display: block;
  }
  .media-banner {
    min-height: 180px;
    padding-top: 60px;
    margin-top: 0;
    background: none !important;
  }
  .media-banner .banner-content h1 {
    width: 170px;
    font-size: 24px;
    padding: 13px 0;
  }
  .media-banner .banner-content h1 span {
    font-size: 10px;
    top: -5px;
  }
  .media-banner .blog-banner-mobile-img {
    background-position: center;
  }
  .media-posts-grp {
    padding-top: 40px;
  }
  .media-posts-grp {
    padding-top: 40px;
  }
  .media-categories {
    margin-bottom: 8px;
  }
  .custom-categories ul li {
    margin-bottom: 10px;
  }
  .media-posts-grp .newsTagScroll {
    margin-right: 25px;
  }
  .blogTagNav__left {
    font-size: 13px;
    display: inline;
    vertical-align: top;
  } 
  h2.blog-post__title {
    font-size: 24px;
    margin-bottom: 16px;
  }
  .blogSingleTagArea__tagList {
    padding: 4px 10px 6px;
  }
  .blogSingleTagArea ul {
    margin: 0;
    line-height: 22px;
    padding: 0;
  }
  .blogSingleTagArea ul li {
    font-size: 11px;
    padding-left: 1.5em;
    vertical-align: middle;
  }
  time.blogSingle__date {
    font-size: 12px;
  }
  .cst-feature-image-grp {
    height: auto;
  }
  .cst-feature-image-grp img {
    position: static;
    height: auto;
  }
  .simple-menu-grp {
    padding: 20px;
    margin-bottom: 60px;
  }
  .simple-menu-grp .hs-menu-wrapper ul li {
    line-height: 18px;
  }
  .simple-menu-grp .hs-menu-wrapper ul li a {
    font-size: 12px;
    display: block;
    padding-right: 1.5em;
    position: relative;
  }
  .simple-menu-grp .hs-menu-wrapper ul li a:after {
    position: absolute;
    top: 6px;
    right: 0px;
  }
  .blogRelation {
    margin-top: 60px;
  }
  .newsSingle__rows {
    flex-direction: column;
  }
  .newsSingle__rows.newsSingle__rows_imgRight .newsSingle__text.text {
    width: 100%;
    margin-bottom: 25px;
  }
  .newsSingle__rows.newsSingle__rows_imgRight .img {
    width: 100%;
    margin-left: 0;
  }
}

.case-posts-wrap .contact-grp,
.case-post-pg-wrap .contact-grp,
.news-posts-wrap .contact-grp {
  padding-bottom: 80px;
}


/* 20221110 ボタンCSS追加 */

.it-blog-cta-button {
    width: 50%;
    text-align:center;
    font-weight:bold;
    padding: 8px 5px 8px 18px;
    margin:10px auto 5px auto;
    background: #cc0000;
    border-radius: 100vh;
    font-size:22px;
    text-decoration: none  !important;
    color:#ffffff;
}

.it-blog-cta-button a {
    display: block;
    text-decoration: none  !important;
  　color:#ffffff;
    margin:0;
    padding:0;
}

.it-blog-cta-arrow {
    display: inline-block;
    margin: 0px 0px 0px 24px;
    vertical-align: -12px;
    fill: #FFFFFF;
}

@media screen and (max-width: 540px) {
.it-blog-cta-button {
    width: 100%;
    display: inline-block;
    padding: 8px 24px 6px 32px;
    margin:10px auto;
    font-size: 20px;
    font-weight: bold;
    background: #cc0000;
    border-radius: 100vh;
}

.it-blog-cta-arrow {
    display: inline-block;
    margin: 0px 0px 0px 15px;
}
}



/* 2024年ブログ記事の装飾変更 */
.blogSingleTagArea__tagList__2024 {
  border: none;
  padding: 0;
}

.blogSingleTagArea__2024 ul li {
  display: inline-block;
  margin-right: 0;
  padding: 0;
  position: relative;
  font-size: 15px;
  vertical-align: top; 
}

.blogSingleTagArea__2024 ul li:before {
  display: none;
}

.blogSingleTagArea__2024 ul li:nth-child(n+2) {
  margin-left: 10px;
}

.blogSingleTagArea__2024 ul li a {
  text-decoration: none;
  color: #0081CC;
  border: 1px solid #0081CC;
  padding: 5px 29px;
  line-height: 1.4;
}

.media-blog-post__body__2024 h2 {
  padding: 13px 20px;
  font-size: 20px;
  font-weight: bold;
  background-color: #f2f2f2;
  border-top: 7px solid #0081CC;
  margin-bottom: 30px;
  margin-top: 60px;
  color: #040000;
  line-height: 1.5;
  font-family: "Noto Sans Japanese", sans-serif;
}
@media screen and (max-width: 767px) {
  .media-blog-post__body__2024 h2 {
    font-size: 18px;
  }
}


.media-blog-post__body__2024 h2::before,
.media-blog-post__body__2024 h2::after {
  display: none;
}

.media-blog-post__body__2024 h3 {
  background-color: transparent;
  border-top: 2px solid #0081CC;
  border-bottom: 2px solid #0081CC;
  font-size: 18px;
  color: #0081CC;
}

@media screen and (max-width: 767px) {
  .media-blog-post__body__2024 h3 {
    font-size: 16px;
  }
}

.media-blog-post__body__2024 .background-text {
  padding: 31px 37px;
  background-color: rgba(200, 228, 245, 0.48);
}

.media-blog-post__body__2024 .background-text p {
  margin: 0;
}

.cmn02_cta-footer {
  max-width: 1272px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .cmn02_cta-footer {
    padding-left: 25px;
    padding-right: 25px;
  }
}

.cmn02_cta-footer .cta-footer .desc h5{
  font-size: 22px !important;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .cmn02_cta-footer .cta-footer .desc h5{
    font-size: 15px !important;
  }
}

.cmn02_cta-footer .cta-footer .desc p{
  font-size: 17px !important;
}

@media screen and (max-width: 767px) {
  .cmn02_cta-footer .cta-footer .desc p{
    font-size: 12px !important;
  }
}

.cmn02_cta-footer .footer-button{
  font-size: 20px !important;
}

@media screen and (max-width: 1000px) {
  .cmn02_cta-footer .footer-button{
    font-size: 16px !important;
  }
}
@media screen and (max-width: 767px) {
  .cmn02_cta-footer .footer-button{
    font-size: 14px !important;
  }
}/*======================================================================
 * 導入事例
======================================================================*/
.post-three-col li {
  line-height: 1.5;
}

.case-blog-post__body h2 {
  background: #f2f2f2;
  font-size: 20px;
  font-weight: 700;
  padding: 13px 20px;
}
.case-blog-post__body h2::before {
  background: #464646;
}
.case-blog-post__body h3 {
  border-left: 6px solid #464646;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 15px;
  margin-top: 40px;
  padding-left: 8px;
}
.case-blog-post__body .ff-hancode {
  font-family: "HanCode";
}
.case-blog-post__body p {
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  .case-blog-post__body p {
    font-size: 1.2rem;
  }
}
.case-blog-post__body a {
  text-decoration: none;
  color: #464646;
  position: relative;
  padding-left: calc(18px + 0.5em);
}
.case-blog-post__body a::before {
  content: "";
  display: inline-block;
  background-image: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/common/link_icon.svg");
  background-repeat: no-repeat;
  background-size: contain;
  width: 18px;
  height: 14px;
  margin-right: 0.5em;
  position: absolute;
  top: 61%;
  left: 0;
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .case-blog-post__body a::before {
    width: 12px;
    height: 12px;
  }
}
.case-blog-post__body .pc-non,
.case-blog-post__body .post-cta-box {
  display: none;
}
.case-blog-post__body .m-profile {
  border-color: #E45557;
}

/*======================================================================
 * ブログ記事レイアウト
======================================================================*/
td, th {
  border-width: 1px;
}

.title-section {
  margin-top: 106px;
  max-width: 1124px;
}
@media screen and (max-width: 1000px) {
  .title-section {
    margin-top: 22px;
  }
}
.title-section .tag-list {
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
@media screen and (max-width: 768px) {
  .title-section .tag-list {
    gap: 5px;
  }
}
.title-section .tag-list a {
  text-decoration: none;
  color: #fff;
  padding: 4px 9px 4px 12px;
  background-color: #464646;
}
@media screen and (max-width: 768px) {
  .title-section .tag-list a {
    font-size: 1rem;
    padding: 5px 8px;
    display: block;
  }
}
.title-section h1 {
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.0015em;
  color: #464646;
  margin-top: 20px;
  margin-bottom: 72px;
}
@media screen and (max-width: 1000px) {
  .title-section h1 {
    margin-top: 6px;
    margin-bottom: 21px;
  }
}
@media screen and (max-width: 768px) {
  .title-section h1 {
    font-size: 1.8rem;
    line-height: 1.38;
  }
}

.col1-container {
  display: flex;
  justify-content: space-between;
  margin-bottom: 100px;
  max-width: 1124px;
}
.col1-container .post-content .main-content {
  width: 100%;
}
.col1-container .featured-image {
  margin-bottom: 65px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .col1-container .featured-image {
    width: 100%;
    margin-bottom: 16px;
  }
}
.col1-container .featured-image img {
  max-width: 800px;
  width: 100%;
  height: 515px;
  object-position: top;
}
@media screen and (max-width: 768px) {
  .col1-container .featured-image img {
    height: 297px;
  }
}
@media screen and (max-width: 490px) {
  .col1-container .featured-image img {
    height: 187px;
  }
}
.col1-container .post-body p {
  font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
  .col1-container .post-body p {
    font-size: 1.2rem;
  }
}
.col1-container .post-body::after {
  content: " ";
  display: table;
  clear: both;
}
@media screen and (max-width: 768px) {
  .col1-container .post-body table td {
    display: block !important;
    width: 100% !important;
  }
}
@media screen and (max-width: 768px) {
  .col1-container {
    display: block;
  }
  .col1-container .post-container-wrap {
    width: 100%;
  }
}

/*======================================================================
 * ニュース記事レイアウト
======================================================================*/
.news-posts-container .news-posts-wrap {
  max-width: 1110px;
  margin-right: auto;
  margin-left: auto;
  padding: 106px 0 0;
}
@media screen and (max-width: 1280px) {
  .news-posts-container .news-posts-wrap {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap {
    padding-top: 29px;
    margin-bottom: 18px;
  }
}
.news-posts-container .news-posts-wrap .title-section {
  margin-top: 0;
  margin-bottom: 61px;
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .title-section {
    margin-bottom: 26px;
  }
}
.news-posts-container .news-posts-wrap .tag-list li {
  color: #fff;
  padding: 4px 12px;
  background-color: #464646;
  font-size: 1.7rem;
  line-height: 1.47;
  letter-spacing: 0.0015em;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .tag-list li {
    font-size: 1rem;
    padding: 3px 12px;
    display: block;
    color: rgba(255, 255, 255, 0.8);
  }
}
.news-posts-container .news-posts-wrap .news-title {
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.0015em;
  margin-top: 20px;
  margin-bottom: 0;
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .news-title {
    font-size: 1.6rem;
    line-height: 1.56;
    margin-top: 22px;
  }
}
.news-posts-container .news-posts-wrap .news-blog-post__body h2,
.news-posts-container .news-posts-wrap .news-blog-post__body h3 {
  background: transparent;
  border: none;
  font-size: 3.6rem;
  font-weight: 400;
  line-height: 1.44;
  padding: 0 0 16px;
  position: relative;
  margin-bottom: 38px;
  color: #343434;
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .news-blog-post__body h2,
  .news-posts-container .news-posts-wrap .news-blog-post__body h3 {
    margin-bottom: 20px;
    padding: 0 0 8px;
    font-weight: 500;
    font-size: 1.4rem;
  }
}
.news-posts-container .news-posts-wrap .news-blog-post__body h2::before,
.news-posts-container .news-posts-wrap .news-blog-post__body h3::before {
  content: "";
  display: block;
  max-width: 153px;
  width: 30%;
  height: 5px;
  background: #464646;
  position: absolute;
  top: auto;
  bottom: 0;
  left: 0;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .news-blog-post__body h2::before,
  .news-posts-container .news-posts-wrap .news-blog-post__body h3::before {
    max-width: 36px;
    background: #000;
    height: 1px;
  }
}
.news-posts-container .news-posts-wrap .news-blog-post__body h2::after,
.news-posts-container .news-posts-wrap .news-blog-post__body h3::after {
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  background-color: #000;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .news-blog-post__body h2::after,
  .news-posts-container .news-posts-wrap .news-blog-post__body h3::after {
    height: 1px;
  }
}
.news-posts-container .news-posts-wrap .news-blog-post__body h3 {
  font-weight: 400;
}
.news-posts-container .news-posts-wrap .news-blog-post__body h4 {
  border-color: #464646;
}
.news-posts-container .news-posts-wrap .news-blog-post__body .ff-hancode {
  font-family: "HanCode";
}
.news-posts-container .news-posts-wrap .news-blog-post__body p {
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .news-blog-post__body p {
    font-size: 1.2rem;
  }
}
.news-posts-container .news-posts-wrap .news-blog-post__body a.link-icon {
  text-decoration: none;
  color: #464646;
  position: relative;
  padding-left: calc(18px + 0.5em);
}
.news-posts-container .news-posts-wrap .news-blog-post__body a.link-icon::before {
  content: "";
  display: inline-block;
  background-image: url("https://exceljoshi.cocoo.co.jp/hubfs/excel_joshi/images/common/link_icon.svg");
  background-repeat: no-repeat;
  background-size: contain;
  width: 18px;
  height: 14px;
  margin-right: 0.5em;
  position: absolute;
  top: 61%;
  left: 0;
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .news-posts-container .news-posts-wrap .news-blog-post__body a.link-icon::before {
    width: 12px;
    height: 12px;
  }
}
.news-posts-container .news-posts-wrap .news-blog-post__body .pc-non,
.news-posts-container .news-posts-wrap .news-blog-post__body .post-cta-box {
  display: none;
}
.news-posts-container .news-posts-wrap .news-blog-post__body .m-profile {
  border-color: #E45557;
}@charset "UTF-8";
/*------------------------------------------------------------
 * responsive
------------------------------------------------------------*/
@media screen and (min-width: 769px) {
  /* PC/SP表示切替 */
  .u-sp-only {
    display: none;
  }
  /* href="tel:〜"の場合、PC/タブレットではリンク判定無しを前提とする */
  a[href^="tel:"] {
    display: inline-block;
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: inherit;
  }
}
@media screen and (max-width: 768px) {
  /* PC/SP表示切替 */
  .u-pc-only {
    display: none;
  }
}
/*------------------------------------------------------------
 * margin
 * カスタムモジュールの共通余白設定用
------------------------------------------------------------*/
.u-mt-none {
  margin-top: 0;
}
.u-mt-small {
  margin-top: 40px;
}
.u-mt-default {
  margin-top: 60px;
}
.u-mt-large {
  margin-top: 80px;
}

.u-mb-none {
  margin-bottom: 0;
}
.u-mb-small {
  margin-bottom: 40px;
}
.u-mb-default {
  margin-bottom: 60px;
}
.u-mb-large {
  margin-bottom: 80px;
}

/*------------------------------------------------------------
 * 画像
------------------------------------------------------------*/
.u-ofi {
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
.u-ofi.-contain {
  object-fit: contain;
  font-family: "object-fit: contain; object-position: 50% 50%;";
}

/*------------------------------------------------------------
 * サイト内共通 js class
------------------------------------------------------------*/
.-js-slide-toggle-trig, [data-tab-target], [data-tab-switch] {
  -webkit-user-select: none;
  user-select: none;
}

.u-tab-switch-target, .-js-tab-target-hide, .-js-tab-switch-hide {
  display: none;
}

.-js-tab-target-show, .-js-tab-switch-show {
  animation: fade-in 0.25s ease-out;
  display: block;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}