@charset "utf-8";

.illust-map-sp{background:#F6F3EE;height:50px;display:none;}

#illust-map{line-height:1; min-width:1242px;}
#illust-map .all-width{width:1242px;}

#illust-map .box-01{padding-top:60px;
background:#F6F3EE url(../images/suisai-01.jpg) no-repeat center top 90px;
background-size:auto 540px;
height:825px;
}

#illust-map .box-01 .inner{
position:relative;
width:100%;
}
#illust-map .box-01 .inner .map-title{
position: absolute; top:160px; right:0;
font-size:13px; color:#fff;line-height:1.6;letter-spacing:0.2em;
background: url(../images/map-title.png) no-repeat left top;
}
#illust-map .box-01 .inner .map-title .ten-min{
font-size:42px; color:#000;line-height:1.2;letter-spacing:0;margin-bottom:15px;
}


#illust-map .box-02{
margin-top:-65px;
background:#ffffff url(../images/suisai-02.jpg) no-repeat center top;
background-size:auto 630px;
height:650px;
}

#illust-map .box-02 .inner{
position:relative;
width:100%;
text-align:right;
}
#illust-map .box-02 .inner .map-miryoku{
position: absolute; top:180px; left:0; text-align:center;z-index:2;
}

#illust-map .linkbtn{display:inline-block;
margin: 15px 0 25px 0;
width:310px;height:45px;
background:url(../images/btn-bg.png) no-repeat left center;
background-size:100% auto;color:#fff;
text-align:center;
font-size:16px;
letter-spacing:0.2em;line-height:1;
}
#illust-map .linkbtn a{
display:block;
width:310px;height:45px;
color:#fff !important;
padding:14px;
}
#illust-map .linkbtn a:hover{text-decoration:none;}
#illust-map .linkbtn:hover{opacity:0.7;}



#illust-map .map-title02,#illust-map .shousai-btn,#illust-map .sp-map{display: none;}


/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 1000px){
#illust-map{min-width:100%;text-align:center;}
#illust-map .map-image{width:700px;display:inline-block;}
#illust-map .map-image img{width:700px;}

#illust-map .map-title02{display: block;margin-bottom:20px;font-size:34px;
background: url(../images/map-title02.png) no-repeat center top;
background-size: 500px 43px;
}

#illust-map .shousai-btn{display: inline-block;text-align:center !important;width:350px;margin-top:40px;}
#illust-map .all-width{width:100%;padding:0 30px;}
#illust-map .box-02 .inner{width:100% !important;text-align:center !important;}

#illust-map .box-01 .inner .map-title{display: none;}
#illust-map .box-02 .inner .map-miryoku{display: none;}

#illust-map .box-01{
background:#F6F3EE url(../images/suisai-01.jpg) no-repeat center top 160px;
background-size:auto 420px;
padding:90px 0 50px 0;
height:auto;
}
#illust-map .box-02{
margin-top:0;padding-bottom:20px;
background:#Fff url(../images/suisai-02.jpg) no-repeat center top 0;
background-size:auto 480px;
height:auto;
}
}
@media screen and (max-width: 750px){
.illust-map-sp{background:#F6F3EE;height:50px;display:block;}
#illust-map .sp-map{display: inline-block;text-align:center;}
#illust-map .box-01 .inner,#illust-map .box-02 .inner{display:none;}
#illust-map .all-width{width:100%;padding:0;}
#illust-map .box-01{
background:#F6F3EE url(../images/sp-suisai-01.jpg) no-repeat center top 0;
background-size:cover;
padding:50px 0 50px 0;
height:auto;
}
#illust-map .box-01 img{width:650px;}
#illust-map .box-02{text-align:center;
margin-top:0;
background:#fff url(../images/sp-suisai-02.jpg) no-repeat center top 0;
background-size:cover;
padding:70px 0 30px 0;
height:auto;
}
#illust-map .box-02 img{width:650px;}
#illust-map .shousai-btn{margin-top:0;}

/*ナンバー付リスト*/
.listmark-num{
counter-reset: my-counter;
padding: 0;text-align: left;
  line-height: 1.8;margin:20px 0 0 0;
}
.listmark-num.later5{
counter-reset: my-counter 9; 
padding: 0;margin-bottom: 20px;
}
.listmark-num > li{
padding-left: 50px;display: inline-block;
}
.listmark-num > li:before {
content: counter(my-counter);
counter-increment: my-counter;
background-color: #E74728;
display: block;
float: left;
margin-top:3px;
color: #fff;
font-size: 80%;
font-weight: normal;
letter-spacing: -0.5pt;
text-indent: -0.5pt;
line-height: 22px;
margin-left: -25px;
text-align: center;
height: 22px;
width: 22px;
border-radius: 50%;
}
.listmark-num > li:after{
content: "";
display: block;
height: 0;
font-size: 0;
clear: both;
}

}
@media screen and (max-width: 600px){
#illust-map .all-width{width:100%;padding:0 10px;}
.listmark-num{margin:20px 10px 0 0;}
.listmark-num > li{padding-left: 35px;}
}
@media screen and (max-width: 480px){
#illust-map{background:#F6F3EE;}
#illust-map .all-width{width:100%;padding:0 0;}
#illust-map .box-01{padding:50px 0;}
#illust-map .box-02{padding:50px 0 10px 0;}
#illust-map .shousai-btn{width:100%;margin-top:0;}
#illust-map .linkbtn{width:250px;height:45px;font-size:14px;}
#illust-map .linkbtn a{width:250px;height:45px;padding:14px;}
}
/*--------------------------------------------------------------------------------*/

#illust-map .map-image {position: relative;}

#illust-map .map-image .point01,#illust-map .map-image .point02,#illust-map .map-image .point03,#illust-map .map-image .point04,#illust-map .map-image .point05,#illust-map .map-image .point06,#illust-map .map-image .point07,#illust-map .map-image .point08,#illust-map .map-image .point09,#illust-map .map-image .point10,#illust-map .map-image .point11,#illust-map .map-image .point12,#illust-map .map-image .point13,#illust-map .map-image .point14,#illust-map .map-image .point15
{width:34px;height:34px;}
#illust-map .map-image .point01{position:absolute;top:163px;left:372px;}
#illust-map .map-image .point02{position:absolute;top:264px;left:395px;}
#illust-map .map-image .point03{position:absolute;top:380px;left:291px;}
#illust-map .map-image .point04{position:absolute;top:195px;left:458px;}
#illust-map .map-image .point05{position:absolute;top:172px;left:560px;}
#illust-map .map-image .point06{position:absolute;top:247px;left:490px;}
#illust-map .map-image .point07{position:absolute;top:251px;left:542px;}
#illust-map .map-image .point08{position:absolute;top:488px;left:362px;}
#illust-map .map-image .point09{position:absolute;top:372px;left:631px;}

#illust-map .map-image .point10{position:absolute;top:164px;right:197px;}
#illust-map .map-image .point11{position:absolute;top:166px;left:676px;}
#illust-map .map-image .point12{position:absolute;top:450px;left:508px;}
#illust-map .map-image .point13{position:absolute;top:424px;right:314px;}
#illust-map .map-image .point14{position:absolute;top:380px;right:264px;}
#illust-map .map-image .point15{position:absolute;top:292px;right:400px;}

/*レスポンシブ対応------------------------------------------------------------------*/
@media screen and (max-width: 1000px){
#illust-map .map-image .point01{position:absolute;top:118px;left:250px;}
#illust-map .map-image .point02{position:absolute;top:186px;left:268px;}
#illust-map .map-image .point03{position:absolute;top:268px;left:198px;}
#illust-map .map-image .point04{position:absolute;top:125px;left:312px;}
#illust-map .map-image .point05{position:absolute;top:120px;left:384px;}
#illust-map .map-image .point06{position:absolute;top:175px;left:336px;}
#illust-map .map-image .point07{position:absolute;top:178px;left:384px;}
#illust-map .map-image .point08{position:absolute;top:343px;left:245px;}
#illust-map .map-image .point09{position:absolute;top:264px;left:440px;}

#illust-map .map-image .point10{position:absolute;top:130px;right:150px;}
#illust-map .map-image .point11{position:absolute;top:132px;left:250px;}
#illust-map .map-image .point12{position:absolute;top:356px;left:117px;}
#illust-map .map-image .point13{position:absolute;top:335px;right:246px;}
#illust-map .map-image .point14{position:absolute;top:302px;right:200px;}
#illust-map .map-image .point15{position:absolute;top:233px;right:311px;}
}
/*--------------------------------------------------------------------------------*/

.tooltip { /* 補足説明するテキストのスタイル */
  position: relative;
  cursor: pointer;
  padding: 0 5px;
  font-size: 0.9em;
  color: #4682b4;
}

.balloon_top { /* ツールチップのスタイル */
  width: 150px; /* 横幅 */
  position: absolute;
  left: 50%;
  bottom: 80%; /* Y軸の位置 */
  transform: translateX(-50%);
  margin-bottom: 15px; /* テキストとの距離 */
  padding: 8px;
  border-radius: 10px; /* 角の丸み */
  background-color: #295063; /* ツールチップの背景色 */
  font-size: 0.85em;
  color: #fff;
	line-height: 1.4;
  text-align: center;
  visibility: hidden; /* ツールチップを非表示に */
  opacity: 0; /* 不透明度を0％に */
  z-index: 1;
  transition: 0.5s all; /* マウスオーバー時のアニメーション速度 */
}

.balloon_top::before { /* 吹き出しの「しっぽ」のスタイル */
  content: "";
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-top: 12px solid #295063; /* 最後の値は「ツールチップの背景色」と合わせる */
  position: absolute;
  top: 99%;
  left: 50%;
  transform: translateX(-50%);
}

.tooltip:hover .balloon_top { /* マウスオーバー時のスタイル */
  bottom: 100%; /* Y軸の位置 */
  visibility: visible; /* ツールチップを表示 */
  opacity: 1; /* 不透明度を100％に */
}