@charset "utf-8";
/* ---------------------
  - root

  - html
  - body
    - --isLock

  - logo
    - --mediaOutlook
    - --chosakai

  - header
    - --isOver

  - headerWrapper
    - headerWrapper__item
      - --logo
      - --btn

  - menuButton
    - --open
    - --close

  - menu
    - --isVisible
  - menuHeader
    - menuHeader__item
      - --logo
      - --btn
  - menuMain
    - menuMain__item
  - menuSearch
    - menuSearch__title
    - menuSearch__input
  - menuSearchForm
    - menuSearchForm__input
    - menuSearchForm__button
  - menuCategories
    - menuCategories__item
  - menuCategory
    - menuCategory__title
    - menuCategory__body
  - menuCategoryList
    - menuCategoryList__item

  - nav
    - nav__item
      - --global
      - --category
  - navGlobal
    - navGlobal__item
      - --home
      - --isCurrent
  - navCategories
    - navCategories__item
  - navCategory
    - navCategory__title
    - navCategory__body
  - --series
  - --international
  - navCategoryList
    - navCategoryList__item

  - main

  - mainWrapper
    - mainWrapper__top
    - mainWrapper__main
    - mainWrapper__side

  - footer
    - footer__item
  - footerWrapper
    - footerWrapper__item

  - footerMenus
    - footerMenus__item
  - footerMenu
    - footerMenu__title
    - footerMenu__body
  - footerMenuList
    - footerMenuList__item

  - footerCompany
    - footerCompany__logo
    - footerCompany__address
  - footerAddress
    - footerAddress__name
    - footerAddress__text

  - copyright
--------------------- */



/* -----------------------------------
  root
----------------------------------- */
:root {
  --block: clamp( 40px, 4vw, 60px ); /* 60/15 */
  --inner: clamp( 20px, 4.66666667vw, 70px ); /* 70/15 */

  --color:     #333;
  --color-rgb: 51, 51, 51;

  --color-corporate:     #073c6a;
  --color-corporate-rgb: 7, 60, 106;

  --color-corporate-sub:     #eac111;
  --color-corporate-sub-rgb: 234, 193, 17;

  --color-gray:          #697179;
  --color-gray-rgb:      105, 113, 121;
  --color-lightgray:     #d0d6dc;
  --color-lightgray-rgb: 208, 214, 220;
  --color-whitegray:     #eceeef;
  --color-whitegray-rgb: 236, 238, 239;

  --color-red:     #c91d1d;
  --color-red-rgb: 201, 29, 29,;

  --color-white:     #fff;
  --color-white-rgb: 255, 255, 255;

  --font-family:         "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --font-family-serif:   "Yu Mincho", "游明朝", YuMincho, "游明朝体", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif;
  --font-family-pathway: "Pathway Gothic One", sans-serif;
}



/* -----------------------------------
  html
----------------------------------- */
/*html {
  overflow-y: scroll;
}*/
@media ( min-width: 1024px ) {
  html {
    font-size: 15px;
  }
}
@media ( min-width: 600px ) and ( max-width: 1023.9px ) {
  html {
    font-size: 14px;
  }
}
@media ( max-width: 599.9px ) {
  html {
    font-size: 13px;
  }
}



/* -----------------------------------
  body
----------------------------------- */
body {
  color: var(--color);
  font-weight: 400;
  font-family: var(--font-family);
  line-height: 1.5;
  word-wrap: break-word;
  overflow-wrap: break-word;
  -webkit-text-size-adjust: none;
          text-size-adjust: none;
}


/*  --isLock
------------------------ 
body.--isLock {
  overflow: hidden;
}*/



/* -----------------------------------
  logo
----------------------------------- */
.logo :is( a, div ) {
  position: relative;
  overflow: hidden;
  background-position: 50%;
  -webkit-background-size: contain;
          background-size: contain;
  background-repeat: no-repeat;
}

.logo :is( a, span ) {
  display: block;
}

.logo span {
  position: absolute;
  top: 0;
  left: 200%;
  white-space: nowrap;
}


/*  --mediaOutlook
------------------------ */
.logo.--mediaOutlook :is( a, div ) {
  aspect-ratio: 130 / 23;
  background-image: url("/assets/public/images/logo/logo.png");
}


/*  --chosakai
------------------------ */
.logo.--chosakai :is( a, div ) {
  aspect-ratio: 16 / 15;
  background-image: url("/assets/public/images/logo/chosakai/tategumi_logobig.png");
}



/* -----------------------------------
  header
----------------------------------- */
#header {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 999;
  background-color: rgba( var(--color-white-rgb), .9 );
  -webkit-transition: all .25s;
       -o-transition: all .25s;
          transition: all .25s;
}


/*  contents
------------------------ */
#header.--isOver {
  -webkit-transform: translateY( -100% );
      -ms-transform: translateY( -100% );
       -o-transform: translateY( -100% );
          transform: translateY( -100% );
}


/* -----------------------------------
  headerWrapper
----------------------------------- */
#headerWrapper {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: space-between;
  -ms-align-items: center;
      align-items: center;
  padding-block: 15px;
  padding-inline: var(--inner);
  /*background-color: rgba( 153, 153, 204, .5 );*/
}


/*  headerWrapper__item
------------------------ */
.headerWrapper__item {
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
}


/* --logo */
.headerWrapper__item.--logo {
  width: clamp( 130px, 17.33333333vw, 260px ); /* 260/15 */
}


/* --btn */
.headerWrapper__item.--btn {
  width: clamp( 30px, 4vw, 60px ); /* 60/15 */
}



/* -----------------------------------
  menu
----------------------------------- */
.menuButton {
  position: relative;
}

.menuButton :is( a, span ) {
  display: block;
}

.menuButton a {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 50%;
  background-position: 50%;
  -webkit-background-size: contain;
          background-size: contain;
  background-repeat: no-repeat;
}

.menuButton span {
  position: absolute;
  top: 0;
  left: 200%;
  white-space: nowrap;
}


/*  --open
------------------------ */
.menuButton.--open a {
  background-image: url("/assets/public/images/icon/open.svg");
  background-color: var(--color-corporate-sub);
}


/*  --close
------------------------ */
.menuButton.--close a {
  background-image: url("/assets/public/images/icon/close.svg");
}



/* -----------------------------------
  menu
----------------------------------- */
#menu {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: column;
     -moz-flex-direction: column;
      -ms-flex-direction: column;
       -o-flex-direction: column;
          flex-direction: column;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  visibility: hidden;
  opacity: 0;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba( 8, 34, 57, .9 );
  -webkit-transition: all .25s;
       -o-transition: all .25s;
          transition: all .25s;
}


/*  --isVisible
------------------------ */
#menu.--isVisible {
  visibility: visible;
  opacity: 1;
}



/* -----------------------------------
  menuHeader
----------------------------------- */
#menuHeader {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: space-between;
  -ms-align-items: center;
      align-items: center;
  /* padding-block: clamp( 15px, 2vw, 30px ); 30/15 */
  padding-block: 15px;
  padding-inline: var(--inner);
}


/*  menuHeader__item
------------------------ */
.menuHeader__item {
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
}


/*  --logo  */
.menuHeader__item.--logo {
  width: clamp( 130px, 17.33333333vw, 260px ); /* 260/15 */
}

.menuHeader__item.--logo .logo.--mediaOutlook :is( a, div ) {
  background-image: url("/assets/public/images/logo/logo_wh.png");
}


/*  --btn  */
.menuHeader__item.--btn {
  width: clamp( 30px, 4vw, 60px ); /* 60/15 */
}



/* -----------------------------------
  menuMain
----------------------------------- */
#menuMain {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
  padding-block: clamp( 25px, 3vw, 45px ) clamp( 70px, 12.9629629636vh, 140px ); /* 45/15 140/10.8 */
  padding-inline: var(--inner);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba( var(--color-lightgray-rgb), .1 ) transparent;
  overscroll-behavior: contain;
}


/*  menuMain__item
------------------------ */
.menuMain__item + .menuMain__item {
  margin-top: clamp( 40px, 4.66666667vw, 70px ); /* 70/15 */
}



/* -----------------------------------
  menuSearch
----------------------------------- */
#menuSearch {
  max-width: 700px;
  margin-inline: auto;
  color: var(--color-lightgray);
  font-size: 1.2rem; /* 18/15 */
}


/*  menuSearch__title
------------------------ */
#menuSearch__title {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: baseline;
      align-items: baseline;
  column-gap: .88888889em; /* 16/18 */
  margin-bottom: .77777778em; /* 14/18 */
}

#menuSearch__title:before {
  display: block;
  font-size: 3em; /* 54/18 */
  line-height: 1;
  font-family: var(--font-family-pathway);
  text-transform: capitalize;
  content: attr(data-text);
}


/*  menuSearch__input
------------------------ */



/* -----------------------------------
  menuSearchForm
----------------------------------- */
#menuSearchForm {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--color-lightgray);
  border-radius: 10px;
}


/*  menuSearchForm__input
------------------------ */
#menuSearchForm__input {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
}

#menuSearchForm__input input[type="search"] {
  width: 100%;
  padding: 1.11111111em .88888889em; /* 20/18 16/18 */
  border: none;
  background-color: transparent;
  color: inherit;
  line-height: 1.55555556;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

#menuSearchForm__input input[type="search"]::placeholder {
  color: var(--color-lightgray);
}

#menuSearchForm__input input[type="search"]:focus::placeholder {
  color: transparent;
}


/*  menuSearchForm__button
------------------------ */
#menuSearchForm__button {
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  width: 3.22222222em; /* 58/18 */
}


#menuSearchForm__button button {
  display: block;
  width: 100%;
  min-height: 100%;
  padding: 0;
  overflow: hidden;
  border: none;
  background-image: url("/assets/public/images/icon/menuSearch.svg");
  background-position: 50%;
  -webkit-background-size: 58.6206896561%; /* 34/.58 */
          background-size: 58.6206896561%;
  background-repeat: no-repeat;
  background-color: transparent;
  text-indent: 200%;
  white-space: nowrap;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}



/* -----------------------------------
  menuCategories
----------------------------------- */
.menuCategories {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: clamp( 40px, 4vw, 60px ) clamp( 30px, 3vw, 45px ); /* 60/15 45/15 */
}
@media ( max-width: 480px ) {
  .menuCategories {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
  }
}

.menuCategories:has( .menuCategories ) {
  max-width: 1159px;
  margin-inline: auto;
}
@media ( min-width: 480.1px ) {
  .menuCategories:has( .menuCategories ) {
    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
  }
}


/*  menuCategories__item
------------------------ */
@media ( min-width: 1024px ) {
  .menuCategories__item {
    width: calc( ( 100% - ( clamp( 30px, 3vw, 45px ) * 3 ) ) / 4 ); /* 45/15 */
  }
}
@media ( min-width: 480.1px ) and ( max-width: 1023.9px ) {
  .menuCategories__item {
    width: calc( ( 100% - clamp( 30px, 3vw, 45px ) ) / 2 );
  }
}

.menuCategories__item:has( .menuCategories ) {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: column;
     -moz-flex-direction: column;
      -ms-flex-direction: column;
       -o-flex-direction: column;
          flex-direction: column;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  row-gap: clamp( 40px, 4vw, 60px ); /* 60/15 */
}
@media ( min-width: 1024px ) {
  .menuCategories__item:has( .menuCategories ) {
    width: calc( ( 100% - clamp( 30px, 3vw, 45px ) ) / 2 ); /* 45/15 */
  }
}
@media ( min-width: 480.1px ) and ( max-width: 1023.9px ) {
  .menuCategories__item:has( .menuCategories ) {
    flex-basis: 100%;
  }
}

@media ( min-width: 1024px ) {
  .menuCategories__item .menuCategories__item {
    width: calc( ( 100% - clamp( 30px, 3vw, 45px ) ) / 2 ); /* 45/15 */
  }
}



/* -----------------------------------
  menuCategory
----------------------------------- */
.menuCategory {
  font-size: 1.2rem; /* 18/15 */
  line-height: 1.2;
}


/*  menuCategory__title
------------------------ */
.menuCategory__title {
  margin-bottom: 1.66666667em; /* 30/18 */
  border-bottom: 1px solid var(--color-lightgray);
  font-weight: 500;
}

.menuCategory__title a {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: space-between;
  -ms-align-items: center;
      align-items: center;
  padding: 1.11111111em .55555556em; /* 20/18 10/18 */
  color: var(--color-lightgray);
  text-decoration: none;
}

@media ( hover: hover ) and ( pointer: fine ){
  .menuCategory__title a:hover {
    text-decoration: underline;
  }
}

.menuCategory__title a:after {
  display: block;
  -webkit-transform: translateX( -2px ) rotate( 45deg );
      -ms-transform: translateX( -2px ) rotate( 45deg );
       -o-transform: translateX( -2px ) rotate( 45deg );
          transform: translateX( -2px ) rotate( 45deg );
  aspect-ratio: 1 / 1;
  width: .44444444em; /* 8/18 */
  border-top: 1px solid var(--color-lightgray);
  border-right: 1px solid var(--color-lightgray);
  content: " ";
}


/*  .menuCategory__body
------------------------ */
.menuCategory__body {
  padding-inline: .55555556em; /* 10/18 */
}



/* -----------------------------------
  menuCategoryList
----------------------------------- */
.menuCategoryList {
  list-style: none;
  padding: 0;
  font-size: 1.06666667rem; /* 16/15 */
  line-height: 1.375;
}


/*  menuCategoryList__item
------------------------ */
.menuCategoryList__item + .menuCategoryList__item {
  margin-top: .8125em; /* 13/16 */
}

.menuCategoryList__item a {
  color: var(--color-lightgray);
  text-decoration: none;
}

@media ( hover: hover ) and ( pointer: fine ){
  .menuCategoryList__item a:hover {
    text-decoration: underline;
  }
}



/* -----------------------------------
  nav
----------------------------------- */
/*  nav__item
------------------------ */
.nav__item {
  overflow-x: auto;
}


/*  --global  */
.nav__item.--global {
  margin-bottom: -1.5px;
}


/*  --category  */
.nav__item.--category {
  padding: .66666667em var(--inner); /* 10/15 */
  background-color: var(--color-lightgray);
}



/* -----------------------------------
  navGlobal
----------------------------------- */
#navGlobal {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: center;
  -ms-align-items: stretch;
      align-items: stretch;
  list-style: none;
  position: relative;
  inline-size: fit-content;
  margin-inline: auto;
  padding: 0;
  font-weight: 500;
  font-size: 1.133333333rem; /* 17/15 */
  line-height: 1.2;
  white-space: nowrap;
}

#navGlobal:before {
  display: block;
  position: absolute;
  position-anchor: --current-nav;
  bottom: anchor(bottom);
  left: anchor(left);
  width: anchor-size(width);
  border-top: 3px solid var(--color-corporate);
  pointer-events: none;
  content: " ";
  -webkit-transition: all .25s;
       -o-transition: all .25s;
          transition: all .25s;
}

@media ( hover: hover ) and ( pointer: fine ){
  #navGlobal:hover:before {
    position-anchor: --hover-nav;
  }
}


/*  navGlobal__item
------------------------ */
.navGlobal__item a {
  display: block;
  padding-inline: calc( .5882352951em + ( var(--inner) / 2 ) ); /* 10/17 */
  color: var(--color);
  text-decoration: none;
}

.navGlobal__item span {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: center;
  -ms-align-items: flex-start;
      align-items: flex-start;
  column-gap: .4705882366em; /* 8/17 */
  padding-block: .7647058832em; /* 13/17 */
}

.navGlobal__item span:before {
  display: block;
  aspect-ratio: 1 / 1;
  width: 1em;
  background-position: 50%;
  -webkit-background-size: contain;
          background-size: contain;
  background-repeat: no-repeat;
}


/*  --home */
.navGlobal__item.--home span:before {
  background-image: url("/assets/public/images/icon/home.svg");
  content: " ";
}



/* -----------------------------------
  anchor
----------------------------------- */
/*  --isCurrent  */
.navGlobal__item.--isCurrent span {
  anchor-name: --current-nav;
}

@media ( hover: hover ) and ( pointer: fine ){
  /*.navGlobal__item.--isHover span ,*/
  .navGlobal__item:hover span {
    anchor-name: --hover-nav;
  }
}



/* -----------------------------------
  navCategories
----------------------------------- */
#navCategories {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: center;
      align-items: center;
  column-gap: 2.26666667rem; /* 34/15 */
  list-style: none;
  padding: 0;
  white-space: nowrap;
}


/*  navCategories__item
------------------------ */



/* -----------------------------------
  navCategory
----------------------------------- */
.navCategory {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: center;
      align-items: center;
  column-gap: .8em; /* 12/15 */
}


/*  navCategory__title
------------------------ */
.navCategory__title {
  font-weight: 500;
}

.navCategory__title a {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: center;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: 3px .4em; /* 6/15 */
  padding-inline: .4em; /* 6/15 */
  color: var(--color);
  text-decoration: none;
}
@media ( min-width: 1024px ) {
  .navCategory__title a {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
  }
}

.navCategory__title a:before {
  display: block;
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  aspect-ratio: 1 / 1;
  width: 2.2666666667em; /* 34/15 */
  margin-inline: auto;
  background-position: 50%;
  -webkit-background-size: contain;
          background-size: contain;
  background-repeat: no-repeat;
  content: " ";
}

.navCategory__title span {
  display: block;
  -ms-align-self: center;
      align-self: center;
  font-size: 12px;
}


/*  navCategory__body
------------------------ */


/*  --series  */
.navCategory.--series .navCategory__title a:before {
  background-image: url("/assets/public/images/icon/series.svg");
}


/*  --international  */
.navCategory.--international .navCategory__title a:before {
  background-image: url("/assets/public/images/icon/international.svg");
}



/* -----------------------------------
  navCategoryList
----------------------------------- */
.navCategoryList {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: center;
      align-items: center;
  column-gap: .8571428581em; /* 12/14 */
  list-style: none;
  padding: 0;
  font-weight: 500;
  font-size: .933333333rem; /* 14/15 */
  line-height: 1.2;
}


/*  navCategoryList__item
------------------------ */
.navCategoryList__item a {
  display: block;
  padding: 4px 1.1428571433em; /* 16/14 */
  border-radius: 3lh;
  background-color: var(--color-white);
  color: var(--color);
  text-decoration: none;
}



/* -----------------------------------
  main
----------------------------------- */



/* -----------------------------------
  mainWrapper
----------------------------------- */
@media ( min-width: 1024px ) {
  #mainWrapper {
    display: -webkit-flex;
    display:    -moz-flex;
    display:     -ms-flex;
    display:      -o-flex;
    display:         flex;
    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
    justify-content: flex-end;
    -ms-align-items: flex-start;
        align-items: flex-start;
  }
}

#mainWrapper:after {
  display: block;
  -ms-align-self: stretch;
      align-self: stretch;
}
@media ( min-width: 1024px ) {
  #mainWrapper:after {
    border-left: 1px solid var(--color-lightgray);
    content: " ";
  }
}


/*  mainWrapper__top
------------------------ */
#mainWrapper__top {
  border-bottom: 1px solid var(--color-lightgray);
}
@media ( min-width: 1024px ) {
  #mainWrapper__top {
    flex-basis: 100%;
  }
}


/*  mainWrapper__main
------------------------ */
#mainWrapper__main {
  border-bottom: 1px solid var(--color-lightgray);
}
@media ( min-width: 1024px ) {
  #mainWrapper__main {
    -webkit-flex: 1;
       -moz-flex: 1;
        -ms-flex: 1;
         -o-flex: 1;
            flex: 1;
  }
}


/*  mainWrapper__side
------------------------ */
#mainWrapper__side {
  border-bottom: 1px solid var(--color-lightgray);
}
@media ( min-width: 1024px ) {
  #mainWrapper__side {
    -webkit-flex: none;
       -moz-flex: none;
        -ms-flex: none;
         -o-flex: none;
            flex: none;
    -webkit-order: 1;
       -moz-order: 1;
        -ms-order: 1;
         -o-order: 1;
            order: 1;
    width: clamp( 280px, 29.33333333vw, 500px ); /* 440/15 */
  }
}

@media ( max-width: 767.9px ) {
  #lower #mainWrapper__side:not( :has( #bannerList ) ) {
    display: none;
  }
}

@media ( max-width: 767.9px ) {
  #lower #mainWrapper__side .section:not( :has( #bannerList ) ) {
    display: none;
  }
}



/* -----------------------------------
  footer
----------------------------------- */
#footer {
  position: relative;
  margin-top: -1px;
  border-top: 1px solid var(--color-lightgray);
}


/*  footer__item
------------------------ */
.footer__item {
  padding-inline: var(--inner);
}

.footer__item:has( .footerMenuList ) {
  padding-block: 40px;
  background-color: var(--color-whitegray);
}

.footer__item:has( #copyright ) {
  padding-block: 20px;
}

.footer__item + .footer__item {
  border-top: 1px solid var(--color-lightgray);
}



/* -----------------------------------
  footerWrapper
----------------------------------- */
#footerWrapper {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: row-reverse;
     -moz-flex-direction: row-reverse;
      -ms-flex-direction: row-reverse;
       -o-flex-direction: row-reverse;
          flex-direction: row-reverse;
  justify-content: space-between;
  -ms-align-items: stretch;
      align-items: stretch;
  row-gap: 40px;
  max-width: 1135px;
  margin-inline: auto;
}
@media ( max-width: 1023.9px ) {
  #footerWrapper {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
    inline-size: fit-content;
  }
}


/*  footerWrapper__item
------------------------ */
.footerWrapper__item:has( #footerCompany ) {
  -ms-align-self: center;
      align-self: center;
}



/* -----------------------------------
  footerMenus
----------------------------------- */
#footerMenus {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: 20px min( 7.2vw, 108px ); /* 108/15 */
}
@media ( max-width: 475px ) {
  #footerMenus {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
  }
}


/*  footerMenus__item
------------------------ */



/* -----------------------------------
  footerMenu
----------------------------------- */
/*  footerMenu__title
------------------------ */
.footerMenu__title {
  position: relative;
  margin-bottom: .66666667em; /* 16/24 */
  overflow: hidden;
  font-size: 1.6rem; /* 24/15 */
  font-family: var(--font-family-pathway);
  line-height: 1;
  text-transform: capitalize;
}

.footerMenu__title:before {
  display: block;
  content: attr(data-title);
}

.footerMenu__title span {
  position: absolute;
  top: 0;
  left: 200%;
  white-space: nowrap;
}


/*  footerMenu__body
------------------------ */
.footerMenu__body {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  column-gap: min( 3.6vw, 54px ); /* 54/15 */
}

@media ( max-width: 475px ) {
  .footerMenu__body .footerMenuList {
    -webkit-flex: 1;
       -moz-flex: 1;
        -ms-flex: 1;
         -o-flex: 1;
            flex: 1;
  }
}


/* -----------------------------------
  footerMenuList
----------------------------------- */
.footerMenuList {
  list-style: none;
  padding: 0;
  font-size: .93333333rem; /* 14/15 */
  line-height: 1.8;
}


/*  footerMenuList__item
------------------------ */
.footerMenuList__item a {
  text-decoration: none;
  color: var(--color);
}

@media ( hover: hover ) and ( pointer: fine ){
  .footerMenuList__item a:hover {
    text-decoration: underline;
  }
}



/* -----------------------------------
  footerCompany
----------------------------------- */
#footerCompany {
  display: -webkit-flex;
  display:   -moz-flex;
  display:    -ms-flex;
  display:     -o-flex;
  display:        flex;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  gap: 2.4em; /* 36/15 */
}


/*  footerCompany__logo
------------------------ */
#footerCompany__logo {
  -webkit-flex: none;
     -moz-flex: none;
      -ms-flex: none;
       -o-flex: none;
          flex: none;
  width: 5.33333333rem; /* 80/15 */
}


/*  footerCompany__address
------------------------ */
#footerCompany__address {
  -webkit-flex: 1;
     -moz-flex: 1;
      -ms-flex: 1;
       -o-flex: 1;
          flex: 1;
}



/* -----------------------------------
  footerAddress
----------------------------------- */
#footerAddress {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: column;
     -moz-flex-direction: column;
      -ms-flex-direction: column;
       -o-flex-direction: column;
          flex-direction: column;
  justify-content: flex-start;
  -ms-align-items: stretch;
      align-items: stretch;
  min-height: 100%;
  font-style: normal;
  font-size: .86666667rem; /* 13/15 */
}


/*  footerAddress__name
------------------------ */
#footerAddress__name {
  font-weight: 700;
}


/*  footerAddress__text
------------------------ */
#footerAddress__text {
  margin-top: auto;
  font-size: .8461538472em; /* 11/13 */
}



/* -----------------------------------
  copyright
----------------------------------- */
#copyright {
  inline-size: fit-content;
  margin-inline: auto;
  font-size: .8rem; /* 12/15 */
  line-height: 1.2;
}