@charset "utf-8";
/* ===================================================
	Home CSS
====================================================== */
/* ---------------------------------------------------

------------------------------------------------------ */
#gnav { box-shadow: none;}
#main_img { width: 100%; height: 750px; padding: 0; overflow: hidden;}
#main_img img { min-width: 1600px;}
#main_img .flexslider { margin: 0; border: none; background: none; position: relative;}
#main_img p { width: 1100px; color: #fff; font-size: 36px; position: absolute; top: 320px; left: calc(50% - 550px); z-index: 10;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	text-shadow: 0 0 10px #4c3023, 0 0 7px #4c3023, 0 0 3px #4c3023; overflow: hidden;
}
#main_img p span { margin: 0 5px; font-size: 50px;}

@media screen and (max-width: 1100px) {
	#main_img p { width: 700px; left: 190px;}
}

@media screen and (max-width: 600px) {
	#main_img { height: auto;}
	#main_img p { width: 100%; padding: 0 4%; font-size: 6.5vw; top: 170px; left: 0; box-sizing: border-box;}
	#main_img p span { font-size: 8vw;}
	#main_img .flexslider .slides > li { overflow: hidden;}
	#main_img img { min-width: 700px; position: relative; left: 50%; transform: translateX(-50%);}
}


/* ---------------------------------------------------
#lead
------------------------------------------------------ */
#lead { padding: 125px 0; background: url(../../img/lead_bg.jpg)no-repeat center; background-size: cover;
 text-shadow: 0 0 10px #973721, 0 0 7px #973721, 0 0 3px #973721; color: #fff; text-align: center;}
#lead h2 { font-size: 36px; font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#lead p { padding-top: 20px; line-height: 2; font-size: 16px;}

@media screen and (max-width: 600px) {
	#lead { padding: 40px 0;}
	#lead h2 { font-size: 22px;}
	#lead p { text-align: left;}
}


/* ---------------------------------------------------
#plan
------------------------------------------------------ */
#plan { padding-bottom: 60px; background: #fbfbfb; box-shadow: -1px 4px 7px 0px #dcdad6;}
#plan h3 { padding-bottom: 40px; font-size: 42px; color: #2b3339; text-align: center;
	-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#plan h3 span { display: block; width: 100px; height: 35px; padding-top: 5px; margin: 0 auto 10px; color: #fff; font-size: 16px;
	border-radius: 50% / 0 0 100% 100%; background: #916f47; text-align: center;}
#plan #recommend { display: flex; flex-wrap: wrap;}
#plan .PlanView { width: 22%; max-width: 245px; margin-right: 4%;}
#plan .PlanView:nth-of-type(4n) { margin-right: 0;}
#plan .PlanView .explan { padding: 20px 0 0;}
#plan .PlanView .explan .plan { margin-bottom: 10px;}
#plan .PlanView .explan .plan a { text-decoration: underline;}
#plan .PlanView .explan .plan a:hover { text-decoration: none;}
#plan .PlanView .comment { padding-bottom: 20px;}
#plan .PlanView .planlist a { display: block; position: relative; box-sizing: border-box; padding: 7px; background: linear-gradient(#96764e, #75532c); color: #fff; text-align: center; text-decoration: none;}
#plan .PlanView .planlist a:hover { background: linear-gradient(#755429, #865f33); text-decoration: none;}
#plan .PlanView .planlist a::before{ position: absolute; top: calc(50% - 4px); right: 8px; box-sizing: border-box;
	margin: auto;width: 4px; height: 4px; border: 4px solid transparent; border-left: 4px solid #fff; content: ""; vertical-align: middle;
}


@media screen and (max-width: 600px) {
	#plan { padding-bottom: 30px;}
	#plan h3 { padding-bottom: 20px; font-size: 28px;}
	#plan #recommend { justify-content: space-between;}
	#plan .PlanView { width: 48%; padding: 0 0 25px; margin-right: 0;}
	#plan .PlanView .comment { padding-top: 10px;}
	#plan .PlanView .planlist a { font-size: 14px;}
}



/* ---------------------------------------------------
#sec1
------------------------------------------------------ */
#sec1 { width: 1600px; max-width: 100%; margin: 0 auto; padding: 70px 0 0;}
#sec1 h3 { padding-bottom: 50px; font-size: 46px; color: #2b3339; text-align: center;
	-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#sec1>div div { overflow: hidden; width: 50%;}
#sec1>div div img { max-width: none;}
#sec1>div dl { width: 30%; padding-top: 40px;}
#sec1>div dl dt { padding-bottom: 15px; border-bottom: 1px solid #ccc; color: #a07612; font-size: 26px; text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#sec1>div dl dd { padding-top: 20px; line-height: 2;}
#sec1>div dl dd a { float: right; padding: 5px 55px; margin-top: 30px; background: linear-gradient(#96764e, #75532c); color: #fff; text-align: center;}
#sec1>div dl dd a:hover { background: linear-gradient(#755429, #865f33); text-decoration: none;}

#sec1>div:nth-of-type(odd) div { float: left;}
#sec1>div:nth-of-type(odd) dl { float: left; margin-left: 3%;}

#sec1>div:nth-of-type(even) div { float: right;}
#sec1>div:nth-of-type(even) dl { float: left; margin-left: 17%;}

@media screen and (max-width: 1300px) {
	#sec1>div dl { width: 40%;}
	#sec1>div:nth-of-type(even) dl { margin-left: 6%;}
}

@media screen and (max-width: 600px) {
	#sec1 { padding-top: 40px;}
	#sec1 h3 { padding-bottom: 30px; font-size: 31px;}
	#sec1>div div { width: 100%!important; float: none!important;}
	#sec1>div div img { max-width: 100%;}
	#sec1>div dl { width: 92%!important; float: none!important; padding-top: 15px; margin: 0 auto 40px!important;}
	#sec1>div dl dt { padding-bottom: 7px; font-size: 21px;}
	#sec1>div dl dd { padding-top: 10px; line-height: 1.6;}
	#sec1>div dl dd a { display: block; width: 100%; float: none; padding: 5px; box-sizing: border-box; font-size: 14px;}
	#sec1>div dl dd a.arrow::before { right: 5px;}
}



/* ---------------------------------------------------
#sec2
------------------------------------------------------ */
#sec2 { padding: 50px 0 100px; background: #f5f5f5; color: #555;}
#sec2 h3 { padding-bottom: 50px; font-size: 34px; color: #2b3339; text-align: center;
	-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#sec2 dl { display: table; width: 100%;}
#sec2 dl dt { display: table-cell; width: 30%; padding: 15px 40px; vertical-align: middle; background: #e9dece; border-bottom: 1px solid #fff; text-align: center;}
#sec2 dl dd { display: table-cell; padding: 15px 40px; vertical-align: middle; border-bottom: 1px solid #e9dcca;}

@media screen and (max-width: 600px) {
	#sec2 { padding: 30px 0 50px}
	#sec2 h3 { padding-bottom: 20px; font-size: 25px;}
	#sec2 dl { display: block;}
	#sec2 dl dt { display: block; width: 100%; padding: 5px; box-sizing: border-box; border-bottom: none;}
	#sec2 dl dd { display: block; padding: 10px 8px 15px; box-sizing: border-box;}
}


#plan:after,
#sec1>div:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0;}
