@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

:root{
  --BaseFontColor:#212121;
  --BaseColor:#f7a19d;
  --SecondColor:#a9d158;
  --Esinout:ease-in-out;
  --Baseeasing:cubic-bezier(0.2, 0.5, 0.4, 1);
}

/*-- Base
-------------------------------------------------------------*/
*{
  box-sizing: border-box;
  margin:0;
  padding:0;
  border:0;
  backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html{
  width: 100%;
  font-size:0.5vw;
  overflow-x:hidden;
  background:#fff;
}
body{
  color:var(--BaseFontColor);
  font-size:max(1.6rem, 16px);
  font-weight:normal;
  font-family:'Yu Mincho', '游明朝', sans-serif;
}
main{
  width:100%;
  position:relative;
}
ul,li{
  list-style:none;
}
a{
  text-decoration: none;
  color:var(--BaseColor);
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
img{
  max-width: 100%;
}

/*-- Layout
-------------------------------------------------------------*/
/*--- container ---*/
.l-container{
  width:100%;
  position:relative;
  padding:100px 0;
}
/*--- inner ---*/
.l-inner-large{
  width:95%;
  margin:0 auto;
}
.l-inner-small{
  width:75%;
  max-width:1420px;
  margin:0 auto;
}
/*--- block-title ---*/
.p-title{
  font-size:max(1.5rem,15px);
  font-weight: 800;
}
.p-title span{
  font-size:max(1.5rem,15px);
  color:#909090;
  display: block;
}
.p-title-box{
  margin-bottom:4.5em;
}
.l-flex .p-title-box{
  width:50%;
}
/*--- block-text ---*/
.p-txt-box{
  position:relative;
}
.l-flex .p-txt-box{
  width:50%;
}
/*--- block-img ---*/
.p-img-box{
  flex-shrink: 0;
  /* overflow:hidden; */
  position:relative;
}
.p-img-box img{
  max-width:100%;
  object-fit: cover;
}
.l-flex .p-img-box{
  width:50%;
}
/*--- item ---*/
.item{
  position: relative;
}
.item50{
  width:50%;
}
.item-tit{
  font-size:max(1.7rem,17px);
}

h3{
  margin-bottom: 1em;
}

img.icon{transform:translateY(2px);}

/*--- tablet ---*/
@media only screen and (min-width:845px) and (max-width:1280px){
  .l-inner-small{
    width:80%;
    max-width:1080px;
  }
}
/*--- phone ---*/
@media only screen and (max-width:844px){
  .l-container{
    padding:50px 0;
  }
  .l-inner-large,
  .l-inner-small{
    max-width:100%;
    width:100%;
    padding:0 15px;
  }
}

/*--- スタイル ---*/
.is-bar{
  padding-left:1em;
  text-indent: -1em;
}
.is-bar:before{
  content:"";
  width:9px;
  height:5px;
  border-top: 2px solid #28221d;
  display: inline-block;
  margin-right: 3px;
}
/*-- Flex
-------------------------------------------------------------*/
.l-flex{display:flex;}
.l-flex.is-fc{flex-direction:column;}
.l-flex.is-js{justify-content:flex-start;}
.l-flex.is-jb{justify-content:space-between;}
.l-flex.is-jc{justify-content:center;}
.l-flex.is-je{justify-content:flex-end;}
.l-flex.is-ac{align-items:center;}
.l-flex.is-ae{align-items:flex-end;}
.l-flex.is-as{align-items:stretch;}
.l-flex.is-wn{flex-wrap: nowrap;}
.l-flex.is-ww{flex-wrap: wrap;}
@media only screen and (max-width:844px){
	.l-flex{flex-direction:column;}
  .l-flex.is-fr{flex-direction:row;}
  .l-flex.is-fcr{flex-direction:column-reverse;}
  .l-flex.is-frr{flex-direction:row-reverse;}
  .l-flex.is-ac{justify-content:center;}
  .l-flex.is-ae{justify-content:flex-end;}
  .l-flex.is-js{align-items:flex-start;}
  .l-flex.is-jc{align-items:center;}
  .l-flex.is-je{align-items:flex-end;}
  .l-flex.is-wn{flex-wrap: wrap;}
}

/*--- text
-------------------------------------------------------------*/
.l-c-text{
  text-align: center;
}
.l-base-color{
  color: var(--BaseColor);
}
.l-second-color{
  color: var(--SecondColor);
}
.l-blue-color{
  color: #7ad4e3;
}

/*-- Show,Hide
-------------------------------------------------------------*/
@media screen and (min-width: 1281px) {
  .hide_lg{display:none;}
}
@media only screen and (min-width:845px) and (max-width:1280px){
  .hide_md{display:none;}
}
@media only screen and (max-width:844px){
  .hide_sp{display:none;}
}

/*-- Link
-------------------------------------------------------------*/
/*-- Base-Style ----------*/
.p-link{
  position: relative;
}
.p-link:before{
  content: "";
  width: 100%;
  height: 1px;
  background-color:var(--BaseColor);
  position: absolute;
  bottom: 0;
  left: 0em;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .5s cubic-bezier(1,0,0,1);
}
.p-link:hover:before{
  transform: scaleX(1);
  transform-origin: left center;
}
/*-- Link-Arrow-Icon ----------*/
.p-link.is-arrow{
  margin-right: 12px;
}
.p-link.is-arrow:after{
  content: "";
  width: 8px;
  height: 8px;
  position: absolute;
  bottom: 1px;
  right: -8px;
  border-top:1px solid var(--BaseColor);
  border-right:1px solid var(--BaseColor);
  transform: rotate(45deg) translateY(-50%);
}
/*-- Link-Blank-Icon ----------*/
.p-link.is-blank{
  margin-right: 23px;
}
.p-link.is-blank:after{
  content: url("../img/common/blank_icon.svg");
  position: absolute;
  bottom: -2px;
  right: -18px;
}

/*-- LinkBtn
-------------------------------------------------------------*/
/*-- Base-Style ----------*/
.p-btn{
  width: 35rem;
  height: 8.5rem;
  min-width: 250px;
  min-height: 60px;
  max-width:100%;
  position:relative;
  display:flex;
  align-items: center;
  text-align:left;
  text-decoration:none;
  font-size:max(2rem, 20px);
  border-radius:0;
  overflow: hidden;
  padding: 0 4.25rem;
}
.p-btn span{
  width: 100%;
  position:relative;
  z-index:10;
}
/*-- Base-Style ----------*/
.p-btn:before{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  opacity:0;
  transition: opacity 1s ease-in-out;
}
.p-btn:hover:before,
.p-btn:focus:before{
  opacity:1;
}
/*--- icon ----------*/
/* .p-btn span:before{
  content:"";
  width:6rem;
  height:6rem;
  position: absolute;
  top:50%;
  right:0;
  transform:translateY(-50%) scale(0);
  transform-origin: center;
  transform-style: preserve-3d;
  transition: transform 0.2s ease-in-out;
  border-radius:3rem;
}
.p-btn:hover span:before,
.p-btn:focus span:before{
  transform:translateY(-50%) scale(1);
} */
.p-btn span:after{
  content:"";
  width: calc(6rem - 10px);
  height: calc(6rem - 10px);
  max-width: 20px;
  max-height: 20px;
  position: absolute;
  top:50%;
  right:6rem;
  /* opacity:0; */
  transform:translateY(-50%);
  transition: right 1s,opacity 1s;
  background-size:100% !important;
}
.p-btn:hover span:after,
.p-btn:focus span:after{
  right:calc(3rem - 10px);
  opacity:1;
}
/*-- LinkBtn-Normal-Color ----------*/
.is-nml{
  color:var(--BaseFontColor);
  background:#fff;
  border:1px solid var(--BaseFontColor);
  /* border:3px solid #111; */
}
.is-nml:before{
  background:var(--BaseColor)/*linear-gradient(-10deg, var(--BaseColor), var(--BaseColor))*/;
}
/*-- LinkBtn-Arrow-Icon ----------*/
.p-btn.is-arrow span:before{
  background-color:#fff;
}
.p-btn.is-arrow span:after{
  background:url("../img/common/arrow-icon.svg")no-repeat center;
}
/*-- LinkBtn-Blank-Icon ----------*/
.p-btn.is-blank span:before{
  background-color:#fff;
}
.p-btn.is-blank span:after{
  background:url("../img/common/blank-icon.svg")no-repeat center;
}
.p-btn.is-center{
  margin: 0 auto;
}
.p-btn.is-c-txt{
  text-align: center;
}

/*-- Header
-------------------------------------------------------------*/
header{
  width:100%;
  height:80px;
  position:absolute;
  top: 0;
  z-index:1000;
  padding:0 50px;
  align-items: center;
  background: #fff;
}
header.is-fixed{
  position:fixed;
  /* top: 0; */
  animation: is-h-fixed 1s forwards;
}
header.is-footer{
  animation: is-h-fixed 1s reverse 2.3s;
}
@keyframes is-h-fixed {
  0%{
    top: -100%;
  }
  100%{
    top: 0%;
  }
}
header h1{
  max-width:20%;
}
header h1 a{
  display: flex;
  align-items: center;
}
header .p-gmenu-box{
  width:auto;
  padding:0 15px;
  /* background:#fff; */
  border-radius: 5px;
}
@media only screen and (max-width:844px){
  header{
  	width:100%;
    height:70px;
    padding:0 0;
    align-items: flex-start;
  }
  header h1{
    max-width:20%;
    max-height: 100%;
    margin:10px 0 0 5%;
  }
  header h1{
    height: 100%;
    margin-left:15px;
  }
  header h1 a{
    height: 100%;
  }
	header .p-logo-box img{
    height:100%;
  }
  header .p-gmenu-box{
    width:auto;
    padding:0;
    border-radius: 0;
  }
  header.is-fixed .p-gmenu-box{
    right:0%;
    transform:translateX(0%);
  }
}
/*-- Footer
-------------------------------------------------------------*/
/*--- base ----------*/
footer{
  position: relative;
  padding:50px 0 0;
  background:#fff;
}
footer .footer-inner{
  width:95%;
  margin:0 auto;
}
footer .p-flogo-box{
  max-width:100%;
  align-items: center;
  margin-bottom:30px;
}
footer .p-flogo-box p{
  margin-top:1em;
}
/*--- menu ----------*/
footer .p-fmenu-box ul{
  gap:1em;
}
footer .p-fmenu-box ul li a{
  color:#212121;
  font-weight: 600;
  transition: color 0.2s ease-in-out;
}
footer .p-fmenu-box ul li a:hover{
  color:var(--BaseColor);
}

/*--- footer-bottom ----------*/
footer .p-ft-btm-box{
  border-top:1px solid #ddd;
  padding:30px 0;
}
footer .p-copy-box{
  font-size:max(1.2rem, 12px);
}
footer .p-sns-box ul{
  height:30px;
  gap:15px;
}
footer .p-sns-box img{
  max-height:100%;
  opacity:1;
  transition:opacity 0.2s ease-in-out;
}
footer .p-sns-box img:hover{
  opacity:0.5;
}

/*--- colorbar ----------*/
footer .footer-color-bar{
  position:relative;
  width: 100%;
  height:60vh;
  max-height: 500px;
  overflow-y:hidden;
}
footer .footer-color-bar:before{
  content:url('../img/common/f_bar.svg');
  position: absolute;
  top: 50%;
  left:0;
  transform:translateY(-50%);
  z-index: 20;
}
footer .footer-color-bar .l-inner-small{
  position: relative;
  z-index: 20;
}
footer .footer-color-bar .color1{
  position:absolute;
  width: 0%;
  height:100%;
  opacity:0;
  left:0;
  top:0;
  background:var(--BaseColor);
  transition: 4s var(--Baseeasing);
  transition-property: opacity,width;
}
footer .footer-color-bar .color2{
  position:absolute;
  width: 0%;
  height:100%;
  opacity:0;
  right:0;
  top:0;
  background:var(--SecondColor);
  transition: 4s var(--Baseeasing);
  transition-property: opacity,width;
}
footer .footer-color-bar .color1.is_show{
  width: 72%;
  opacity:1;
}
footer .footer-color-bar .color2.is_show{
  width: 28%;
  opacity:1;
}

@media only screen and (max-width:844px){
  footer .p-fmenu-box{
    margin-bottom:2em;
  }
  footer .p-fmenu-box ul li{
    text-align: center;
  }
  footer .footer-color-bar .f-logo{
    left: 15px;
  }
}
/*-- Page-Top-Link
-------------------------------------------------------------*/
.p-scroll-top{
  width: 20px;
  height: auto;
  position: fixed;
  bottom: 30px;
  right: max(0.5%, 2px);
  opacity:0;
  transition:opacity 0.2s ease-in-out;
  font-weight: 800;
  z-index:-1;
}
.p-scroll-top.is-active{
  opacity:1;
  z-index:100;
}
/*--- Font ----------*/
.p-scroll-top p{
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  color:#212121;
  transition:color 0.2s ease-in-out;
}
.p-scroll-top:hover p{
  color:var(--BaseColor);
}
/*--- Icon ----------*/
.p-scroll-top span{
  width: 100%;
  height: 50px;
  position: relative;
  display: block;
}
.p-scroll-top span:before,
.p-scroll-top span:after{
  content:"";
  position:absolute;
  top: 0px;
  border-left:2px solid #212121;
  transition:border-left 0.2s ease-in-out;
}
.p-scroll-top:hover span:before,
.p-scroll-top:hover span:after{
  border-left:2px solid var(--BaseColor);
}
.p-scroll-top span:before{
  left: 10px;
  height: 30px;
  transition:height 0.2s ease-in-out;
}
.p-scroll-top:hover span:before{
  height: 45px;
}
.p-scroll-top span:after{
  left: 15px;
  height: 12px;
  transform: rotate(-45deg);
}

/*--- Font ----------*/
@media only screen and (max-width:844px){
  .p-scroll-top{
    display: none;
  }
}
/*-- パンくずリスト
-------------------------------------------------------------*/
.bread_crumb{
  position: absolute;
  bottom: -130px;
  left:10%;
  z-index: 10;
  font-size:max(1.3rem, 13px);
  color:#9e9e9e;
}
.bread_crumb li{
  padding-left:14px;
  white-space: nowrap;
  position: relative;
  margin-right:14px;
}
.bread_crumb li span{
  margin-top:-3px;
  display: inline-block;
}
.bread_crumb li::before {
  content: "";
  display: block;
  width: 1px;
  height: 15px;
  transform: translateY(-50%) rotate(25deg);
  position: absolute;
  top: 50%;
  left: 0px;
  border-right: 1px solid #9e9e9e;
  margin: auto;
  margin-top: 1px;
}
.bread_crumb li:first-child{
  padding-left:0;
}
.bread_crumb li:first-child::before {
  content: "";
  display: none;
}

.bread_crumb li a{
  color:#9e9e9e;
}

@media only screen and (max-width:844px){
  .bread_crumb{
    display: none;
  }
}

/*-- イメージ
-------------------------------------------------------------*/
figure.trans_image{
  position: relative;
  overflow: hidden;
}
figure.trans_image img{
  width: 100%;
  position: absolute;
  top: 50%;
  left:50%;
  transform: translate(-50%, -50%) scale(1,1);
  z-index:0;
  transition:transform 0.4s cubic-bezier(.26,.06,0,1);
}
figure.trans_image img:hover{
  transform: translate(-50%, -50%) scale(1.2,1.2);
  transition:transform 0.4s cubic-bezier(.26,.06,0,1);
}

/*-- テキスト
-------------------------------------------------------------*/
input[type="text"],
input[type="tel"],
input[type="date"]{
  border:1px solid #c3c3c3;
  width: 100%;
  height: 4em;
  padding: 0 1em;
}
input[type="text"]:disabled,
input[type="tel"]:disabled,
input[type="date"]:disabled,
select:disabled{
  background-color: gray;
}
select{
  border: 1px solid #c3c3c3;
  width: 100%;
  height: 4em;
  padding: 0 1em;
  background: #fff;
}
textarea{
  border:1px solid #c3c3c3;
  width: 100%;
  height: 10em;
  padding: 1em;
}
.confirm-box{
  display: flex;
  gap:2em;
  border-bottom:1px solid #acacac;
}
.confirm-box p:first-child{
  width:10em;
  max-width: 100%;
  padding-left:1em;
}
.confirm-box p:last-child{
  width:calc(100% - 12em);
  max-width: 100%;
}
.button-box{
  gap:2em;
}

@media only screen and (max-width:844px){
  .confirm-box p:first-child{
    width:7.5em;
    max-width: 100%;
  }
  .confirm-box p:last-child{
    width:calc(100% - 8.5em);
    max-width: 100%;
  }
  .confirm-box{
    display: flex;
    gap:1em;
    justify-content:flex-start;
  }
}

.caution{
  color:#ff0000;
}