@charset "UTF-8";


.linkbtn {
	position:relative;
	color:#fff;
	padding:0.8em;
	text-align:center;
	background-image:url(../images/bg_linkbtn.gif);
	background-repeat:repeat;
	background-position:top left;
	border-radius:1.2em;
	overflow:hidden;
}
.linkbtn img {position:absolute;transition:all 1s ease-in-out;transform:translate(-300px,-20px);opacity:1;}

.linkbtn:hover img {opacity:1;transform:translate(300px,-20px);}


.linkbtn a {
	font-size:1.2em;
	color:#fff;
	text-decoration:none;
}

h2 {font-size:2em;padding:0.2em;text-align:center;}
h2 img {padding-right:0.5em;}


img {border:none;vertical-align: top;}
ul {padding:0;margin:0;list-style:none;}


#wrapper {
	margin: 0 auto;
	padding:0;
	width: 100%;
	/*background:url(../images/bg_wrapper.gif) repeat-x top 78px left 120px; */
}

.inner {
	width: 1000px;
	margin: 0 auto;
}


#ImageArea {
		width: 100%;margin-top:0px;padding:0;
}

#VideoArea {width:100%;height:900px;overflow:hidden;}

@media screen and (min-width:1700px) {
#VideoArea {height:1000px;}
}

@media screen and (max-width:1100px) {
#VideoArea {height:800px;}
}


/* Slick set */
.slider {margin:0 auto;}
.slider img {width:100%;}
.slick-slide img {width: 100%;height:100%;}
.slick-slide div {line-height:0;}



#contentsArea {border-top: 1px solid #111;}

.topfw {position:absolute;top:0px;left:-55px;z-index:88;margin:0;}

/* Concept Area */

#SuisyunConcept {
	padding: 20px 0 30px;
	margin-top:0px;
	z-index:10;
	height:210px;
}
#SuisyunConcept .inner {
	width:80%;
	padding:40px 90px 40px 40px;
	margin-top:2.5em;
	margin-left:auto;margin-right:auto;
	text-align:left;
	background-color:#fff;
	background-image:url(../images/bg_concept_light2.png),url(../images/bg_spout.png);
	background-position:top 2px center,bottom -23px right -20px;
	background-repeat:no-repeat,no-repeat;
	border-top:1px solid #d7d7d7;
}
#SuisyunConcept p {color:#111;letter-spacing:0.1em;font-size:15px;line-height:180%;}


/* Shop Appeal Section */

#AppealArea .inner {overflow:visible;width:1000px;}


#AppealArea {
	padding-top:1em;
	background-color:#fff;
	background-image:url(../images/red-line.gif);
	background-position:top center;
	background-repeat:no-repeat;
	z-index:1;
}


#AppealArea h2 {background:url(../images/bg_main_btm.jpg) repeat-x bottom 1px left;padding-bottom: 1.5em;}


#AppealArea h3 {font-size:2.4em;text-align:center;}
#AppealArea h3::before{
	content: url(../images/onsen_mark.gif);
	margin: 0px;
	position: relative;
	right: 6px;
	vertical-align:top;
}
#AppealArea #matsuiyamate h3 {font-size:2em;}

.appSec {background:url(../images/bg_main_btm.jpg) repeat-x bottom 2px left;padding-bottom: 4.5em;}

.app-bg {
	background-color:#fff;height:640px;background-position:center top;background-repeat:no-repeat;
	background-attachment: fixed;
	border-top: 1px solid #333;
}

.app-area.effect {margin-top:50px;width:500px;padding:1.8em;background-color:rgba(255,255,255,1);padding-bottom:4em;
		transition:all 1s ease-in-out;-webkit-transition: all 0.8s ease-in-out;transition-delay:0.2s;}
.app-area.effect.fade {margin-top:-50px;}


@media screen and (min-width:1400px) {
#AppealArea .inner {overflow:visible;width:1120px;}
.app-area {margin-top:-50px;width:600px;}
}



.app-bg {
	opacity: 0;
	transition: all 2s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
}

#ashiya .app-bg.lazyloaded {background-image:url(../images/pn_ashiya.jpg);opacity: 1;}
#matsuiyamate .app-bg.lazyloaded {background-image:url(../images/pn_matsuiyamate.jpg);opacity: 1;}
#moriyama .app-bg.lazyloaded {background-image:url(../images/pn_moriyama.jpg);opacity: 1;}
#kumamoto .app-bg.lazyloaded {background-image:url(../images/pn_kumamoto.jpg);opacity: 1;}
#mino .app-bg.lazyloaded {background-image:url(../images/pn_mino.jpg);opacity: 1;}
#neyagawa .app-bg.lazyloaded {background-image:url(../images/pn_kohri.jpg);opacity: 1;}
#tsurumi .app-bg.lazyloaded {background-image:url(../images/pn_tsurumi.jpg);opacity: 1;}
#kusatsu .app-bg.lazyloaded {background-image:url(../images/pn_kusatsu.jpg);opacity: 1;}



.app-area table {width:100%;margin-top:2em;border-collapse:collapse;}
.app-area table caption {text-align:center;}
.app-area table th {width:25%;text-align:left;padding:1em;border:1px solid #ddd;}
.app-area table td {width:75%;text-align:left;padding:1em;border:1px solid #ddd;}

.subArea.effect  {margin-top:8.5em;width:400px;transition:all 0.8s ease-in-out;	-webkit-transition: all 1s ease-in-out;transition-delay:0.5s}
.subArea.effect.fade  {margin-top:4.5em;}

.subArea ul.slider2 {}


/* SuisyunInfo Section */


#SuisyunInfo {background:url("../images/bg_ka.gif") repeat 0 0;padding: 2.5em 0;}

.top_tt {padding:0px 0 10px;}

#topics {height:100%;}

#SuisyunInfo ul,#mediaInfo ul {
	height:200px;
	margin:15px auto;
	overflow-y:scroll;
}

ul.list {width:98%;margin-top:30px;}
ul.list li {
	margin-top:5px;
	font-size:14px;color:#111;
	padding-left:20px;
	background:url("../images/icon_footer_yazi.gif") no-repeat top 4px left;
}
ul.list li:first-child {margin-top:0;}


#topics li:first-child {margin-top:0;}

#mediaInfo {background:url("../images/bg_ka0.gif") repeat 0 0;padding:2.5em 0;}




.flex-box {
	display:flex;
	width:100%;
	flex-wrap:wrap;
}


/* suisyun-ticket */
.suisyun-ticket {
	padding:100px 0;
	border-bottom:1px solid #aaa;
}

.suisyun-ticket .flexBox-wrapper {
	display:flex;
	width:100%;
	flex-flow: row wrap;
	justify-content:space-between;/* リンクBox2つの時 */
}
.suisyun-ticket .flexBox {
	display:block;
	width:48%;
	margin-top:50px;
	text-align:center;
	box-shadow:2px 2px 10px #c1c1c1;
	position:relative;
}
.suisyun-ticket .flexBox:after {
	position:absolute;
	top:15px;right:20px;
	content:">";
	font-weight:lighter;
	font-size:40px;
	color:#fff;
}
.suisyun-ticket .flexBox a {
	display:block;
	font-size:26px;
	padding:40px 0;
	text-decoration:none;
	transition : all 0.3s ease 0s;
	background: #f41e1e;
	color:#fff;
}
.suisyun-ticket .flexBox a:hover {
	background:#ff7575;
}
.suisyun-ticket .flexBox .sub {
	font-size:18px;margin-top:20px;
	display:block;
}





/* sns */
.sns {box-sizing:border-box;border:1px solid #353535;width:calc(33.333% - 16px);padding: 10px;margin:8px;color:#111;background:#fafafa;text-align:center;}
.sns .tt {font-size:18px;border-bottom:1px dashed #fff;margin:10px;}
.sns a:hover {color:#ffc844;}




.LinkBox {
	box-sizing:border-box;
	border:1px solid #353535;
	width:calc((100% - 24px)/4);
	padding: 5px;
	margin-right:8px;
	color:#111;
	background:#fafafa;
	text-align:center;
}
.LinkBox:nth-child(4n) {
	margin-right:0px;
}

.LinkBox {font-size:14px;color:#ddd;}
.LinkBox .tt {overflow:hidden;}


.LinkBox a {font-size:14px;text-align:center;}


#SuisyunMap {width:92%;margin:2em auto;}
#SuisyunMap h2 {margin:50px 0;}




/* shareBox */
.shareBox {
	margin-left:auto;margin-right:auto;
	padding:10px;
	border:1px solid #eee;
}
.share-Btn {height:30px;float:left;padding-left:5px;margin-bottom:5px;}
.share-Btn:first-child {padding-left:0;}




.wid10 {width:10%;}.wid10_m100 {width:10%;}
.wid15 {width:15%;}.wid15_m100 {width:15%;}
.wid20 {width:20%;}.wid20_m100 {width:20%;}
.wid25 {width:25%;}.wid25_m100 {width:25%;}
.wid30 {width:30%;}.wid30_m100 {width:30%;}
.wid33 {width:33%;}.wid33_m100 {width:33%;}
.wid35 {width:35%;}.wid35_m100 {width:35%;}
.wid40 {width:40%;}.wid40_m100 {width:40%;}
.wid45 {width:45%;}.wid45_m100 {width:45%;}
.wid48 {width:48%;}.wid48_m100 {width:48%;}
.wid50 {width:50%;}.wid50_m100 {width:50%;}
.wid55 {width:55%;}.wid55_m100 {width:55%;}
.wid58 {width:58%;}.wid58_m100 {width:58%;}
.wid60 {width:60%;}.wid60_m100 {width:60%;}
.wid65 {width:65%;}.wid65_m100 {width:65%;}
.wid70 {width:70%;}.wid70_m100 {width:70%;}
.wid75 {width:75%;}.wid75_m100 {width:75%;}
.wid80 {width:80%;}.wid80_m100 {width:80%;}
.wid85 {width:85%;}.wid85_m100 {width:85%;}
.wid90 {width:90%;}.wid90_m100 {width:90%;}
.wid95 {width:95%;}.wid95_m100 {width:95%;}
.wid98 {width:98%;}.wid98_m100 {width:98%;}
.wid100 {width:100%;}




.box3divs {float:left;width:auto;}
.box2divs {float:left;width:auto;}
.box2divs:last-child {margin-right:0;}

.box3divs img {width:100%;}
.box2divs img {width:100%;}



