/*========================================
型は決まっているけどそのサイトで微調整するもの系

　●　サイト基本定義
　●　横幅設定
　●　上へ／横プラン
　●　シンプルモジュール類
　●　スライドで全体表示
　●　ボタンエフェクト
　●　感染症対策等　情報エリア

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

/*========================================
　●　サイト基本定義
========================================*/
body{
}

main{
 display: block;
 font-size: 16px;
}

.fotorama__dot{ border-color: #38211a !important;}

/*============================== ■ max-width 1087 */
@media screen and (max-width: 1087px){}/*----- media -----*/

/*============================== ■ max-width 767 */
@media screen and (max-width: 767px){}/*----- media -----*/

/*============================== ■ max-width 520 */
@media screen and (max-width: 520px){}/*----- media -----*/

/*========================================
　●　横幅設定
========================================*/
.m-mainwidth750{
 width: 100%;
 max-width: 750px;
 margin-left: auto;
 margin-right: auto;
}

.m-mainwidth750__space{
 width: 100%;
 max-width: 770px;
 margin-left: auto;
 margin-right: auto;
 padding-right: 10px;
 padding-left: 10px;
}

.m-mainwidth1212{
 width: 100%;
 max-width: 1212px;
 margin-left: auto;
 margin-right: auto;
}

.m-mainwidth1212__space{
 width: 100%;
 max-width: 1232px;
 margin-left: auto;
 margin-right: auto;
 padding-right: 10px;
 padding-left: 10px;
}


.m-mainwidth1280{
 width: 100%;
 max-width: 1280px;
 margin-left: auto;
 margin-right: auto;
}

.m-mainwidth1280__space{
 width: 100%;
 max-width: 1300px;
 margin-left: auto;
 margin-right: auto;
 padding-right: 10px;
 padding-left: 10px;
}

.m-mainwidth1600{
 width: 100%;
 max-width: 1600px;
 margin-left: auto;
 margin-right: auto;
}

.m-mainwidth1600__space{
 width: 100%;
 max-width: 1620px;
 margin-left: auto;
 margin-right: auto;
 padding-right: 10px;
 padding-left: 10px;
}

/*============================== ■ max-width 520 */
@media screen and (max-width: 520px){}/*----- media -----*/


/*========================================
　●　上へ／横プラン
========================================*/
#js-toTOP{
 display: none;
 position: fixed;
  bottom: 25px;
  right: 0px;
  z-index: 500;
 font-size: 1.8rem;
}

/*============================== ■ max-width 1087 */
@media screen and (max-width: 1087px){}/*----- media -----*/

/*============================== ■ max-width 767 */
@media screen and (max-width: 767px){
#js-toTOP{
 display: none;
 position: fixed;
  bottom: 25px;
  right: -12px;
  z-index: 500;
 font-size: 1.8rem;
}

#js-toTOP img{
 width: 80%;
}

}/*----- media -----*/

/*========================================
　●　シンプルモジュール類
========================================*/
.m-newtab{
 padding-right: 24px;
 background: url("../images/parts/icon_link.png") no-repeat right center;
}

.m-gmap{
 width: 100%;
 max-width: 1180px;
 height: 420px;
 margin-left: auto;
 margin-right: auto;
 border: 1px solid #44245d;
}

.m-zei{
 padding-bottom: 8px;
 text-align: right;
}

/*-------------------- （レスポンシブで）overflow */
.m-hidden { overflow: visible;}
.m-hiddenX{ overflow-x: visible;}

/*============================== □ max-width xxx */
@media screen and (max-width: 1087px){/* クエリ幅は調整 */
.m-hidden { overflow: hidden;}
.m-hiddenX{ overflow-x: hidden;}

}/*----- media -----*/

/*========================================
　●　スライドで全体表示
========================================*/
.sp_attention{
 display: none;
 padding-bottom: 16px;
 text-align: center;
}
/*============================== □ max-width xxx */
@media screen and (max-width: 750px){/* クエリ幅は調整 */
.overflowWrap{
 display: block;
 overflow-x: scroll;
 white-space: nowrap;
 -webkit-overflow-scrolling: touch;
 border-right: 1px solid #37291d;
}

.sp_attention{
 display: block;
}

}/*----- media -----*/

/*========================================
　●　ボタンエフェクト
========================================*/
.button_ef{
 overflow: hidden;
 position: relative;
 z-index: 1;
}

.button_ef > span.ef{
 position: absolute; top: 0; left: 0; z-index: -1;
 display: block;
 width: 100%;
 height: 100%;
 background: #778b26;
}

.button_ef > span.ef:after{
 position: absolute; top: 0px; left: -100%; z-index: 0;
 display: block;
 width: 100%;
 height: 100%;
 content: "";
 background: #778b26;
 transition: all 0.25s ease-out;
}

.button_ef:hover > span.ef:after{
 position: absolute; top: 0; left: 0; z-index: -1;
 display: block;
 width: 100%;
 height: 100%;
 background: #b686db;
}

/*========================================
　●　感染症対策等　情報エリア
========================================*/
.js-accordion--naiyo{ display: none;}

.info01{
 width: 100%;
 max-width: 1080px;
 margin: 0 auto 56px auto;
}

.info01 h3{
 overflow: hidden;
 position: relative;
 margin-bottom: 4px;
 padding: 24px 40px 24px 40px;
 color: #fff;
 font-size: 24px;
 background: #38211a;
}

.info01 h3:hover{ cursor: pointer;}

.info01 h3 span{
 position: absolute; top: 0px; right: 27px;
 display: flex;
  align-items: center;
  justify-content; center;
 height: 100%;
 transition: all 0.3s ease-out;
}

.info01 h3.adn_open span{ transform: rotate(180deg);}


.info01Naiyo{
 padding: 28px 40px 0px 40px;
 color: #222222;
 background: rgba(255,255,255,0.8);
 border: 1px solid #d4c6bb;
}

.info01Naiyo > p{ padding-bottom: 15px;}

.info01Naiyo dl{
 padding: 0 0 24px 0;
}

.info01Naiyo dt{
 margin-bottom: 12px;
 padding-bottom: 6px;
 line-height: 1.5;
 border-bottom: 1px solid #38211a;
}

.info01Naiyo dd{}

.info01Naiyo dd p{ line-height: 1.8;}

.info01Naiyo ol{ margin: 0 0 24px 1em;}
.info01Naiyo ol li{
 padding: 0.25em 0;
 line-height: 1.5;
}

.info01Naiyo ul{ margin: 0 0 4px 1em;}
.info01Naiyo ul li{
 padding: 0.25em 0;
 line-height: 1.5;
}

.info01Naiyo > p{ line-height: 1.5;}

/*============================== ■ max-width 1087 */
@media screen and (max-width: 1087px){
.info01{ max-width: 750px;}

.info01 h3{ padding: 24px 60px 24px 20px;}

.info01 h3 span{ position: absolute; top: 0px; right: 12px;}

.info01Naiyo{ padding: 32px 20px;}

}/*----- media -----*/

/*============================== ■ max-width 767 */
@media screen and (max-width: 767px){}/*----- media -----*/

/*============================== ■ max-width 520 */
@media screen and (max-width: 520px){}/*----- media -----*/