@charset "UTF-8";

/* =========================================================
   TOP / お名前.com — zoomed-out centered layout fix
   縮尺を下げてもTOP本体・サービス一覧・ヘッダー・フッター内容を中央維持
========================================================= */

html,
body{
  width:100%;
  min-width:320px;
}

body{
  overflow-x:hidden;
}

/* TOPページ本体を画面中央へ */
.growth-page{
  width:min(100%,1920px)!important;
  max-width:1920px!important;
  margin-right:auto!important;
  margin-left:auto!important;
}

/* 各セクション共通コンテナを中央へ */
.growth-page .growth-container{
  width:min(100%,1560px)!important;
  margin-right:auto!important;
  margin-left:auto!important;
}

/* SERVICES全体と各一覧を中央コンテナ内へ固定 */
.growth-services > .growth-container{
  width:min(100%,1560px)!important;
  margin-inline:auto!important;
}

.growth-services .growth-featured-service,
.growth-services .growth-service-grid,
.growth-services .growth-inline-cta{
  width:100%!important;
  max-width:100%!important;
  margin-right:auto!important;
  margin-left:auto!important;
}

/* 旧 right bleed 指定が残っていても解除 */
.growth-services .growth-service-grid{
  margin-right:auto!important;
}

/* ヘッダー背景は全幅、内容は中央 */
#header{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

@media screen and (min-width:1037px){
  #header .header,
  .header{
    width:min(100%,1620px)!important;
    max-width:1620px!important;
    margin-right:auto!important;
    margin-left:auto!important;
  }
}

/* フッター背景は全幅、内容は中央 */
#footer{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

#footer .footer,
.footer{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

#footer .footer-info,
.footer-info{
  width:min(calc(100% - 80px),1280px)!important;
  max-width:1280px!important;
  margin-right:auto!important;
  margin-left:auto!important;
}

/* タブレット・スマホは既存レスポンシブを優先 */
@media screen and (max-width:1036px){
  .growth-page{
    width:100%!important;
    max-width:none!important;
  }

  .growth-page .growth-container,
  .growth-services > .growth-container{
    width:100%!important;
  }

  #footer .footer-info,
  .footer-info{
    width:100%!important;
    max-width:none!important;
    margin-right:0!important;
    margin-left:0!important;
  }
}