@charset "UTF-8";


/*--------------------------------------------------------------
#screen_area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#screen_area {
		margin: 0;
		padding: 0 0 25px 0;
		overflow: hidden;
		position: relative;
	}
	
	.main_area {
		width: 100%;
		height: 40vh;
		overflow: hidden;
		position: relative;
		z-index: 0;
	}
	
	.show-list {
		margin: 0;
		padding: 0;
		z-index: 0;
	}
	
	.show-list li.show-img1 {
		height: 40vh;
		background: url("image/slide/img1.jpg") top center/ cover no-repeat;
	}
	
	.show-list li.show-img2 {
		height: 40vh;
		background: url("image/slide/img2.jpg") top center/ cover no-repeat;
	}
	
	.show-list li.show-img3 {
		height: 50vh;
		background: url("image/slide/img3.jpg") top center/ cover no-repeat;
	}
	
	.show-list li.show-img4 {
		height: 40vh;
		background: url("image/slide/img4.jpg") top center/ cover no-repeat;
	}
	
	.show-list li.show-img5 {
		height: 40vh;
		background: url("image/slide/img5.jpg") top center/ cover no-repeat;
	}
	
	.show-list li.show-img6 {
		height: 40vh;
		background: url("image/slide/img6.jpg") top left/ cover no-repeat;
	}
	
	.show-list li.show-img7 {
		height: 40vh;
		background: url("image/slide/img7.jpg") top left/ cover no-repeat;
	}
	
	.main_area p {
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		left: 5%;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
		width: 70px;
		height: auto;
	}
	
	.tentomushi {
		margin: 0;
		padding: 0;
		position: absolute;
		bottom: 0;
		left: 8%;
		width: 60px;
		height: auto;
	}

}

/* Small than tablet */
@media (min-width: 768px) {
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	
	.main_area {
		margin: 0;
		padding: 0;
		width: 100%;
		min-width: 1100px;
		height: 600px;
	}
	
	.show-list li.show-img1 {
		height: 100vh;
		background: url("image/slide/img1.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.show-list li.show-img2 {
		height: 100vh;
		background: url("image/slide/img2.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.show-list li.show-img3 {
		height: 100vh;
		background: url("image/slide/img3.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.show-list li.show-img4 {
		height: 100vh;
		background: url("image/slide/img4.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.show-list li.show-img5 {
		height: 100vh;
		background: url("image/slide/img5.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.show-list li.show-img6 {
		height: 100vh;
		background: url("image/slide/img6.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.show-list li.show-img7 {
		height: 100vh;
		background: url("image/slide/img7.jpg") top center no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
	}
	
	.main_area p {
		margin: 0;
		padding: 0;
		position: absolute;
		top: 50%;
		left: 15%;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
		width: 130px;
		height: auto;
	}

	
	.tentomushi {
		margin: 0;
		padding: 0;
		position: absolute;
		bottom: 0;
		left: 10%;
		width: 110px;
		height: auto;
	}

}



/*--------------------------------------------------------------
#introduction_area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	.flower {
		margin: 0;
		padding: 0;
		position: absolute;
		top: 0;
		right: 5%;
		width: 70px;
		height: auto;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	.flower {
		display: none;
	}
	
}


/*--------------------------------------------------------------
#information_title
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#information_title {
		margin: 0;
		padding: 0;
		position: relative;
	}
	
	.archi {
		marin: 0;
		padding: 0;
		width:300px;
		position: absolute;
		top: 0;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	#information_title {
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	
	.archi {
		marin: 0;
		padding: 0;
		width: 550px;
		position: absolute;
		top: 0;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	.archi {
		marin: 0;
		padding: 0;
		width: 600px;
		position: absolute;
		top: 0;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
	
}

/*--------------------------------------------------------------
#information_area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#information_area {
		margin: 0;
		padding: 0;
		background: url("image/img_top2_item.png") top left no-repeat;
		-webkit-background-size: 100% auto;
		background-size: 100% auto;
		background-color: #EEF2E6;
		position: relative;
		overflow: hidden;
	}
	
	.kamakiri {
		display: none;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	#information_area {
		padding: 20px 0 0 0;
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#information_area {
		margin: 0;
	}
	
	
}

/* Larger than tablet */
@media (min-width: 1300px) {
	
	.kamakiri {
		display: inherit;
		marin: 0;
		padding: 0;
		width: 165px;
		position: absolute;
		top: 0;
		right: 5%;
	}
	
}

/*--------------------------------------------------------------
.tab
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {

	ul.tab {
		margin: 0 5px;
		padding: 0;
		overflow: hidden;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
	}
	
	ul.tab li {
		width: 50%;
		margin: 0 2px;
		padding: 0;
		font-family: 'RocknRoll One', sans-serif;
		font-size: 13px;
		text-align: center;
		border-top-left-radius: 15px;  
		border-top-right-radius: 15px;
		position: relative;
	}
	
	.tab1 {
		background: -webkit-linear-gradient(70deg, rgb(235, 188, 62), rgb(250, 138, 69));
		background: linear-gradient(70deg, rgb(235, 188, 62), rgb(250, 138, 69));
	}
	
	.tab2 {
		background: -webkit-linear-gradient(70deg, rgb(80, 214, 162), rgb(43, 193, 248));
		background: linear-gradient(70deg, rgb(80, 214, 162), rgb(43, 193, 248));
	}
	
	.tab3 {
		background: -webkit-linear-gradient(70deg, rgb(244, 141, 161), rgb(211, 115, 219));
		background: linear-gradient(70deg, rgb(244, 141, 161), rgb(211, 115, 219));
	}
	
	.tab3 p {
		letter-spacing: -1px;
	}
	
	
	ul.tab li i {
		display: none;
	}
	
	ul.tab li span {
		margin: 0;
		padding: 0;
		font-size: 12px;
		display: block;
	}
	
	ul.tab li a {
		margin: 0;
		padding: 10px 0;
		display: block;
		text-align: center;
		-webkit-transition: all .3s;
		transition: all .3s;
	}
	
	ul.tab li a:link {
		color: #FFF;
		text-decoration: none;
	}
	
	ul.tab li a:visited {
		color: #FFF;
		text-decoration: none;
	}
	
	ul.tab li a:hover, a:active, a:focus {
		text-decoration: none;
	}
	
	ul.tab li:hover a {
		opacity: 0.7;
	}
	
	.tab-content {
		margin: 0 20px;
		padding: 0;
		overflow: hidden;
	}
	
	.area {
		display: none;
	}
	
	#tab1,
	#tab2,
	#tab3 {
		position: relative;
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	
	.tab-content p {
		margin: 0 auto 30px auto;
		padding: 0;
		width: auto;
		position: relative;
	}
	
	.tab_1 {
		margin: 0 0 0 -12px;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		left: 15%;
	}
	
	.tab_2 {
		margin: 0 -12px 0 0;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
	.tab_3 {
		margin: 0 -12px 0 0;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		right: 15%;
	}
	

}

/* Small than tablet */
@media (min-width: 768px) {
	
	ul.tab li i {
		font-size: 15px;
		position: absolute;
		top: 50%;
		left: 15px;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		display: inherit;
	}
	
	.tab3 p {
		letter-spacing: 0;
	}
	
	ul.tab li span {
		font-size: 15px;
	}
	
	.tab_1 {
		margin: 0 0 0 -12px;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		left: 17%;
	}
	
	.tab_2 {
		margin: 0 -12px 0 0;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
	.tab_3 {
		margin: 0 -12px 0 0;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		right: 17%;
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	ul.tab {
		width: 880px;
		font-size: 22px;
		margin: 0 auto;
		padding: 0;
	}
	
	ul.tab li {
		margin: 0 5px;
		font-size: 20px;
	}
	
	
	ul.tab li a {
		margin: 0;
		padding: 20px 0;
	}
	
	.tab-content {
		margin: 0 auto;
	}
	
	.tab-content p {
		width: 900px;
	}

	.tab_1 {
		margin: 0 0 0 -12px;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		left: 160px;
	}
	
	.tab_2 {
		margin: 0 -12px 0 0;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
	.tab_3 {
		margin: 0 -12px 0 0;
		padding: 0;
		width: 15px;
		position: absolute;
		top: 0;
		right: 160px;
	}
	
}


/*--------------------------------------------------------------
.area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	.area {
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	
	.area ul {
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	
	.area ul li {
		margin: 0 10% 20px 10%;
		padding: 0;
		width: auto;
		text-align: center;
	}
	
	.area ul li a {
		margin: 0;
		padding: 0;
		display: block;
		-webkit-transition: all .3s;
		transition: all .3s;
	}
	
	.area ul li:hover a {
		opacity: 0.7;
	}
	
	.area dl {
		margin: 0;
		padding: 0;
	}
	
	.area dt {
		margin: 0 0 10px 0;
		padding: 0;
	}
	
	.area dd {
		margin: 0;
		padding: 0;
		color: #660230;
		font-size: 20px;
		font-weight: 500;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	.area ul {
		margin: 0;
		padding: 0;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
	}
	
	.area ul li {
		margin: 0 30px;
		padding: 0;
		width: auto;
		text-align: center;
	}
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	.area ul li {
		margin: 0 30px;
		padding: 0;
		width: 320px;
		text-align: center;
	}
	
	.area dl {
		margin: 0;
		padding: 0;
	}
	
	.area dt {
		margin: 0 0 10px 0;
		padding: 0;
	}
	
	.area dd {
		margin: 0;
		padding: 0;
		color: #660230;
		font-size: 20px;
		font-weight: 500;
	}

}

/*--------------------------------------------------------------
#pickup_area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#pickup_area {
		margin: 0 0 20px 0;
		padding: 100px 0 10px 0;
		position: relative;
		background: url("image/ground_2.png") top center no-repeat;
		-webkit-background-size: 110% auto;
		background-size: 110% auto;
	}
	
	#pickup_area p {
		margin: 0 0 45px 0;
		padding: 0;
		text-align: center;
		font-family: 'RocknRoll One', sans-serif;
		color: #413B3E;
		font-size: 20px;
	}
	
	.pickup {
		marin: 0;
		padding: 0;
		width: 93%;
		position: absolute;
		top: 130px;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
	#pickup_area ul {
		margin: 0;
		padding: 0;
	}
	
	#pickup_area ul li {
		margin: 0 10% 50px 10%;
		padding: 0;
		width: auto;
		overflow: hidden;
	}
	
	#pickup_area dl {
		margin: 0;
		padding: 0;
		text-align: center;
	}
	
	#pickup_area dt.photo {
		margin: 0 0 10px 0;
		padding: 0;
		line-height: 0;
	}
	
	#pickup_area dt.photo img {
		border-radius: 20px;
	}
	
	#pickup_area dt.title {
		margin: 0 0 10px 0;
		padding: 0;
		font-family: 'RocknRoll One', sans-serif;
		font-size: 22px;
		color: #660230;
	}
	
	#pickup_area dt.title span {
		margin: 5px 0 0 0;
		padding: 0;
		font-size: 9px;
		display: block;
	}
	
	#pickup_area dd.text {
		margin: 0 0 15px 0;
		padding: 0;
		font-size: 14px;
	}
	
	.tonbo {
		marin: 0;
		padding: 0;
		width: 80px;
		position: absolute;
		top: -20px;
		left: 5%;
	}
	
	.kabutomushi {
		marin: 0;
		padding: 0;
		width: 100px;
		position: absolute;
		top: 170px;
		right: 2%;
	}

}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#pickup_area {
		margin: 0;
		padding: 120px 0 80px 0;
		overflow: hidden;
		position: relative;
		background: url("image/ground_2.png") top center no-repeat;
		-webkit-background-size: 1460px auto;
		background-size: 1460px auto;
	}
	
	#pickup_area p {
		margin: 0 0 45px 0;
		padding: 0;
		text-align: center;
		font-family: 'RocknRoll One', sans-serif;
		color: #413B3E;
		font-size: 28px;
	}
	
	.pickup {
		marin: 0;
		padding: 0;
		width: 515px;
		position: absolute;
		top: 130px;
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	
	#pickup_area ul {
		margin: 0;
		padding: 0;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
	}
	
	#pickup_area ul li {
		margin: 0 20px;
		padding: 0;
		width: 500px;
	}
	
	#pickup_area dl {
		margin: 0;
		padding: 0;
		text-align: center;
	}
	
	#pickup_area dt.photo {
		margin: 0 0 10px 0;
		padding: 0;
		line-height: 0;
	}
	
	#pickup_area dt.photo img {
		border-radius: 20px;
	}
	
	#pickup_area dt.title {
		margin: 0 0 10px 0;
		padding: 0;
		font-family: 'RocknRoll One', sans-serif;
		font-size: 22px;
		color: #660230;
	}
	
	#pickup_area dt.title span {
		margin: 5px 0 0 0;
		padding: 0;
		font-size: 9px;
		display: block;
	}
	
	#pickup_area dd.text {
		margin: 0 0 15px 0;
		padding: 0;
		font-size: 14px;
	}
	
	.tonbo {
		marin: 0;
		padding: 0;
		width: 130px;
		position: absolute;
		top: 0;
		left: 10%;
	}
	
	.kabutomushi {
		marin: 0;
		padding: 0;
		width: 140px;
		position: absolute;
		top: 120px;
		right: 10%;
	}
	
}




/*--------------------------------------------------------------
#news_area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#news_area {
		margin: 0 auto 60px auto;
		padding: 40px 30px 40px 30px;
		overflow: hidden;
		background: #FFF;
		border-radius: 10px;
		box-sizing: border-box;
	
	}
	
	.news {
		margin: 0 0 50px 0;
		padding: 0;
		overflow: hidden;
		width: auto;
	}
	
	.news p {
		margin: 0;
		padding: 0;
		font-family: 'RocknRoll One', sans-serif;
		font-size: 25px;
		color: #660230;
		text-align: center;
	}
	
	.news p span {
		margin: 5px 0 0 0;
		padding: 0;
		font-size: 9px;
		display: block;
	}
	
	.news dl {
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	
	.news dt {
		margin: 0;
		padding: 20px 0 5px 0;
		font-size: 12px;
		position: relative;
	}
	
	.news dt span {
		margin: 0;
		font-size: 11px;
		font-weight: 500;
		color: #FFF;
		border-radius: 5px;
		text-align: center;
		position: absolute;
		top: 15px;
		left: 80px;
		width: 70px;
	}
	
	.tag_news {
		background: #ACD561;
		padding: 3px 0;
	}
	
	.tag_rc {
		background: #ECAA70;
		padding: 3px 0;
	}
	
	.tag_em {
		background: #DB6464;
		padding: 3px 0;
	}
	
	.news dd {
		margin: 0;
		padding: 0 0 20px 0;
		border-bottom: dotted 1px #ccc;
		font-size: 14px;
	}
	
	.news dd a {
		transition: 0.3s;
	}
	
	.news dd a:hover {
		opacity: 0.4;
	}
	
	.instagram {
		margin: 0;
		padding: 0;
		overflow: hidden;
		width: auto;
	}
	
	.instagram p {
		margin: 0 0 20px 0;
		padding: 0;
		font-family: 'RocknRoll One', sans-serif;
		font-size: 22px;
		color: #660230;
		text-align: center;
	}
	
	.instagram p i {
		display: inline-block;
		margin: 0 10px 0 0;
		padding: 0;
		width: 30px;
		height: 30px;
		background: url("image/instaicon.png") no-repeat;
		-webkit-background-size: 28px 28px;
		background-size: 28px 28px;
		vertical-align: middle;
	}

}

/* Small than tablet */
@media (min-width: 768px) {
	
	
	
}


/* Larger than tablet */
@media (min-width: 992px) {
	
	#news_area {
		margin: 0 auto 60px auto;
		padding: 50px;
		overflow: hidden;
		width: 1100px;
		background: #FFF;
		border-radius: 10px;
		box-sizing: border-box;
		
	}
	
	.news {
		margin: 0;
		padding: 0;
		overflow: hidden;
		width: 500px;
		float: left;
	}
	
	.news p {
		margin: 0 0 30px 0;
		padding: 0;
		font-family: 'RocknRoll One', sans-serif;
		font-size: 25px;
		color: #660230;
		text-align: left;
	}
	
	.news p span {
		margin: 0 0 0 20px;
		padding: 0;
		font-size: 9px;
		display: inline;
	}
	
	.news dl {
		margin: 0;
		padding: 0;
		overflow: hidden;
	}
	
	.news dt {
		margin: 0;
		padding: 20px 20px 20px 0;
		float: left;
		font-size: 13px;
	}
	
	
	.news dt span {
		margin: 0;
		font-size: 13px;
		font-weight: 500;
		color: #FFF;
		border-radius: 5px;
		text-align: center;
		position: absolute;
		top: 15px;
		left: 90px;
		width: 80px;
	}
	
	.tag_news {
		background: #ACD561;
		padding: 3px 0;
	}
	
	.tag_em {
		background: #DB6464;
		padding: 3px 0;
	}
	
	.news dd {
		margin: 0;
		padding: 20px 20px 20px 190px;
		border-bottom: dotted 1px #ccc;
		font-size: 14px;
	}
	
	
	
	.instagram {
		margin: 0;
		padding: 0;
		overflow: hidden;
		width: 430px;
		float: right;
	}
	
	.instagram p {
		margin: 0 0 20px 0;
		padding: 0;
		font-family: 'RocknRoll One', sans-serif;
		font-size: 22px;
		color: #660230;
		text-align: left;
	}
	
	.instagram p i {
		display: inline-block;
		margin: 0 10px 0 0;
		padding: 0;
		width: 30px;
		height: 30px;
		background: url("image/instaicon.png") no-repeat;
		-webkit-background-size: 28px 28px;
		background-size: 28px 28px;
		vertical-align: middle;
	}
	
}


/*--------------------------------------------------------------
.insta-area
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	
	#insta {
		margin: 0;
		overflow: hidden;
	}
	
	#insta ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
		display:-webkit-box;
		display:-moz-box;
		display:-ms-flexbox;
		display:-webkit-flex;
		display:-moz-flex;
		display:flex;
		-webkit-box-lines:multiple;
		-moz-box-lines:multiple;
		-webkit-flex-wrap:wrap;
		-moz-flex-wrap:wrap;
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
	}
	
	#insta ul li {
		margin: 1.5%;
		padding: 0;
		width: 30.3%;
		line-height: 0;
		bottom: 0;
		overflow: hidden;
		box-sizing: border-box;
		border-radius: 20px;
	}
	
	
	
	#insta ul li img {
		-webkit-transition: 0.3s ease-in-out;
		-moz-transition: 0.3s ease-in-out;
		-o-transition: 0.3s ease-in-out;
		transition: 0.3s ease-in-out;
		object-fit: cover;
  width: 100%;
  aspect-ratio: 1 / 1;
	}
	
	#insta ul li a:hover img {
		opacity: 0.6;
		filter: alpha(opacity=60);
		-moz-opacity: 0.6;
		border-radius: 20px;
	}
	
	
	#insta li a .like {
		display: none;
	}
	
}

/* Small than tablet */
@media (min-width: 768px) {
	
	#insta {
		margin: 0;
		overflow: hidden;
	}
	

}


/* Larger than tablet */
@media (min-width: 992px) {
	
	
	

}

