/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

/*************** Font descriptions are in the plugin(sugimori)   ***************/

/* 下層ページの row-main の幅を変更（TOPは除外） */
body:not(.home) .row.row-main {
  max-width:880px !important;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.section-title-normal {
    border-bottom: 1px solid #ff0000;
}
.section-title-normal span {
    border-bottom: 3px solid #ff0000;
    margin-bottom: -2px;
    margin-right: 15px;
    padding-bottom: 7.5px;
}


/* PCでは改行しない */
.br-sp { display: none; }

/* モバイルだけ改行する */
@media (max-width: 849px){
  .br-sp { display: inline; }
}

/* PCでは改行する */
.br-pc { display: inline; }

/* モバイルでは改行しない */
@media (max-width: 849px){
  .br-pc { display: none; }
}

/* statement：モバイル時のみ、内部テキストをすべて左寄せ */
@media (max-width: 849px){
  .statement,
  .statement *{
    text-align: left !important;
  }
}



/*************** TOP  ***************/

/* TOP冒頭の見出し（心を動かす、体験をつくる）：モバイル時のみ中央寄せ */
@media (max-width: 849px){
  body.home .text_top_text h1{
    text-align: center !important;
  }
}

/* 1) アイコンの色：デフォルトは黒 */
header .header-main .nav > li.nav-icon > a > i:not(.icon-angle-down) {
  color: #000000 !important;
}

/* TOP 最上部（ヘッダーが非 sticky）のときだけ白にする */
body.home header .header-wrapper:not(.stuck) .header-main .nav > li.nav-icon > a > i:not(.icon-angle-down) {
  color: #ffffff !important;
}

/* 2) 下線・枠・影を完全に無効化（li.nav-icon とその a） */
header .header-main .nav > li.nav-icon,
header .header-main .nav > li.nav-icon > a,
header .header-main .nav > li.nav-icon > a:hover,
header .header-main .nav > li.nav-icon > a:focus {
  text-decoration: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* 擬似要素で付いている下線も消す */
header .header-main .nav > li.nav-icon::before,
header .header-main .nav > li.nav-icon > a::before {
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

.statement{
    margin: 90px auto 40px auto;
    max-width:800px;
}
.statement p{
    font-weight: bold;
    font-size:1em;
    line-height: 2.5;
}
.statement h2 {
    text-align: center;
    font-weight: bold;
    font-size:2em;
    line-height: 2;
    margin-bottom: 40px;
}

.statement h3 {
    text-align: center;
    font-weight: bold;
    font-size:1.6em;
    line-height: 2;
    margin-bottom: 40px;
    margin-top: 80px;
}

.statement h4 {
    text-align: center;
    font-weight: bold;
    font-size:1.1em;
    line-height: 2;
    margin-bottom: 40px;
}

.nav>li>a {
    color:#000;
}
.header:not(.transparent) .header-nav-main.nav > li > a {
    color: #000000 !important;
}
.relative {
    text-align: center;
}
.c-button{
    margin: 0 auto 90px !important;
    display: inline-block;
}
.d-button{
    margin: 0 auto !important;
    display: inline-block;
}
.d-button span{
        font-size: .8em;
}

.e-button:hover{
    background-color: #ff0000 !important;
    border-color: #ff0000 !important;
    color: #ffffff !important;
}

.e-button:hover span{
    color: #ffffff !important;
}

/* =========================
   TOP Hero：モバイルだけ縦画像に差し替え（banner-bgを上書き）
   ========================= */
@media (max-width: 849px) {
  /* Flatsome は .banner-bg 内に <img> を出すため、モバイルでは img を消して背景画像を優先 */
  body.home .hero-banner .banner-bg img{
    display: none !important;
  }

  body.home .hero-banner .banner-bg {
    background-image: url("/wp/wp-content/uploads/2026/01/top_sp.jpg") !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
  }

  body.home .hero-banner.is-full-height {
    min-height: 100vh !important;
    height: 100vh !important;
  }
}


/* 右上 ENTRY ボタンだけ赤くする */
header .header-main .header-button > a.button.secondary.is-large {
  background-color: #ff0000 !important;
  border-color: #ff0000 !important;
  color: #ffffff !important;
}

.topcolumn p{
    color: #FFFFFF;
    text-align: left;
    margin: 10 auto;
    display: block;
    max-width: 70%;
}

.top-container {
  display: flex;
  max-width: 80%;
  margin: 0 auto;
  min-height: 50vh;
  flex-wrap: wrap;
  
}

.top-container h4{
    text-align: center;
    font-weight: normal;
    margin: 2em 0;
    font-size: 1em;
}

.top-container .left,
.top-container .right {
    flex: 1 1 50%;
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center; /* 上下中央 */
  align-items: center;     /* 左右中央 */
  min-height: 300px;       /* 高さがないと上下中央にならないので指定 */
  text-align: center;      /* テキストも中央揃え */

}

.top-container .left {
  background-color: #f2f2f2;
}

.top-container .right {
  background-color: #ffffff;
}

.col-inner {
  display: flex;
  flex-direction: column;
  justify-content: center; /* 縦方向中央 */
  align-items: center;     /* 横方向中央 */
  text-align: center;
}

/* text-left 指定時は flex 中央寄せを解除して文章を左寄せにする */
.col-inner.text-left{
  align-items: flex-start !important;
  text-align: left !important;
}

/* 子要素が内容幅で縮んで中央に見えるのを防ぐ */
.col-inner.text-left > *{
  width: 100%;
}

/* col 側に text-left が付いている場合も、内側 col-inner を左寄せにする（Flatsomeの出力に合わせる） */
.col.text-left > .col-inner{
  align-items: flex-start !important;
  text-align: left !important;
}

/* 子要素が内容幅で縮んで中央に見えるのを防ぐ */
.col.text-left > .col-inner > *{
  width: 100%;
}

 body.page-id-1209 .col-inner {
    text-align: left;
}

/* h4.h_underline：下線アニメーション（JSで .animate-underline を付与） */
.statement h4.h_underline{
  font-size: 1.7em;
  margin-bottom: 0.1rem;

  /* 下線分だけテキスト幅に合わせて中央寄せ */
  position: relative;
  width: fit-content;
  width: -moz-fit-content;
  width: max-content; /* fallback */
  margin-left: auto;
  margin-right: auto;

  padding-bottom: 0.25em; /* 下線分の余白 */
  --underline-delay: 0s; /* JSで段階的に上書き */

}

/* 初期状態：下線は見えない */
.statement h4.h_underline::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 15px !important;
  background-color: #ff0000 !important;

  transform: scaleX(0) !important;
  transform-origin: left center !important;
  transition: transform 1.6s ease-out, opacity 2s ease-out !important;
  transition-delay: var(--underline-delay) !important;
  opacity: 0 !important;
  will-change: transform, opacity;
  pointer-events: none !important;
}

/* アニメーション発火時 */
.statement h4.h_underline.animate-underline::after{
  transform: scaleX(1) !important;
  opacity: 1 !important;
}

/* モーション軽減 */
@media (prefers-reduced-motion: reduce) {
  .statement h4.h_underline::after{
    transition: none !important;
    transform: scaleX(1) !important;
  }
}

/*************** TOP GROUP image ***************/
.section.groupimage .section-content {
  padding-top: 0;
  padding-bottom: 0;
}

/* セクション内の行・カラムの左右余白をゼロに */
.section.groupimage .section-content .row {
  margin-left: 0;
  margin-right: 0;
}
.section.groupimage .section-content .row > .col {
  padding-left: 0;
  padding-right: 0;
}

/* グレー背景内で画像コンテンツを上下左右中央に配置 */
.section.groupimage .col-inner {
  min-height: 520px;
  display: flex !important;
  align-items: center !important;   /* 上下中央 */
  justify-content: center !important;/* 左右中央 */
}

.section.groupimage .col-inner .img,
.section.groupimage .col-inner .img-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* GROUPセクションの画像ブロックを左右中央寄せ（画像コンテナ幅はそのまま） */
.section.groupimage .img.has-hover {
  margin-left: auto !important;
  margin-right: auto !important;
}


.section.groupimage .col-inner img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* TOP：GROUP（3ブロック）ロゴ画像の見切れ防止（固定ボックス＋contain） */
body.home .section.groupimage .img-inner{
  overflow: visible !important; /* 万一のはみ出しを隠さない */
}

/* TOP：GROUP（3ブロック）ロゴ画像の見切れ防止（固定ボックス＋contain）
   ※大きいGROUP画像（png/jpg等）には当てない */
body.home .section.groupimage img.attachment-original,
body.home .section.groupimage img[src$=".svg"]{
  width: 220px;              /* 基準幅（必要なら調整） */
  height: 170px;             /* 基準高（必要なら調整） */
  object-fit: contain;       /* 見切れ防止 */
  object-position: center;
}

/* 大きいGROUP画像（例：attachment-large size-large）は従来どおりフル幅 */
body.home .section.groupimage img.attachment-large.size-large,
body.home .section.groupimage img.attachment-medium.size-medium,
body.home .section.groupimage img.attachment-full.size-full{
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain;
}

/* 画面が狭い場合は縮小しても見切れないように */
@media (max-width: 849px){
  body.home .section.groupimage img.attachment-original,
  body.home .section.groupimage img[src$=".svg"]{
    width: min(220px, 100%);
    height: auto;
  }
}


.button.primary.is-outline.c-button {
  padding: 5px 30px;
  margin:0 auto;
}

/* TOP下部「私たちについて」ボタン：hover時に赤 */
a.button.primary.e-button:hover,
a.button.primary.e-button:focus,
a.button.primary.is-outline.e-button:hover,
a.button.primary.is-outline.e-button:focus{
  background-color: #ff0000 !important;
  border-color: #ff0000 !important;
  color: #ffffff !important;
}

/* span に色が残るケース対策 */
a.button.primary.e-button:hover span,
a.button.primary.e-button:focus span,
a.button.primary.is-outline.e-button:hover span,
a.button.primary.is-outline.e-button:focus span{
  color: #ffffff !important;
}
.top_text {
    margin-left:0;
    margin-right:0;
}
.top_text h1{
    background-color: #ffffff;
    padding: 15px;
}

/*************** WORKING ENVIROMENT  ***************/

.kenshu p{
  margin-bottom: 5rem;
}

/* 数字で見るレキップグループ：ブロック間の薄い縦線（左線）を消す */
body.page-id-1209 .row-divided .col + .col,
body.page-id-1209 .row.divided .col + .col{
  border-left: 0 !important;
}

/* テーマ側が col-inner や疑似要素で線を出しているケースも潰す */
body.page-id-1209 .row-divided .col + .col > .col-inner,
body.page-id-1209 .row.divided .col + .col > .col-inner{
  border-left: 0 !important;
}

body.page-id-1209 .row-divided .col + .col::before,
body.page-id-1209 .row.divided .col + .col::before{
  content: none !important;
  border: 0 !important;
}

/* working-enviroment：スクロール表示アニメーション（data-animate="blurIn"）の速度調整 */
body.page-id-1209 [data-animate="blurIn"]{
  /* ここを変えると全体のテンポを調整できます */
  --we-blurin-duration: 0.3s;   
  --we-blurin-opacity-duration: 1.8s;
  --we-blurin-filter-duration: 1.0s;

  transition-duration: var(--we-blurin-duration), var(--we-blurin-filter-duration), var(--we-blurin-opacity-duration) !important;
  transition-timing-function: ease, ease, ease-in !important;
}

/* TOP（page-id-721）：スクロール表示アニメーション（data-animate="blurIn"）を 0.3s に統一 */
body.page-id-721 [data-animate="blurIn"]{
  transition-duration: 0.3s, 0.3s, 0.3s !important;
  transition-timing-function: ease, ease, ease-in !important;
}

/* オプション：遅延も揃えたい場合はここを調整（今は既定を尊重） */
/*
body.page-id-1209 [data-animate="blurIn"]{
  transition-delay: 0s, 0s, 0s !important;
}
*/

@media screen and (min-width: 850px) {
    .row-large {
        padding-left:0;
        padding-right: 0
    }

    .container .row-large:not(.row-collapse),.row .row-large:not(.row-collapse) {
        margin-bottom: 0;
        margin-left: -30px;
        margin-right: -30px
    }

    .row-large>.col,.row-large>.flickity-viewport>.flickity-slider>.col {
        margin-bottom: 0;
        padding: 0 15px 15px;
    }
}

/*************** ENTRY  ***************/

.career-container {
  display: flex;
  max-width: 80%;
  margin: 0 auto;
  flex-wrap: wrap;
  
}

.career-container h4{
    text-align: center;
    font-weight: normal;
    margin: 2em 0;
    font-size: 1em;
}

.career-container .left,
.career-container .right {
    flex: 1 1 50%;
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center; /* 上下中央 */
  align-items: center;     /* 左右中央 */
  min-height: 300px;       /* 高さがないと上下中央にならないので指定 */
  text-align: center;      /* テキストも中央揃え */

}

.career-container .left {
  background-color: #f2f2f2;
}

.career-container .right {
  background-color: #ffffff;
}

/*************** ABOUT  ***************/

.about-first-container{
    margin-bottom: 60px;
}

.about-first h2{
    text-align: center;
    font-weight: 600!important;
    font-size: 1.3em;
    margin-bottom: 50px;
}
.aboutcontainer .about-first h3{
    font-size: 1.2em;
}
.about-first h4{
    font-size: 1em;
    font-weight: 600!important;
    margin-bottom: 0px;
    line-height: 1;
}
.about-first-container.OurApproach p{
    margin-bottom: 30px;
}
.about-first-container.services p{
    margin-bottom: 30px;
}
.about-first-container.representative, .about-first-container.representative p{
    margin-bottom: 0!important;
}
.about-more {
    margin-bottom: 30px;
}

.aboutaccordion .accordion-title.active {
    background-color: rgba(0, 0, 0, 0);
    border-color: var(--fs-color-primary);
    color: var(--fs-color-primary);
    font-weight: 700;
}

.aboutaccordion h2{
     font-weight: 600!important;
    font-size: 1.3em;
    margin-bottom: 50px;
}
.abouttitle h2{
    font-size: 1.8em;
    font-weight: 600!important;
    margin: 1.8em 0;
}
.aboutcontainer{
    text-align: left;
    max-width: 800px;
    padding: 20px;
}
.aboutcontainer h3{
    font-size: 16px;
    font-weight: 600 !important;
    margin-bottom: 2em;
}
.aboutcontainer p:last-child{
    margin-bottom: 4em;
}



/*************** COMPANY  ***************/
.company-profile{
    max-width:800px;
}
.company-profile td {
    color: #000;
}
.cptitle{
    width:30%;
    font-weight: 600;
}
.company-profile th {
    font-weight: 400;
}
.cpimage{
    max-width: 800px;
}
.company-profile td, .company-profile th {
    border-bottom: 0px solid #ececec;
    font-size: 0.9em;
    line-height: 2;
    padding: 1em ;
    text-align: left;
}

/*************** Coming soon  ***************/

.comingsooncontainer{
    height: 100%;
    display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
}
.coming-soon {
      font-size: 2.5rem;
      color: #333;
    }
.center-section {
  min-height: 65vh !important; /* 画面全体の高さ */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

/*************** VISION  ***************/

.visiontext h5{
    margin-bottom: 1rem;
}

/*************** SERVICE  ***************/

/* 数字丸＋タイトルを横並びにするラッパー */
.p-workingEnvData__itemTitleWrap {
  display: inline-flex;   /* 数字ブロック＋タイトルを自然幅で保持 */
  align-items: center;
  gap: 0.8rem;
}

/* 働く環境ページではタイトルブロック自体を左寄せに配置 */
body.page-id-1209 .p-workingEnvData__itemTitleWrap {
  align-self: flex-start;    /* 親の col-inner（column flex）の中で左寄せ */
  text-align: left;
}

/* 赤い正円の中に数字 */
.p-workingEnvData__itemTitleWrap .numberp {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 50%;
  background-color: #ff0000;   /* 赤 */
  color: #ffffff;              /* 文字は白 */
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.3rem;
  line-height: 1;
}

/* タイトル部分の体裁 */
.p-workingEnvData__itemTitleWrap .p-workingEnvData__itemTitle {
  font-weight: 700;
  font-size: 1.3rem;
}

/* タイトル直下の画像ブロックを左右中央寄せ */
.p-workingEnvData__itemTitleWrap + .img {
  text-align: center;
}

/* 画像そのものを中央に配置（幅指定はそのまま生かす） */
.p-workingEnvData__itemTitleWrap + .img img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.servicecontainer h2{
    font-weight: 600 !important;
    font-size: 1.3em;
    margin-bottom: 20px;
    text-align: left;
}

.luxandpcontainer{
    margin-bottom: 1rem;
}

.luxandpcontainer h3{
    font-size: 1.2em;
    margin-bottom: 4rem;
}

.luxandpcontainer h4{
    font-size: 1.1em;
    font-weight: 600 !important;
}

.luxandpcontainer-bottom {
  display: flex;
  max-width: 80%;
  margin: 0 auto;
  min-height: 50vh;
  flex-wrap: wrap;
  
}

.luxandpcontainer-bottom h4{
    font-size: 1em;
    font-weight: 600 !important;
}

.luxandpcontainer-bottom h5{
    font-weight: 600 !important;
    margin-bottom: 1.5rem;
    
}
.luxandpcontainer-bottom ul{
    margin: 20px 0;
}
.luxandpcontainer-bottom li{
    font-size: 0.9em;
}

.btnCol{
    width: 80% !important;
}

/*************** spot ***************/
.spotcontainer h3{
    font-size: 1.1em;
    margin-bottom: 2rem;
    line-height: 2;
}


/*************** Contact ***************/
div.wpforms-container-full.contactform {
    width: 100%;
    max-width: 600px;
    text-align: left;
}

.contactform-enter{
    border-bottom:solid 1px #000 !important;
}

.contactform-btn{
    border: 2px solid #000 !important;
    cursor: pointer;
    display: block !important;
    font-size: .97em !important;
    font-weight: bolder !important;
    letter-spacing: .03em !important;
    line-height: 2.4em;
    margin-right: 1em;
    margin: 20px auto !important;
    max-width: 100%;
    min-height: 2.5em;
    padding: 5px 30px 5px 30px !important;
    position: relative;
    text-align: center;
    text-rendering: optimizeLegibility;
    transition: transform .3s, border .3s, background .3s, box-shadow .3s, opacity .3s, color .3s !important;
}

div.wpforms-container-full .wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
    background: #fff;
    border: 0px solid #fff;
    box-sizing: border-box;
}
div.wpforms-container-full .wpforms-confirmation-container-full p, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) p {
    color: #000;
    text-align: center;
}
/*************** Footer  ***************/

.footer-nav {
    margin: 20px 0 !important;
}
.footer-nav li a{
    font-weight: 600 !important;
    border: solid 2px #000;
    padding: 5px 15px;
    border-radius: 20px;
    
}

.absolute-footer {
    color: #000;
    font-size: .8em;
    padding: 10px 0 45px;
}

.absolute-footer ul.links li a {
    color: #000 !important;
}

/* 画像をブロックにフィット（画像カラムのみ） */
.section.top-company .col:not(.topcolumn_p) .col-inner {
  height: 100%;
}
.section.top-company .col:not(.topcolumn_p) .col-inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* TOP：GROUP（3ブロック）のロゴ（.ux-logo.top_threelogo）は見切れ防止のため固定サイズ＋contain */
.section.top-company .ux-logo.top_threelogo img.ux-logo-image{
  width: 220px !important;        /* 基準幅（必要なら調整） */
  height: 105px !important;       /* 基準高（スクショの inline height に合わせる） */
  max-width: 100% !important;     /* 画面が狭い時は縮む */
  object-fit: contain !important; /* cover を上書きして見切れ回避 */
  object-position: center !important;
}

/* さらに安全策：ロゴ枠も伸縮させつつ、高さは確保 */
.section.top-company .ux-logo.top_threelogo{
  width: 100% !important;
  max-width: 220px;               /* 画像基準幅に合わせる */
  margin-left: auto;
  margin-right: auto;
}

/* 画像カラムだけ画像フィット（テキストカラム .topcolumn には当てない） */
.section.top-company .col:not(.topcolumn) .col-inner {
  height: 100%;
}
.section.top-company .col:not(.topcolumn) .col-inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media (max-width: 849px) {
  .section.top-company .row {
    display: flex;
    flex-wrap: wrap;
  }

  .section.top-company .row > .col {
    width: 100%;
  }

  /* 1段目・3段目だけ 画像カラムを後ろに回す → テキスト→画像… */
  .section.top-company .row:nth-of-type(1) > .col:first-child,
  .section.top-company .row:nth-of-type(3) > .col:first-child {
    order: 2;
  }

  /* TOP：LBM（青）ブロックの高さをモバイル/タブレットで増やす（2つ目の topcolumn） */
  .section.top-company .col.topcolumn:nth-of-type(2) > .col-inner{
    min-height: 380px !important;
    height: 380px !important; /* inline height を上書き */
  }
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
    .statement {
        max-width: 93%;
        margin: 45px auto;
    }  
    .statement h3{
        font-size: 1.35em;
        line-height: 1.8;
    }

    /* TOP：5つのキーワード（h4.h_underline）が右側で見切れる対策（下線幅は文字列幅に追従） */
    .statement h4.h_underline{
        position: relative;           /* 念のため（下線::after用） */
        display: inline-block;
        width: fit-content;
        width: -moz-fit-content;
        width: max-content;           /* fallback */
        max-width: 100% !important;   /* 画面幅を超えない */
        box-sizing: border-box;
        margin-left: auto;
        margin-right: auto;

        padding-left: 12px;           /* 端ギリギリを避ける */
        padding-right: 12px;
        white-space: normal !important;
        overflow-wrap: anywhere;      /* 長い英字でも折り返す */
        word-break: break-word;
    }

    /* 念のため：h4 全体も折り返し許可 */
    .statement h4{
        overflow-wrap: anywhere;
        word-break: break-word;
    }
    
    
    
    





.top-container .left,
.top-container .right {
    flex: 1 1 100%;
}

.header-wrapper.stuck .header-main .nav > li > a > i:not(.icon-angle-down) {
    color: #000000 !important;
}
.last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .company-profile {
    width: 80%;
  }
  .company-profile th,
  .company-profile td {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
    
    
  /* TOP：groupimage セクションの画像をモバイルで余白なし＆大きく表示 */
  body.home section.groupimage,
  body.home section.groupimage .section-content,
  body.home section.groupimage .section-bg,
  body.home section.groupimage .section-bg-overlay{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.home section.groupimage .row{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.home section.groupimage .row > .col{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 画像ブロックの内側に付いている余白（inline style の margin）を打ち消す */
  body.home section.groupimage .img-inner,
  body.home section.groupimage .img-inner.dark,
  body.home section.groupimage .img{
    margin: 10px !important;
    padding: 0 !important;
  }

  /* inline style の width:66% を上書きして全幅に */
  body.home section.groupimage [id^="image_"]{
    width: 100% !important;
  }

  body.home section.groupimage img{
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    display: block !important;
  }
}