@charset "utf-8";

/*--  goriyou --*/

/* ==========================
   マイページガイド
========================== */

.mypage-guide{
	background:#fdfaf5;
}

.mypage-guide main{
	margin:0 auto;
	padding:20px 0;
}


.mypage-guide h2{
	text-align:center;
	font-size:31px;
	font-weight:bold;
	color:#5a4634;
	background:#fdfaf5;
	margin-bottom:20px;
}

.lead{
	text-align:left;
	line-height:2;
	font-size:16px;
	padding:0px 20px;
	margin-bottom:40px;
	color:#555;
}


/* カード */

.guide-card{

	position:relative;
	display:flex;
	gap:30px;
	align-items:center;
	padding:35px;
	background:#fff;
	border:2px solid #efe4d7;
	border-radius:20px;
	margin-bottom:20px;
}


/* STEP番号 */

.step-no{
	position:absolute;
	top:20px;
	left:20px;
	width:65px;
	height:65px;
	background:#f38da8;
	color:#fff;
	font-size:42px;
	font-weight:bold;
	border-radius:12px;
	display:flex;
	align-items:center;
	justify-content:center;
}


/* テキスト */

.guide-text{
	width:35%;
	padding-top:70px;
}

.guide-text h3{
	font-size:28px;
	line-height:1.3;
	font-weight:bold;
	margin-bottom:25px;
	color:#222;
}

.guide-text p{
	font-size:18px;
	line-height:2;
	margin-bottom:20px;
}

.guide-text ul{
	font-size:17px;
	line-height:2;
	padding-left:20px;
}

.guide-text li{
	margin-bottom:8px;
}

/* 画像 */

.guide-image{
	width:65%;
	text-align:center;
}

.guide-image img{
	width:100%;
	height:auto;
	border:1px solid #ddd;
	border-radius:10px;
}

/* 矢印 */

.arrow-2{
	text-align:center;
	font-size:60px;
	color:#f3b4c5;
	line-height:1;
	margin:10px 0 20px;
}


/* お問い合わせ */

.contact-box{
	background:#fff8e8;
	border:2px solid #f1dd9b;
	border-radius:15px;
	padding:30px;
	text-align:center;
	margin-top:30px;
}

.contact-box h3{
	font-size:30px;
	margin-bottom:15px;
}

.contact-box p{
	font-size:18px;
	line-height:2;
}

/* スマホ */

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

.guide-card{
	display:block;
	padding:20px;
}

.guide-text{
	width:100%;
	padding-top:70px;
}

.guide-image{
	width:100%;
	margin-top:20px;
}

.mypage-guide h2{
	font-size:30px;
}

.guide-text h3{
	font-size:28px;
}

.guide-text p,
.guide-text ul{
	font-size:16px;
}

.step-no{
	width:55px;
	height:55px;
	font-size:34px;
}

.arrow-2{
	font-size:45px;
}