@charset "shift-jis";

section h2,section.colm h3{font-size:1.4em;font-weight:bold;padding:.2em .5em;border-bottom:3px #1493d6 solid;}

/*--hero--*/
div.hero{width:1180px;margin:1em auto;}
ul.topimg{margin:1em auto;width:1100px}
ul.thumnav{width:1100px;margin:0 auto;}
ul.thumnav li{width:14%;margin:0 4px;padding:1px;border:1px #fff solid}
ul.thumnav li.slick-current {border-color:#2994d8}


/*---news-container-*/
#news-container{margin:1.5em auto;border:1px #2994d8 solid;width:1100px}
a.fancybox{display:block;font-size:.8em;position:absolute;right:5px;top:0;bottom:0;margin:auto;z-index:10;line-height:35px}
#news-container ul li a{display:block;padding:10px 5px 10px 15px; font-size:.9em; text-align:left; line-height:1em;}
#news-container ul li{line-height:1em;}
#news-container span.news,#news-container span.event{padding:3px 5px; margin:0 10px 0 5px; color:#FFF; font-size:.8em;border-radius: 3px;}
#news-container span.news{background:#f33;}
#news-container span.event{background:#39f;}

/*--covid--*/
.covid dl{display:flex;flex-wrap:wrap;align-items:center;background:#eaf4fe;border:2px #75b3e6 solid;padding:1em 1.5em;margin:.5em auto;transition:.4s}
.covid dt{width:12em;color:#0096d5}
.covid dt:before{content:"";border:5px transparent solid;border-left:5px #0096d5 solid;display:inline-block;margin-left:0;margin-right:.5em;transition:.4s}
.covid dd{width:calc(100% - 14em);color:#000}
.covid a[href$="pdf"]:after{content:none}
.covid a:hover dl{background:#f3eafe;border-color:#7578e6}
.covid a:hover dl dt{color:#7578e6}
.covid a:hover dl dt:before{margin-left:.2em;margin-right:.3em;border-left-color:#7578e6}
.covid a:hover dl dd{color:#19378d}

/*--search--*/
section.search,section.covid{width:1100px;margin:1em auto}
.search h2{padding:.2em 0 .2em 2em;line-height:31px;background:url(../img/common/loope_b.gif) 1% no-repeat;}
div.search{background:#efefef;padding:1.5em 1em;display:flex;flex-wrap:wrap;justify-content:center;line-height:2.5em}
.search form{position:relative}
div.search dl:first-child{width:35%;}
div.search dl:nth-of-type(2){width:36%}
div.search dl:nth-of-type(3){width:29%;position:relative}
div.search dt{clear:left;float:left;display:inline-block;width:4em;font-weight:bold;text-align:right;font-size:.9em}
div.search dd{margin-left:4em;}
div.search dd select,div.search dd input{padding:.2em .5em}
div.search dl:nth-of-type(2) dt{width:3em}
div.search dl:nth-of-type(3) dt{width:6em}
div.search dl:nth-of-type(3) dt span{font-size:.8em;position:absolute;bottom:1.8em;left:-1em}
div.search dl:nth-of-type(2) dd{margin-left:3em;}
div.search dl:nth-of-type(3) dd{margin-left:6em;}
.sbtn{position:absolute;width:27%;display:flex;justify-content:space-around;right:1em;bottom:1.5em;align-items:flex-end}
.sbtn li{width:45%;text-align:center}
.sbtn input{text-align:center;color:#fff;padding:.2em 0;cursor:pointer;border:1px solid;width:100%}
.sbtn input[type="reset"]{background:#9f9f9f;border-color:#9f9f9f}
.sbtn input[type="submit"]{background:#64b6e5;border-color:#64b6e5}
.sbtn input:hover{background:#fff;}
.sbtn input[type="reset"]:hover{color:#9f9f9f}
.sbtn input[type="submit"]:hover{color:#64b6e5}


/*--new_slide--*/
section.new_slide{width:1100px; margin:2em auto;}
ul.class{padding:1em;background:#efefef;display:flex;justify-content:flex-start;flex-wrap:wrap}
ul.picup div.slick-track{display:flex;}
ul.class li{padding:0;background:#fff;margin:.5em;width:18.5%}
ul.picup li.slick-slide{float:none;height:inherit}
ul.picup h4{font-size:.8em;margin-bottom:.2em}
ul.class li a{display:block;height:100%;padding:.5em}
/*figure.pics{margin:.2em auto;position:relative;}
figure.pics img{height:180px; margin:0 auto;display:block;object-fit:contain;}*/
figure.pics{overflow: hidden;
    width: 180px;/* トリミングしたい枠の幅 */
    height: 180px;/* トリミングしたい枠の高さ */
    position: relative;}
figure.pics img{position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit:contain;
}
figure.pics+p{padding:.5em 0;font-size:.9em;color:#000;line-height:1.2em;min-height:3.5em}
ul.class li dt{text-align:center;color:#fff;background:#4caf50;margin-bottom:.5em}
ul.class li dd{padding:0 .2em;font-size:.9em;color:#4caf50;line-height:1.4em}
ul.class li dl.exp dt{background:#ff9800;}
ul.class li dl.exp dd{color:#ff9800;}
ul.class li dl.oneday dt{background:#2196f3;}
ul.class li dl.oneday dd{color:#2196f3;}

/*--room--*/
section.room{width:1100px; margin:2em auto;}
.room h2{border:none;}
ul.tab_btn{border-bottom:3px #1493d6 solid;display:flex;flex-wrap:wrap;justify-content:flex-start;}
ul.tab_btn li{width:auto;margin-right:.5em;}
ul.tab_btn li a{display:block;padding:.5em 1em;border:1px #1493d6 solid;position:relative;top:1px;color:#1493d6;text-align:center;}
ul.tab_btn li a.tab_on{background:#1493d6;color:#fff;}
ul.tab_btn li.point{}
ul.tab_btn li.point a{font-weight:bold;border:1px #f74682 solid;color:#f74682;padding:.5em 1.5em}
ul.tab_btn li.point a.tab_on{background:#f74682;color:#fff}
.tab_area{display:none;}

p.hksn_btn{margin:1em auto 2em;width:80%;text-align:center}
p.hksn_btn a{display:block;border:3px #f74682 double;padding:.5em 1em;border-radius:1em;font-size:1.5em;color:#fff;background:#f74682}
p.hksn_btn a:hover{color:#f74682;background:#fff}

/*--colm--*/
section.colm{margin:2em auto;display:flex;flex-direction:row-reverse;justify-content:space-between;flex-wrap:wrap}
.cright{width:70%;}
.cleft{width:25%;}
.colm iframe{width:100%;}
.cright div#map {height: 600px;width: 100%;margin-bottom: 2em;}
.cleft .fb-page{height:auto;margin-top:1.5em}
.fb-page iframe{height:450px ! important;}
/*.cright iframe{height:600px;margin-bottom:2em}*/
ul.tile{display:flex;flex-wrap:wrap;justify-content:space-between;width:100%}
ul.tile li a:after{content:"";margin:0;}

p.nodata {border: 1px #ccc solid;background: #f8f8f8;text-align: center;font-weight: bold;color: #ccc;padding: 2em .5em;margin-bottom: 3em;/*display: none;*/}
/*div.ticket:empty+p.nodata{display:block;}*/

/*---inqbtn---*/
p.inqbtn{margin:3em auto;text-align:center;width:1180px;}
p.inqbtn a{width:69%;display:inline-block;padding:.5em 1em .5em 15%;background:url(../img/common/doc.png) 8% no-repeat #ff6d9e;text-align:left;font-size:2em;letter-spacing:.1em;color:#fff;font-weight:bold;border:1px #fff solid;outline:2px #ff6d9e solid;}
p.inqbtn a span{display:inline-block;margin-left:4em;font-size:.5em;vertical-align: middle;}
p.inqbtn a:hover{opacity:.8;outline:3px #ff5722 solid}

@media only screen and (max-width: 700px){

section h2, section.colm h3{font-size:1em;}

/*--hero--*/
div.hero,ul.thumnav{width:100%;}
ul.topimg{width:90%}
ul.thumnav li{width:30%}

.slick-prev:before, .slick-next:before{font-size:16px;z-index:10}
.slick-prev{left:-16px;}
.slick-next{right:-16px;}

.picup .slick-prev{left:0px;}
.picup .slick-next{right:0px;}

#news-container{width:100%;margin:1em auto}
#news-container ul{width:80%}
#news-container ul li a{display:block;padding:5px 0 5px 10px; font-size:.7em; text-align:left; line-height:1.4em;}
#news-container span.news,#news-container span.event{padding:1px 2px; margin:0 5px; font-size:.7em;border-radius: 2px;}

section.search,section.covid,section.new_slide,section.room,section.colm,p.inqbtn{width:95%;margin:.5em auto}

div.search{padding:1em .5em 3.5em;line-height:2em}
div.search dl:first-child,div.search dl:nth-of-type(2),div.search dl:nth-of-type(3){width:100%;font-size:.8em}
div.search dl select,div.search dl input[type="text"]{width:100%;}
div.search dl:nth-of-type(2) dt{width:4em}
div.search dl:nth-of-type(2) dd{margin-left:4em;}
div.search dl:nth-of-type(3) dt span{bottom:-2em;left:0}
.sbtn{width:100%;right:inherit;bottom:.5em}

/*figure.pics img{height:75px}*/

figure.pics{overflow: hidden;
    width: 135px;/* トリミングしたい枠の幅 */
    height: 135px;/* トリミングしたい枠の高さ */
    position: relative;
    margin: 0 auto;
}

figure.pics+p{padding:.2em 0;line-height:1.4em;font-size:.8em;}
ul.class{padding:.5em}
ul.class li{width: calc(100% / 3 - 4px);margin:2px;font-size:.8em}
ul.class li a{padding:.2em}
ul.class li h4{font-size:.7em}
ul.class li dt{font-size:.8em;}
ul.class li dd{padding:0 .2em;font-size:.8em;}

/*ul.picup.class{padding:.5em 0;width:95%;margin:0 auto}*/
ul.picup.class{padding:.5em 1em;position:relative;z-index:1}
ul.picup.class li{margin:.2em;width:30%}

ul.tab_btn{padding-bottom:.5em;}
ul.tab_btn li{width: calc(100% / 3 - 4px);margin:2px}
ul.tab_btn li a{padding:.2em .5em;font-size:.9em;}
ul.tab_btn li a.kahoku{font-size:.6em;padding:.6em 0}

p.hksn_btn{width:90%;}
p.hksn_btn a{font-size:1em}
    
section.colm{flex-direction:row;}
.cright,.cleft{width:100%;display:block}
    .cleft a[href$="pdf"]:after{content:none} 
.cleft .fb-page{height:400px;margin:1em auto;width:98%;}
.cright iframe{height:400px;margin-bottom:1em}
.cright div#map {height: 400px;width: 100%;margin-bottom: 2em;}
ul.tile{justify-content:flex-start;}
ul.tile li{width:calc(100%/3);padding:1px}

p.nodata{margin-bottom:1em}

p.inqbtn{margin:2em auto;text-align:center;}
p.inqbtn a{width:90%;padding:.5em 1em .5em 18%;background:url(../img/common/doc.png) 5% / 8% no-repeat #ff6d9e;font-size:1em;}
p.inqbtn a span{margin-left:1em}
}

div.tube{width:1100px;margin:0 auto;border:2px #f00 solid;padding:1em 2em;border-radius:1em;line-height:1.4em}
div.tube p{margin:1em auto;}
div.tube a{display:block;text-align:center;color:#f00;padding:1em;border-radius:1em;font-weight:bold;letter-spacing:.1em;font-size:1.2em;border:2px #f00 solid;border-radius:1em;}
div.tube a:hover{background:#f00;color:#fff}
div.tube dl{margin:1em auto;width:80%;display:flex;flex-wrap:wrap;justify-content:center;align-items: center}
div.tube dt{width:10em;background:#ffe6e6;border-radius:1em;text-align:center;padding:.8em 0;font-weight:bold}
div.tube dd{margin-left:2em}
div.tube p.kome{text-indent:-1em;padding-left:1em;font-size:.9em;text-align:center}

.atte {padding: 1em 2em;border: 1px #ccc solid;border-radius: 1em;background: #fefefe;margin: 1em auto;}

@media only screen and (max-width: 700px){
div.tube{width:95%;font-size:1em;padding:.5em 1em}
div.tube p{margin:.5em auto}
div.tube a{letter-spacing:normal}
div.tube dl{width:90%}
div.tube dt,div.tube dd{width:100%;padding:.2em 0;text-align:center;margin:0 auto}
div.tube p.kome{text-align: left}
}

@media only screen and (max-width: 493px){
    
figure.pics{overflow: hidden;
    width: 120px;/* トリミングしたい枠の幅 */
    height: 120px;/* トリミングしたい枠の高さ */
    position: relative;
    margin: 0 auto;
}
ul.class li{width: calc(100% / 2 - 4px);margin:2px;font-size:.8em}
ul.tab_btn li{width: calc(100% / 2 - 4px);margin:2px}
ul.tile{justify-content:space-around;}
ul.tile li{width:calc(100%/2);padding:1px;text-align:center}

.covid dl{padding:.5em 1em;margin:.5em auto}   
.covid dt{width:100%;color:#0096d5;border-bottom:1px #0096d5 solid;margin-bottom:.5em}
.covid dd{width:100%}

.fb-page iframe{width:100% ! important;}
}