@charset "utf-8";

.topGroupName{width: 100%;}

#commonWrapperGuide {
	max-width: 1000px!important;
 	width: 100%!important;
 	margin: 0 auto!important;
	}


/* ▼ guide  */

/*-----------------
 top
-------------------*/

.guide-cont { margin-bottom: 0 0 20px 0;}

.guide_menu ul{
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
.guide_menu ul li.guideNavTtl {
	font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6";
	padding: 10px 0;
	color: #644c1f;
	border-bottom: 1px solid #bfa77a;
	font-size: 120%;
	width: 100%;
	}

.guide_menu ul li.guideNavTtl a { color: #644c1f; }

.guide_menu ul li .guideNavLi {
	padding: 15px 10px;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    display: inline-block;
	border-bottom: 1px dotted #cfcfcf;
	font-size: 90%;
	width: 100%;
}

.guide_menu ul li .guideNavLi:after {
	position: absolute;
    top: 43%;
    right: 15px;
    width: 7px;
    height: 7px;
    content: "";
	border-top: solid 1px #333333;
    border-right: solid 1px #333333;
    transform: rotate(45deg);
}

.guide_ttlWrap{
	text-align: center;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
h2.guide_ttl {
 display: inline-block;
 font-size: 2.667rem;
 border-bottom: 3px solid #bfa77a;
 padding: 0 15px;
 margin-bottom: 30px;
	}
@media screen and (max-width: 449px){
	h2.guide_ttl {
	 font-size: 2.1rem;
	}
}


.guideBox {
	overflow: hidden;
	width: 100%;
	border: 1px solid #bfa77a;
	box-sizing: border-box;
	margin-bottom: 15px;
	min-height: 200px;
}
.guideBox_list {
	display: inline-block;
	width: 49%;
	margin-right: 1%;
}
.guideBox_list_nmr {
	display: inline-block;
	width: 49%;
}
.guideBox_tittle_area {
	width: 100%;
	background-color: #bfa77a;
	border-bottom: 1px solid #bfa77a;
	padding: 15px 30px;
	font-size: 110%;
	color: #fff;
}

.guideBox_tittle_area span {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    display: inline-block;
	width: 100%;
}

.guideBox_tittle_area span:after {
	position: absolute;
    top: 35%;
    right: 0;
    width: 7px;
    height: 7px;
    content: "";
	border-top: solid 1px #fff;
    border-right: solid 1px #fff;
    transform: rotate(45deg);
}

a:link .guideBox_tittle_area  { color: #fff;}

a:hover .guideBox_tittle_area {
 	opacity: 0.8;
	filter: alpha(opacity=80);
}


.guideBox_inner {
	width: 100%;
}

.guideBox_inner ul { margin-top: 5px;}
.guideBox_inner ul li {
	font-size: 85%;
}

.guideBox_inner li .guide_inner_li {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    display: inline-block;
	width: 100%;
	padding: 5px 0 0 46px;
}

.guideBox_inner li .guide_inner_li:after {
	position: absolute;
    top: 48%;
    left: 30px;
    width: 5px;
    height: 5px;
    content: "";
	border-top: solid 1px #bfa77a;
    border-right: solid 1px #bfa77a;
    transform: rotate(45deg);
}


/*-----------------
 order
-------------------*/
.guide_orderLink li {
	color: #705a30;
	width: 49%;
	border: 1px solid #a27f37;
	background-color: #f5eee0;
	padding:12px 20px;
	border-radius: 10px;
	font-size: 110%;
	font-weight: bold;
	display: inline-block;
	margin: 0 1% 12px 0;
}

.guide_orderLink li:nth-child(even){margin: 0 0 10px 0;}

.guide_orderLink li span {
	display: inline-block;
	color: #705a30;
	text-decoration: none;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
	width: 100%;
}

.guide_orderLink li span:after {
	position: absolute;
    top: 40%;
    right: 6px;
    width: 6px;
    height: 5px;
    content: "";
	border-top: solid 1px #a27f37;
    border-right: solid 1px #a27f37;
    transform: rotate(135deg);
}


h3.guide_orderH3 {
	background-color: #bfa77a;
	color: #fff;
	width: 100%;
	padding:12px 20px;
	font-size: 110%;
	color: #fff;
	margin: 20px 0;
	}

.guide_order_step dt {
	border-top: 1px solid #bfa77a;
	border-bottom: 1px solid #bfa77a;
	padding:12px 20px;
	color: #705a30;
	margin:15px 0 5px;
	}
.guide_order_step dd {
	padding:12px 20px 20px;
	font-size: 85%;
	}

.guide_order_step dd .step_ttl {
	display: inline-block;
	text-decoration: none;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
	width: 100%;
	padding: 5px 0 5px 12px;
	font-size: 120%;
	font-weight: bold;
	margin: 15px 0 10px 0;
}

.guide_order_step dd .step_ttl.top{	margin: 0 0 10px 0;}

.guide_order_step dd .step_ttl:after {
	position: absolute;
    top: 40%;
    left: 0px;
    content: "";
	border-right: 5px solid transparent;
  	border-top: 7px solid #000;
  	border-left: 5px solid transparent;
}


.step_chuui {
	border: 1px solid #d00;
	width: 100%;
	padding: 15px;
	color: #d00;
	margin: 10px 0 20px;
	}

.step_chuui .step_chuuiTtl	{ font-weight: bold; margin: 0 0 10px 0;}


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

/*-----------------
 top
-------------------*/
h2.guide_ttl {
	font-size: 160%;
	font-weight: bold;
	padding: 0 0 7px;
	border-bottom: 2px solid #bfa77a;
	margin-bottom: 20px;
	margin-top: -10px;
	text-align: center;
	}

.guideBox {
	overflow: hidden;
	width: 100%;
	border: none;
	box-sizing: border-box;
	margin-bottom: 5px;
	min-height: initial;
}

.guideBox_inner {
	width: 100%;
}

.guideBox_list {
	display: inline-block;
	width: 100%;
}
.guideBox_list_nmr {
	display: inline-block;
	width: 100%;
}

.guideBox_tittle_area {
	width: 100%;
	background-color: #bfa77a;
	border-bottom: 1px solid #bfa77a;
	padding: 10px 20px 10px 15px;
	font-size: 110%;
}

.guideBox_inner ul li {
	font-size: 100%;
}

.guideBox_tittle_area span:after {
	position: absolute;
    top: 28%;
    right: 0;
    width: 9px;
    height: 9px;
    content: "";
	border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    transform: rotate(45deg);
}

.guideBox_inner ul li {
	font-size: 105%;
	margin: 0 0 3px 0;
}

.guideBox_inner li .guide_inner_li {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    display: inline-block;
	width: 100%;
	padding: 7px 0 8px 33px;
	border-bottom: 1px solid #bfa77a;
}

.guideBox_inner li .guide_inner_li:after {
	position: absolute;
    top: 38%;
    left: 15px;
    width: 7px;
    height: 7px;
    content: "";
	border-top: solid 1px #bfa77a;
    border-right: solid 1px #bfa77a;
    transform: rotate(45deg);
}


/*-----------------
 order
-------------------*/

.guide_orderLink li {
	color: #705a30;
	width: 100%;
	border-top: 1px solid #a27f37;
	border-bottom: 1px solid #a27f37;
	border-left: none;
	border-right: none;
	background-color: #f5eee0;
	padding:10px 15px;
	border-radius: 0;
	font-size: 120%;
	font-weight: bold;
	display: inline-block;
	margin: 0 1% 12px 0;
}

.guide_orderLink li:nth-child(even){margin: 0 0 10px 0;}

.guide_orderLink li span {
	display: inline-block;
	color: #705a30;
	text-decoration: none;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
	width: 100%;
}

.guide_orderLink li span:after {
	position: absolute;
    top: 10%;
    right: 6px;
    width: 10px;
    height: 10px;
    content: "";
	border-top: solid 2px #a27f37;
    border-right: solid 2px #a27f37;
    transform: rotate(135deg);
}


h3.guide_orderH3 {
	background-color: #bfa77a;
	color: #fff;
	width: 100%;
	padding:10px 10px;
	font-size: 120%;
	color: #fff;
	margin: 10px 0 5px 0;
	}

.guide_order_step  { margin: 0 0 30px 0;}

.guide_order_step dt {
	border-top: 2px dotted #bfa77a;
	border-bottom: 2px dotted #bfa77a;
	padding:10px 8px;
	color: #705a30;
	margin:15px 0 8px;
	font-size: 110%;
	}
.guide_order_step dd {
	padding: 3px 8px 10px;
	font-size: 95%;
	}

.guide_order_step dd .step_ttl {
	display: inline-block;
	text-decoration: none;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
	width: 100%;
	padding: 5px 0 5px 12px;
	font-size: 110%;
	font-weight: bold;
	margin: 10px 0 5px 0;
}

.guide_order_step dd .step_ttl.top{	margin: 0 0 5px 0;}

.guide_order_step dd .step_ttl:after {
	position: absolute;
    top: 40%;
    left: 0px;
    content: "";
	border-right: 5px solid transparent;
  	border-top: 7px solid #000;
  	border-left: 5px solid transparent;
}


.step_chuui {
	border: 1px solid #d00;
	width: 100%;
	padding: 15px;
	color: #d00;
	margin: 10px 0 20px;
	}

.step_chuui .step_chuuiTtl	{ font-weight: bold; margin: 0 0 10px 0;}

}

