@charset "UTF-8";
/*--------------------------------------------------------*/
/*! _reset*/
/*--------------------------------------------------------*/
/*html5doctor.com Reset Stylesheetv1.6.1Last Updated: 2010-09-17Author: Richard Clark - http://richclarkdesign.comTwitter: @rich_clark*/
html,body,div,span,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: 100%; font: inherit; vertical-align: baseline;  background: transparent;}body {  line-height: 1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {  display: block;}nav ul {  list-style: none;}blockquote,q {  quotes: none;}blockquote:before,blockquote:after,q:before,q:after {  content: '';  content: none;}a {  margin: 0;  padding: 0;  font-size: 100%;  vertical-align: baseline;  background: transparent;}
/* change colours to suit your needs */
ins {  background-color: #ff9;  color: #000;  text-decoration: none;}
/* change colours to suit your needs */
mark {  background-color: #ff9;  color: #000;  font-style: italic;  font-weight: bold;}del {  text-decoration: line-through;}abbr[title],dfn[title] {  border-bottom: 1px dotted;  cursor: help;}table {  border-collapse: collapse;  border-spacing: 0;}
/* change border colour to suit your needs */
hr {  display: block;  height: 1px;  border: 0;  border-top: 1px solid #cccccc;  margin: 1em 0;  padding: 0;}input,select {  vertical-align: middle;}

/*--------------------------------------------------------*/
/*! _font*/
/*--------------------------------------------------------*/
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W3);
  font-weight: normal;
}
@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W6);
  font-weight: bold;
}
/*--------------------------------------------------------*/
/*! _color*/
/*--------------------------------------------------------*/
:root {
  --c_brown01: #3B0606;
  --c_brown02: #8C574E;
  --c_brown03: #F7EEDA;
  --c_brown04:#94513D;
  --c_yellow01: #F2D578;
  --c_yellow02: #FDD229;
  --c_ivory: #FFFAE8;
  --c_orange: #F39945;
  --c_pink01: #EF8694;
  --c_pink02: #FF3D60;
  --c_pink03: #C8324D;
  --c_blue: #708FC9;
  --c_green: #7FBB58;
  --c_black: #000;
  --txt_main: var(--c_brown01);
  --c_gray: #D7C4BE;
  --c_white: #FFF;
  --txt_white: var(--c_white);
  --bg_body: var(--c_white);
  --bg_footer: var(--c_white);
  --btn_bg: var(--c_pink02);
  --btn_txt: var(--txt_white);
  --shadow: rgba(0, 0, 0, 0.2);
}
/*--------------------------------------------------------*/
/*! _variable*/
/*--------------------------------------------------------*/
:root {
  --hover_transition:0.3s;
  --hover_opacity:0.7;
}

/*--------------------------------------------------------*/
/*! _base*/
/*--------------------------------------------------------*/
:root {
  --fz: min(0.267vw, calc((32.768 / 16) / 16 * 1rem));
  --val: min(0.267vw, 2.048px);
  --z_header: 300;
  --z_menu: 200;
  --menu_h: 120;
}
@media screen and (min-width: 768px) {
  :root {
    --fz: min(0.052vw, calc(1 / 16 * 1rem));
    --val: min(0.052vw, 1px);
    --menu_h: 170;
  }
}

*,
*:before,
*:after {
  box-sizing: border-box;
  letter-spacing: 0em;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--val) * var(--menu_h));
}

body {
  width: 100%;
  min-height: 100vh;
  background-color: var(--bg_body);
  font-family: "M PLUS Rounded 1c", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "NotoSansJP", "Meiryo", sans-serif;
  font-size: calc(var(--fz) * 16);
  font-weight: 500;
  color: var(--txt_main);
  text-spacing-trim: space-all;
  overflow-y: scroll;
}

ul,
ol {
  list-style: none;
}

a {
  color: currentColor;
  text-decoration: none;
}
@media (any-hover: hover) {
  a:hover {
    text-decoration: none;
  }
}
@media (any-hover: none) {
  a:active {
    text-decoration: none;
  }
}

span {
  display: inline-block;
  letter-spacing: inherit;
}

picture {
  display: block;
}

img,
video,
iframe {
  display: inline-block;
  width: 100%;
  max-width: 100%;
  height: auto;
  font: initial;
  font-style: italic;
  vertical-align: middle;
  white-space: pre;
}

input {
  margin: 0;
  padding: 0;
  font: inherit;
}

textarea {
  display: block;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  resize: none;
  field-sizing: content;
}

select {
  font: inherit;
  color: inherit;
}

button {
  padding: 0;
  background-color: transparent;
  border: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  touch-action: manipulation;
  user-select: none;
}

/*--------------------------------------------------------*/
/*add*/
/*--------------------------------------------------------*/
h2 {
  margin-bottom: 12px;
}
.mT10 {
  display: block;
  margin-top: 10px;
}
.mT20 {
  display: block;
  margin-top: 20px;
}
.mT30 {
  display: block;
  margin-top: 30px;
}
.mB10 {
	display: block;
	margin-bottom: 10px;
}
.mB20 {
	display: block;
	margin-bottom: 20px;
}
ul.indent1 {
	display: block;
	padding: 0px;
	margin: 0px;
	line-height: 1.8em;
}

ul.indent1 li:before {
	padding: 0px;
	margin: 0 0 0 -15px;
	content: "\203B";
}

ul.indent1 li {
	padding: 0px;
	margin: 0 0 0 15px;
}

ul.indent2 {
	display: block;
	padding: 0px;
	margin: 0px;
	line-height: 1.8em;
}

ul.indent2 li:before {
	padding: 0px;
	margin: 0 0 0 -15px;
	content: "\30FB";
}

ul.indent2 li {
	padding: 0px;
	margin: 0 0 0 15px;
}

ul.indent3 {
	display: block;
	padding: 0px;
	margin: 0px;
	line-height: 1.8em;
}

ul.indent3 li:before {
	padding: 0px;
	margin: 0 0 0 -15px;
	content: "\25CF";
}

ul. {
	padding: 0px;
	margin: 0 0 0 15px;
}
ul.indent4 {
	display: block;
	padding: 0px;
	margin: 0px;
	line-height: 1.8em;
}

ul.indent4 li:before {
	padding: 0px;
	margin: 0 0 0 -15px;
	content: "\25A0";
}

ul.indent4 li {
	padding: 0px;
	margin: 0 0 0 15px;
}

/*--------------------------------------------------------*/
/*! _header*/
/*--------------------------------------------------------*/
.l-header {
  /* position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--z_header);
  pointer-events: none; */
  background-color: #F39945;
}
.l-header_inner {
  padding: calc(var(--val) * 10);
}
@media screen and (min-width: 768px) {
  .l-header_inner {
    padding: calc(var(--val) * 40) calc(var(--val) * 20);
  }
}
.l-header_logo {
  width: calc(var(--val) * 114);
}

.l-header_logo_list {
	  width:24%;
	  margin:0 auto;
}


@media screen and (min-width: 768px) {
.l-header_logo_list {
  width:10%;
  margin:0 auto;
	}
}


@media screen and (min-width: 768px) {
  .l-header_logo {
    width: calc(var(--val) * 300);
  }
}
.l-header_logoLink {
  display: inline-block;
  pointer-events: all;
}
@media (any-hover: hover) {
  .l-header_logoLink:hover {
    animation: bounce 1s linear;
  }
}

/*--------------------------------------------------------*/
/*! _main*/
/*--------------------------------------------------------*/
.l-layout_inner {
  max-width: calc(var(--val) * 1920);
  margin: 0 auto;
}

.l-main {
  position: relative;
}
.l-main::before {
  content: "";
  width: 100%;
  max-width: 1920px;
  height: 100%;
  margin: 0 auto;
  background-image: url(../img/bg_sp.webp);
  background-size: 100% auto;
  background-position: top center;
  background-repeat: repeat-y;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .l-main::before {
    height: calc(100% - var(--val) * 100);
    background-image: url(../img/bg.webp);
    top: calc(var(--val) * 100);
  }
}
.l-main > section {
  overflow-x: clip;
}
@media screen and (min-width: 768px) {
  .l-main > section {
    --fz: min(0.071vw, calc(1 / 16 * 1rem));
    --val: min(0.071vw, 1px);
  }
}
.l-main_inner {
  width: 100%;
  padding: 0 calc(var(--val) * 17.5);
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .l-main_inner {
    max-width: 1400px;
    padding: 0 calc(var(--val) * 50);
  }
}
.l-main_box {
  background-color: var(--c_ivory);
  border-radius: calc(var(--val) * 30);
  position: relative;
  z-index: 2;
}
@media screen and (min-width: 768px) {
  .l-main_box {
    border-radius: calc(var(--val) * 60);
  }
}
.p-popup_secTitle {
  --mask_url: url(../img/icon-item.svg);
}
.p-popup_secTitle,
.p-attention_secTitle
 {
  display: flex;
  align-items: center;
  gap: calc(var(--val) * 4);
  font-size: calc(var(--fz) * 24);
  font-weight: 900;
  line-height: 1.2;
  color: var(--secColor);
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-popup_secTitle,
  .p-attention_secTitle {
    align-items: center;
    gap: calc(var(--val) * 8);
    font-size: calc(var(--fz) * 50);
    line-height: 1.5;
  }
}
.p-popup_secTitle::before {
  content: "";
  width: calc(var(--val) * 60);
  aspect-ratio: 1/1;
  background-color: currentColor;
  mask-image: var(--mask_url);
  mask-size: contain;
  mask-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .p-popup_secTitle::before{
    width: calc(var(--val) * 120);
  }
}

.p-item .p-popup_text, .p-item_text {
  margin-top: calc(var(--val) * 14);
  margin-bottom: calc(var(--val) * 28);
  /* font-size: calc(var(--fz) * 16); */
  font-size: 1.1rem;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-item .p-popup_text, .p-item_text {
    /* font-size: calc(var(--fz) * 24); */
    font-size: 1.1rem;
  }
}

/*--------------------------------------------------------*/
/*! <item>*/
/*--------------------------------------------------------*/
.p-item {
  --secColor: var(--c_orange);
  /* padding: calc(var(--val) * 50) 0 0; */
  background-color: #F39945;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-item {
    padding: calc(var(--val) * 195) 0 calc(var(--val) * 27);
    padding-top: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-item::after {
    height: calc(var(--val) * 104);
  }
}
.p-item_box {
  padding: calc(var(--val) * 40) calc(var(--val) * 20);
  position: relative;

}
@media screen and (min-width: 768px) {
  .p-item_box {
    padding: calc(var(--val) * 60) calc(var(--val) * 40) calc(var(--val) * 70) calc(var(--val) * 70);

  }
}

.p-item_box2 {
  padding: calc(var(--val) * 40) calc(var(--val) * 20);
  position: relative;

}
@media screen and (min-width: 768px) {
  .p-item_box2 {
    padding: calc(var(--val) * 60) calc(var(--val) * 40) calc(var(--val) * 70) calc(var(--val) * 70);

  }
}

.p-item_obj {
  width: calc(var(--val) * 92);
  position: absolute;
  top: calc(var(--val) * -31);
  right: calc(var(--val) * 20);
}
@media screen and (min-width: 768px) {
  .p-item_obj {
    width: calc(var(--val) * 175);
    top: calc(var(--val) * -100);
    right: calc(var(--val) * 36);
  }
}
.p-item_secTitle {
  --mask_url: url(../img/icon-item.svg);
}
@media screen and (min-width: 768px) {
  .p-item_secTitle {
    gap: calc(var(--val) * 4);
  }
}
.p-item_container {
  display: grid;
  margin-top: calc(var(--val)*20);
}
@media screen and (min-width: 768px) {
  .p-item_container {
    grid-template-columns: calc(var(--val) * 580) 1fr;
    grid-template-areas: "text img" "btn btn";
    gap: 0 calc(var(--val) * 30);
    margin-top: calc(var(--val)*32);
  }
}
.p-item_container+.p-item_container {
  margin-top: calc(var(--val)*50);
}
@media screen and (min-width: 768px) {
  .p-item_container+.p-item_container {
    margin-top: calc(var(--val)*70);
  }
}
.p-item_textArea {}

@media screen and (min-width: 768px) {
  .p-item_textArea {
    grid-area: text;
    padding-bottom: calc(var(--val)*32);
  }
}
.p-item_label {
  width: fit-content;
  padding: 0 calc(var(--val)*10);
  background-color: var(--c_brown02);
  border-radius: 100vh;
  font-size: calc(var(--fz)*16);
  font-weight: 900;
  line-height: 1.5;
  color: var(--txt_white);
}
@media screen and (min-width: 768px) {
  .p-item_label {
    padding: 0 calc(var(--val)*20);
    font-size: calc(var(--fz)*32);
  }
}
.p-item_heading {
  margin-top: calc(var(--val)*5);
  font-size: calc(var(--fz)*18);
  font-weight: 900;
  line-height: 1.5;
  color: var(--c_brown02);
}
@media screen and (min-width: 768px) {
  .p-item_heading {
    margin-top: calc(var(--val)*10);
    font-size: calc(var(--fz)*32);
  }
}
.p-item_text {
    margin-top: calc(var(--val)*10);
}

.p-item_note {
  margin-top: calc(var(--val)*10);
  font-size: calc(var(--fz)*14);
  font-weight: 500;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-item_note {
    font-size: calc(var(--fz)*20);
  }
}
.p-item_imgArea {
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-item_imgArea {
    grid-area: img;
  }
}
.p-item_imgArea:where(.p-item_container:nth-child(1 of .p-item_container) *) {
  margin-top: calc(var(--val) * 73);
}
@media screen and (min-width: 768px) {
  .p-item_imgArea:where(.p-item_container:nth-child(1 of .p-item_container) *) {
    margin-top: calc(var(--val)*64);
  }
}
.p-item_img:nth-child(2):where(.p-item_container:nth-child(1 of .p-item_container) *) {
  width: calc(var(--val) * 94);
  position: absolute;
  top: calc(var(--val) * -3);
  left: 0;
  transform: translateY(-50%);
}
@media screen and (min-width: 768px) {
  .p-item_img:nth-child(2):where(.p-item_container:nth-child(1 of .p-item_container) *) {
    width: calc(var(--val) * 168);
    top: calc(var(--val) * -28);
    left: calc(var(--val)*8);
  }
}
.p-item_img:where(.p-item_container:nth-child(2 of .p-item_container) *) {
  width: calc(var(--val)*250);
  margin: calc(var(--val)*20) auto calc(var(--val)*10);
    transform: translateX(calc(var(--val)*-5));
}
@media screen and (min-width: 768px) {
  .p-item_img:where(.p-item_container:nth-child(2 of .p-item_container) *) {
    width: calc(var(--val)*320);
    margin-top: calc(var(--val)*20);
    margin-bottom: calc(var(--val)*-10);
  }
}
.p-item_btn {
  margin-top: calc(var(--val) * 9);
}
@media screen and (min-width: 768px) {
  .p-item_btn {
    grid-area: btn;
    width: calc(var(--val)*350);
    margin-top: 0;
  }
}
/*--------------------------------------------------------*/
/*! list*/
/*--------------------------------------------------------*/

table.list{
	width:90%;
	margin:20px auto 50px;
	font-size:0.8rem;
	line-height:1.2em;
}
table.list th:nth-child(1n),table.list td:nth-child(1n){
width:12%;
}
table.list th:nth-child(2n),table.list td:nth-child(2n){
width:70%;
}


table.list th:nth-child(3n),table.list td:nth-child(3n){
  width:18%;
	font-size:0.8rem;
	letter-spacing:-0.05em;
}

table.list th{
	color:#FFF;
	background-color: #8C574E;
}

table.list th:nth-child(2){
	border-right-color:#FFF;
	border-left-color:#FFF;
}

table.list td{
	border:2px solid #8C574E;
}

table.list th,table.list td{
	padding:10px 5px;
}


@media screen and (min-width: 768px) {
  table.list{
    width:90%;
    border:3px solid #8C574E;
    margin:50px auto 50px;
    font-size:1.25rem;
    line-height:1.2em;
  }

  table.list th:nth-child(1n),table.list td:nth-child(1n){
  width:12%;
  }

  table.list th:nth-child(2n),table.list td:nth-child(2n){
  width:70%;
  }

  table.list th:nth-child(3n),table.list td:nth-child(3n){
  width:18%;
  font-size:1.2rem;
  }

  table.list th{
    color:#FFF;
    background-color: #8C574E;
  }

  table.list th:nth-child(2){
    border-right-color:#FFF;
    border-left-color:#FFF;
  }

  table.list td{
    border:3px solid #8C574E;
  }

  table.list th,table.list td{
    padding:20px;
  }

}

/*--------------------------------------------------------*/
/*! _footer*/
/*--------------------------------------------------------*/
.l-footer {
  background-color: var(--bg_footer);
  padding: calc(var(--val) * 10) 0;
}
@media screen and (min-width: 768px) {
  .l-footer {
    padding: calc(var(--val) * 20) 0;
  }
}
.l-footer_copyright {
  font-size: calc(var(--fz) * 12);
  font-weight: normal;
  line-height: 1.5;
  text-align: center;
}