.pan_list{
  background-color:rgb(106 75 32 / 10%);
  color: #000;
  width: 100%;
  padding: 10px 0;
  margin-top: 80px;

}
@media (max-width: 767px) { 
 .pan_list{
  background-color:rgb(106 75 32 / 10%);
  color: #000;
  width: 100%;
  padding: 5px 0;
  margin-top: 70px;
} 
}
@media (max-width: 575px) { 
 .pan_list{
  background-color:rgb(106 75 32 / 10%);
  color: #000;
  width: 100%;
  padding: 5px 0;
  margin-top: 60px;
} 
}
.pan_txt{
  max-width: 1200px;
  width: 100%;
  margin: 0px auto;
}
.pan_yazirusi{
  vertical-align: baseline;
  padding: 0 5px;
}
.pan_txt p{
  font-size: 0.7em;
}
@media (max-width: 575px) { 
.pan_txt p{
  font-size: 0.4em;
}
}
.pan_txt a{
  text-decoration: none;
}
.pan_txt a span.home {
  color: #6d6d6d;
}
.pan_txt  a:hover span.home {
  color: #c0c0c0;
}
.pan_txt ol, ul{
  display: flex;
  padding-left: 5%;
}
.spot{
  width: 100%;
  max-width: 800px;
}
@media (max-width: 1199px) { 
.spot{
  width: 100%;
  max-width: 800px;
} 
}
@media (max-width: 991px) { 
.spot{
  width: 100%;
  max-width: 700px;
} 
}
@media (max-width: 767px) { 
.spot{
  width: 100%;
  max-width: 650px;
  padding: 0 20px;
} 
}
.spot2{
  width: 100%;
  max-width: 500px;
}
@media (max-width: 1199px) { 
.spot2{
  width: 100%;
  max-width: 500px;
} 
}
@media (max-width: 991px) { 
.spot2{
  width: 100%;
  max-width: 500px;
} 
}
@media (max-width: 767px) { 
.spot2{
  width: 100%;
  max-width: 450px;
  padding: 0 20px;
} 
}
.spot3{
  width: 100%;
  max-width: 250px;
}
@media (max-width: 1199px) { 
.spot3{
  width: 100%;
  max-width: 250px;
} 
}
@media (max-width: 991px) { 
.spot3{
  width: 100%;
  max-width: 250px;
} 
}
@media (max-width: 767px) { 
.spot3{
  width: 100%;
  max-width: 200px;
  padding: 0 20px;
} 
}

.spot_p{
  text-align: center;
  margin: 100px auto 2% auto;
  width: 100%;
  max-width: 1200px;
}
@media (max-width: 1199px) { 
.spot_p{
  text-align: center;
  margin: 100px auto 2% auto;
  width: 100%;
  max-width: 1200px;
}
}
@media (max-width: 991px) { 
.spot_p{
  text-align: center;
  margin: 100px auto 2% auto;
  width: 100%;
  max-width: 1200px;
}
}
@media (max-width: 767px) { 
.spot_p{
  text-align: center;
  margin: 70px auto 3% auto;
  width: 100%;
  max-width: 1200px;
}
}
@media (max-width: 500px) { 
.spot_p{
  text-align: center;
  margin: 50px auto 3% auto;
  width: 100%;
  max-width: 1200px;
}
}
.left{
  text-align: left;
  margin-left: -620px;
  margin-top: 3%;
  width: 100%;
  max-width: 200px;
}
@media (max-width: 991px) { 
.left{
  text-align: left;
  margin-left: -540px;
  margin-top: 3%;
  width: 100%;
  max-width: 170px;
}
}
@media (max-width: 767px) { 
.left{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 140px;
} 
}
@media (max-width: 575px) { 
.left{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 120px;
}  
}
.left2{
  text-align: left;
  margin-left: -520px;
  margin-top: 3%;
  width: 100%;
  max-width: 280px;
}
@media (max-width: 991px) { 
.left2{
  text-align: left;
  margin-left: -360px;
  margin-top: 5%;
  width: 100%;
  max-width: 350px;
}
}
@media (max-width: 767px) { 
.left2{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 250px;
} 
}
@media (max-width: 575px) { 
.left2{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 200px;
}  
}
.left3{
  text-align: left;
  margin-left: -560px;
  margin-top: 3%;
  width: 100%;
  max-width: 250px;
}
@media (max-width: 991px) { 
.left3{
  text-align: left;
  margin-left: -450px;
  margin-top: 5%;
  width: 100%;
  max-width: 250px;
}
}
@media (max-width: 767px) { 
.left3{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 250px;
} 
}
@media (max-width: 575px) { 
.left3{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 150px;
}  
}
.left4{
  text-align: left;
  margin-left: -410px;
  margin-top: 5%;
  width: 100%;
  max-width: 400px;
}
@media (max-width: 991px) { 
.left4{
  text-align: left;
  margin-left: -360px;
  margin-top: 5%;
  width: 100%;
  max-width: 350px;
}
}
@media (max-width: 767px) { 
.left4{
  text-align: left;
  margin-left: 0;
  margin-top: 7%;
  width: 100%;
  max-width: 290px;
} 
}
@media (max-width: 575px) { 
.left4{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 250px;
}  
}
.left5{
  text-align: left;
  margin-left: -310px;
  margin-top: 5%;
  width: 100%;
  max-width: 400px;
}
@media (max-width: 991px) { 
.left5{
  text-align: left;
  margin-left: -250px;
  margin-top: 5%;
  width: 100%;
  max-width: 350px;
}
}
@media (max-width: 767px) { 
.left5{
  text-align: left;
  margin-left: 0;
  margin-top: 7%;
  width: 100%;
  max-width: 290px;
} 
}
@media (max-width: 575px) { 
.left5{
  text-align: left;
  margin-left: 0;
  margin-top: 5%;
  width: 100%;
  max-width: 250px;
}  
}
.explanatory{
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.7;
  padding-bottom: 3%;
}
@media (max-width: 991px) { 
 .explanatory{
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.7;
  padding-bottom: 6%;
} 
}
@media (max-width: 767px) { 
 .explanatory{
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.7;
  padding: 0 15px 13% 15px;
}  
}
@media (max-width: 575px) { 
.explanatory{
  width: 100%;
  max-width: 550px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.8em;
  padding: 0 15px 15% 15px;
}  
}
.explanatory a{
  color: #2f2f2f;
}
.explanatory2{
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.7;
  padding-bottom: 3%;
}
@media (max-width: 991px) { 
 .explanatory2{
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.7;
  padding-bottom: 6%;
} 
}
@media (max-width: 767px) { 
 .explanatory2{
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.7;
  padding: 0 15px 13% 15px;
}  
}
@media (max-width: 575px) { 
.explanatory2{
  width: 100%;
  max-width: 550px;
  margin: 0 auto;
  font-size: 1.1em;
  line-height: 1.8em;
  padding: 0 15px 15% 15px;
}  
}
.btn_p{
  text-align: center;
  margin-left: -600px;
}
@media (max-width: 991px) { 
.btn_p{
  text-align: center;
  margin-left: -470px;
}
}
@media (max-width: 767px) { 
.btn_p{
  text-align: center;
  margin-left: 0;
}  
}
.topbtn{
  width: 100%;
  max-width: 230px;
  padding-bottom: 13%;
}
@media (max-width: 767px) { 
.topbtn{
  width: 100%;
  max-width: 230px;
  padding-bottom: 25%;
}
}
@media (max-width: 575px) { 
.topbtn{
  width: 100%;
  max-width: 200px;
  padding-bottom: 17%;
}  
}
.topbtn2{
  width: 100%;
  max-width: 230px;
  padding-bottom: 13%;
  margin-left: 130px;
}
@media (max-width: 991px) { 
 .topbtn2{
  width: 100%;
  max-width: 230px;
  padding-bottom: 13%;
  margin-left: 100px;
} 
}
@media (max-width: 767px) { 
.topbtn2{
  width: 100%;
  max-width: 230px;
  padding-bottom: 25%;
  margin-left: 0;
}
}
@media (max-width: 575px) { 
.topbtn2{
  width: 100%;
  max-width: 200px;
  padding-bottom: 17%;
  margin-left: 0;
}  
}