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


:root{
  font-family:'Noto Sans JP', sans-serif, YuGothic, "Yu Gothic Medium", "Yu Gothic",-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, Verdana,sans-serif;
 font-size:16px;
 
  
 
 /* color */
 --c-b: #000;
 --c-w: #fff;
 --c-blue: #78ABDC;
 --c-darkblue: #073E7D;
 --c-d-blue: #5395d5;
 --c-link-blue: #006CBC;
 --c-gray01:#C8C8C8;
 --c-gray02:#F5F5F5;
 --c-gray03:#DDDDDD;
 --c-gray-footer:#F5F5F5;
 --c-light-y: #FBFAF4;
 --c-red:#F02E00;
 --c-pink:#FFF1F0;
}

body{
 position:relative;
 padding-top: 80px !important;
}

html,body,div,p,h1,h2,h3,h4,h5,form,input,radio,checkbox,ul,li,
dl,dt,dd{
 padding:0;
 margin:0;
 box-sizing: border-box;
 line-height:1.4;
}
ul li{
 list-style:none;
}

p{
 margin:0;
 
}

:where(img, picture, svg) {
 /* max-inline-size: 100%; */
 block-size: auto;
 max-width: 100%;
}
@media screen and (max-width: 768px) {
 body{
  padding-top: 50px !important;
 }
 
 img{
  image-rendering:auto;
 }
 
}


/* a
------------------------ */
a.link:hover{
 transition:0.5s all;
 opacity:1;
}
a.link:hover{
 transition:0.5s all;
 opacity:0.5;
}
.icon-blank::after{
 content:url(/images/icon-blank.svg);
 margin-left:6px;
}

/* footer
------------------------ */
footer{
 color:#6E6E6E;
 background:#F5F5F5;
 font-size:14px;
 text-align:center;
 padding:24px 0 20px;
 position: static;
 bottom: 0;
 width: 100%;
}
@media screen and (max-width: 768px){
 footer{
  padding:15px 0;
 
 }
}

/* font color
------------------------ */
.txt-c-red{
 color:var(--c-red);
}

/* メニューありfooter
------------------------ */
/* フッター 
--------------------- */
footer#footer {
 width:100%;
}

#footer .copyright{
 font-size: 14px;
 color:#6E6E6E;
}

#footer .footer-area{
 margin:auto;
 max-width:900px;
 width:100%;
 display:flex;
 padding:60px 0 25px;
 border-bottom:1px solid var(--c-gray01);
 margin-bottom:28px;
}

#footer .footer-area a{
 color:var(--c-b);
 text-decoration: none;
 transition:0.3s all;
}
#footer .footer-area a:hover{
 opacity:0.5;
 transition:0.3s all;
}

#footer .footer-area .link-in{
 display:block;
 text-align: left;
 max-width:160px;
 width:100%;
 margin-right:25px;
}
#footer .footer-area .link-in:last-child{
 margin-right:0;
}
#footer .hd-link{
 font-size:14px;
 font-weight:bold;
 display: inline-block;
 width: 100%;
 margin-bottom:20px;
}
#footer .c-link{
 font-size:14px;
 display:block;
 display: inline-block;
 width: 100%;
 margin-bottom:25px;
}
#footer .link-icon{
 position:relative;
 display: flex;
 align-items: center;
}
#footer .link-icon:before{
 content:"";
 background:url(/images/footer/arrow.svg);
 background-repeat:no-repeat;
 width:16px;
 height:16px;
 display:inline-block;
 padding-right:8px;
}

@media screen and (max-width: 768px){
   footer#footer{
  padding:0 16px 30px;
  box-sizing: border-box;
 }
 
#footer  .footer-area{
  margin:auto;
  max-width:initial;
  display:block;
  padding:36px 0 25px;
  margin-bottom:0;
  border-bottom:none;
 }
 #footer .footer-area .link-in{
  max-width:initial;
  margin-right:0;
 }
 
 #footer .footer-area .link-in:first-child{
  border-top: 1px solid var(--c-gray01);
  border-bottom: 1px solid var(--c-gray01);
 }
  #footer .footer-area .link-in:last-child{
  border-bottom: 1px solid var(--c-gray01);
 }
 
 #footer .footer-area .link-in .c-link-list{
  display:none;
 }
 #footer .hd-link , .c-link{
  margin-bottom:0;
  padding:15px 0;
 }
 #footer .hd-link{
  width:auto;
  color:var(--c-b);
 }
 #footer div[data-open-trigger]{
  border-bottom:1px solid var(--c-gray01);
  width: 100%;
 }
 
 #footer .c-link{
  border-bottom:1px dashed var(--c-gray01);
  margin-bottom:0;
  text-indent: 46px; 
  text-align: left;
  display: inline-block;
  position: relative;
 }
 #footer .close .c-link:last-child{
  border-bottom:1px solid var(--c-gray01);
 }
 #footer .hd-link:not(.link-icon){
  position:relative;
  text-indent: 26px;
 }
 #footer .hd-link:not(.link-icon):before , #footer .hd-link:not(.link-icon):after{
  position: absolute;
  content: '';
  width: 15px;
  height: 1px;
  background-color: #8C8C8C;
  top: 50%;
  left: 0;
 }
 #footer .hd-link:not(.link-icon):after{
  transform: rotate(90deg);
  left: 0;
  transition: .3s;
 }
 #footer .close .hd-link:not(.link-icon):after{
  transform: rotate(0deg);
  left: 0;
  transition: .3s;
 }
 
 #footer .footer-area .link-in .c-link-list .link-icon:before{
  position: absolute;
  left: 20px;
 }
 
}

/* navi in
--------------------- */

#footer .navi-in{
 margin:0 auto 30px;
 max-width:900px;
 width:100%;
 display:flex;
 justify-content: center;
}
#footer .navi-in li{
 border-left:1px solid var(--c-gray01);
}
#footer .navi-in li:last-child{
 border-right:1px solid var(--c-gray01);
}
#footer .navi-in a{
 font-weight:bold;
 padding:0 20px;
 color:var(--c-b);
 text-decoration: none;
 transition:0.3s all;
}
#footer .navi-in a:hover{
 opacity:0.5;
 transition:0.3s all;
}

@media screen and (max-width: 768px){
 #footer .navi-in{
  display:inline-block;
  font-size:12px;
  margin-bottom:30px;
 }
 #footer .navi-in li{
  display:inline-block;
  margin-bottom:12px;
 }
 #footer .navi-in li a{
  padding:0 6px;
 }
 #footer .navi-in li:nth-of-type(3){
  border-right:1px solid var(--c-gray01);
 }
 #footer .navi-in li:last-child{
  width:auto;
 }
}





/* topへのアイコン
--------------------------------- */
.icon-totop {
  display: none;
  z-index: 10;
  position: fixed;
  bottom: 10%;
  right: 20px;
  cursor: pointer;
}

@media screen and (max-width: 768px){
 .icon-totop {
   bottom: 5%;
 }
 .icon-totop img{
  width:48px;
  height:48px;
 }
}

/* --------------------------------- */
.pc-only{
 display:block;
}
.sp-only{
  display:none;
 }
@media screen and (max-width: 768px){
 .pc-only{
  display:none;
 }
 .sp-only{
  display:block;
 }
}

/* Display None
------------------------ */
.display-none{
 display:none;
}


/* header
------------------------ */
header{
 padding:15px 27px;
 position: fixed;
 z-index: 22;
 height: 80px;
 box-sizing: border-box;
 width: 100%;
 background: var(--c-w);
 top: 0;
}
.h1-area{
 display:inline-block;
 margin:0;
}
.header-logo{
 max-width:175px;
 display:block;
}

@media screen and (max-width: 768px){
 header{
  padding:12px 16px;
 }
 .header-logo{
  max-width:106px;
  
 }


}
.mypage{
  display: flex;
  align-items: center;
  height:80px;
  position: absolute;
  right: 0;
  top:0;
  font-size:14px;
}
.mypage .icon{
 margin-right:14px;
}

.mypage-click{
 width:80px;
 height:80px;
 background:#FFF;
 margin-left:14px;
 position: relative;
}

.mypage-click.active{
 background:#FBFAF4;

}

.mypage-click:before,.mypage-click:after{
 content:"";
 display:inline-block;
 width:30px;
 height:2px;
 background:var(--c-gray01);
 position: absolute;
 top: 40px;
 left: 25px;
}

.mypage-click.active:before{
 transform: rotate(45deg);
 transition:0.3s all;
}
.mypage-click.active:after{
 transform: rotate(-45deg);
 transition:0.3s all;
}

.mypage-click > span:first-child{
 position: absolute;
 display:block;
 width:30px;
 height:2px;
 background:var(--c-gray01);
 top: 30px;
 left: 25px;
 transition:0.3s all;
}
.mypage-click.active> span:first-child{
 display:none;
 transition:0.3s all;
}
.mypage-click > span:last-child{
 position: absolute;
 display:block;
 width:30px;
 height:2px;
 background:var(--c-gray01);
 top: 50px;
 left: 25px;
 transition:0.3s all;
}
.mypage-click.active> span:last-child{
 display:none;
 transition:0.3s all;
}


/* ヘッダー ナビ
--------------------- */
.header-menu-back{
 opacity:0;
 position:absolute;
 top:-1080px;
 transition:0.3s all;
}
.header-menu-back.active{
 opacity:1;
 background:rgb(53 53 53 / 45%);
 position: absolute;
 top:0;
 width: 100%;
 /* height:calc(100% - 84px); */
 min-height:100%;
 height:auto;
 z-index: 12;
 transition:0.3s all;
}
.header-menu{
 opacity:0;
 max-width:680px;
 width: 100%;
 background:#FBFAF4;
 text-align: center;
 padding:40px;
 position: fixed;
 top: -1080px;
 right: 0;
 z-index: 1;
 transition:0.3s all;
}
.header-menu.active{
 opacity:1;
 position: fixed;
 top: 80px;
 right: 0;
 z-index: 1;
 transition:0.3s all;
}
.header-menu a{
 text-decoration: none;
 transition: 0.3s all;
}
.header-menu a:hover{
 opacity:0.5;
 transition: 0.3s all;
}
.header-menu-wrap dl a{
 color:var(--c-b);
 padding:19px 0;
 display:block;
 position:relative;
}

.header-menu-wrap dl a:after{
 content:url(/images/header-menu-arrow.svg);
 display:block;
 position:absolute;
 top: 18px;
 right: 10px;
}

.header-menu-wrap{
 display:flex; 
 justify-content: start;
 
}
.header-menu .inner{
 text-align: left;
 max-width:280px;
 width:100%;
 margin:0;
}
.header-menu .inner:first-child{
 margin-right:40px;
}
.header-menu .inner dl{
 border-bottom:1px solid var(--c-b);
}
.header-menu .inner dt{
 font-size:16px;
 font-weight:bold;
 border-top:1px solid var(--c-b);
}
.header-menu .inner dt.no-link{
 padding:19px 0;
}

.header-menu .inner dd{
 font-size:14px;
 border-top:1px dashed var(--c-gray01);
}

.header-menu .logout{
 border:1px solid var(--c-b);
 color: var(--c-b);
 display: inline-block;
 text-decoration: none;
 padding: 18px 30px;
 border-radius: 50px;
 max-width: 280px;
 width: 100%;
 text-align: center;
 margin: 26px auto 0;
 font-size:14px;
 font-weight:bold;
 position: relative;
 box-sizing: border-box;
}
.header-menu .logout::before{
 content:url(/images/logout.svg);
 position:absolute;
 left:24px;
}

.header-menu .header-shoppng-btn{
 display: inline-block;
 margin:30px 0 10px;
}


/* ヘッダー ナビ SP
--------------------- */
@media screen and (max-width: 768px){
 header{
  height:50px;
 }
 .mypage-click{
  width:50px;
  height:50px;
 }
 .mypage{
  height:50px;
 }
 .mypage-click:before, .mypage-click:after{
  top: 25px;
  left: 12px;
 }
 .mypage-click > span:first-child{
  top: 15px;
  left: 12px;
 }
 .mypage-click > span:last-child{
 top: 35px;
 left: 12px;
 }
 
 
 .header-menu{
  padding:20px 20px 100px;
  width: calc(100% - 70px);
  max-height: 100vh;
  overflow: auto;
 }
 .header-menu.active{
  top:50px;
 }
 
 .header-menu-wrap{
  display:block;
 }
 .header-menu .inner:first-child{
  margin-right:0;
 }
 
 .header-menu .inner{
  max-width:initial;
 }
 
 .header-menu-wrap dl a{
   padding: 18px 0;
 }
 .header-menu .logout{
  max-width:initial;
 }
 
 .sp-mypage{
  font-size:14px;
  font-weight:bold;
  display:flex;
  align-items:center;
  padding-bottom:16px;
 }
 .sp-icon-mypage{
  width: 24px;
  height: 24px;
  display:block;
  flex-shrink: 1;
  margin-right:5px;
 }
 
 .header-menu .inner dl {
  border-bottom:none;
 }
 
}

/* form 
------------------------ */
label.text-block,input[type="text"].block{

 display:block;
}

::placeholder {
  color: #8C8C8C;
}
input,select{
 font-size:16px;
 padding:16px 10px;
 border-radius: 5px;
 border:1px solid #C8C8C8;
 height:50px;
}
input:focus ,select:focus {
 border:1px solid #000;
}


input.enterted{
 background:#C8C8C8;
}
input[type="text"]{
 margin-bottom: 16px;
}
input[type="text"].last{
 margin-bottom: 0;
}
.label-flex input[type="text"],
.label-flex input[type="tel"]
{
 margin-bottom: 0;
}


input[type="text"].w-all,
input[type="password"].w-all
{
 width:100%;
}

input[type="text"].w-100,input[type="tel"].w-100{
 width:100px;
}
input[type="text"].w-180{
 width:180px;
}
input[type="text"].w-200{
 width:200px;
}
input[type="text"].w-220{
 width:220px;
}
input[type="text"].w-240{
 width:240px;
}
input[type="text"].w-300{
 width:300px;
}
input[type="text"].w-400{
 width:400px;
}
input[type="text"].w-500{
 width:500px;
}

input[type="text"].w-600{
 width:600px;
}
input[type="password"].w-300{
 width:300px;
}



@media screen and (max-width: 768px){
  
  input[type="text"].sp-w-all{
   width:100%;
  }
  
  input[type="text"].w-140,
  input[type="text"].w-200,
  input[type="text"].w-220,
  input[type="text"].w-240,
  input[type="text"].w-300,
  input[type="text"].w-400,
  input[type="text"].w-500,
  input[type="text"].w-600,
  input[type="password"].w-300
  {
   width:100%;
  }
  input[type="tel"].w-100{
   width:96px;
  }
}



/* label 横 
------------------- */
.label-flex{
 display:flex;
 align-items: start;
 margin-bottom:25px;
 flex-wrap:wrap;
}


.label-flex > label{
 margin-right:20px;
}
.label-flex > label:last-child{
 margin-right:0;
}
.label-flex.label-birthday > label{
 margin-right:10px;
}
@media screen and (max-width: 768px){
  .label-flex.label-birthday > label{
   margin-bottom:0;
  }
}
.label-flex.label-birthday > label + span{
 margin-right:10px;
 height:50px;
 display:flex;
 align-items: center;
}

.label-name{
 display:block;
 margin-bottom:10px;
}
@media screen and (max-width: 768px){

 .label-flex{
  display:block;
  margin-bottom:0;
 }
 .label-flex.label-birthday , .label-flex.label-age{
  display:flex;
  margin-bottom:16px;
  }
 
 .label-flex > label{
  margin-right:0;
  margin-bottom:16px;
 }
 


 
}

.label-select select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width:100%;
  height:50px;
  padding:0 16px;
  position: relative;
}
.label-select{
 position: relative;
}
.label-select::after{
  content: "";
  position: absolute;
  display:block;
  right: 18px;
  top: 24px;
  background-image:url("/images/select.svg");
  background-repeat:no-repeat;
  width: 9px;
  height: 9px;
  pointer-events:none;
}

/* select 性別 */
.label-select.sex.w-180{
 width:180px;
}
@media screen and (max-width: 768px){
  .label-select.sex.w-180{
   width:100%;
  }

}



/* select  
------------------- */

.label-select.w-140{
 width:140px;
}
.label-select.w-100{
 width:100px;
}
.label-select.w-180{
 width:180px;
}
.label-select.w-300{
 width:300px;
}
.label-select.w-200{
 width:200px;
}
.label-select.w-400{
 width:400px;
}
.label-select.w-600{
 width:600px;
}
@media screen and (max-width: 768px){
 .label-select.w-100,
 .label-select.w-140,
 .label-select.w-180,
 .label-select.w-200,
 .label-select.w-300,
 .label-select.w-400,
 .label-select.w-600
 {
  width:100%;
 }

 .label-select.w-140.sp-w-90{
  width:90px;
 }
 .label-select.w-100.sp-w-70{
  width:70px;
 }
 .label-select.w-100.sp-w-100{
  width:100px;
 }
 .label-select.w-140.sp-w-70{
  width:70px;
 }
 .label-select.w-140.sp-w-140{
  width:140px;
 }
}


/* select 生年月日 
------------------- */
.label-age{
 margin-bottom:30px;
}
@media screen and (max-width: 768px){
 .label-age{
  margin-bottom:10px;
 }
}

.label-age span{
 font-weight:bold;
}

.label-age .age{
 font-weight:normal;
 margin-left:10px;
}

.label-age input[type="text"]{
 height:50px;
}
.label-age .text-block.text-block-age{
  width:100px;
  position: relative;
 }
 
 .label-age .text-block.text-block-age:after{
  content: "歳";
  position: absolute;
  font-size: 16px;
  right: -30px;
  top: 45px;
}

 
@media screen and (max-width: 768px){
 .label-age .text-block:first-child{
  margin-right:20px;
 }
 .label-age .text-block.text-block-age{
  width:100px;
 
 }
}

/* radio 
------------------- */

input[type="radio"]{
 width:24px;
 height:24px;
 margin-right:5px;
 border:1px solid var(--c-gray01);
}
input[type="radio"]:checked{
 accent-color:var(--c-d-blue);
 border:1px solid var(--c-d-blue);
}
.label-radio-button > label{
 margin-bottom:20px;
}

label.label-raio-block{
 display: flex;
 align-items: center;
}

label.label-raio-block2{
 display: flex;
 align-items: center;
 font-size:14px;
 margin-bottom:10px;
}

@media screen and (max-width: 768px){
 label.label-raio-block{
  border:1px solid var(--c-gray01);
  border-radius:5px;
  padding:12px;
 }
 label.label-raio-block.checked{
  border:2px solid var(--c-blue);
 }
 .label-radio-button > label{
  margin-bottom:8px;
 }
 .label-radio-button{
  margin-bottom:24px;
 }

}

/* textarea 
------------------- */
textarea{
 max-width:100%;
 width:100%;
 font-size: 16px;
 padding: 16px 10px;
 border-radius: 5px;
 border: 1px solid #C8C8C8;
 box-sizing: border-box;
}


/* 電話番号 
------------------- */
.input-hyphen{
 display:inline-block;
 margin:0 5px 5px;
}
@media screen and (max-width: 768px){

.input-hyphen{
 margin:0 0 5px;
}

}

/* button 
------------------- */
button{
 opacity:1;
 transition:0.3s all;
}
button:hover{
 opacity:0.5;
 transition:0.3s all;
}
button.submit{
 display:block;
 max-width:400px;
 height:70px;
 width:100%;
 margin: auto;
 border:none;
 background:var(--c-darkblue);
 color:var(--c-w);
 font-size:20px;
 font-weight:bold;
 border-radius: 50px;
}
button.submit:disabled{
 background:var(--c-gray01);
}
@media screen and (max-width: 768px){
 button.submit{
 max-width:initial;
 }
}
button.w-search{
 background: var(--cw);
 color: var(--c-b);
 border:1px solid var(--c-b);
 width:300px;
 height:50px;
 font-size:16px;
}



/* input-last 
------------------- */
form .input-last{
 margin-bottom:40px;
}
@media screen and (max-width: 768px){
 form .input-last{
  margin-bottom:30px;
 }

}
/* お子様情報　追加 
------------------- */
a.plus{
 text-decoration: none;
}
.plus{
 display: flex;
 align-items: center;
 justify-content: center;
 max-width:180px;
 height:50px;
 width:100%;
 margin: 0 0 10px;
 border:none;
 background:var(--cw);
 color:var(--c-b);
 font-size:16px;
 font-weight:normal;
 border-radius: 50px;
 border:1px solid var(--c-b);
}
.plus:before{
 content:url(/images/plus.svg);
 margin-right:6px;
}
.plus{
 opacity:1;
 transition:0.3s all;
}
.plus:hover{
 opacity:0.5;
 transition:0.3s all;
}

.plus.w-260{
 max-width:260px;
}

@media screen and (max-width: 768px){
 .plus{
  margin:0 auto 16px;
  max-width:245px;
 }
 .plus.w-260{
  max-width:initial;
 }
}

/* 区切り線 
------------------- */
.bd-bottom{
 border-bottom:1px solid var(--c-gray01);
 margin-bottom:28px;
}
@media screen and (max-width: 768px){
 .bd-bottom{
  padding-bottom:8px;
 }
}

/* お子様情報　区切り線 
------------------- */
.child-bd-bottom{
 border-bottom:1px solid var(--c-gray01);
 margin-bottom:28px;
}


/* 郵便番号ボタン
------------------- */

.yubin-num{
 display: flex;
 align-items: center;
 justify-content: center;
 max-width:215px;
 height:50px;
 width:100%;
 margin: 0;
 border:none;
 background:var(--cw);
 color:var(--c-b);
 font-size:14px;
 font-weight:normal;
 border-radius: 50px;
 border:1px solid var(--c-b);
}


@media screen and (max-width: 768px){
 .yubin-num{
  margin:0 auto 16px;
  max-width:245px;
 }

}

/* キャンセルボタン 
------------------- */
a.cancel{
 text-decoration: none;
}
.cancel{
 display: flex;
 align-items: center;
 justify-content: center;
 max-width:180px;
 height:50px;
 width:100%;
 margin: 0 ;
 border:none;
 background:var(--cw);
 color:var(--c-b);
 font-size:16px;
 font-weight:normal;
 border-radius: 50px;
 border:1px solid var(--c-b);
 box-sizing: border-box;
}

.cancel{
 opacity:1;
 transition:0.3s all;
}
.cancel:hover{
 opacity:0.5;
 transition:0.3s all;
}

@media screen and (max-width: 768px){
 .cancel{
  margin:0 auto 16px;
  max-width:245px;
 }

}

/* アレルギーの追加／削除ボタン等
------------------- */
a.allergy{
 text-decoration: none;
}
.allergy{
 display: flex;
 align-items: center;
 justify-content: center;
 max-width:250px;
 height:50px;
 width:100%;
 margin: 0 ;
 border:none;
 background:var(--cw);
 color:var(--c-b);
 font-size:16px;
 font-weight:normal;
 border-radius: 50px;
 border:1px solid var(--c-b);
 box-sizing: border-box;
}

.allergy{
 opacity:1;
 transition:0.3s all;
}
.allergy:hover{
 opacity:0.5;
 transition:0.3s all;
}

.plus.w-260{
 max-width:260px;
}

@media screen and (max-width: 768px){
 .allergy{
  margin:0 auto 16px;
  max-width:245px;
 }
}



/* error 
------------------- */

input[type="text"].error ,input[type="password"].error , input[type="tel"].error, select.error,textarea.error{
 background:var(--c-pink);
 border-width: 2px;
 border-color:var(--c-red);
}
input[type="radio"].error{
 position:relative;
 accent-color:var(--c-red);
}
input[type="radio"].error:after{
 position: absolute;
 content: "";
 display: block;
 width: 22px;
 height: 22px;
 border: 2px solid var(--c-red);
 border-radius: 100%;
 top: -1px;
 left: -1px;
}
.agree input[type="checkbox"].error,input[type="checkbox"].error{
 position:relative;
 accent-color:var(--c-red);
}
input[type="checkbox"].error:after{
 position: absolute;
 content: "";
 display: block;
 width: 22px;
 height: 22px;
 border: 2px solid var(--c-red);
 border-radius: 5px;
 top: -1px;
 left: -1px;
}
@media screen and (max-width: 768px){
input[type="radio"].error:after{
 -webkit-appearance: none;
 width: 21px;
 height: 21px;
}
 input[type="checkbox"].error:after{
   -webkit-appearance: none;
  width: 20px;
  height: 20px;
 }
}

.error-text{
 color:var(--c-red);
 font-size:14px;
 margin-bottom:20px;
 display: block;
 width:100%;
}
.error-text a{
 color:var(--c-red);
}

.error-normal{
 color:var(--c-red);
 font-size:14px;
 display: block;
 width:100%;
 padding-top: 5px;
 text-align:left;
}


/* 同意する
------------------- */
.agree{
 text-align:center;
 font-size:18px;
 margin-bottom:30px;
}
.agree label{
 display:flex;
 justify-content:center;
 align-items: center;
}
.agree input[type="checkbox"]{
 cursor: default;
 appearance: auto;
 width:24px;
 height:24px;
 margin-right:8px;
 border-color:var(--c-gray01);
 border:2px solid var(--c-gray01); 
 accent-color:var(--c-d-blue);
}
.agree input[type="checkbox"]:cecked{
  accent-color:#5395d5;
  /* accent-color:var(--c-blue); */
  background:var(--c-blue);
}

@media screen and (max-width: 768px){
 .agree label{
   border:1px solid ;
   border-color:var(--c-gray01);
   border-radius:5px;
   padding:16px;
  }
 .agree label.checked{
  border-color:var(--c-blue);
 }
}

/* チェックボックス
------------------- */
.ckbox{
 text-align:center;
 font-size:18px;
 margin-bottom:30px;
}
.ckbox label{
 display:flex;
 justify-content:start;
 align-items: start;
 text-align: left;
}
.ckbox input[type="checkbox"]{
 cursor: default;
 appearance: auto;
 width:24px;
 height:24px;
 margin-right:8px;
 border-color:var(--c-gray01);
 border:2px solid var(--c-gray01); 
 accent-color:var(--c-d-blue);
 flex-shrink: 0;
}
.ckbox input[type="checkbox"]:cecked{
  accent-color:#5395d5;
  background:var(--c-blue);
}

.ckbox.ft-s{
 font-size:14px;
}
.ckbox .error-normal{
 text-align:left;
}

@media screen and (max-width: 768px){
 .ckbox label{
   border:1px solid ;
   border-color:var(--c-gray01);
   border-radius:5px;
   padding:16px;
  }
 .ckbox label.checked{
  border-color:var(--c-blue);
 }
}



/* reCAPTCHA ダミー
------------------- */
.recaptcha{
 text-align:center;
 margin-bottom:30px;
}
@media screen and (max-width: 768px){
 .recaptcha{
  margin-bottom:20px;
 }
 .recaptcha img{
  width:100%;
 }

}








/* font-size 
------------------------ */
.h2-text{ font-size:36px; font-weight:bold;}
.h3-text{ font-size:24px; font-weight:bold;}
.h4-l-text{ font-size:20px; font-weight:bold;}
.h4-text{ font-size:18px; font-weight:bold;}

@media screen and (max-width: 768px){
 .h2-text{ font-size:25px;}
 .h3-text{ font-size:22px;}
 .h4-l-text{ font-size:20px;}
 .h4-text{ font-size:18px;}
}


/* SNS
------------------------ */
.sns-link{
 margin:0 auto 30px;
 display:flex;
 max-width:200px;
 width:100%;
 justify-content: space-between;
 box-sizing:border-box;
}
.sns-link > a{
 display:block;
 width:32px;
}

@media screen and (max-width: 768px){
 .sns-link{
  display:flex;
  max-width:initial;
  width:60%;
 }
}

/* pc width 
------------------------ */
.main{
 max-width:900px;
 padding:56px 20px 70px;
 margin:0 auto ;
}
.main p{
 line-height:1.5;
}
@media screen and (max-width: 768px){
 .main{
  max-width:initial;
  padding:26px 15px 40px;
  margin:0 auto ;
 }
}

/* 必須 
------------------------ */
.icon-required{
 display:inline-block;
 position:relative;
}
.icon-required:after{
 content:url(/images/required.svg);
 display:block;
 width:36px;
 height:20px;
 position: absolute;
 bottom: 1px;
 right: -40px;
}



/* 任意 
------------------------ */
.icon-option{
 display:inline-block;
 position:relative;
}
.icon-option:after{
 content:url(/images/option.svg);
 display:block;
 width:36px;
 height:20px;
 position: absolute;
 bottom: 1px;
 right: -40px;
}


/* PDF 
------------------------ */
.icon-pdf{
 display:inline-block;
 position:relative;
 margin-right: 25px 
}
.icon-pdf:after{
 content:url(/images/icon-pdf.svg);
 display:block;
 width:36px;
 height:20px;
 position: absolute;
 bottom: -1px;
 right: -40px;
}
a.icon-pdf{
 color:#006CBC;
}

/* 入力済み 
------------------------ */
.entered{
 background:var(--c-gray02);
}


/* カレンダー
------------------------ */
.input-calendar{
 display:block;
 position:relative;
}
.input-calendar:after{
  content: "";
  display: block;
  background: url(/images/calendar.svg);
  background-repeat: no-repeat;
  position: absolute;
  width: 18px;
  height: 18px;
  top: 18px;
  right: 18px;
  pointer-events: none;
}

/* 角丸囲み
------------------------ */
.bg-rad{
 border-radius: 10px;
}

/* メンテナンス
------------------------ */
.maintenance{
 text-align:center;
}


.button-back-home{
 margin:34px auto 0;
 text-align: center;
}
.button-back-home a{
 text-decoration: none;
 opacity:1;
 transition:0.3s all;
}
.button-back-home a span{
 display: flex;
 align-items: center;
 justify-content: center;
 margin:auto;
 color:var(--c-b);

 position:relative;
}
.button-back-home a span:after{
 content:url(/images/forward.svg);
 width:18px;
 height:18px;
 display:inline-block;
 margin:0 0 0 5px;
 transform: rotate(180deg);
}

.button-back-home a:hover{
 opacity:0.5;
 transition:0.3s all;
}

.button-back-home a.link{
 color:var(--c-link-blue);
 
}


/* パスワード忘れ
------------------------ */
.e-mail{
 display:block;
}