@charset "utf-8";
/* CSS Document */


.slick-initialized .slick-slide img {
  width: 100%;
}

/* ---- overview ---- */

#overview .photo_area {
	width: 773px;
	float: left;
}

#overview .photo_area li:focus {
	outline: none;
}

#overview .txt_area {
	position: relative;
	width: 300px;
	height: 525px;
	float: right;
}

#overview .txt_area .txt_box {
	position: absolute;
	bottom: -0.3em;
}

#overview .txt_area .date {
	font-size: 38px;
	line-height: 1.2;
}

#overview .txt_area .date span {
	font-size: 35px;
}

#overview .txt_area .date span.date_s {
	font-size: 20px;
}

#overview .txt_area .time {
	padding-bottom: 7px;
	font-size: 22px;
}

#overview .txt_area .txt_box .f_gothic {
    padding: 0 5px 0 0;
}


/* ---- howto ---- */

#howto .howto_step {
	overflow: hidden;
}

#howto .howto_step li {
	width: 250px;
	margin-right: 45px;
	background: url(../img/howto_arrow_pc.png) right 13px top 30px no-repeat;
	float: left;
}
#howto .howto_step li:last-child {
	margin-right: 0;
	background: none;
}

#howto .howto_step .step_img {
	display: block;
	margin: 0 auto 30px;
  height: 248px;
}

#howto .howto_step .step_img.step_img_02 {
  height: 287px;
}

#howto .howto_step p {
	margin-bottom: 24px;
}

#howto .howto_step .link_btn {
	display: block;
	padding: 8px 32px 8px 0;
	margin-bottom: 15px;
	background:#fff url(../common/img/arrow_01_s.png) right 10px top 44% no-repeat;
	border: 2px solid #000;
	color: #000;
	font-size: 19px;
	letter-spacing: 0.03em;
	text-align: center;
	text-decoration: none;
	box-sizing: border-box;
}

#howto .howto_step .link_btn:last-child {
	margin-bottom: 0;
}


/* ---- ticket ---- */

#ticket {
	text-align: center;
}

#ticket_notes {
	margin-bottom: 20px;
}

#ticket .l_caution {
	margin-bottom: 45px;
  font-size: 14px;
}

#ticket #ticket_time {
	width: 750px;
	padding: 30px 0;
	margin: 0 auto 30px;
	background: url(../img/ticket_time_bg.jpg) 0 0;
	color: #2e4f1f;
	letter-spacing: 0.1em;
	overflow: hidden;
}

.p750{
  width: 750px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

#ticket #ticket_time li {
	width: 229px;
	border-right: 1px solid #2e4f1f;
	float: left;
  line-height: 1.4;
	font-size: 28px;
  padding: 0 0 0 20px;
	text-align: left;
}

#ticket #ticket_time li:last-child {
	border-right: 0;
}


/* ---- experience ---- */

#experience {
	text-align: center;
}

#experience .h-large_black .en {
	margin-top: -7px;
}

#experience .h-large_black .en span {
	font-size: 20px;
}

#experience .time {
	padding: 15px 0;
	font-size: 34px;
	letter-spacing: 0.1em;
}


/* ---- map ---- */

#map .btn_box{
	margin-top: 45px;
	overflow: hidden;
}

#map .btn_box .link_btn{
	display: block;
	width: 400px;
	padding: 20px 20px 20px 0;
	margin-right: 40px;
	background:#fff url(../common/img/arrow_01_l.png) right 22px top 45% no-repeat;
	border: 2px solid #000;
	color: #000;
	font-size: 24px;
	letter-spacing: 0.1em;
	text-align: center;
	text-decoration: none;
	box-sizing: border-box;
	float: left;
}

#map .btn_box .link_btn:last-child {
	margin-right: 0;
}


/* ---- rain ---- */

#rain .txt_box {
	width: 705px;
	margin: 0 auto;
	overflow: hidden;
  text-align: center;
}

#rain .txt_box p.txt_rain {
  padding: 10px 15px;
  background: #e7151e;
  margin-top: 15px;
  color: #fff;
  border-radius: 3px;
}


/* ---- brand ---- */

#brand {
	min-width: 1100px;
	background: url(../img/bg_01_pc.jpg) 0 0;
}

#brand h3 {
	margin-bottom: 15px;
}

#brand .center_txt {
	margin-top: 40px;
	text-align: center;
}

.separate_box {
	overflow: hidden;
}

.separate_box section {
	width: 400px;
	margin-right: 40px;
	float: left;
}

.separate_box section img {
	width: 100%;
}

.separate_box section:last-child {
	margin-right: 0;
}


/* ---- howto_drink ---- */

#howto_drink {
	min-width: 1100px;
	background: url(../img/bg_02_pc.jpg) 0 0;
}

#howto_drink h3 {
	padding-left: 0.5em;
	margin-bottom: 5px;
	border-radius: 15px;
	color: #fff;
	font-size: 23px;
	text-align: center;
	line-height: 30px;
	letter-spacing: 0.5em;
}

#howto_drink #howto_drink_matcha h3 {
	background-color: #91c52b;
}
#howto_drink #howto_drink_sencha h3 {
	background-color: #a48123;
}

#howto_drink li {
	padding: 20px 10px 0 2em;
	text-indent: -2em;
	line-height: 1.4;
}

#howto_drink .white_box {
	margin-top: 10px;
	padding: 18px;
	font-size: 14px;
	line-height: 1.7;
	background-color: #fff;
}


/* ---- list_past ---- */

#list_past .btn_box{
	display:flex;
  flex-wrap:wrap;
  column-gap: 45px;
  row-gap:20px;
}

#list_past .btn_box .link_btn{
	display: block;
	width: 250px;
	padding: 8px 20px 8px 0;
	background:#fff url(../common/img/arrow_01_s.png) right 10px top 44% no-repeat;
	border: 2px solid #000;
	color: #000;
	font-size: 19px;
	letter-spacing: 0.1em;
	text-align: center;
	text-decoration: none;
	box-sizing: border-box;
	float: left;
}



/* ==== Smart phone ==== */

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

	/* ---- overview ---- */

	#overview {
		margin: 0;
		border-bottom: 1px solid #cdcdcd;
	}

	#overview .photo_area {
		width: auto;
		float: none;
	}

	#overview .photo_area li:focus {
		outline: none;
	}

	#overview .txt_area {
		position: relative;
		width: auto;
		height: auto;
		padding: 4.7% 4.7% 10%;
		float: none;
	}

	#overview .txt_area .txt_box {
		position: static;
	}

	#overview .txt_area .date {
		font-size: calc(100vw / ( 320 / 30 ));
		line-height: 1.2;
	}

	#overview .txt_area .date span {
		font-size: calc(100vw / ( 320 / 28 ));
	}

	#overview .txt_area .time {
		padding-bottom: 12px;
		font-size: calc(100vw / ( 320 / 20 ));
		line-height: 1.4;
	}


	/* ---- howto ---- */

	#howto .howto_step li {
		width: auto;
		margin-right: 0;
		padding-bottom: 76px;
		background: url(../img/howto_arrow_sp.png) center bottom 29px no-repeat;
		background-size: 7.8%;
		float: none;
	}
	#howto .howto_step li:last-child {
		background: none;
	}

	#howto .howto_step .step_img,
  #howto .howto_step .step_img.step_img_02{
		width: 100%;
    height: auto;
		margin: 0 auto 5.2%;
	}

	#howto .howto_step p {
		margin-bottom: 3.1%;
	}

	#howto .howto_step .link_btn {
		width: 80%;
		padding: 10px 10px;
		margin: 0 auto;
		background:#fff url(../common/img/arrow_01_l.png) right 7px top 44% no-repeat;
		background-size: 15px;
		border: 1px solid #000;
		font-size: calc(100vw / ( 320 / 15 ));
		line-height: 1.45;
	}

	#howto .howto_step .link_btn .sp_small {
		display: block;
		font-size: calc(100vw / ( 320 / 12 ));
	}

	#howto .howto_step .btn_box {
		overflow: hidden;
	}

	#howto .howto_step .btn_box .link_btn {
		width: 48.3%;
		padding: 4px 10px;
		margin-right: 3.4%;
		float: left;
	}

	#howto .howto_step .btn_box .link_btn:last-child {
		margin-right: 0;
	}

	#howto .howto_step .step_03 {
		padding-bottom: 0;
	}


	/* ---- ticket ---- */

	#ticket {
		text-align: left;
	}
  
  #ticket_notes {
		margin-bottom: 6.5%;
  }

  #ticket .l_caution {
		margin-bottom: 6.5%;
  }

	#ticket #ticket_time {
		width: auto;
		padding: 3% 0;
		margin: 0 auto;
		background: url(../img/ticket_time_bg.jpg) 0 0;
		background-size: 375px;
		color: #2e4f1f;
		letter-spacing: 0.1em;
		overflow: hidden;
	}

	.p750{
 	 width: 100%;
	}

	#ticket #ticket_time li {
		position: relative;
		width: auto;
		padding: 4.6% 0 4.6% 22%;
		border-right: 0;
		float: none;
	}

	#ticket #ticket_time li::after {
		content: "";
		position: absolute;
		bottom: 0;
		left: 20%;
		width: 60%;
		height: 1px;
		background-color: #2e4f1f;
	}

	#ticket #ticket_time li:last-child::after {
		display: none;
	}


	/* ---- experience ---- */

	#experience {
		text-align: left;
	}

	#experience .h-large_black .en {
		margin-top: -3px;
	}

	#experience .h-large_black .en span {
		font-size: calc(100vw / ( 320 / 10 ));
	}

	#experience .time {
		padding: 2.7% 0 4.7%;
		font-size: calc(100vw / ( 320 / 19 ));
		text-align: center;
	}

	#experience ul li,
  #ticket ul.l_caution li{
		padding-left: 1em;
		text-indent: -1em;
	}


	/* ---- map ---- */

	#map .map_wrapper {
		width: auto;
		margin: 0 -5.17%;
	}

	#map .btn_box{
		margin-top: 6.9%;
		overflow: hidden;
	}

	#map .btn_box .link_btn{
		width: 48.3%;
		padding: 4px 10px;
		margin-right: 3.4%;
		background:#fff url(../common/img/arrow_01_l.png) right 7px top 44% no-repeat;
		background-size: 15px;
		border: 1px solid #000;
		font-size: calc(100vw / ( 320 / 15 ));
		line-height: 1.45;
		float: left;
	}

	#map .btn_box .link_btn:last-child{
		margin-right: 0;
	}

	#map .btn_box .link_btn .sp_small {
		display: block;
		font-size: calc(100vw / ( 320 / 12 ));
	}



	/* ---- rain ---- */

	#rain .txt_box {
		width: auto;
		margin: 0 auto;
		overflow: hidden;
	}

	#rain .txt_box p {
		width: auto;
		margin-bottom: 5.6%;
    text-align: left;
	}
  
  
/* ---- corona ---- */

	#corona .txt_box {
		width: auto;
		margin: 0 auto;
		overflow: hidden;
    text-align: left;
}	


	#corona .txt_box ul {
		width: 100%;
		margin: 0;
	}



	/* ---- brand ---- */

	#brand {
		min-width: 0;
		background: url(../img/bg_01_pc.jpg) 0 0;
	}

	#brand h3 {
		margin-bottom: 4.7%;
	}

	#brand .center_txt {
		margin-top: 8%;
		text-align: left;
	}

	.separate_box {
		overflow: hidden;
	}

	.separate_box section {
		width: auto;
		margin: 0 0 8%;
		float: none;
	}

	.separate_box section:last-child {
		margin-bottom: 0;
	}


	/* ---- howto_drink ---- */

	#howto_drink {
		min-width: 0;
		background: url(../img/bg_02_pc.jpg) 0 0;
	}

	#howto_drink h3 {
		margin-bottom: 6%;
		font-size: calc(100vw / ( 320 / 18 ));
	}

	#howto_drink li {
		padding: 0 0 2% 2em;
		text-indent: -2em;
	}

	#howto_drink .white_box {
		margin: 2% 0 12%;
		padding: 3%;
		font-size: calc(100vw / ( 320 / 11 ));
	}
    
    
  /* ---- list_past ---- */
  
	#list_past .map_wrapper {
		width: auto;
		margin: 0 -5.17%;
	}

  #list_past .btn_box{
		padding-top: 0;
		overflow: hidden;
	}

  #list_past .btn_box .link_btn{
		width: 48.3%;
		padding: 10px;
		background:#fff url(../common/img/arrow_01_l.png) right 7px top 44% no-repeat;
		background-size: 15px;
		border: 1px solid #000;
		font-size: calc(100vw / ( 320 / 15 ));
		line-height: 1.45;
		float: left;
	}
  
  #list_past .btn_box{
    column-gap: 3.4%;
    row-gap: .8em;
  }

}