@charset "utf-8";
/*----------------------------------------------------------
	00 reset
	01 link
	02 font
	03 common layout and heading
	04 header
	05 footer
	06 toppage
  07 FAQ
  08 product page
	00 common parts
----------------------------------------------------------*/
/*  00 reset
======================================================================================*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
 display: block;
}
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 font-size: 12px;
 font-weight: normal;
 line-height: 1.8;
 color: #000;
 vertical-align: middle;
 background: transparent;
 box-sizing: border-box;
}
input, textarea {
 font-size: 12px;
}
html {
 overflow-y: scroll;
}
body {
 line-height: 1;
}
nav ul {
 list-style: none;
}
blockquote, q {
 quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
 content: '';
 content: none;
}
table {
 border-collapse: collapse;
 border-spacing: 0;
}
hr {
 display: block;
 height: 1px;
 border: 0;
 border-top: 1px solid #cccccc;
 margin: 1em 0;
 padding: 0;
}
input, select {
 vertical-align: middle;
}
input {
 padding: 5px;
}
input[type^="image"] {
 padding: 0;
}
img {
 border: 0;
 vertical-align: top;
 max-width: 100%;
}
img:not([height]) {
 height: auto;
}
li {
 list-style: none;
}
/*  01 link
======================================================================================*/
a {
 color: #006ab6;
 text-decoration: underline;
}
a:hover {
 text-decoration: none;
transition: all  0.3s ease;
}
.overbu:hover{
 opacity: 0.8;
 text-decoration: none;
}

.red_bu {
  width: 100%;
}

.red_bu a {
  display: block;
  padding: 2.7%;
  background: linear-gradient(#ee3e3c, #ea100e);
  border: solid 1px #fff;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  line-height: 1.3;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
}
.red_bu a .material-symbols-rounded {
  font-size: 20px;
  vertical-align: sub;
  padding-right: 5px;
}

.red_bu.ye_bu a {
  background: linear-gradient(#ffeb55, #ffdc21);
  border: none;
  color: #15953b;
}

.red_bu a:hover,
.head_bu a:hover {
  background: linear-gradient(#f05553, #ee3e3c);
}

.red_bu.ye_bu a:hover {
  background: linear-gradient(#fff28f, #ffeb55);
}

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

#foot_nav_area .head_bu {
  width: 100%;
}

#foot_nav_area .head_bu a {
  display: block;
  padding: 2.7%;
  background: linear-gradient(#ee3e3c, #ea100e);
  border: solid 1px #fff;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  line-height: 1.3;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
}
#foot_nav_area .head_bu a .material-symbols-rounded {
  font-size: 20px;
  vertical-align: sub;
  padding-right: 5px;
}

}



/*  02 font-family
======================================================================================*/
body, textarea,
.nt{
 font-family: 'Noto Sans JP', sans-serif;
  letter-spacing: 0.03em;
}
.rbt{
 font-family: 'Roboto', sans-serif;
}
.mp1 {
  font-family: 'M PLUS 1', sans-serif;
}

/*  03 common layout and heading
======================================================================================*/
/*body {
 background-color: #FFF;
 -webkit-text-size-adjust: none;
 font-size: 13px;
}*/
p {
 margin-bottom: 10px;
}
 #content {
   margin-top: 60px;
 }/*  04 header
==============================================================*/

#header {
 position: fixed;
  top: 0;
right: 0;
left: 0;
background-color: #fff;
height: 60px;
  min-width: 320px;
padding: 1.5% 65px 0 3%;
z-index: 10;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
}

.header_inner {
  display: flex;
  gap:20px;
  justify-content: space-between;
}
.head_logo {
  padding-top: 5px;
  width: 170px;
}

.head_bu {
  width: 100px;
  padding-top: 4px;
}

.head_bu a {
  display: block;
  padding: 4% 6% 4% 3%;
  background: linear-gradient(#ee3e3c, #ea100e);
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  line-height: 1.3;
  font-weight: 700;
  text-align: right;
}
.head_bu img {
  width: 19px;
  vertical-align:sub;
  padding: 0 5px 2px 0;
}
.head_bu a .material-symbols-rounded {
  font-size: 18px;
  padding-right: 5px;
}


@media screen and (max-width : 750px) {
 #gnav {
  display: none;
 }



  /* ハンバーガーメニュー */
#bumenu{
  display: flex;
  align-items: center;
  width: 32px;
  height: 32px;
  padding: 5px;
  background-color: #fff;
  cursor: pointer;
  z-index: 10;
   position: fixed;
  top: 17px;
  right: 17px;
}

.bumenu_line{
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background-color: #15953b;
  position: relative;
  transition: all 0.5s;
}

.bumenu_line::before,
.bumenu_line::after{
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background-color: #15953b;
  position: absolute;
  transition: all 0.5s;
}

.bumenu_line::before{
  transform: translateY(-8px);
}
.bumenu_line::after{
  transform: translateY(8px);
}
#bumenu.open .bumenu_line{
  background-color: transparent;
}
#bumenu.open .bumenu_line::before{
  transform: rotate(45deg);
}
#bumenu.open .bumenu_line::after{
  transform: rotate(-45deg);
}
}

/*  05 footer
==============================================================*/

.foot_link {
  background-color: rgba(202,235,190,0.5);
  padding: 3% 3% 50px;
  text-align: center;
}

#footer {
  border-top: solid 5px #15953b;
  background-color: #efefef;
  text-align: center;
  padding: 10px 0;
}

#footer p {
  margin-bottom: 5px;
}
  
#footer p img {
  width: 50%;
  margin-bottom: 5px;
}

@media screen and (max-width : 750px) {
#foot_nav_area {
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
  position: fixed;
  top: 60px;
  width: 100%;
  height: calc(100vh - 60px);
  background-image: url("../img/ansin_bg_sp.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto;
  text-align: center;
  padding:0 3%;
}

#foot_nav_area.open {
  visibility: visible;
  opacity: 1;
  z-index: 5;

}

#foot_nav_area ul {
  margin-bottom: 50px;
}

#foot_nav_area li {
  border-bottom: solid 1px #ccedc0;
}

#foot_nav_area li a {
  display: block;
  color: #15953b;
  padding: 26px 0;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
}
 #foot_nav_area .head_bu img {
  width: 19px;
  vertical-align:sub;
  padding: 0 5px 4px 0;
}
}









/* heading
===========================================*/

h3 {
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 10px;
}

/* -------------- ページトップへ */

#toTop {
 position: fixed;
 right: 10px;
 bottom: 10px;
 font-size: 13px;
 background-color: rgba(0,120,0,0.8);
}
#toTop a:link, #toTop a:visited {
 position: relative;
 color: #FFF;
 display: block;
 padding: 15px 7px 7px;
  text-decoration: none;
}
#toTop a:before {
 content: "";
 display: block;
 width: 7px;
 height: 7px;
 border-top: 2px solid #FFF;
 border-right: 2px solid #FFF;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 position: absolute;
 left: 40%;
 top: 8px;
}
/*  00 common parts
======================================================================================*/
.for_pc, .for_pc_ib {
 display: none;
}
.mgn0, div#content p.mgn0 {
 margin: 0px !important;
}
.mgn10, div#content .mgn10, div#content p.mgn10 {
 margin-bottom: 10px !important;
}
.mgn20, div#content .mgn20 {
 margin-bottom: 20px;
}
.mgn30 {
 margin-bottom: 30px;
}
.mgn40, div#content p.mgn40 {
 margin-bottom: 40px;
}
.mgn50, div#content p.mgn50 {
 margin-bottom: 50px;
}
.pdt0 {
 padding-top: 0px;
}
#content .pdt10 {
 padding-top: 10px;
}
.pdr5 {
 padding-right: 5px;
}
.pdb5 {
 padding-bottom: 5px;
}
.pdl10 {
 padding-left: 10px;
}
.pdl120 {
 padding-left: 120px;
}
.pdg10 {
 padding: 10px;
}
strong {
 font-weight: bold;
}
#content .center {
 text-align: center;
}
#content .left {
 text-align: left;
}
#content .right {
 text-align: right;
}
.p_img_l {
 float: left;
 padding-right: 15px;
}
.p_img_r {
 float: right;
 padding-left: 15px;
}
.red {
 color: #ed2e2c;
}
.yellow {
    color: #fcee21;
}
.content .bold {
 font-weight: 700;
}
.content .normal {
  font-weight: 400;
}
.content .red_bold {
 font-weight: 700;
 color: #ed2e2c;
}
.tx0 {
 font-size: 0px;
}
.tx11 {
 font-size: 11px;
}
.tx13 {
 font-size: 13px;
}
.tx15 {
 font-size: 15px;
}
#content .txsmall {
  font-size: 90%;
}
.indent1 {
  padding-left:1em;
	text-indent:-1em;
  margin-bottom: 5px;
}
.indent13 {
  padding-left:1.3em;
	text-indent:-1.3em;
  margin-bottom: 5px;
}

.indent2 {
  padding-left:2em;
	text-indent:-2em;
  margin-bottom: 5px;
}

/* =========================================================
	*00 clearfix
========================================================= */
.cl:after {
 content: '';
 display: block;
 clear: both;
}

/* middle style ---------------------------------------------------*/



/* pc style -------------------------------------------------------*/

@media screen and (min-width : 751px) {
 html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, input, textarea {
   font-size: 18px;
  /*font-size: clamp(16px, 1.125vw, 18px);*/
 }
 /* common ------------------------*/
 body .for_sp {
  display: none;
 }
 .for_pc {
  display: block;
 }
 .for_pc_ib {
  display: inline-block;
 }
 #content {
  min-width: 1200px;
   margin-top: 80px;
 }
  

  
 table.th150 th {
  width: 150px;
 }

  /* link -----------------------*/


.red_bu {
  width: 560px;
  margin: auto;
}

.red_bu a {
  padding: 20px 0;
  border: solid 2px #fff;
  border-radius: 8px;
  font-size: 26px;
}
.red_bu a .material-symbols-rounded {
  font-size: 30px;
  vertical-align: sub;
  padding-right: 5px;
}

.red_bu.ye_bu a {
  background: linear-gradient(#ffeb55, #ffdc21);
  border: none;
  color: #15953b;
}
  
.red_bu.w460 {
  width: 460px;
  }


 /* header -------------------------*/

 #header {
height: 80px;
padding: 5px 0 0 ;
z-index: 10;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
}

.header_inner {
  width: 1200px;
  margin: auto;
  display: flex;
  gap:20px;
  justify-content: space-between;
}
.head_logo {
  width: 420px;
  padding-top: 10px;
}
  

.head_bu{
  width: 300px;
  padding-top: 10px;
}

.head_bu a{
  text-align: center;
  border: 1px solid #fff;
}
.head_bu a .material-symbols-rounded{
  font-size: 20px;
}
.head_bu img {
  width: 23px;
  vertical-align:sub;
  padding: 0 7px 4px 0;
}
  
  #gnav {
    width: 480px;
 }
 #gnav>ul {
display: flex;
   gap:1.7vw;
   justify-content: right;
   padding-right: 20px;
 }

 #gnav ul li a {
   display: block;
   padding: 20px 10px 15px;
   font-weight: 700;
   color: #000;
   text-decoration: none;
 }
  #gnav>ul>li>a:hover,
  #gnav>ul>li>a.current{
   color: #15953b;
  }
  #gnav ul li .acmenu {
    cursor: pointer;
  }
    #gnav ul li a span.main {
 font-family: 'Roboto', sans-serif;
  }
  #gnav ul li .sub {
    display: none;
  }
  
  
  
/*  05 footer
==============================================================*/
.foot_link {
  padding-bottom: 100px;

}

  #foot_nav_area {
    background-color: #15953b;
  }
  
  #foot_nav_area nav {
    width: 1200px;
    margin: auto;
    display: flex;
  }
  
  #foot_nav_area ul {
    width: 900px;
    display: flex;
    justify-content: space-between;
    padding-right: 50px;
  }

  #foot_nav_area li a {
  display: block;
  color: #fff;
  padding: 26px 0;
  font-size: 20px;
  font-weight: 700;
  text-decoration: none;
}
  #foot_nav_area .sub a {
  font-weight: 400;
  }

  #foot_nav_area .head_bu {
    padding-top: 18px;
  }
  
  
  
#footer {
  background-color: #f0f0f0;
  border: none;
  text-align: center;
  padding: 30px 0;
}


#footer p {
  margin-bottom: 10px;
  font-size: 21px;
}
  
  #footer p:last-of-type {
    font-size: 16px;
  }
#footer p img {
  width: 367px;
  margin-bottom:10px;
}
  
  
#toTop {
 bottom: 50px;
}


}