@charset "UTF-8";
@import url("base.css");

.attention_Area {
	background-color: #4be11f;
	color: #FFF;
	padding: 10px;
}

.attention_Area p {
	margin-left: 1em;
	text-indent: -1em;
	font-size: 14px;
}

/*各種カード*/
.system div.con_txt1 { border: #f0f0f0 solid 1px; padding: 20px; }

.system div.con_txt1 li { position: relative; padding-left: 15px; font-size: 13px;}

.system div.con_txt1 li:before { content:"※"; display: inline-block; position: absolute; left: 0; top: 0;}

/* HOW TO !? */
.howto{
	width: 660px;
	height: 2345px;
	background: url(../images_design/system/howto_bg.jpg) center top no-repeat;
	position: relative;
	margin-bottom: 20px;
}

.howto p{
	position: absolute;
	line-height: 1.6;
	font-size: 14px;
}

.howto p.ptn1{ width: 440px; left: 202px;}
.howto p.ptn2{ width: 620px; left: 20px;}

.howto .c1_1{ top: 170px;}
.howto .c1_2{ top: 430px;}
.howto .c1_3{ top: 690px;}
.howto .c1_4{ top: 950px;}

.howto .c2_1{ top: 1021px;}
.howto .c2_2{ top: 1280px;}
.howto .c2_3{ top: 1540px;}

.howto .c3_1{ top: 1872px;}
.howto .c3_2{ top: 2131px;}

.howto p span{ color: #ff3264;}

/* 緑枠 */
.border_Area,
.reservation_attention {
	border: #5de42d solid 1px;
}

.reservation_attention {
	width: 618px;
	margin: 0px 20px 20px;
}

/*ご利用に関しまして*/
.system div.con_txt2 .reservation_attention .reserve_info{
	font-size: 14px;
	margin-top: 15px;
	padding-left: 15px;
}

.system div.con_txt2 .reservation_attention .reserve_info li{
	background: url(/pc/images_design/system/arrow1.png) no-repeat;
	background-position: 0px 3px;
	padding-left: 18px;
	margin-bottom: 10px;
}

.rev_txt1{ padding: 10px; text-align: center; font-weight: bold; font-size: 18px;}
.rev_txt1 p{ color: #49BD00;}
.rev_txt1 p span{ color: #ff2f62;}

/*STD対策*/
.system div.con_txt3 { border: #5de42d solid 1px; padding: 9px; font-size: 14px; }
.system div.con_txt3 img { margin-bottom: 15px;}
.system div.con_txt3 p { margin: 0px 10px 10px;}
.system div.con_txt3 .w620 { width: 620px; margin-right: auto; margin-left: auto;}

/*禁止事項*/
.prohibited_matter_list { margin-top: 0px; margin-right: 10px; margin-left: 10px;}
.prohibited_matter_list li { margin: 0 0 5px; border-bottom: #CCC dotted 1px; padding-left: 5px; padding-bottom: 5px;}
.prohibited_matter_list li:last-child { border-bottom: none;}
.prohibited_matter_list li:before{ content:"\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 900; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; margin: 0 5px;}

/*ポイントカード会員*/
.pointcard_tokuten { border: #D8D5CC solid 1px; background-color: #FDFDF5; margin-bottom: 15px; padding: 15px;}
.pointcard_tokuten > h3 { color: #92BE00; font-weight: bold; font-size: 24px; text-align: center; border-bottom: #D8D5CC solid 1px; padding-bottom: 5px;}
.pointcard_tokuten > h3 + p { margin: 10px 0px;}
.pointcard_tokuten > ul { margin: 0px 20px;}
.pointcard_tokuten > ul li { margin-top: 10px; padding-bottom: 10px; border-bottom: #D8D5CC solid 1px;}
.pointcard_tokuten > ul li:last-child { border-bottom: none;}
.pointcard_tokuten > ul li h4 { font-size: 24px; margin-bottom: 3px;}
.pointcard_tokuten > ul li h4 span { color: #92BE00;}
.pointcard_tokuten > ul li p { font-size: 14px; margin-left: 100px;}

.pointcard_add { background-color: #FFF; border: #D8D5CC solid 1px; font-size: 14px; margin-bottom: 25px; padding: 10px;}

/* ================================== */
.system .pic img { display: block; }
.system div .pic { position: relative; z-index: 0;}
/*.system div div:nth-child(2), .system div div:nth-child(3) { z-index: 2; width: 620px; position: absolute; left: 20px; }
.system div div:nth-child(2) p, .system div div:nth-child(3) p { font-size: 12px; }
.system div ul img { display: block; }
.system div ul { position: absolute; left: 70px; bottom: 20px; }

.system div.con_txt1,.system div.con_txt2,.system div.con_txt3,.system div.con_txt4 { position: relative; }

.system div.con_txt1 div:nth-child(2) { top:85px;}
.system div.con_txt2 div:nth-child(2) { top: 290px; }
.system div.con_txt1 div:nth-child(2) p,.system div.con_txt2 div:nth-child(2) p { position: relative; padding-left: 15px; }
.system div.con_txt1 div:nth-child(2) p:before,.system div.con_txt2 div:nth-child(2) p:before{ content:"※"; display: inline-block; position: absolute; left: 0; top: 0;}

.system div.con_txt3 div:nth-child(2) { top: 70px; }
.system div.con_txt4 div:nth-child(2) { top: 130px; }
.system div.con_txt4 div:nth-child(3) { top: 318px; }
.system div.con_txt4 div:nth-child(2) p:before,.system div.con_txt4 div:nth-child(3) p:before{ content:"\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 900; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; margin: 0 5px;}*/