@charset "utf-8";

@media screen and (max-width: 767px) {}
@media screen and (min-width: 768px) and (max-width: 1024px) {}
@media screen and (min-width: 768px) {}

/*-------------------------------------------------
共通指定
-------------------------------------------------*/
/*タイトル*/
h1.title_top_01{ text-align: center; font-size: 24px; font-weight: bold;}
h1.title_top_02{ text-align: center; font-size: 20px; background: #a5a5a5; color: #fff; padding: 10px;}

/*ボタン*/
p.btn_01 a{ background: #7d7d7d; color: #fff; font-family: Arial, Helvetica, "sans-serif";}
p.btn_01 a:hover{ background: #9d9d9d;}
p.btn_01 span{ background: #7d7d7d; color: #fff; font-family: Arial, Helvetica, "sans-serif";}
p.btn_01 span:hover{ background: #9d9d9d;}

.box_home_contents_01{ clear: both;}

/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	h1.title_top_01{ margin-bottom: 40px;}
	h1.title_top_02{ margin-bottom: 20px;}
	
	p.btn_01 a{ padding: 10px 24px;}
	p.btn_01 span{ padding: 10px 24px;}
}
@media screen and (min-width: 768px), print {
	h1.title_top_01{ margin-bottom: 50px;}
	h1.title_top_02{ margin-bottom: 40px;}
	
	p.btn_01 a{ padding: 10px 24px;}
	p.btn_01 span{ padding: 10px 24px;}
}
/*-------------------------------------------------
レイアウト
-------------------------------------------------*/
.bor_t_01{ border-top: 4px solid #f2f2f2;}

/*--------------------Slider*/
.slider_frame{}

/*--------------------About EVAGARDEN*/
.box_about_frame_01{/* background: #000;*/ border: 4px solid #000; overflow: hidden;}
.box_about_frame_01 h1{/* color: #fff;*/ text-align: center; font-weight: bold;}
.box_about_contents_01{ background: #fff;}
.box_about_contents_01 h2,.box_about_contents_01 h3{ font-weight: bold; margin-bottom: 1em;}
.box_about_contents_02 iframe{ width: 100%;}

/*--------------------INGREDIENTS*/
.box_ingredients_frame_01{ overflow: hidden;}
.box_ingredients_frame_01 h2{ font-weight: bold;}

/*--------------------PICKUP*/
.box_pickup_frame_01{ overflow: hidden;}
.box_pickup_frame_01 ul{ text-align: center; display: flex; justify-content: center;}
.box_pickup_frame_01 ul li{ float: left;}
.box_pickup_frame_01 ul li dl dd{ font-weight: bold; /*color: #7d7d7d;*/}

/*--------------------TOPICS*/
.box_topics_frame_01{}
.box_topics_frame_01 ul{ overflow: hidden;}
.box_topics_frame_01 ul li{ overflow: hidden; border-bottom: 1px solid #e1e1e1; padding-bottom: 20px; margin-bottom: 20px;}
.box_topics_frame_01 ul li dl dt{ font-weight: bold;}
.box_topics_frame_01 ul li dl dd{ font-style: oblique;}
.topics_p_01{ float: left;}

/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	.bor_t_01{ padding-top: 40px;}
	
	.slider_frame{ width: 100%;}
	
	.box_about_frame_01{ padding: 30px 10px 10px; margin-bottom: 60px;}
	.box_about_frame_01 h1{ font-size: 2em; margin-bottom: 10px;}
	.box_about_r{ margin-bottom: 10px;}
	.box_about_contents_01{ padding: 20px;}
	.box_about_contents_01 h2{ font-size: 1.4em;}
	.box_about_contents_01 p{ font-size: 0.9em;}
	.box_about_contents_02 iframe{ height: 240px;}
	
	.box_ingredients_frame_01{ margin-bottom: 40px;}
	.box_ingredients_frame_01 p{ margin-bottom: 30px;}
	.box_ingredients_frame_01 h2{ font-size: 1.2em; margin-bottom: 10px; text-align: center;}
	.box_ingredients_frame_01 ul{ margin-left: -4%; text-align: center;}
	.box_ingredients_frame_01 ul li{ float: left; width: 30%; margin-left: 3.3%; margin-bottom: 20px; font-size: 0.9em; letter-spacing: -0.1em;}
	
	.box_pickup_frame_01{ padding-top: 40px; margin-bottom: 30px;}
	.box_pickup_frame_01 ul{ margin-right: -2%;}
	.box_pickup_frame_01 ul li{ width: 48%; margin-right: 2%; padding-top: 10px; border-top: 4px solid #ebebeb; margin-bottom: 30px;}
	.box_pickup_frame_01 ul li h2{ font-size: 1.8em; margin-bottom: 10px;}
	.box_pickup_frame_01 ul li dl dd{ margin-bottom: 16px; padding: 0 1em;}
	
	.box_topics_frame_01{ margin-bottom: 60px;}
	.box_topics_frame_01 ul{ margin-bottom: 20px;}
	.box_topics_frame_01 ul li{ padding-bottom: 20px; font-size: 0.8em;}
	.box_topics_frame_01 ul li dl{ padding-left: 31vw;}
	.box_topics_frame_01 ul li dl dt{ margin-bottom: 0.5em; font-size: 1.1em;}
	.topics_p_01{ width: 30vw;}
}
@media screen and (min-width: 768px), print {
	.bor_t_01{ padding-top: 50px;}

	.slider_frame{ width: 100%; max-width: 1280px; margin: 0 auto 70px;}
	
	.box_about_frame_01{ padding: 56px 76px; margin-bottom: 90px;}
	.box_about_frame_01 h1{ font-size: 28px; width: 320px; margin: 0 auto 40px; border-bottom: 2px solid #000; line-height: 0.8; padding-bottom: 12px;}
	.box_about_l{ float: left; width: 530px;}
	.box_about_r{ float: right;}
	.box_about_contents_01{ /*height: 417px; padding: 30px;*/ margin-bottom: 30px;}
	.box_about_contents_01 h2{ font-size: 1.4em; line-height: 1.4;}
	.box_about_contents_02 iframe{ height: 309px;}
	
	.box_ingredients_frame_01{ text-align: center; margin-bottom: 120px;}
	.box_ingredients_frame_01 p{ font-size: 1.2em; margin-bottom: 60px;}
	.box_ingredients_frame_01 h2{ font-size: 1.2em; margin-bottom: 20px;}
	.box_ingredients_frame_01 ul{ margin-left: 50px;}
	.box_ingredients_frame_01 ul li{ float: left; margin-right: 20px;}
	
	.box_pickup_frame_01{ margin: 0 50px 90px;}
	.box_pickup_frame_01 ul{ margin-right: -40px;}
	.box_pickup_frame_01 ul li{ width: 265px; margin-right: 40px;}
	.box_pickup_frame_01 ul li h2{ font-size: 30px; margin-bottom: 10px}
	.box_pickup_frame_01 ul li dl dt{ margin-bottom: 20px;}
	.box_pickup_frame_01 ul li dl dd{ padding-bottom: 16px; margin-bottom: 24px; border-bottom: 4px solid #ebebeb;}
	
	.box_topics_frame_01{ margin-bottom: 90px;}
	.box_topics_frame_01 ul{ margin: 0 80px 20px;}
	.box_topics_frame_01 ul li a:hover dl dt{ text-decoration: underline;}
	.box_topics_frame_01 ul li time{ font-size: 12px; padding-left: 10px;}
	.box_topics_frame_01 ul li dl{ padding-left: 150px;}
	.box_topics_frame_01 ul li dl dt{ font-size: 18px; margin-bottom: 16px;}
	
}