@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＞子テーマ＞クライアント別設定＞エアケント

===============================================================================================
*/


/* 固定ページ＞デザイン優先＞タイトルエリアの排除
--------------------------------------------------------------- */
/* タイトル非表示（W3Cガイドライン代替策）
----------------------------------------------- */
.c-pageTitle {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
/* コンテンツエリア＞スペース＞排除
----------------------------------------------- */
.l-content {
	padding-top: 0;
}

/* 固定ページ＞上部＞スペース＞排除 */
.l-mainContent__inner>.post_content {
	margin: 0;
}


/* リッチカラム＞スクロール装飾
--------------------------------------------------------------- */
/* 「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-slider-arrowbutton-circle {
	position: relative;
}
.adx-arrow-button-left-circle,
.adx-arrow-button-right-circle {
  position: absolute;
  top: 60%;/* サイト別調整 */
  transform: translateY(-50%);
  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;
  border-radius: 50%;
  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);*/
		text-indent: 200%;/* テキスト排除 */
		white-space: nowrap;/* テキスト排除 */
		overflow: hidden;/* テキスト排除 */
}
.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: 30px;
    padding: 0px 19px 0px 15px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }

  .adx-arrow-button-right-circle {
    right: 30px;
    padding: 0px 15px 0px 19px; /* 「▶」が視覚的に中央ズレするため微調整 */
  }
}

@media (max-width: 767px) {
  .adx-arrow-button-left-circle,
  .adx-arrow-button-right-circle {
    width: 49px;/* サイト別調整 */
    height: 49px;/* サイト別調整 */
    font-size: 22px !important;/* サイト別調整 */
  }

	.adx-arrow-button-left-circle {
		left: 16px;/* サイト別調整 */
		background-image: url("images/pic-erkennt066-65x65.png");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: contain;
	}

	.adx-arrow-button-right-circle {
		right: 16px;/* サイト別調整 */
		background-image: url("images/pic-erkennt065-65x65.png");
		background-repeat: no-repeat;
		background-position: center center;
		background-size: contain;
  }
}




/* 「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) {
}
