/*=================================================
 * CSS for PC
 * ================================================= */

main{
	width: 100%;
	padding: 80px 0;
}

.main_bg{
	width: 1100px;
	margin: 0 auto;
	padding: 20px;
	background: #ececec;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.main{
	background: #fff;
	padding: 20px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}


.toptxt{
	margin: 0 0 60px 0;
}

.toptxt em{
	font-family: 'Noto Serif JP', serif;
	font-weight: 600;
	font-size: 26px;
	line-height: 32px;
}

.toptxt span{
	display: block;
	font-family: "FontA";
	font-size: 12px;
	line-height: 16px;
	color: #caaa55;
	padding: 5px 0 0 0;
}


/** map **/

#map{
	padding: 30px 0 50px 0;
	background: url(img/bg.gif) top center;
	background-size: 125px auto;
}
#map .s_title{	margin-bottom: 30px;}

#map .main{
	padding: 30px 40px;
}

#map h4{	margin-bottom: 30px;}

#map h4 em{
	font-family: 'Noto Serif JP', serif;
	font-weight: 600;
	font-size: 28px;
	line-height: 32px;
}

#map h4 span{
	display: block;
	font-family: "FontA";
	font-size: 12px;
	line-height: 16px;
	color: #caaa55;
	padding: 5px 0 0 0;
}

#map p{
	font-size: 14px;
	line-height: 20px;
	padding: 30px 0 0 0;
}
#map p:nth-of-type(2){
	font-size: 18px;
	line-height: 25px;
	text-align: left;
}

#map .gmap{
	font-size: 0;
	line-height: 0;
}

#map .gmap iframe{
	border: 1px solid #ddd;
}


/** flow **/

#flow{
	width: 1100px;
	margin: 0 auto;
	padding: 50px 0;
}

.fbox{
	position: relative;
	display: flex;
	width: 100%;
	align-items: stretch;
	align-content: center;
	justify-content: flex-start;
	background: #fff;
	margin: 0 0 30px 0;
	padding: 20px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.fbox:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 22.5px 0 22.5px;
	border-color: #000 transparent transparent transparent;
	position: absolute;
	bottom: -20px;
	right: 210px;
}
.fbox:last-of-type{	margin-bottom: 50px;}
.fbox:last-of-type:after{	display: none;}

.step{
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 150px;
	min-height: 150px;
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: 28px;
	line-height: 30px;
	color: #fff;
	background: #caaa55;
}

.fimg{
	width: 470px;
	text-align: left;
	background: #ececec;
	padding: 10px;
}
.fimg img{
	width: 100%;
	height: auto;
}

.ftxt{
	width: calc(100% - 150px);
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
}
.ftxt:nth-child(3){
	width: calc(100% - 620px);
}

.ftxt p{
	font-size: 20px;
	font-weight: bold;
	line-height: 24px;
	text-align: center;
	padding: 0 0 0 20px;
}

.flowp{
	font-family: 'Noto Serif JP', serif;
	font-weight: 600;
	font-size: 26px;
	line-height: 35px;
	text-align: center;
}


/** shop **/

#shop{
	padding: 30px 0 50px 0;
	background: url(img/bg.gif) top center;
	background-size: 125px auto;
}
#shop .s_title{	margin-bottom: 30px;}

#shop .main{
	padding: 30px 40px 20px 40px;
}

#shop h4{
	position: relative;
	font-family: 'Noto Serif JP', serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 26px;
	margin-bottom: 50px;
}
#shop h4:after{
	content: '';
	width: 100px;
	border-bottom: 1px solid #000;
	position: absolute;
	bottom: -25px;
	left: calc(50% - 50px);
}

#shop p{
	font-size: 16px;
	font-weight: bold;
	line-height: 25px;
	margin: 0 0 30px 0;
	color: #caaa55;
}

#shop ul{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	font-size: 0;
	line-height: 0;
}

#shop li{
	margin-bottom: 20px;
}

#shop li img{
	width: 480px;
	height: auto;
}




