@charset "utf-8";
*,
*::before,
*::after { 
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

a { 
  text-decoration: none;
}

ul,
li{
  list-style: none;
}

img {
  max-width:100%; 
  height:auto;
  vertical-align: bottom;
}


body{
    font-family: 'Times New Roman', Times, serif, 'Hiragino Mincho ProN', 'MS PMincho';
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
}

header{
    background-color: #745399;
    color: #e4ccff;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

/* header img{
    width: 100px;
    height: auto;
    margin-left: 20px;;
} */




h1{
    font-size: clamp(1.625rem, 1.2852rem + 1.5184vw, 2.5rem);
    margin-bottom: 0;
    margin-left: 20px;
}

iframe{
    width: 100%;
    height: auto;
}

html {
  scroll-behavior: smooth;
}



/* トップへ戻るボタン */
.topbutton{
    width: 80px;
    height: auto;
    position: fixed;
    right: 20px;
    bottom: 10px;
}


/* 下へ戻るボタン */
.downbutton{
  width: 80px;
  height: auto;
  position: fixed;
  right: 20px;
  top: 50px;

}


/* フッター */
footer{
    background-color: #745399; 
    /* 花紫・江戸紫いろ */
    color: #e4ccff;
    /* 同一色相、同一彩度の配色の彩度を上げた色 */
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
}

.lead-copy{
  padding: 10px;
  margin: 15px 5px;
  line-height: 1.8;
  text-align: center;
}


/* カラム指定ここから */
.all-column{
  display: flex;
  justify-content: space-between;
  margin: 20px 5px 20px 5px;
  padding: 5px;

}

.left-column{
  flex-basis: 25%;
}

.center-column{
  flex-basis: 45%;
}

.right-column{
flex-basis: 25%;
}

/* 次はお城頁の指定 */
.left-column2{
  flex-basis: 30%;
}
.ph-column{
  flex-basis: 65%;
}
/* カラム指定ここまで */

/* 左カラムの指定ここから */

nav{
  line-height: 2;
  background-color: #e4ccff;
  padding: 20px;
}

.mission{
  padding: 5px 0;
  margin: 10px 0;
  text-align: center;
 border-bottom: #745399 3px solid;
 border-top: #745399 2px dotted;
}

.mission-detail{
  font-size: 18px;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-weight: 500;
  color: #745399;
}

.castle-info{
  border: 2px #745399 solid;
  padding: 10px;
  margin-top: 10px;
  line-height: 2;
}
.castle-info h3{
color: #745399;
text-align: center;
padding: 5px;
}

.castle-info dl{
line-height: 20px;
}
.castle-info dl dt{
font-weight: 600;
}

.castle-info dl dd{
font-size: 14px;
padding-left: 20px;
margin-bottom: 20px;
}

.left-column h4{
  border-bottom: #745399 2px solid;
  padding-bottom: 3px;
  text-align: center;
  font-size: 18px;
}

.left-column h5{
  border-bottom: #745399 1px dotted;
  padding-bottom: 2px;
  font-size: 16px;
}

.left-column .table-info{
  font-weight: 500;
  text-align: center;
  margin-top: 20px;
}

.left-column table{
  border: #745399 solid 1px;
  font-size: 14px;
  font-weight: lighter;
 margin-bottom: 40px;
}

.left-column td{
  text-align: left;
  padding: 2px 10px 2px 5px;
  border: #745399 1px dotted;
}



/* 左カラムの指定ここまで */



/* センターカラム内の指定 */
/* 写真指定 */

.flex-ph{
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
}
.center-column .flex-ph img{
  width: 30%;
  height: auto;
}

.center-column dl{
  margin: 10px 10px;
  background-color: #e4ccff;
  border-radius: 5px;

}

.center-column dl dt{
  font-weight: 600;
  color: #745399;
  padding: 10px 0px;
  text-align: center;
}
.center-column dl dd{
  padding: 5px 0px;
  text-align: center;
}
.castle-detail{
  padding: 20px;
  text-align: right;
  font-weight: 600;
}


/* ここから右カラム指定 */
.right-column{
  border: #745399 4px solid;
  border-radius: 3px;
}

.right-column h4{
  text-align: center;
  padding-top: 15px;
}
.right-column dl{
  padding: 10px;
  line-height: 1.8;
}

.right-column dl dt{
  font-weight: 600;
  background-color: #e4ccff;
  text-align: center;

}

.right-column dl dd{
  font-size: 95%;
}

.right-column .marker{
  background: linear-gradient(transparent 30%,rgba(192,138,255,0.5));

}

.right-column figcaption{
  font-size: 90%;
}
.flex-ph2{
  display: flex;
}
.flex-ph2 img{
  padding: 5px;
}

.flex-ph2 figcaption{
  font-size: 85%;
  line-height: 100%;
}

.mailadress{
  display: flex;
  justify-content: space-around;
  border: #745399 double 3px;
  padding: 5px;
}

.right-column h4{
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  color: #745399;
  margin-top: 10px;
}
.banner-css{
  margin: 5px;
}

.banner-css img{
  margin: 10px 0;
}
/* ここまで右カラム */


/* ここからお城頁の指定 */

.castle-nav{
  background-color: #ffffff;
}

.ph-column h3{
  color: #745399;
  padding: 10px;
  margin: 20px 0px;
  text-align: center;
  font-size: 20px;
  background-color: #e4ccff;
  border-radius: 10px;
}

.flex-castle-ph{
  display: flex;
  justify-content: space-around;
}

.flex-castle-ph img{
border-radius: 10px;
}

.flex-castle-ph figure{
  padding: 5px;
}

.left-column2{
  line-height: 180%;
}
.left-column2 dl dt{
 font-weight: 600; 
}

.left-column2 dl dd{
  padding-left: 16px;
}

.nagahamahotel{
  font-size: 14px;
  line-height: 1.4;
}

/* ここまでお城頁の指定 */


/* ここからレスポンシブ */

@media screen and (max-width: 768px){
.all-column{
  display: block;
}

.banner-css{
  margin-bottom: 20px;
}

.flex-castle-ph{
  display: block;
}

.flex-ph2{
  display: block;

}

}