@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/


/*
===============================================================================================

　SWELL＞子テーマ＞カスタマイズ、ハックを定義する

===============================================================================================
*/


/* 高さ設定
--------------------------------------------------------------- */
.adx-h650 { height: 650px !important; }
.adx-h600 { height: 600px !important; }
.adx-h550 { height: 550px !important; }
.adx-h500 { height: 500px !important; }
.adx-h450 { height: 450px !important; }
.adx-h400 { height: 400px !important; }
.adx-h350 { height: 350px !important; }


/* フッター直前＞スペース削除（SWELLハック）
--------------------------------------------------------------- */
.w-beforeFooter {
	margin: 0;
}


/* リンクリスト（ブロック）＞横並び＞センタリング（SWELLハック）
--------------------------------------------------------------- */
.adx-linklist-center {
	width: fit-content;
	margin: 0 auto;
}


/* リッチカラム
--------------------------------------------------------------- */
/* 「スクロールできます」エリアの非表示
----------------------------------------------- */
.scrolHint-displaynone > .c-scrollHint { display: none; }


/* スクロールバー（横方向）＞非表示
----------------------------------------------- */
.scrollbar-displaynone > .swell-block-columns__inner::-webkit-scrollbar {
	display: none;/* Chrome、Safari、Opera、Edge */
}
.scrollbar-displaynone > .swell-block-columns__inner {
	-ms-overflow-style: none;/* Internet Explorer 10+ */
	scrollbar-width: none;/* Firefox */
}




/*
===============================================================================================

　SWELL＞子テーマ＞クライアント別設定＞クラウドリザーブ（エアケント）

===============================================================================================
*/


/* ブロック＞タブ
--------------------------------------------------------------- */
/* タブスタイル＞ノーマル
----------------------------------------------- */
.is-style-default .c-tabList__button:hover, .is-style-default .c-tabList__button[aria-selected=true] {
background-color: #ECA04C !important;
}
.is-style-default .c-tabBody {
	border: 1px solid #ECA04C !important;
	background-color: #FFFCDB ;
}


/* タブスタイル＞ふきだし
----------------------------------------------- */
.is-style-balloon .c-tabList__button:hover, .is-style-balloon .c-tabList__button[aria-selected=true] {
background-color: #ECA04C !important;
}
.is-style-balloon .c-tabList__button:before {
border-top: 8px solid #ECA04C !important;
}


/* タブスタイル＞下線
----------------------------------------------- */
.is-style-bb .c-tabList__button:hover, .is-style-bb .c-tabList__button[aria-selected=true] {
color: #ECA04C !important;
}
.is-style-bb .c-tabList__button::after {
background-color: #ECA04C !important;
}


/* タブブロック＞文字サイズ＞カスタマイズ
----------------------------------------------- */
@media (min-width: 600px) {
	.c-tabList__button {
			font-size: 18px;
	}
}


/*hoverアクション＞無効化
--------------------------------------------------------------- */
.swell-block-linkList.-fill .swell-block-linkList__link:hover {
	background-color: var(--the-color);
	color: #fff;
}


/* リッチカラム＞スクロール装飾
--------------------------------------------------------------- */
/* 「adx-slider-arrowbutton」セット時に反映
----------------------------------------------- */
.adx-arrow-button-left,
.adx-arrow-button-right {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  font-size: 50px;
  text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.8);
  background: transparent;
  border: none;
}

.adx-arrow-button-left {
  left: 80px;
}

.adx-arrow-button-right {
  right: 80px;
}

.adx-arrow-button-left:hover,
.adx-arrow-button-right:hover {
  color: #FFF362;
  text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.8);
}


/* Responsive
------------------------------- */
@media (min-width: 768px) and (max-width: 1023px) {
  .adx-arrow-button-left,
  .adx-arrow-button-right {
    font-size: 40px;
  }

  .adx-arrow-button-left {
    left: 20px;
  }

  .adx-arrow-button-right {
    right: 20px;
  }
}


@media (max-width: 767px) {
  .adx-arrow-button-left,
  .adx-arrow-button-right {
    font-size: 35px;
  }

  .adx-arrow-button-left {
    left: 5px;
  }

  .adx-arrow-button-right {
    right: 5px;
  }
}




/* 「adx-slider-arrowbutton-circle」セット時に反映
----------------------------------------------- */
.adx-arrow-button-left-circle,
.adx-arrow-button-right-circle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #333;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  font-size: 30px !important;
  /*text-shadow: 0 0 10px rgba(0, 0, 0, 0.8);*/
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background-color: #FFF;
  border: 3px solid #333;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
  /*box-shadow: 0 4px 8px rgba(255, 255, 255, 0.3);*/
  font-size: 30px;
}

.adx-arrow-button-left-circle {
  left: 80px;
  padding: 0px 13px 0px 7px; /* 「◀」が視覚的に中央ズレするため微調整 */
}

.adx-arrow-button-right-circle {
  right: 80px;
  padding: 0px 7px 0px 13px; /* 「▶」が視覚的に中央ズレするため微調整 */
}

.adx-arrow-button-left-circle:hover,
.adx-arrow-button-right-circle:hover {
  background-color: #333;
  color: #FFF;
}


/* Responsive
------------------------------- */
@media (min-width: 768px) and (max-width: 1023px) {
  .adx-arrow-button-left-circle,
  .adx-arrow-button-right-circle {
    width: 60px;
    height: 60px;
    font-size: 26px !important;
  }

  .adx-arrow-button-left-circle {
    left: 20px;
    padding: 0px 19px 0px 15px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }

  .adx-arrow-button-right-circle {
    right: 20px;
    padding: 0px 15px 0px 19px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }
}

@media (max-width: 767px) {
  .adx-arrow-button-left-circle,
  .adx-arrow-button-right-circle {
    width: 50px;
    height: 50px;
    font-size: 22px !important;
  }

  .adx-arrow-button-left-circle {
    left: 5px;
    padding: 0px 16px 0px 12px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }

  .adx-arrow-button-right-circle {
    right: 5px;
    padding: 0px 12px 0px 16px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }
  }

	
	

/* 「adx-slider-arrowbutton-square」セット時に反映
----------------------------------------------- */
.adx-arrow-button-left-square,
.adx-arrow-button-right-square {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #333;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  /*text-shadow: 0 0 10px rgba(0, 0, 0, 0.8);*/
  width: 70px;
  height: 70px;
  font-size: 30px !important;
  background-color: #FFF;
  border: 3px solid #333;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
  box-shadow: 0 4px 8px rgba(255, 255, 255, 0.3);
  font-size: 30px;
}

.adx-arrow-button-left-square {
  left: 80px;
  padding: 0px 12px 0px 8px; /* 「◀」が視覚的に中央ズレするため微調整 */
}

.adx-arrow-button-right-square {
  right: 80px;
  padding: 0px 8px 0px 12px; /* 「▶」が視覚的に中央ズレするため微調整 */
}

.adx-arrow-button-left-square:hover,
.adx-arrow-button-right-square:hover {
  background-color: #ccc;
  border: 3px solid #333;
  color: #000;
}

/* Responsive
------------------------------- */
@media (min-width: 768px) and (max-width: 1023px) {
  .adx-arrow-button-left-square,
  .adx-arrow-button-right-square {
    width: 60px;
    height: 60px;
    font-size: 26px !important;
  }

  .adx-arrow-button-left-square {
    left: 20px;
    padding: 0px 19px 0px 15px; /* 「◀」が視覚的に中央ズレするため微調整 */
  }

  .adx-arrow-button-right-square {
    right: 20px;
    padding: 0px 15px 0px 19px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }
}

@media (max-width: 767px) {
  .adx-arrow-button-left-square,
  .adx-arrow-button-right-square {
    width: 50px;
    height: 50px;
    font-size: 22px !important;
  }

  .adx-arrow-button-left-square {
    left: 5px;
    padding: 0px 16px 0px 12px; /* 「◀」が視覚的に中央ズレするため微調整 */
  }

  .adx-arrow-button-right-square {
    right: 5px;
    padding: 0px 12px 0px 16px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }
}




/* 
===============================================================================================


===============================================================================================
*/
/* 
--------------------------------------------------------------- */
/* 
----------------------------------------------- */
/* Responsive
------------------------------- */
@media screen and (min-width:1281px) {
}
@media screen and (min-width:992px) and (max-width:1280px) {
}
@media screen and (min-width:736px) and (max-width:991px) {
}
@media screen and (max-width:735px) {
}