@charset "UTF-8";

/*--- ▼common、baseファイル読み込み ------*/
@import url("./common/common.css");
@import url("./common/base.css");





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

	▼h2、アンカーリンクボタン設定

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

div#contentWrap>h2{ width:100%; min-width:1200px; float:left; }
div#contentWrap>h2 img{ vertical-align:top; }

div.contentBtn{ width:100%; padding:45px 0 50px; float:left; }
div.contentBtn nav{ width:1200px; margin:0 auto; }
div.contentBtn ul{ width:100%; float:left; }
div.contentBtn li{ padding:0 15px; float:left; }
div.contentBtn li a{ color:#474747; text-decoration:none; }
div.contentBtn li a::before {
    content:  "";     /* 空の要素作成 */
    width:  10px;               /* 幅指定 */
    height:  10px;              /* 高さ指定 */
    display:  inline-block;     /* インラインブロックにする */
    background-color: #bfbfbf;  /* 背景色指定 */
	border:1px solid #979797;
    border-radius:  50%;        /* 要素を丸くする */
	margin-right:5px;
}
div.contentBtn li a:hover{ text-decoration:underline; }
div.contentBtn li a:hover::before{ background-color: #26a1a1; border:1px solid #26a1a1; }



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

	▼ class section_wrap wrap_gray　などの設定

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

.section_wrap{ width:100%; float:left; }
.wrap_gray{ background-color:#eeeeee; }

.section_wrap h3{ width:34%; margin:0 33%; padding-bottom:20px; border-bottom:1px solid #000; font-size:1.4em; letter-spacing:0.4em; color:#009999; font-weight:bold; text-align:center; float:left; }



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

	▼ headImg

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

div#headImg{ position:relative; width:100%; min-width:1200px;  float:left; }

h3.headimg_tit{ position:absolute; bottom:7vw; width:90%; padding:0 5%; text-align:center; }
div.headimg_catch{ position:absolute; bottom:3vw; width:90%; padding:0 5%; text-align:center; }

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

	▼ イントロ

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


div#newofficeArea{ width:1200px; margin:20px auto 30px; }


div.introArea{ width:100%; padding:20px 0; float:left; }
.introArea_L{ width:68%; float:left; }
.introArea_R{ width:28%; float:right; }

.introArea_L p{ font-size:1.3em; line-height:2em;  }

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

	▼ 施設紹介

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

div.imggalleryArea{ display:flex; justify-content: space-between; flex-wrap: wrap; gap:30px 0; width:100%; padding:10px 0 60px; float:left; }

div.imggalleryBox{ width:32%; float:left; }
div.imggalleryBox h4{ width:100%; padding:5px 0 0; font-size:1.2em; font-weight:bold; letter-spacing:0.2em; text-indent:1em; color:#009999; float:left; }

.arrow{ position:relative; width:20px; height:20px; background:#009999; border-radius:50%; float:left; }
.arrow::before{
	content: '';
	position: absolute;
	left: 5px;
	top: 6px;
	width: 5px;
	height: 5px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}


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

	▼ スライダー設定

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

div.sliderArea{ width:100%; float:left; }


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

	▼ 新社屋にお気軽にお越し下さい。

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


div#newoffice_bottomArea{ width:1200px; margin:20px auto 30px; }

div#newoffice_bottomArea p{ width:100%; padding:20px 0 60px; font-size:1.3em; line-height:2em; text-align:center; float:left; }