@charset "utf-8";

/*##### Base Width #####*/
.baseW {
  width: 1080px;
  margin-left: auto;
  margin-right: auto;
}
.baseW02 {
  width: 1112px;
}
.baseW03 {
  width: calc(100% - 40px);
  min-width: 1080px;
  max-width: 1376px;/*1400px;*/
  margin-left: auto;
  margin-right: auto;
}
.baseW04 {
  width: calc(100% - 40px);
  min-width: 1080px;
  max-width: 1220px;
  margin-left: auto;
  margin-right: auto;
}
.baseW05 {
  width: calc(100% - 40px);
  min-width: 1080px;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}
.baseW06 {
  width: calc(100% - 40px);
  min-width: 1040px;
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}
@media all and (max-width: 750px){
  .baseW,
  .baseW02,
  .baseW03,
  .baseW04,
  .baseW05,
  .baseW06 {
    width: 100%;
    min-width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
  .baseSpW {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
  }
}

.baseLpW {
  max-width: 1920px;
  margin-left: auto;
  margin-right: auto;
}
.baseLpW02 {
  width: calc(100% - 40px);
  min-width: 1040px;
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
}
@media all and (max-width: 750px){
  .baseLpW {
    max-width: 750px;
  }
  .baseLpW02 {
    width: 100%;
    min-width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
  .baseLpSpW {
    width: 92.2%;
    margin-right: auto;
    margin-left: auto;
  }
}


.dOneLine {
  display: inline-block
}


/*##### boxBaseComLp #####*/
.boxBaseComLp > p {
  line-height: 1.45;
  letter-spacing: 0.03em;
  font-size: 1.97rem;
}
body.pageLpEn .boxBaseComLp > p {
  letter-spacing: normal;
}
.boxBaseComLp.typeSmall > p {
  letter-spacing: 0.02em;
  font-size: 1.67rem;
}
body.pageLpEn .boxBaseComLp.typeSmall > p {
  letter-spacing: normal;
}
@media all and (max-width: 750px){
  .boxBaseComLp > p,
  .boxBaseComLp.typeSmall > p {
    font-size: 0.9rem;
  }
}

body.pageLpEn .boxBaseComLp > p + p {
  margin-top: 1.0em;
}


/*##### ttlBase01 #####*/
.ttlBase01Lp {
  position: relative;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  min-height: 10.0em;
  background-color: #d7eff3;
}
.ttlBase01Lp.typeOrange {
  background-color: #ffe6cf;
}
@media all and (max-width: 750px){
  .ttlBase01Lp {
    min-height: 7.44em;
    padding-top: 0.3em;
  }
  body.pageLpEn .ttlBase01Lp {
    min-height: 6.0em;
    padding: 1.8em 0;
  }
}

.ttlBase01Lp .ttlNum {
  position: absolute;
  top: 50%;
  left: 50%;
  line-height: 1.0;
  font-family: var(--base-font-num);
  font-size: 5.0rem;
  transform: translateX(-50%) translateY(-88%);
  color: #fff;
}
@media all and (max-width: 750px){
  .ttlBase01Lp .ttlNum {
    top: -7.2%;
    left: -1.0%;
    letter-spacing: 0.03em;
    font-size: 3.0rem;
    transform: none;
  }
}

.ttlBase01Lp .ttlEn {
  position: relative;
  z-index: 2;
  margin-bottom: 1.15em;
  color: #b8b8b8;
}
@media all and (max-width: 750px){
  .ttlBase01Lp .ttlEn {
    margin-bottom: 1.0em;
    letter-spacing: 0.045em;
    font-size: 0.8rem;
  }
}

.ttlBase01Lp .ttlJa {
  position: relative;
  z-index: 2;
  font-size: 3.5rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #1470b2;
}
.ttlBase01Lp.typeOrange .ttlJa {
  color: #ff7800;
}
body.pageLpEn .ttlBase01Lp .ttlJa {
  letter-spacing: normal;
}
body.pageLpEn .ttlBase01Lp .ttlNum + .ttlJa {
  margin-top: 0.6em;
}
@media all and (max-width: 750px){
  .ttlBase01Lp .ttlJa {
    font-size: 2.0rem;
  }
  body.pageLpEn .ttlBase01Lp .ttlJa {
    padding-left: 0.2em;
    padding-right: 0.2em;
    text-align: center;
    line-height: 1.3;
    font-size: 1.6rem;
  }
  body.pageLpEn .ttlBase01Lp .ttlNum + .ttlJa {
    margin-top: 0;
  }
}


/*##### linkBase01 #####*/
.linkBase01 {
  position: relative;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  max-width: 565px;
  height: 4.65em;
}
@media all and (max-width: 750px){
  .linkBase01 {
    width: 78.6vw;
    max-width: none;
    height: 2.54em;
    margin-left: auto;
    margin-right: auto;
  }
}

.linkBase01:before,
.linkBase01:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.linkBase01:before {
  z-index: 2;
  background-color: #fff000;
}
.linkBase01:after {
  top: 0.5em;
  left: 0.5em;
  border: 2px #fff solid;
}
@media all and (max-width: 750px){
  .linkBase01:after {
    top: 0.44em;
    left: 0.4em;
    border: 0.3vw #fff solid;
  }
}

.linkBase01 > span {
  position: relative;
  z-index: 3;
  padding-top: 0.1em;
  padding-left: 0.76em;
  letter-spacing: 0.05em;
  font-size: 1.55rem;
  font-weight: 700;
  color: #1470b2;
}
@media all and (max-width: 750px){
  .linkBase01 > span {
    padding-left: 0;
    letter-spacing: 0.044em;
    font-size: 1.0rem;
  }
}

.linkBase01 > span:before {
  content: '';
  position: absolute;
  top: 0.14em;
  left: -1.9em;
  width: 0.9em;
  background-image: url('./../../images/base/base-icn-deco01.png');
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 100% auto;
  aspect-ratio: 1 / 1;
}
@media all and (max-width: 750px){
  .linkBase01 > span:before {
    content: none;
  }
}


/*##### baseBorderDeco01 #####*/
.baseBorderDeco01 {
  position: absolute;
  left: 0;
  width: 100%;
}
.baseBorderDeco01.typeTop {
  top: 0;
}
.baseBorderDeco01.typeBottom {
  bottom: 0;
}

.baseBorderDeco01:before,
.baseBorderDeco01:after {
  content: '';
  position: absolute;
  width: 100%;
}
.baseBorderDeco01:before {
  left: 0;
  height: 0.67em;
  background-color: #cce3e6;
}
.baseBorderDeco01.typeTop:before {
  top: 0;
}
.baseBorderDeco01.typeBottom:before {
  bottom: 0;
}
.baseBorderDeco01:after {
  z-index: 2;
  height: 0.929em;
  background-image: url('./../../images/base/base-border-deco01-l.png'), url('./../../images/base/base-border-deco01-r.png');
  background-repeat: no-repeat;
  background-position: left top, right top;
  background-size: auto 100%, auto 100%;
}
.baseBorderDeco01.typeTop:after {
  top: calc(((0.929em - 0.67em) / 2) * -1);
}
.baseBorderDeco01.typeBottom:after {
  bottom: calc(((0.929em - 0.67em) / 2) * -1);
}
@media all and (max-width: 750px){
  .baseBorderDeco01:before {
    height: 0.47em;
  }
  .baseBorderDeco01:after {
    height: 0.7em;
    background-position: left calc(50% + 0.001em), right calc(50% + 0.001em);
  }
}