@charset "UTF-8";
/* CSS Document */
#mainTop{background:url(../../img/top/bg.jpg); border-bottom:1px solid #b5b5b5; padding:0 0 0;}
#mainVisual img{width:49.0625%; float:left;}
#mainVisual img:nth-of-type(2){float:right;}
#point{padding:0px 10px 25px; text-align:center;}

#info{padding:90px 10px; text-align:center; line-height:1;}
#info h2{color:#3c300a; font-size:12px; margin:0 0 25px; letter-spacing:0.2em;}
#info .txt1{ font-size: 36px; color: #3c300a; max-width: 960px; padding: 0 0 26px; margin: 0 auto 26px; line-height: 1.4; }
#info .txt2{ font-size: 20px; letter-spacing: 0.1em; margin: 0 0 30px; }

#info .txt1 span{font-size: 16px!important; display:block; line-height: 1.5!important; padding-top: 5px;}
#info .txt1 span:last-of-type{font-size: 20px!important;}
#info .txt1 span.txtBig{font-size: 18px!important; font-weight: bold;}
#info ul.infoBtns{ display: flex; justify-content: center}
#info ul.infoBtns li{margin: 0 10px 20px 10px;}
#info ul.infoBtns li a{ max-width:465px; margin:0 auto; width:100%; font-size:24px; padding:25px 50px; display:block; color:#fff;}
#info ul.infoBtns li:first-child a{background:#6c0a00;}
#info ul.infoBtns li:last-child a{background:#b55500;}
#info ul.infoBtns li a:hover{opacity: 0.8;}

.cap{font-size:10px; line-height:1.4; position:absolute; bottom:5px; left:5px; right:5px; text-align:right; color:#3c300a;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, Arial, Helvetica, Verdana, sans-serif;}

#concept{position:relative;}
#concept .inner{position:absolute; top:50%; max-width:1147px; margin:0 auto; left:10px; right:10px; text-align:center;
transform:translateY(-50%); -webkit-transform:translateY(-50%);}
#concept h2{font-size:44px; line-height:1.2; margin:0 0 35px; letter-spacing:0.2em;}
#concept h3{font-size:22px; line-height:1; padding:0 0 24px; margin:0 0 22px; position:relative;}
#concept h3:before{position:absolute; bottom:0; left:0; right:0; width:20px; height:1px; background:#000; margin:0 auto; content:'';}
#concept .txt1{font-size:16px; line-height:2; margin:0 0 140px;}
#concept .txt1 span{display:inline-block;}
#concept .txt2{ font-size: 22px; margin: 0 0 17px; line-height: 1.5; }
#concept figure{margin:0 0 20px;}
#concept a{ max-width: 380px; width: 90%; font-size: 16px; line-height: 1; padding: 15px 0; margin: 0 auto; background: #d4d2c6; color: #000; display: block; }
#concept li{width:47.1%; float:right; padding:60px 0 45px; box-shadow:0px 0px 7px 0px rgba(32, 48, 24, 0.42);
background-image:url(../../img/top/bg_3.jpg); background-size:cover; background-position:center center; background-repeat:no-repeat;}
#concept a:hover{background:#afa572;}
#concept li:nth-of-type(1){float:left; background-image:url(../../img/top/bg_4.jpg); color:#fff;}
#concept li:nth-of-type(1) h3:before{background:#fff;}
#concept li:nth-of-type(1) a{background:#fff;}
#concept li:nth-of-type(1) a:hover{background:#8f8f8d;}

.group{position:relative;}
.group .inner{position:absolute; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); width:590px; color:#fff; text-align:center; font-size:16px; line-height:1.6;}
.group h2{font-size:30px; line-height:1.4; margin:0 0 15px;}
.group .txt{margin:0 0 25px;}
.group a{font-size:14px; border:1px solid rgba(255,255,255,0.4); width:246px; padding:14px 0; display:block; line-height:1.2; background-color:rgba(0,0,0,0.35); margin:0 auto;}

#location .inner{background-color:rgba(46,87,45, 0.75); right:11%; padding:82px 0;}
#location a:hover{background-color:rgba(46,87,45, 1);}
#access .inner{left:0; right:0; margin:0 auto; background-color:rgba(0,40,67, 0.75); padding:50px 0;}
#access a:hover{background-color:rgba(0,40,67, 1);}

#bnr{ margin: 0 auto 35px; }
#bnr li{ width: 25%; margin: 0; float: left;  text-align: center;}
#bnr li:last-of-type{margin:0;}
#bnr a:hover{opacity:0.8;}

/* anime */
#anime{ width: 100%; height: 39.58vw; overflow: hidden; display: block; position: relative;}
#spVisual{display: none;}
#canvas{background-color: rgb(255, 255, 255,0)!important;}
#_preload_div_ { width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; justify-content: center; align-items: center;}
#_preload_div_ span img{ width: 32px; height: auto;}

.infoSp{display: none;}

.bnr360{text-align: center; padding: 20px 10px;}

.mainImg{ max-width: 1500px; margin-top: 0; margin-right: auto; margin-left: auto; background:url(../../img/top/main_scene.png) no-repeat; background-size:100% auto;}

.topInfoBox{max-width: 1460px; margin:0 auto 0px auto;}
.topInfoBox a:hover{opacity: 0.8;}

.placeWrap{float: right; width: 50%; max-width: 710px; padding: 0 10px;}
.ogawaWrap{float: left; width: 50%; max-width: 710px; padding: 0 10px;}

.teigi{margin-bottom: 5px;}
.point_spec{margin-bottom: 10px;}
.placeInfoBox,.ogawaInfoBox{ max-width: 630px; margin: 0 auto 40px; text-align: center; padding-bottom: 15px; }

.placeInfoBox{background-color: #f3f1ea;}
.ogawaInfoBox{background-color: #ededed;}
.infoTit{margin-bottom: 15px;}
.infoImg{margin-bottom: 15px;padding: 0 10px;}
.infoTxt{
	padding: 15px 10px;
	min-height: 330px;
}

.limitedWrap{ background-image: url(../../img/top/bg_limited.jpg); background-repeat: repeat; padding: 70px 0; border-top:2px solid #bbae73; text-align: center;}

.titLimited{margin-bottom: 15px;}

.limitedWrap .mainTit{font-size: 36px;}
.bodyTxt{font-size: 16px;margin-bottom: 30px;}

.stepBox{max-width: 800px; margin: auto;}
.stepBox .tit{background-color: #696969; color: white; padding: 5px 0; margin-bottom: 25px;}
.stepBox ul{display: flex; justify-content: center;}
.stepBox ul li{margin: 0 20px 10px; width: 30%}


.limitedWrap .btnBox{padding: 30px 0;}
.limitedWrap .btnBox ul{ justify-content: center; }
.limitedWrap .btnBox ul li{margin: 0 15px 10px;}
.limitedWrap .btnBox a:hover{opacity: 0.8;}

.conceptWrap{text-align: center;}
.conceptMainImg{margin-bottom: 60px;}
.txtSeijaku{margin-bottom: 40px;}
.conceptWrap .subTit{font-size: 18px; margin-bottom: 15px;}
.conceptWrap p{line-height: 1.8;}
.gainenzu{max-width: 790px; margin: auto;}
.gainenzu figcaption{text-align: right; font-size: 10px;}
.conceptWrap figure{margin-bottom: 50px;}
.jitsubutsu{margin-bottom: 10px;}



.holiday{ margin: 20px auto; max-width: 800px; border: 1px solid #ccc; padding: 25px; line-height: 1.6; font-size: 14px; background-color: white; clear: both; } 
.holiday a{
	text-decoration: underline;
	color: black;
	text-align: center !important;
	font-size: 16px;
}

.holiday ul.cp_list {
	padding:0.5em;
	list-style-type:none;
}
.holiday ul.cp_list li {
	position:relative;
	padding: 0em 0.3em 0.3em 1.3em;
	margin-bottom: 6px;
}
.holiday ul.cp_list li:last-of-type {
	margin-bottom: 0px;
}

.holiday ul.cp_list li::before {
	position: absolute;
	content: '';
	display: block;
	top: 0.5em;
	left: 0;
	width: 6px;
	height: 6px;
	border-right: 2px solid #000;
	border-bottom: 2px solid #000;
	transform: rotate(-45deg);
}

.holidayBase{
	background-color: #fff;
	padding: 30px 10px;
	border-top: 2px solid #bbae73;
	text-align: center;
}

.bnr360Box{text-align: center;padding: 80px 0 30px;}
.bnr360Box p{font-size: 36px;margin-bottom: 20px;}

.bnr360Box ul{
	display: flex;
	justify-content: center;
	margin-top: 30px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
}
.bnr360Box ul li{margin: 0 20px 20px;}

.bnr360Box .txtCap {font-size: 14px;}
.bnr360Box .txtCap a{color: white; padding: 10px 30px; display: inline-block; margin: 0 20px 20px;  background-color: #393a34}


.sceneFinal img{position: absolute;}
.sceneFinal span{position: relative; left: 0; top: 0; display: block; z-index: 99999;}

/* add 19.09.19 */
.bnr_gallery { text-align: center; margin-bottom: 50px; }



/*20200514*/

.stayHome{padding:80px;max-width: 1024px; margin: 80px auto; text-align: center; border: 1px solid #999;}
.stayHome .tit{margin-bottom: 30px;}
.stayHome p{margin-bottom: 30px;}
.stayHome .flowImg{margin-bottom: 20px;}
.stayHome p:nth-of-type(2){text-align: right; font-size: 10px;}
.stayHome p:nth-of-type(2) a{text-decoration: underline}
.stayHome .btnStayhome a{background-color: #000; display: block; color: white; font-size: 16px; padding: 15px 10px; border-radius: 5px;}


.akasakaMap{
	text-align: center;
	font-size: 16px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 10px;
}
.akasakaMap b{font-size: 18px;margin-bottom: 15px;display: block; }
.akasakaMap .mapImg{padding: 40px 10px 0;}


.holidayKokuchi{max-width: 800px; background-color: #ffeaea; margin:50px auto ; padding: 30px}
.holidayKokuchi b{color:#E40B0E}

.otherTPH{
	background-color: #434343;
	padding-top: 30px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 70px;
	text-align: center;
	color: white;
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ 明朝", serif;
}
.otherTPH p.tit{
	background-color: #434343;
	padding-top: 50px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 30px;
	text-align: center;
	color: white;
	font-size: 24px;
}
.otherTPH ul{max-width: 700px; margin: auto; display: flex; justify-content: space-between;}
.otherTPH ul li{width: 46%;}
.otherTPH ul li p{padding-top: 5px; font-size: 13px;}
.otherTPH ul li p.small{padding-top: 5px; font-size: 11px;}
.otherTPH ul li a:hover{opacity: 0.8;}


#concept{ padding-right: 10px; padding-left: 10px; background-repeat: no-repeat; background-position: center bottom; background-size: 100% auto;  margin-bottom: 50px;}
#concept #imgBg{display:none;}	
#concept .inner{position:static; transform:translateY(0); -webkit-transform:translateY(0);}
#concept .txt1{margin:0 0 10%;}


.bnrAsakatsu{text-align: center; padding: 30px 10px;}

@media only screen and (max-width:767px){
	#anime{display: none;}
	#spVisual{display: block;}
}

/* add 2019-12-17 */
#top-anime{margin:0 0 20px;}
#top-anime .sp{display: none;}
#top-anime object,
#top-anime #animation_container{width: 100%!important;}
#top-anime, #top-anime object {width: 100%;	height: 46.4vw;	overflow: hidden;}

@media print, screen and (max-width: 767px){
#top-anime{margin:0;}
#top-anime .pc{display: none;}	
#top-anime .sp{display: block;}
#top-anime, #top-anime object {width: 100%;	height: 100vw; overflow: hidden;}
}

/*===============================
             MEDIA
================================*/
@media screen and (min-width:0\0) and (min-width:1000px){  /* IE */
#info a{padding:28px 0 22px;}
#concept a{padding:24px 0 20px;}
.group a{padding:16px 0 12px;}
}


@media only screen and (max-width:1200px){
#mainTop{padding:0;}	
#point{padding:20px 10px 15px;}

#concept h2{font-size:40px;}
#concept h3{font-size:2vw;}
#concept li{width:48.5%; padding:6% 0 4.5%;}	
#concept .txt2{font-size:2.2vw;}
#concept figure{width:60%; margin:0 auto 20px;}

.group .inner{font-size:14px; width:450px;}
.group h2{font-size:24px;}

#location .inner{right:5%; padding:60px 0;}
#access .inner{padding:28px 0;}
}

@media only screen and (max-width:767px){
#mainTop{padding:14px 0 0 0; border-top:1px solid #cac4c4;}

#mainVisual img{width:97%;}
#mainVisual img:nth-of-type(1){margin:0 0 3%;}
.mainImg{background:none;}

#info{padding:20px 10px 80px;}
#info .txt1{ font-size: 5.5vw!important; color: #3c300a; max-width: 960px; padding: 0 0 26px; margin: 0 auto 26px; line-height: 1.4; }
#info .txt1 span.txtBig{font-size: 3vw!important; font-weight: bold; display: inline-block; padding-top: 15px;}
	#info .txt1 span.txtBig br{display: block !important;}
#info .txt1 span{font-size: 2vw !important; text-align: left;}
#info .txt1 span:last-of-type{text-align: center; font-size: 4vw !important;}
#info .txt1 span br{display: none;}

	
#concept{padding:0; background:url(../../img/top/bg_2_sp.jpg) no-repeat center bottom; background-size:100% auto;}
#concept h2{font-size:6.2vw; margin:0 0 25px;}
#concept h3{font-size:4vw;}

#concept .txt1{margin:0 0 30px;}
#concept .txt2{font-size:4.2vw;}
#concept li{width:calc( 100% - 20px ); float:none !important; padding:30px 10px; margin:0 auto 5% !important;}
#concept .cap{position:static; padding:0 5px 5px;}

.group .inner{max-width:590px; width:calc( 100% - 20px );}
.group h2{font-size:4.2vw;}

#location .inner{right:0; left:0; margin:0 auto; padding:5.5% 0;}
#access .inner{padding:3% 0;}

#bnr{max-width:250px;}
.slick-list{width:200px; margin:0 auto;}
#bnr li{width:100%;}
.slick-arrow{position:absolute; top:3px; background-repeat:no-repeat; background-size:100% auto; width:9px; height:50px; text-indent:-9999px;}
.slick-prev{background-image:url(../../img/top/btn_prev.gif); left:0;}
.slick-next{background-image:url(../../img/top/btn_next.gif); right:0;}


.holiday{ font-size: 12px;} 
.infoSp{display: block;}
	
.placeWrap{float: none; width: 100%; background-color: white; padding: 10px 10px;}
.ogawaWrap{float: none; width: 100%; background-color: #373737; padding: 10px 10px;}

.infoTxt{padding: 15px 10px ; min-height: auto;}
	
.limitedWrap .mainTit{font-size: 7vw; line-height: 1.5; margin-bottom: 10px;}
.bodyTxt{font-size: 3.5vw;}
	

.stepBox{max-width: 800px; margin: auto 15px;}
.stepBox ul{display: block; }
.stepBox ul li{margin: 0 auto 20px; width: 60%;}
	

.limitedWrap .btnBox ul{display: block;}
.limitedWrap .btnBox ul li{margin: 0 15px 10px;}
	
.txtSeijaku{margin:0 15px 20px; }
.conceptWrap p.subTit{text-align: center ;}

.conceptWrap p{line-height: 1.5; padding: 0 15px;text-align: left;}
	
.btnConcept{max-width: 60%; margin: auto}
	
.holiday{ margin: 30px 10px; } 	
	
.bnr360Box p{font-size: 5.5vw;margin-bottom: 20px;}
.bnr360Box ul{display: block; }
.bnr360Box ul li{text-align: center; width: 100%; margin: 0 0 20px 0;}
	
.bnr360Box .txtCap a.ogawa{ display: block; width: 320px; margin: 0 auto; }
.bnr360Box .txtCap a.place{  display: block; width: 320px; margin: 0 auto;}
	
.otherTPH p.tit{font-size:4.5vw;}
	.otherTPH ul{display: block; padding: 0 40px;}
	.otherTPH ul li{width: 100%; margin-bottom: 40px;}
}

@media only screen and (max-width:480px){
#info .txt1{font-size:7vw;}
#info .txt2{font-size:4.6vw;}

#concept h3{font-size:4.5vw;}
#concept .txt1{font-size:14px;}
#concept .txt2{font-size:4.8vw;}
#concept a{padding:15px 0; width:70%; font-size:14px;}

.group h2{margin:0 0 8px; font-size:4.9vw;}
.group .txt{font-size:3.3vw; margin:0 0 8px;}
.group a{font-size:12px; width:180px; padding:8px 0;}
}
