@charset "utf-8";
/* ========== すべて共通 ========== */
html, body,
h1, h2, h3, h4, h5, h6,
a, p, span,
em, small, strong,
sub, sup,
mark, del, ins, strike,
abbr, dfn,
blockquote, q, cite,
code, pre,
ol, ul, li, dl, dt, dd,
div, section, article,
main, aside, nav,
header, hgroup, footer,
img, figure, figcaption,
address, time,
audio, video,
canvas, iframe,
details, summary,
fieldset, form, label, legend,
table, caption,
tbody, tfoot, thead,
tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
}
figure {
    display: block;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

/* wrapper */
.os_wrapper {
	width: 740px;
	display: block;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	font-size: 62.5%;
	line-height: 1.6;
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}
/* セクション */
.sec1, .sec2, .sec3, .sec4 ,.sec5 {
	width: 740px;
	margin: 0 auto;
	padding: 0;
	position: relative;
}
/* フルサイズイメージ */
.main_img {
	width: 740px;
	margin: 0 auto;
	display: block;
}
.button_img,
.ab_button_img {
	display: block;
	margin: 0 auto;
}
.disc_p {
  font-size: 1rem;
  width: 690px;
  display: block;
  margin: 20px auto;
}
.click_p {
  font-size: 2rem;
  color: #22ac38;
  margin: 30px 0 50px;
  text-align: center;
}
/* 3列 */
.ke_box {
  margin: 30px 0;
  width: 740px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}
.ke_box a {
  text-decoration: none;
	color: #000;
}
.ke_img_box {
	margin: 0 3px;
	padding: 0;
  width:calc(740px / 3 - 6px);
}
.ke_img_box:nth-child(3n) {
	margin: 0;
}
.ke_img {
  width: auto;
  display: block;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}
.ke_img_box figcaption {
	width: 100%;
	font-size: .8rem;
  padding: 0 12px;
  box-sizing: border-box;
  text-align: center;
}
.m_margin {
  margin: 30px auto;
}
.bg01, .bg02 {
  position: relative;
}
.bg_img01, .bg_img02 {
  display: block;
  position: absolute;
  top: -40px;
  left: 20px;
  z-index: -1;
}


 @media screen and (max-width: 739px) {

	 .os_wrapper {
	 	width: 100%;
	 }
	 .sec1, .sec2, .sec3, .sec4 ,.sec5 {
	 	width: 100%;
	 }
	 .main_img {
	 	width: 100%;
	 }
   .disc_p {
     width: 80%;
   }
   .click_p {
     font-size: 1.2rem;
     color: #22ac38;
     margin: 10px 0 30px;
     text-align: center;
   }
	 .button_img,
	 .ab_button_img {
	 	display: block;
	 	margin: 0 auto;
		width: 50%;
	 }

   /* 3列 */
   .ke_box {
     margin: 30px 0;
     width: 100%;
   }
   .ke_img_box {
   	margin: 0 2px;
   	padding: 0;
     width:calc(100% / 3 - 4px);
   }
   .ke_img_box:nth-child(3n) {
   	margin: 0;
   }
   .ke_img {
     width: 100%;
     display: block;
     margin: 0 auto;
     padding: 5px;
     box-sizing: border-box;
   }
   .ke_img_box figcaption {
   	width: 100%;
   	font-size: .8rem;
     padding: 0 12px;
     box-sizing: border-box;
     text-align: center;
   }
   .m_margin {
     margin: 30px auto;
   }
   .bg01, .bg02 {
     position: relative;
   }
   .bg_img01, .bg_img02 {
     display: block;
     position: absolute;
     top: -30px;
     left: 5px;
     width: 50px;
     z-index: -1;
   }

	}
