@charset "UTF-8";

/* --------------------------------------------------
box
-------------------------------------------------- */
/* contents box --------------- */
.contentsBox{
box-sizing:border-box;
width:100%;
padding-left: 10%;
padding-right: 10%;
}
.contentsBoxFlex{
box-sizing:border-box;
width: 100%;
display: flex;
}
.contentsBoxFlex > .flex{
box-sizing:border-box;
}
.contentsBoxFlex.leftSide{
justify-content: flex-start;
}
.contentsBoxFlex.leftSide > .flex:nth-of-type(1){
width: 50%;
}
.contentsBoxFlex.leftSide > .flex:nth-of-type(2){
width: 45%;
max-width: 550px;
}
.contentsBoxFlex.rightSide{
justify-content: flex-end;
}
.contentsBoxFlex.rightSide > .flex:nth-of-type(1){
width: 45%;
max-width: 550px;
}
.contentsBoxFlex.rightSide > .flex:nth-of-type(2){
width: 50%;
}
.contentsFloatingBox{
box-sizing:border-box;
width:90%;
max-width:1100px;
margin-left: auto;
margin-right: auto;
}
.contentsBoxMargin{
box-sizing:border-box;
margin-top: 120px;
}
@media screen and (max-width: 750px) {
  .contentsBoxMargin{
  margin-top: 14%;
  }
}

/* boxAccordion --------------- */
.boxAccordion{
margin: 0 0 1px;
box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
}
.boxAccordion .accordionTrigger{
box-sizing: border-box;
background-color:#968b8a;
padding: 2% 70px 2% 4%;
line-height: 1.5;
cursor:pointer;
position:relative;
z-index:1;
transition:0.2s;
}
.boxAccordion .accordionTrigger:hover{
opacity: 0.8;
}
.boxAccordion .accordionTrigger .txt{
display:block;
color:#fff;
}
.boxAccordion .accordionTrigger .more{
position:absolute;
top:0;
bottom:0;
right:0;
width:60px;
}
.boxAccordion .accordionTrigger .more:before{
content:"";
background-color:#fff;
width:14px;
height:2px;
margin:auto;
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
transition:0.2s;
transform:rotate(90deg);
}
.boxAccordion .accordionTrigger.onclick .more:before{
transform:rotate(0deg);
}
.boxAccordion .accordionTrigger .more:after{
content:"";
background-color:#fff;
width:14px;
height:2px;
margin:auto;
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
}
.boxAccordion .accordionContent{
background:#fff;
margin-bottom: calc(25px + 3%);
position:relative;
color:#222;
}
.boxAccordion .accordionContent .inner{
padding: 4% 4%;
padding-bottom: calc(25px + 2%);
}
.boxAccordion .accordionContent .btnClose{
box-sizing:border-box;
display:block;
text-decoration:none;
position:absolute;
right:2%;
bottom:-25px;
z-index:2;
background:#968b8a;
border:1px solid #968b8a;
cursor:pointer;
padding: 0 4%;
height: 50px;
line-height: 50px;
color:#fff;
font-size: 90%;
transition:0.2s;
}
.boxAccordion .accordionContent .btnClose:hover{
opacity: 0.8;
}
@media screen and (max-width: 750px) {
  .boxAccordion .accordionTrigger{
  padding: 5% 60px 5% 4%;
  }
  .boxAccordion .accordionTrigger .more{
  width:50px;
  }
  .boxAccordion .accordionContent{
  margin-bottom: calc(20px + 8%);
  }
  .boxAccordion .accordionContent .inner{
  padding: 8% 4%;
  padding-bottom: calc(20px + 4%);
  }
  .boxAccordion .accordionContent .btnClose{
  padding: 0 8%;
  height: 40px;
  line-height: 40px;
  bottom: -20px;
  }
}

/* boxSeparate --------------- */
.boxSeparate.col2 > li{
box-sizing:border-box;
width:48%;
margin: 0 0 6%;
}
.boxSeparate.col2 > li:nth-of-type(odd){
clear:both;
float:left;
}
.boxSeparate.col2 > li:nth-of-type(even){
float:right;
}
.boxSeparate.col3 > li{
box-sizing:border-box;
float:left;
width:32%;
margin:0 0 5% 2%;
}
.boxSeparate.col3 > li:nth-of-type(3n+1){
clear:both;
margin:0 0 5% 0;
}
@media screen and (max-width: 750px) {
  .boxSeparate.col2 > li:nth-of-type(odd),
  .boxSeparate.col2 > li:nth-of-type(even){
  clear:none;
  float:none;
  width:100%;
  margin: 0 0 18%;
  }
  .boxSeparate.col3 > li,
  .boxSeparate.col3 > li:nth-of-type(3n+1){
  clear:none;
  float:none;
  width:auto;
  margin: 0;
  }
  .boxSeparate.col3 > li:nth-of-type(odd){
  clear:both;
  float:left;
  width:48%;
  margin: 0 0 10%;
  }
  .boxSeparate.col3 > li:nth-of-type(even){
  float:right;
  width:48%;
  margin: 0 0 10%;
  }
}

/* --------------------------------------------------
title
-------------------------------------------------- */
/* ttlPage --------------- */
.ttlPage .ttl{
background: #eaecf5;
margin-bottom: 80px;
overflow: hidden;
}
.ttlPage .ttl .inner{
display: flex;
align-items: center;
position: relative;
z-index: 2;
}
.ttlPage .ttl .hd{
box-sizing: border-box;
position: relative;
max-width: 40%;
line-height: 1.5;
padding: 7% 0;
text-align: center;
}
.ttlPage .ttl .hd:before{
content: "";
position: absolute;
top: -50%;
right: -300px;
transform: rotate(45deg);
transform-origin: right top;
background: #f6edf6;
width: 100vw;
height: 100vw;
z-index: -1;
}
.ttlPage .ttl .hd .main{
display: block;
font-size: 230%;
letter-spacing: 0.1em;
font-weight:bold;
}
.ttlPage .ttl .hd .sub{
margin-top: 2%;
}
.ttlPage .ttl .subj{
box-sizing: border-box;
position: relative;
padding: 7% 0 7% 12%;
}
.ttlPage .ttl .date{
display: block;
}
.ttlPage .ttl .date:before{
content: "／";
margin-right: 1em;
}
.ttlPage .ttl .txt{
display: block;
margin-left: 2em;
font-weight: bold;
}
@media screen and (max-width: 1220px) {
  .ttlPage .ttl .hd:before{
  right: -28vw;
  }
  .ttlPage .ttl .subj{
  padding-left: 17vw;
  }
}
@media screen and (max-width: 750px) {
  .ttlPage .ttl{
  margin-bottom: 10%;
  }
  .ttlPage .ttl .inner{
  display: block;
  }
  .ttlPage .ttl .hd{
  display: block;
  max-width: none;
  padding: 7% 0 5%;
  font-size: 85%;
  }
  .ttlPage .ttl .hd:before{
  right: auto;
  top: 0%;
  left: -40%;
  height: 200vw;
  }
  .ttlPage .ttl .subj{
  display: block;
  padding: 0 0 7%;
  }
}

/* ttlComm --------------- */
.ttlComm{
text-align: center;
line-height: 1.5;
margin-bottom: 100px;
position: relative;
}
.ttlComm:after{
content: '';
position: absolute;
left: 50%;
top: calc(100% + 15px);
height: 30px;
width: 1px;
background:#707070;
}
.ttlComm .main{
display: block;
font-size: 230%;
letter-spacing: 0.1em;
font-weight:bold;
}
.ttlComm .sub{
margin-top: 2%;
}
.ttlPage .ttlComm{
margin-top: 50px;
}
@media screen and (max-width: 750px) {
  .ttlComm{
  font-size: 85%;
  margin-bottom: calc(45px + 9%);
  }
  .ttlPage .ttlComm{
  margin-top: 10%;
  }
}

/* --------------------------------------------------
list
-------------------------------------------------- */
/* listFaq --------------- */
.listFaq .accordionTrigger{
position: relative;
font-weight: bold;
padding-left: calc(20px + 3%);
padding-right: calc(12px + 3%);
cursor: pointer;
}
.listFaq .accordionTrigger:before{
content: 'Q';
position: absolute;
top:50%;
left: 0;
line-height: 0;
font-size: 170%;
color: #727272;
font-weight:bold;
}
.listFaq .accordionTrigger:after{
font-family: "Font Awesome 5 Free";
content: '\f0d7';
font-weight: 900;
font-size: 20px;
color: #ca99cc;
position: absolute;
top:50%;
right: 0;
line-height: 0;
}
.listFaq .accordionTrigger.onclick:after{
transform: rotate(180deg);
}
.listFaq .accordionContent{
position: relative;
padding-left: calc(20px + 8%);
margin-top: 3%;
}
.listFaq .accordionContent:before{
content: 'A';
position: absolute;
top:15px;
left: calc(20px + 3%);
line-height: 0;
font-size: 170%;
color: #a95aac;
font-weight:bold;
}
@media screen and (max-width: 750px) {
  .listFaq .accordionTrigger{
  padding-left: 9vw;
  padding-right: 7vw;
  }
  .listFaq .accordionContent{
  margin-top: 7%;
  padding-left: 17vw;
  }

  .listFaq .accordionContent:before{
  top: 3vw;
  left: 9vw;
  }
}

/* --------------------------------------------------
button
-------------------------------------------------- */
/* btn --------------- */
.btnComm{
width: 100%;
margin: 5% auto 3%;
text-align: center;
}
.btnComm a{
box-sizing: border-box;
text-decoration: none;
display: inline-block;
margin: 0 2% 2%;
padding: 17px 6% 17px 4%;
background:#b8b8b9;
text-align: center;
position: relative;
color: #fff !important;
font-size: 90%;
min-width: 240px;
transition: 0.2s;
}
.btnComm a:hover{
opacity: 0.7;
}
.btnComm a:after{
content: "";
position: absolute;
top: 50%;
right: -15px;
height: 1px;
width: 70px;
background: #707070;
transition: 0.2s;
}
.btnComm a:hover:after{
right: -30px;
}
@media screen and (max-width: 750px) {
  .btnComm{
  margin: 9% auto 5%;
  }
  .btnComm a{
  margin: 0 4% 4%;
  }
}

/* --------------------------------------------------
banner
-------------------------------------------------- */
/* bnr --------------- */


/* --------------------------------------------------
table
-------------------------------------------------- */
/* tblComm --------------- */
.tblComm{
box-sizing:border-box;
width:100%;
}
.tblComm tr{
border-bottom: #ccc solid 1px;
}
.tblComm.style02 tr{
border:none;
}
.tblComm th,
.tblComm td{
box-sizing:border-box;
padding: 4% 2% 4%;
}
.tblComm.style02 th,
.tblComm.style02 td{
display: block;
padding: 0;
}
.tblComm.style02 th{
font-weight: bold;
}
.tblComm.style02 td{
margin: 1% 0 3%;
}
.tblComm thead th{
text-align:center;
}
.tblComm.style02 td input,
.tblComm.style02 td select,
.tblComm.style02 td textarea{
box-sizing: border-box;
background-color:#f4f4f4;
border-radius: 7px;
width: 100%;
border: none;
}
.tblComm.style02 td textarea{
height:200px;
}
@media screen and (max-width: 750px) {
  .tblComm:not(.noNarrow) th,
  .tblComm:not(.noNarrow) td{
  display:block;
  width:100% !important;
  padding: 8% 3% 8%;
  }
  .tblComm.style02:not(.noNarrow) th,
  .tblComm.style02:not(.noNarrow) td{
  padding: 3% 0% 3%;
  }
  .tblComm:not(.noNarrow) th{
  padding-bottom:0;
  font-weight: bold;
  font-size: 110%;
  }
  .tblComm:not(.noNarrow) td{
  padding-top:4%;
  }
}

/* tblNoNarrowWrap --------------- */
.tblNoNarrowWrap{
overflow-x:auto;
}
.tblNoNarrowWrap table.noNarrow{
min-width:700px;
}
.tblNoNarrowWrap .tblNoNarrowWrapNote{
display:none;
font-size:90%;
color:#f00;
margin:2% 0;
text-align:center;
}
@media screen and (max-width: 750px) {
  .tblNoNarrowWrap .tblNoNarrowWrapNote{
  display:block;
  }
  .tblNoNarrowWrap table.noNarrow th,
  .tblNoNarrowWrap table.noNarrow td{
  width:auto !important;
  display:table-cell !important;
  }
}


/* --------------------------------------------------
text
-------------------------------------------------- */
.txtGothic{
font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
font-weight:400;
}
.txtMincho{
font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "Times New Roman", serif;
font-weight:500;
}
.txtEnglish{
font-family: Lato, sans-serif;
font-weight:400;
}
.txtUnderline{
text-decoration:underline;
}
.txtBig{
font-size:120%;
}
.txtSmall{
font-size:85%;
}
.txtNormal{
font-weight:normal;
}
.txtWeight{
font-weight:bold;
}
.txtItalic{
font-style: italic;
}
.txtBlack{
color:#000;
}
.txtRed{
color:#e60000;
}
.txtError{
color:#f00;
font-weight: bold;
}
.txtBorderShadow{
text-shadow:
2px 2px 0px #fff,
2px -2px 0px #fff,
-2px 2px 0px #fff,
-2px -2px 0px #fff,
-2px 0px 0px #fff,
2px 0px 0px #fff,
0px 2px 0px #fff,
0px -2px 0px #fff,
3px 3px 4px rgba(0,0,0,0.7);
}
.txtLineDeco{
display: inline;
position: relative;
z-index: 1;
}
.txtLineDeco:before{
content: "";
position: absolute;
bottom: -2px;
left: -5px;
border-radius: 999px;
background: #fff45c;
height: 15px;
width: calc(100% + 10px);
z-index: -1;
}
@media screen and (max-width: 750px) {
  .txtForSp{
  text-align:left !important;
  }
  .txtForSp br{
  display:none;
  }
}

/* --------------------------------------------------
animation
-------------------------------------------------- */
/* animLink --------------- */
.animLink,
.animLink a{
transition: 0.2s;
}
.animLink:hover,
.animLink a:hover{
opacity: 0.7;
}

/* animScrollFadeIn --------------- */
.enterDisp.animScrollFadeIn,
.enterDispOnce.animScrollFadeIn{
transition: 0.5s 0.2s;
opacity: 0;
}
.enterDisp.animScrollFadeIn.fromBtm,
.enterDispOnce.animScrollFadeIn.fromBtm{
transform: translate(0, 100px);
}
.enterDisp.animScrollFadeIn.fromLeft,
.enterDispOnce.animScrollFadeIn.fromLeft{
transform: translate(-100px, 0);
}
.enterDisp.animScrollFadeIn.fromRight,
.enterDispOnce.animScrollFadeIn.fromRight{
transform: translate(100px, 0);
}
.enterDisp.entered.animScrollFadeIn,
.enterDispOnce.entered.animScrollFadeIn{
opacity: 1;
transform: translate(0, 0);
}

/* --------------------------------------------------
other classes
-------------------------------------------------- */
/* clear fix --------------- */
.clearFix:after{
content:"";
clear:both;
display:block;
}

/* hide --------------- */
.noDisp{
display:none;
}

/* align --------------- */
.alignCenter{
text-align: center;
}
.alignLeft{
text-align: left;
}
.alignRight{
text-align: right;
}

/* br tag hide --------------- */
@media screen and (min-width: 750px) {
  .brPc{display:block;}
  .brSp{display:none;}
}
@media screen and (max-width: 750px) {
  .brPc{display:none;}
  .brSp{display:block;}
}

/* required mark --------------- */
.required,
.nRequired{
background-color:#f02323;
color:#fff;
display:inline-block;
font-weight:normal;
font-size:12px;
margin:0 5px;
padding:0;
text-align:center;
line-height:22px;
width:40px;
}
.nRequired{
background-color:#999;
}

/* input form --------------- */
.focusAnimation{
border:1px solid #aaa;
transition:all 0.3s ease-in-out 0s;
}
.focusAnimation:focus{
border:1px solid #39c;
box-shadow:0 0 5px #39c;
outline:medium none;
transition:all 0.3s ease-in-out 0s;
}
input.narrowSize{
box-sizing:border-box;
width:20%;
}
input.smallSize{
box-sizing:border-box;
width:35%;
}
input.middleSize{
box-sizing:border-box;
width:55%;
}
input.wideSize{
box-sizing:border-box;
width:80%;
}
input.fullSize{
box-sizing:border-box;
width:100%;
}
textarea.fullSize{
box-sizing:border-box;
width:100%;
height:200px;
}
@media screen and (max-width: 750px) {
  input.narrowSize{
  width:35%;
  }
  input.smallSize{
  width:60%;
  }
  input.middleSize{
  width:100%;
  }
  input.wideSize{
  width:100%;
  }
}

/* youtube movieWrap --------------- */
.movieWrap {
position: relative;
padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
height: 0;
overflow: hidden;
margin: 3% auto;
}
.movieWrap iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* slick arrow --------------- */
.slickArrowPrev,
.slickArrowNext{
position: absolute;
top: calc(50% - 7px);
display: block;
width: 14px;
height: 14px;
border-top: solid 3px #999;
border-right: solid 3px #999;
cursor: pointer;
transition:all 0.2s;
}
.slickArrowPrev:hover,
.slickArrowNext:hover{
opacity: 0.3;
}
.slickArrowPrev{
left: -4%;
transform: rotate(225deg);
}
.slickArrowNext{
right: -4%;
transform: rotate(45deg);
}
@media screen and (max-width: 750px) {
  .slickArrowPrev,
  .slickArrowNext{
  display: none !important;
  }
}

/* fullcalendar --------------- */
.fc-event-container a{
color: #fff !important;
}
.fc-event-container .fc-event,
.fc-event-container .fc-event-dot{
background-color: #fa6469 !important;
}
.fc-event-container .fc-event{
border: 1px solid #ff969a !important;
}
.fc-event-container .fc-title{
color: #fff !important;
}