@charset "UTF-8";

/* 基本設定： ページ全体 */

.all {
  margin: 0 auto;
  max-width: 1120px;
  margin: 0 auto;
  padding-left: 1.6rem;

  display: flex;
  flex-direction: row-reverse;
  position: relative;

}

/* サイドバー 隠す-----------------------------*/
@media (max-width: 840px) {
  .all{
    padding-left: 0rem;
    padding-right: 0rem;
  }
}

.body {
  width: 100%;
}

/* https://bsblog.casareal.co.jp/archives/6408 */
.sidebar {
  width: auto;
  /* padding-left:2rem; */
  flex: 1rem 0 250px;
  -ms-flex: 0 0 250px;
  padding-bottom: 5.2rem;/* スクロール終了時の下の隙間 */
  padding-left: 1.6rem;
  padding-right: 1.6rem;
}

/* サイドバー 隠す-----------------------------*/
@media (max-width: 840px) {
  .sidebar{
    display: none;
  }
}

#child2{
  /* position: fixed; */
  top: 3rem;/* スクロール時の上の隙間 */
	z-index: 100;
  position: sticky;
}

#child2 .container{
  width: 204px;
  height: auto;
	border: solid 1px #ccc;
	background: #fff;
	padding: 10px;
	padding-top: 6px;
	padding-bottom: 0;
	z-index: 100;
}

header .container {
    max-width: 1120px;
    margin: auto;
}
@media (min-width: 841px) {
  .page .container{
	 text-align: center;
	 margin-left: 0rem;
	 margin-right: 0rem;
  }
}

/* ----------------------------------------------------- */

/* メニューの中身で使用 */
/* コンテンツBB： 概要（アイコン＋テキスト） */

/* 3カラムテスト https://whitewood-hp.com/web-tips/archives/4208*/
.column3{
  background-color: #ccc;/* 背景色の親 */
  padding-top: 3.2rem;
  padding-bottom: 1.6rem;
}
.column3-wrap{
  display:flex;
  flex-wrap:wrap;
  justify-content: space-between;
  padding-left: 1.6rem;
  padding-right: 1.6rem;
  /* 以降はレイアウトとは無関係です */
  margin: 0 auto;
  padding-bottom: 0;
  overflow: hidden;
  background-color: #ccc;
}
  /* footerとの距離ゆったり */
.padding-bottom_3{
  padding-bottom: 3rem;
}
.column3-inner{
  background:#fff;
  /* padding: 1rem; */
  /* margin: 6px; */
  border: solid 2px #fff;
	border-radius: 16px;
  box-shadow: 0 2px 5px #aeabab;
	background-color: #fff;
	text-decoration: none;
  display: flex;
  flex-direction: column;
}
.column3-inner-bnr{
	text-decoration: none;
  display: flex;
  flex-direction: column;
}
.card-bnr-img {
  border-radius: 16px;
  max-width: 100%;
  height: auto;
  background: #000;
  display: block;
  align-items: center;
  vertical-align: middle;/* 画像高さセンターに　画像下の1pxが出なくなった　2025/12/20 */
}
/* バナー文字 */
.card-bnr-img p img{
	display: block;
	position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin:0;
  padding:0;
	height: 100%;/* ひまわり */
	/* filter: drop-shadow(1px 1px 2px #fff); */
	text-align: center;
	line-height:1.1;
  }
/* -------------------------- */
/* 大きい画面用(1300px以上) の設定 */
@media (min-width: 840px) {
  .column3-wrap{
    max-width: 1104px;
  }
  .column3-inner{
    flex-basis:calc((100% - 4rem) / 3);
    max-width:calc((100% - 44px) / 3);
    margin: 0 16px 16px 0;
  }
  /* 1段目だけ上下マージンを無くす */
  .column3-inner:nth-of-type(1),
  .column3-inner:nth-of-type(2),
  .column3-inner:nth-of-type(3){
    margin-top:0;
  }
  /* 最終行のアイテム数が2つの時、左右に振り分けられるのを防ぐ */
  .column3-inner:nth-of-type(3n-1):nth-last-of-type(1){
    margin-right:auto;
    margin-left:0;
  }
  .column3-inner:nth-child(3n) {
    margin-right: 0;
  }
}
/* -------------------------- */
/* 840px以内) の設定 */
@media (max-width: 840px) {
  .column3-wrap{
    max-width: 840px;
  }
  .column3-inner{
    flex-basis:calc((100% - 24px) / 2);
    max-width:calc((100% - 24px) / 2);
    margin-top:20px;
    /* 以降はレイアウトとは無関係です */
    margin: 0 16px 16px 0;
  }
  /* 1段目だけ上下マージンを無くす */
  .column3-inner:nth-of-type(1),
  .column3-inner:nth-of-type(2){
    margin-top:0;
  }
  /* 最終行のアイテム数が2つの時、左右に振り分けられるのを防ぐ */
  .column3-inner:nth-of-type(2n-1):nth-last-of-type(1){
    margin-right:auto;
    margin-left:0;
  }
  .column3-inner:nth-child(2n) {
    margin-right: 0;
  }
}

/* 840px以上の設定 */
@media (min-width: 840px) {
  .column3-wrap{
    max-width: 1104px;
  }
  .column3-inner-bnr{
    max-width:calc((100% - 32px) / 3);
    margin: 0 16px 16px 0;
  }
  /* 1段目だけ上下マージンを無くす */
  .column3-inner-bnr:nth-of-type(1),
  .column3-inner-bnr:nth-of-type(2),
  .column3-inner-bnr:nth-of-type(3){
    margin-top:0;
  }
  /* 最終行のアイテム数が2つの時、左右に振り分けられるのを防ぐ */
  .column3-inner-bnr:nth-of-type(3n-1):nth-last-of-type(1){
    margin-right:auto;
    margin-left:0;
  }
  .column3-inner-bnr:nth-child(3n) {
    margin-right: 0;
  }
}
/* -------------------------- */
/* 840px以内) の設定 */
@media (max-width: 840px) {
  .column3-wrap{
    max-width: 840px;
  }
  .column3-inner-bnr{
    max-width:calc((100% - 16px) / 2);
    margin-top:20px;
    /* 以降はレイアウトとは無関係です */
    margin: 0 16px 16px 0;
  }
  /* 1段目だけ上下マージンを無くす */
  .column3-inner-bnr:nth-of-type(1),
  .column3-inner-bnr:nth-of-type(2){
    margin-top:0;
  }
  /* 最終行のアイテム数が2つの時、左右に振り分けられるのを防ぐ */
  .column3-inner-bnr:nth-of-type(2n-1):nth-last-of-type(1){
    margin-right:auto;
    margin-left:0;
  }
  .column3-inner-bnr:nth-child(2n) {
    margin-right: 0;
  }
}

/* -------------------------- */
@media screen and (min-width: 769px){
  .br-sp {
    display: none;
  }
}
/* -------------------------- */
@media screen and (min-width: 550px){
  .br-sp_550 {
    display: none;
  }
}
/* -------------------------- */
@media screen and (min-width: 480px){
  .br-sp_480 {
    display: none;
  }
}
/* -------------------------- */
@media screen and (min-width: 460px){
  .br-sp_460 {
    display: none;
  }
}
@media screen and (min-width: 370px){
  .br-sp_370 {
    display: none;
  }
}
/* -------------------------- */
@media screen and (min-width: 410px){
  .br-sp_410 {
    display: none;
  }
}
/* -------------------------- */
@media screen and (min-width: 390px){
  .br-sp_390 {
    display: none;
  }
}

/* -------------------------- */
@media screen and (max-width: 410px){
  .br-pc_410 {
    display: none;
  }
}

/* ----------------------------------------------------- */
.margin_top_0 {
  margin-top: 0!important;
}
.margin_top_0_5 {
  margin-top: 0.5rem!important;
}
.margin_top_1 {
  margin-top: 1rem!important;
}
.margin_top_1_5 {
  margin-top: 1.5rem!important;
}
.margin_top_2 {
  margin-top: 2rem!important;
}
.margin_top_3 {
  margin-top: 3rem!important;
}
/* ----------------------------------------------------- */
.margin_bottom_0 {
  margin-bottom: 0!important;
}
.margin_bottom_0_5 {
  margin-bottom: 0.5rem!important;
}
.margin_bottom_1 {
  margin-bottom: 1rem!important;
}
.margin_bottom_1_5 {
  margin-bottom: 1.5rem!important;
}
.margin_bottom_2 {
  margin-bottom: 2rem!important;
}
.margin_bottom_3 {
  margin-bottom: 3rem!important;
}
.margin_bottom_3_2 {
  margin-bottom: 3.2rem!important;
}
.margin_bottom_5_2 {
  margin-bottom: 5.2rem!important;
}
/* ----------------------------------------------------- */
.padding_top_0 {
  padding-top: 0!important;
}
.padding_top_0_25 {
  padding-top: 0.25rem!important;
}
.padding_top_0_5 {
  padding-top: 0.5rem!important;
}
.padding_top_1 {
  padding-top: 1rem!important;
}
.padding_top_1_5 {
  padding-top: 1.5rem!important;
}
.padding_top_2 {
  padding-top: 2rem!important;
}
.padding_top_3 {
  padding-top: 3rem!important;
}
.padding_top_38px {
  padding-top: 38px;
}
/* ----------------------------------------------------- */
.padding_bottom_0 {
  padding-bottom: 0!important;
}
.padding_bottom_0_2_5 {
  padding-bottom: 0.25rem!important;
}
.padding_bottom_0_5 {
  padding-bottom: 0.5rem!important;
}
.padding_bottom_1 {
  padding-bottom: 1rem!important;
}
.padding_bottom_1_5 {
  padding-bottom: 1.5rem!important;
}
.padding_bottom_2 {
  padding-bottom: 2rem!important;
}
.padding_bottom_3 {
  padding-bottom: 3rem!important;
}
/* ----------------------------------------------------- */
