@charset "UTF-8";

/* 1440px基準 */
:root {
	--px3: min(0.21vw,3px);
	--px4: min(0.28vw,4px);
	--px5: min(0.35vw,5px);
	--px6: min(0.42vw,6px);
	--px7: min(0.49vw,7px);
	--px8: min(0.56vw,8px);
	--px9: min(0.63vw,9px);

	--px10: min(0.69vw,10px);
	--px11: min(0.76vw,11px);
	--px12: min(0.83vw,12px);
	--px13: min(0.9vw,13px);
	--px14: min(0.97vw,14px);
	--px15: min(1.04vw,15px);
	--px16: min(1.11vw,16px);
	--px17: min(1.18vw,17px);
	--px18: min(1.25vw,18px);
	--px19: min(1.32vw,19px);

	--px20: min(1.39vw,20px);
	--px21: min(1.46vw,21px);
	--px22: min(1.53vw,22px);
	--px23: min(1.6vw,23px);
	--px24: min(1.67vw,24px);
	--px25: min(1.74vw,25px);
	--px26: min(1.81vw,26px);
	--px27: min(1.88vw,27px);
	--px28: min(1.94vw,28px);
	--px29: min(2.01vw,29px);

	--px30: min(2.08vw,30px);
	--px31: min(2.15vw,31px);
	--px32: min(2.22vw,32px);
	--px33: min(2.29vw,33px);
	--px34: min(2.36vw,34px);
	--px35: min(2.43vw,35px);
	--px36: min(2.5vw,36px);
	--px37: min(2.57vw,37px);
	--px38: min(2.64vw,38px);
	--px39: min(2.71vw,39px);

	--px40: min(2.78vw,40px);
	--px41: min(2.85vw,41px);
	--px42: min(2.92vw,42px);
	--px43: min(2.99vw,43px);
	--px44: min(3.06vw,44px);
	--px45: min(3.13vw,45px);
	--px46: min(3.19vw,46px);
	--px47: min(3.26vw,47px);
	--px48: min(3.33vw,48px);
	--px49: min(3.33vw,49px);
	--px50: min(3.47vw,50px);

  --primary: #FFFB00;
  --secondary: #344FFF;
  --tertiary: #FE8F00;
  --black: #333;
  --white: #FFF;
  --white-rgb: 255,255,255;
  --gray: #EEE;
  --border: var(--primary);
  --leading-trim: calc((1em - 1lh) / 2);
  --leading-trim-en: calc((1cap - 1lh) / 2);
}

html{
  /* scroll-behavior: smooth; */
}

.forPc{display: block;}
.forSp{display: none;}

	@media screen and (max-width:768px){

	.forPc{display: none;}
	.forSp{display: block;}

	}/* --- max-width:768px */

.backTopBtn{
	z-index: 2;
}

.linkTxt{
  text-decoration: underline !important;
  color: #4690ED !important;
  &:hover{text-decoration: none !important;;}
}

.pricePage{
  position: relative;
  img{
    display: block;
    max-width: 100%;
    height: auto;
  }
  select:focus {
    outline: none;
    box-shadow: none;
  }
  .ancWrap{
    position: relative;
    .anc{
      position: absolute;
      top: max(-12.5vw,-180px);
    }
  }
}

.borderBottomDashed{
	position: relative;
	&::after {
	  content: "";
	  position: absolute;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  height: 1px;
	  background: repeating-linear-gradient(
	    to right,
	    #4690ED 0 var(--px4),
	    transparent var(--px4) var(--px8)
	  );
	}
}

	@media screen and (max-width:768px){

  .pricePage{
    .ancWrap{
      .anc{
        top: -30vw;
      }
    }
  }

	.borderBottomDashed{
		&::after {
		  height: 2px;
		  background: repeating-linear-gradient(
		    to right,
		    #4690ED 0 0.8vw,
		    transparent 0.8vw 1.6vw
		  );
		}
	}

	}/* --- max-width:768px */

.h2Box{
  display: flex;
  align-items: center;
  gap: var(--px24);
  width: fit-content;
  .img{width: min(4.58vw,66px);}
  .txt{font-size: var(--px28);font-weight: 600;text-align: left;}
}

.btnNormal{
  background: #ffac52;
	border: 1px solid #ffac52;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  height: var(--px50);
  padding: 0 var(--px35);
  border-radius: 9999px;
  text-decoration: none;
  transition: all 0.3s 0s ease;
	line-height: 1;
  &:hover{
    text-decoration: none;
    opacity: 1;
		background: #ffd8ad;
		border-color: #ffac52;
  }
  span{
    position: relative;
    font-weight: 500;
    font-size: var(--px20);
    padding-left: var(--px30);
    &:before{
      content: "";
      position: absolute;
      display: block;
      background: url(../img/arw_right.svg) no-repeat center;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      width: var(--px9);
      height: var(--px18);
      background-size: contain !important;
    }
  }
}

	@media screen and (max-width:768px){

  .h2Box{
    gap: 4.27vw;
    .img{width: 10.4vw;}
    .txt{font-size: 6.4vw;line-height: 1.3;}
  }

  .btnNormal{
    height: 16.67vw;
    padding: 0 8vw;
    span{
      font-size: 4vw;
      padding-left: 5.33vw;
      &:before{
        width: 2.67vw;
        height: 4.93vw;
        background-size: contain !important;
      }
    }
  }

	}/* --- max-width:768px */

/* ------------------------------- etc */

.breadcrumbArea{
  margin: var(--px44) 0;
	.breadcrumb{
		padding-top: 0;
	}
}

	@media screen and (max-width:768px){

  .breadcrumbArea{
    margin: 7.2vw 0;
  }

	}/* --- max-width:768px */

/* ------------------------------- topSection */

.topSection *{box-sizing: border-box;}

.topSection{
  box-sizing: border-box;
  position: relative;
  background: #DAE9FB;
  overflow: hidden;
  &:before{
    content: "";
    position: absolute;
    display: block;
    background: #fff;
    top: max(-8.54vw,-123px);
    left: 0;
    border-radius: 50%;
    filter: blur(min(6.94vw,100px));
    width: min(26.39vw,380px);
    height: min(26.39vw,380px);
    background-size: contain !important;
  }
  .contInner{
    position: relative;
    margin: auto;
    width: min(100vw,1440px);
    padding: var(--px40) 0;
  }
}

.topSection .ttlBox{
  margin: auto;
  width: min(76.74vw,1105px);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  .mainSide{
    width: min(39.17vw,564px);
    .ttl{
      width: min(36.53vw,526px);
    }
    .txt{
      text-align: left;
      font-size: var(--px18);
			margin-top: var(--px20);
    }
  }
  .imgSide{
    position: relative;
    width: min(33.68vw,485px);
    &:before{
      content: "";
      position: absolute;
      display: block;
      background: #fff;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      border-radius: 50%;
      filter: blur(100px);
      width: min(43.33vw,624px);
      height: min(43.33vw,624px);
      background-size: contain !important;
    }
    img{
      position: relative;
    }
  }
}

	@media screen and (max-width:768px){

  .topSection{
    padding: 5.33vw;
    &:before{
      top: auto;
      left: 50%;
      transform: translateX(-50%);
      bottom: -14vw;
      filter: blur(5.33vw);
      width: 125.07vw;
      height: 100vw;
    }
    .contInner{
      width: 100%;
      padding: 0;
    }
  }

.topSection .ttlBox{
    width: 100%;
    display: block;
    .mainSide{
        width: 100%;
      .ttl{
        width: 100%;
      }
      .txt{
        font-size: 3.73vw;
				margin-top: 4.27vw;
      }
      .img{
        margin: 3.33vw auto 6.67vw;
        width: 75.73vw;
      }
    }
    .imgSide{
      display: none;
      &:before{
        display: none;
      }
    }
  }

	}

/* ------------------------------- navSection */

.navSection *{box-sizing: border-box;}

.navSection{
  box-sizing: border-box;
  background: #E3EEFC;
  top: 0;
  left: 0;
  z-index: 1;
  height: min(5.83vw,84px);
  .wrap{
    z-index: 10;
  }
  .contInner{
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(81.94vw,1180px);
    height: min(5.83vw,84px);
    margin: auto;
  }
  .navBox{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--px8);
  }
  .btn_nav{
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    padding: 0 var(--px15);
    border-radius: var(--px8);
    height: min(3.61vw,52px);
    gap: var(--px10);
    text-decoration: none;
  	transition: all 0.3s 0s ease;
    .txt{font-size: var(--px18);}
    .img{width: var(--px32);}
    .arw{width: var(--px14);}
		box-shadow: rgba(70,144,237,0.1) 0 0 var(--px20) 0px;
		border: 1px solid #fff;
		&:hover{
			opacity: 1;
			background: #f6f9fe;
			border-color: #90bcf4;
		}
  }
}
.navSection.is_fixed .wrap{
  background: #E3EEFC;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}

	@media screen and (max-width:768px){

  .navSection{
    width: 100%;
    height: 33vw;
    .wrap{
      width: 100%;
    }
    .contInner{
      width: 100%;
      height: 29.33vw;
      overflow-x: auto;
      overflow-y: hidden;
			justify-content: unset;
			padding-left: 4.27vw;
    }
    .navBox{
      width: max-content;
      gap: 2.13vw;
      li:last-child{padding-right: 4.27vw;}
    }
    .btn_nav{
      flex-direction: column;
      width: 26.67vw;
      padding: 0;
      border-radius: 2.13vw;
      height: 21.33vw;
      gap: 1.33vw;
      .txt{font-size: 2.3vw;}
      .img{width: 8vw;}
      .arw{width: 3.6vw;}
			box-shadow: rgba(70,144,237,0.1) 0 0 1.33vw 0px;
    }
  }

  .navSection.is_fixed {
    width: 100%;
    .wrap {
      width: 100%;
    }
    .contInner {
      width: 100%;
    }
  }

	}

/* ------------------------------- priceSection */

.priceSection *{box-sizing: border-box;}

.priceSection{
  box-sizing: border-box;
  background: #E3EEFC;
  position: relative;
  overflow: hidden;
  &:before{
    content: "";
    position: absolute;
    display: block;
    background: #fff;
    top: max(-8.54vw,-123px);
    left: 0;
    border-radius: 50%;
    filter: blur(min(20.83vw,300px));
    width: min(69.44vw,1000px);
    height: min(69.44vw,1000px);
    background-size: contain !important;
  }
  .contInner{
    position: relative;
    margin: auto;
    width: min(65.63vw,945px);
    padding: min(5.21vw,75px) 0 min(9.72vw,140px);
  }
  .h2Box{
    margin: auto;
  }
  .priceBox{
    margin-top: var(--px32);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    > div{width: min(31.94vw,460px);}
  }
  .ttl{
    border-radius: var(--px16) var(--px16) 0 0;
    font-size: var(--px28);
    font-weight: 600;
    padding: var(--px5);
    span{font-size: var(--px20);}
  }
  .tableWrap{
    border-bottom: 2px solid #000;
    border-left: 2px solid #000;
    border-right: 2px solid #000;
    border-radius: 0 0 var(--px16) var(--px16);
    overflow: hidden;
  }
  table{
    width: 100%;
    th{
      font-size: var(--px16);
      text-align: left;
      padding: 0 var(--px15) 0 var(--px16);
			font-weight: normal;
    }
    tr:first-child th,
    tr:first-child td{padding-top: var(--px20);}
    tr:last-child th,
    tr:last-child td{padding-bottom: var(--px15);}
    td{
      font-size: var(--px16);
      text-align: center;
      padding: 0 0 0 var(--px19);
      background: #fff;
      .txt{
        display: flex;
				span{
					display: block;
					letter-spacing: 1px;
					em{
	        	font-weight: 600;
						font-size: var(--px28);
					}
				}
				span:first-child{width: min(7.29vw,105px);text-align: right;}
				span:nth-child(2){width: var(--px45);}
				span:last-child{width: min(8.33vw,120px);text-align: left;}
      }
    }
  }
  .rentalSide .ttl{background: #4690ED;color: #fff;}
  .rentalSide .tableWrap{border-color: #4690ED;}
  .rentalSide th{background: #F6F9FE;}
  .rentalSide .txt em{color: #4690ED;}
  .kaigoSide .ttl{background: #FFB86B;color: #1A1A1A;}
  .kaigoSide .tableWrap{border-color: #FFB86B;}
  .kaigoSide th{background: #FFF1E2;}
  .kaigoSide .txt{color: #1A1A1A;}
  .kaigoSide .caution{
    font-size: var(--px16);
    margin-top: var(--px24);
  }
}

	@media screen and (max-width:768px){

  .priceSection{
    .contInner{
      width: auto;
      padding: 18.67vw 3.2vw 21.33vw;
    }
    .h2Box{
      margin: 0 auto 0 0;
    }
    .priceBox{
      margin-top: 8.67vw;
      display: block;
      > div{width: 100%;}
    }
    .ttl{
      border-radius: 2.13vw 2.13vw 0 0;
      font-size: 5.33vw;
      padding: 2vw;
      text-align: center;
			font-weight: 500;
      span{font-size: 4.27vw;font-weight: 600;}
    }
    .tableWrap{
      border-radius: 0 0 2.13vw 2.13vw;
    }
    table{
      th{
        font-size: 3.5vw;
        padding: 0 1vw;
        text-align: center;
        width: 30vw;
				height: 15.5vw;
      }
      tr:first-child th,
      tr:first-child td{padding-top: 0;}
      tr:last-child th,
      tr:last-child td{padding-bottom: 0;}
      td{
        font-size: 3.5vw;
        padding:0;
				height: 15.5vw;
	      .txt{
					align-items: center;
					width: fit-content;
					margin: auto;
					span{
						font-size: 4.27vw;
						letter-spacing: 0;
						em{
							font-size: 6.4vw;
						}
					}
					span:first-child{width: 24vw;}
					span:nth-child(2){width: 8vw;}
					span:last-child{width: 27vw;}
	      }
      }
    }
    .kaigoSide{margin-top: 5.33vw;}
    .kaigoSide .caution{
      text-align: center;
      font-size: 3.2vw;
      margin-top: 4.27vw;
    }
  }

	}

/* ------------------------------- compareSection */

.compareSection *{box-sizing: border-box;}

.compareSection{
  box-sizing: border-box;
  .contInner{
    width: min(75vw,1080px);
    margin: auto;
    padding: min(9.72vw,140px) 0 min(4.86vw,70px);
  }
}

.compareSection .tableBlock{
  margin-top: var(--px32);
  border: 1px solid #4690ED;
  border-radius: var(--px16);
  overflow: hidden;
  table{
    width: 100%;
    text-align: center;
    font-size: var(--px24);
    em{
      font-weight: 500;
      font-size: var(--px28);
    }
    th,td{
      height: min(4.51vw,65px);
      vertical-align: middle;
      border-bottom: 1px solid #4690ED;
    }
    tbody tr:last-child th,tbody tr:last-child td{border-bottom: none;}
    tr:last-child td:nth-child(2){
			position: relative;
			&:before{
				content: "";
				position: absolute;
				display: block;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 100%;
				border-bottom: var(--px6) solid #4690ED;
			}
		}
    thead{
      th{font-weight: 600;}
      th:first-child{
        width: min(19.44vw,280px);
        background: #fff;
      }
      th:nth-child(2){
        width: min(36.11vw,520px);
        background: #4690ED;
        color: #fff;
        border-right: var(--px6) solid #4690ED;
        border-left: var(--px6) solid #4690ED;
      }
      th:last-child{
        background: #ECF4FD;
				font-weight: 400;
      }
    }
    tbody{
      th:first-child{
        background: #f3f3f3;
				font-weight: normal;
      }
      td:nth-child(2){
        background: #ECF4FD;
        border-right: var(--px6) solid #4690ED;
        border-left: var(--px6) solid #4690ED;
      }
      td:last-child{
        background: #fff;
      }
    }
  }
}

.compareSection .caseBlock{
  margin-top: var(--px40);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  .itemBox{
    width: calc(50% - var(--px10));
    .ttl{
      border-radius: var(--px16) var(--px16) 0 0;
      background: #ECF4FD;
      font-size: var(--px24);
      font-weight: 600;
      padding: var(--px10);
      border: var(--px3) solid #4690ED;
    }
    .cont{
      text-align: left;
      font-size: var(--px18);
      min-height: min(44.79vw,645px);
      padding: var(--px30) var(--px30) 0 var(--px30);
      border-left: var(--px3) solid #4690ED;
      border-right: var(--px3) solid #4690ED;
      border-bottom: var(--px3) solid #4690ED;
      border-radius:  0 0 var(--px16) var(--px16);
      dt{
        margin-top: var(--px20);
        position: relative;
        color: #4690ED;
        font-weight: 500;
        text-decoration: underline;
        text-decoration-color: #B5D3F8;
        text-decoration-thickness: 2px;
        text-underline-offset: var(--px5);
        padding-left: 1em;
				letter-spacing: 3%;
        &:first-child{margin-top: 0;}
        &:before{
          content: "";
          position: absolute;
          display: block;
          top: var(--px12);
          left: 0;
					background: #4690ED;
					width: var(--px8);
					height: var(--px8);
					border-radius: var(--px4);
          background-size: contain !important;
        }
      }
      dd{
        margin-top: var(--px20);
        padding-bottom: var(--px20);
        &:last-child{border-bottom: none;}
      }
			.bold{
				color: #4690ED;
				font-weight: 500;
			}
    }
  }
  .itemBox.rental .ttl{background: #4690ED;color: #fff;}
  .itemBox.rental .cont{background: #F6F9FE;}
  .itemBox.rental dt{text-decoration-color: #FFAC52;}
  .itemBox.buy .ttl{border: 1px solid #4690ED;}
  .itemBox.buy .cont{
		border-left: 1px solid #4690ED;
		border-right: 1px solid #4690ED;
		border-bottom: 1px solid #4690ED;
	}
}

.compareSection .last{
  margin-top: var(--px32);
  font-size: var(--px18);
  em{
    font-size: var(--px24);
    font-weight: 600;
    color: #FFAC52;
  }
}

	@media screen and (max-width:768px){

  .compareSection{
    .contInner{
      width: auto;
      padding: 18.67vw 3.2vw 10.67vw
    }
  }

  .compareSection .tableBlock{
    margin-top: 8.53vw;
    border-radius: 2.13vw;
    table{
      font-size: 3vw;
      em{
        font-size: 5.33vw;
      }
      th,td{
        text-align: center;
        height: 15.2vw;
      }
      tr:last-child td:nth-child(2){
				&:before{
					border-width: 1vw;
				}
			}
      thead{
        th:first-child{
          width: 24vw;
        }
        th:nth-child(2){
          width: 42.67vw;
          font-size: 4.8vw;
          border-right: 1vw solid #4690ED;
          border-left: 1vw solid #4690ED;
        }
      }
      tbody{
        td:nth-child(2){
          background: #ECF4FD;
          border-right: 1vw solid #4690ED;
          border-left: 1vw solid #4690ED;
        }
      }
    }
  }

  .compareSection .caseBlock{
    margin-top: 0;
    display: block;
    .itemBox{
      margin-top: 5.33vw;
      width: 100%;
      .ttl{
        border-radius: 2.13vw 2.13vw 0 0;
        font-size: 5.33vw;
        padding: 2.67vw;
        text-align: center;
      }
      .cont{
        font-size: 4.27vw;
        min-height: 0;
        padding: 5.4vw 5.4vw 5.4vw;
        border-left: 1vw solid #4690ED;
        border-right: 1vw solid #4690ED;
        border-bottom: 1vw solid #4690ED;
        border-radius:  0 0 2.13vw 2.13vw;
        dt{
          margin-top: 3.2vw;
          text-decoration-thickness: 0.53vw;
          text-underline-offset: 1vw;
					letter-spacing: 0;
	        &:before{
						top: 2.8vw;
						transform: translateY(0);
						width: 1.87vw;
						height: 1.87vw;
						border-radius: 1.87vw;
	        }
        }
        dd{
					font-size: 3.73vw;
          margin-top: 2vw;
          padding-bottom: 3.2vw;
        }
      }
    }
    .itemBox.buy .ttl,
    .itemBox.buy .cont{border-width: 0.27vw;}
    .itemBox.rental dt{text-decoration-color: #FFAC52;}
  }

  .compareSection .last{
      text-align: center;
      margin-top: 4.67vw;
      font-size: 4.27vw;
      em{
        font-size: 5.33vw;
      }
      .dot{display: none;}
    }

	}

/* ------------------------------- symSection */

.symSection *{box-sizing: border-box;}

.symSection{
  box-sizing: border-box;
  .contInner{
    width: min(75vw,1080px);
    margin: auto;
    padding: min(4.86vw,70px) 0 min(4.86vw,70px);
  }
  .h2Box{
    margin: auto;
  }
  .btnBlock{
    margin-top: var(--px32);
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}

.symSection .selectBox p{
  position: relative;
  display: flex;
  align-items: center;
  height: min(5.42vw,78px);
  border-radius: var(--px16);
  overflow: hidden;
  border: 2px solid #4690ED;
  border-left:none;
  font-size: var(--px24);
	cursor: pointer;
  &:after{
    content: "";
    position: absolute;
    display: block;
    background: url(../img/btn_arw.svg) no-repeat center;
    right: var(--px43);
    width: var(--px19);
    height: var(--px10);
    background-size: contain !important;
  }
  .no{
    display: flex;
    align-items: center;
    justify-content: center;
    font-family:"Roboto Condensed", "Noto Sans JP", sans-serif;
    font-style: italic;
    font-size: min(2.78vw,40px);
    height: 100%;
    width: min(3.89vw,56px);
    background: #4690ED;
    color: #fff;
    line-height: 1;
    border-radius: 0 var(--px16) 0 0;
  }
  .txt{
    display: block;
    color: #4690ED;
    text-align: center;
    width: min(8.33vw,120px);
  }
  .colon{
    display: block;
    color: #4690ED;
    text-align: center;
    width: var(--px35);
  }
	.selectedValue,
	.selectedValue:focus{
    width: min(21.11vw,304px);
    outline: none;
    box-shadow: none;
		border: none;
		font-size: var(--px22);
		padding-left: var(--px15);
		cursor: pointer;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	}
}
.symSection .selectBox.no2 .txt{width: min(9.72vw,140px);}
.symSection .is_notReady .selectBox.no2 .btnPopup,
.symSection .is_notReady .selectBox.no2 .selectedValue{
	pointer-events: none;
	background: #EFEFEF;
	border-color: #EFEFEF;
	color: #898989;
}
.symSection .selectBox > .btnPopup.is_selected{
  background: #E3EEFC;
  border-color: transparent;
  input{background: #E3EEFC;}
}

.symSection .selectBox{
	width: calc(50% - var(--px10));
	position: relative;
	.popupWin{
		padding: var(--px10);
		background: #fff;
		position: absolute;
		z-index: 2;
		right: 0;
    width: min(22.22vw,320px);
		border-radius: var(--px10);
		box-shadow: rgba(70, 144, 237, 0.3) 0 0 var(--px20) 0px;
	  display: grid;
	  opacity: 0;
	  visibility: hidden;
	  transition:
	    grid-template-rows .3s ease,
	    opacity .3s ease,
	    visibility .3s;
	  li {
	    overflow: hidden;
	    min-height: 0;
	  }
	}
	&.is_opened .popupWin{
    opacity: 1;
    visibility: visible;
	}
	&.no1{
		.popupWin{grid-template-rows: repeat(4, 0fr);}
		&.is_opened .popupWin{grid-template-rows: repeat(4, 1fr);}
	}
	&.no2{
		.popupWin{grid-template-rows: repeat(2, 0fr);}
		&.is_opened .popupWin{grid-template-rows: repeat(2, 1fr);}
	}
	.btnSelect{
		display: block;
		border-radius: var(--px10);
		padding: var(--px10);
		text-decoration: none;
		text-align: left;
		font-size: var(--px22);
		transition: all 0.3s 0s ease;
		cursor: pointer;
		font-weight: 600;
		&:hover{
			background: #ECF4FD;
		}
	}
}

.symSection .resultBlock{
  display: none;
  margin-top: var(--px24);
  .arw{
    text-align: center;
    img{
      display: inline-block;
      width: var(--px34);
    }
  }
  .result{
    margin-top: var(--px20);
    display: block;
    font-size: var(--px24);
    padding: var(--px10);
    border-radius: var(--px16);
    background: #4690ED;
    color: #fff;
    .sub{text-align: center;display: block;}
    .main{
      text-align: center;
      display: block;
      em{
        font-size: var(--px32);
        font-weight: 600;
      }
      span{
        font-weight: normal;
        font-size: var(--px24);
      }
    }
  }
  .caution{
    margin-top: var(--px10);
    font-size: var(--px16);
  }
}
.symSection .resultBlock.is_selected{
  display: block;
}

	@media screen and (max-width:768px){

  .symSection{
    .contInner{
      width: 100%;
      padding: 10.67vw 3.2vw 21.33vw;
    }
	  .h2Box{
	    margin: 0 auto 0;
	  }
    .btnBlock{
      margin-top: 8.53vw;
      display: block;
    }
  }

  .symSection{
    .selectBox{
      margin-top: 3.2vw;
    }
    .selectBox:first-of-type{margin-top: 0;}
    .selectBox p{
      height: 13.87vw;
      border-radius: 2.13vw;
      font-size: 4.27vw;
      &:after{
        right: 2.67vw;
        width: 4.13vw;
        height: 1.87vw;
        background-size: contain !important;
      }
      .no{
        font-size: 6.4vw;
        width: 12.27vw;
        border-radius: 0 2.13vw 0 0;
      }
      .txt{
        width: 24vw;
				padding-left: 4.27vw;
				text-align: left;
				font-weight: 500;
      }
      .colon{
        width: 6.67vw;
      }
			.selectedValue,
			.selectedValue:focus{
				font-size: 4vw;
				font-weight: 500;
        width: 45vw;
				padding-left: 3.2vw;
      }
    }
  }
	.symSection .selectBox.no2 .txt{width: 24vw;}

	.symSection .selectBox{
		width: 100%;
		.popupWin{
			padding: 1.33vw;
	    width: 55vw;
			border-radius: 1.33vw;
			box-shadow: rgba(70, 144, 237, 0.3) 0 0 2.67vw 0px;
		}
		&.no1{
			.popupWin{z-index: 3;}
		}
		&.no2{
			.popupWin{z-index: 2;}
		}
		.btnSelect{
			border-radius: 1.33vw;
			padding: 1.33vw;
			font-size: 4vw;
		}
	}

  .symSection .resultBlock{
      margin-top: 4vw;
      .arw{
        img{
          width: 5.07vw;
        }
      }
      .result{
        margin-top: 4vw;
        font-size: 4.27vw;
        padding: 2vw;
        border-radius: 2.13vw;
        .main{
          em{
            font-size: 5.33vw;
          }
          .ex{
            display: block;
          }
          span{
            font-size: 3vw;
          }
        }
      }
      .caution{
        margin-top: 1.33vw;
        font-size: 3vw;
        text-indent: -1em;padding-left: 1em;
      }
    }

	}

/* ------------------------------- detailSection */

.detailSection *{box-sizing: border-box;}

.detailSection{
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  background: #ddeafb;
  padding-top: min(4.86vw,70px);
  padding-bottom: min(4.86vw,70px);
  .contInner{
    z-index: 1;
    position: relative;
    width: min(75vw,1080px);
    margin: auto;
    padding: min(4.86vw,70px) 0 min(4.86vw,70px);
  }
  .btnBottom{
    margin-top: var(--px40);
  }
  .infoBox{
    display: flex;
    justify-content: space-between;
    li{
      box-shadow: rgba(70,144,237,0.1) 0 0 var(--px20) 0px;
      position: relative;
      background: #fff;
      border-radius: var(--px16);
      display: flex;
      align-items: start;
      flex-direction: column;
      justify-content: flex-end;
      flex-direction: column;
      text-align: left;
      padding: var(--px30);
      > a{
        width: 100%;
        height: 100%;
        display: block;
      }
      a:hover{
        text-decoration: none;
      }
    }
    .img{
      position: absolute;
    }
    .main{
      font-size: var(--px20);
      color: #4690ED;
      em{
        display: inline-block;
        font-weight: 500;
        font-size: var(--px24);
        text-decoration: underline;
        text-decoration-color: #FFAC52;
        text-underline-offset: var(--px5);
        text-decoration-thickness: var(--px4);
      }
    }
    .sub{
      margin-top: var(--px15);
      font-size: var(--px17);
    }
    .price{
      font-weight: 500;
      font-size: var(--px20);
    }
  }
  .infoBox.col2 > li{
    width: min(36.81vw,530px);
    min-height: min(17.36vw,250px);
  }
  .infoBox.col3 > li{
    width: min(24.31vw,350px);
    min-height: min(19.44vw,280px);
  }
}

.detailSection{
  .block01 .txtList{
    margin-top: var(--px32);
    text-align: left;
    .main{
      font-size: var(--px20);
      color: #4690ED;
      font-weight: 500;
			letter-spacing: 3%;
    }
    .sub{font-size: var(--px20);margin-top: var(--px10);}
    .ex{font-size: var(--px16);}
  }
  .block04 .subTxt{
    text-align: left;
    margin-top: var(--px32);
		font-size: var(--px18);
  }
  .block01 .infoBox{margin-top: var(--px24);}
  .block02 .infoBox{margin-top: var(--px40);}
  .block03 .infoBox{margin-top: var(--px40);}
  .block04 .infoBox{margin-top: var(--px24);}
  .block05 .infoBox{margin-top: var(--px40);}
  .block06 .infoBox{margin-top: var(--px40);}
  .block07 .infoBox{margin-top: var(--px40);}

  .block01 li{
    .img{
      width: min(9.31vw,134px);
      top: var(--px30);
      right: var(--px30);
    }
  }
  .block02 li{
    .img{
      width: min(9.31vw,134px);
      top: var(--px30);
      right: var(--px30);
    }
    .main{
      margin-top: min(9.38vw,135px);
			em{font-weight: 500;}
    }
  }
  .block03 li{
    justify-content: flex-start;
		padding: var(--px32) var(--px32) var(--px32);
    .pic{
      flex-shrink: 0;
      width: 100%;
      height: min(16.46vw,237px);
      img{
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
      }
    }
    .main{
      margin-top: var(--px15);
      height: 4.5em;
			font-weight: 500;
    }
    .sub{
      font-size: var(--px18);
      font-weight: 500;
      em{
        font-size: var(--px24);
        font-weight: 500;
      }
    }
  }
  .block04 li{
    justify-content: flex-start;
		padding: var(--px16) var(--px16) var(--px30);
    .pic{
      flex-shrink: 0;
      width: 100%;
      height: min(16.46vw,237px);
			border-radius: var(--px6);
			overflow: hidden;
      img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
      }
    }
    .main{
      margin-top: var(--px15);
      height: 3em;
      font-weight: 500;
    }
    .sub{
      font-size: var(--px18);
      font-weight: 500;
      em{
        font-size: var(--px24);
        font-weight: 500;
      }
    }
  }
  .block05 li{
    justify-content: flex-start;
		padding: var(--px16) var(--px16) var(--px24);
    .pic{
      flex-shrink: 0;
      width: 100%;
      height: min(16.46vw,237px);
			border-radius: var(--px6);
			overflow: hidden;
      img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
      }
    }
    .sub{
      font-size: var(--px18);
			padding: 0 var(--px8);
      font-weight: 500;
      em{
        font-size: var(--px24);
      }
    }
  }
  .block06 li{
    height: min(30.21vw,435px);
    .img{
      width: min(9.31vw,134px);
      top: var(--px48);
      right: var(--px48);
    }
    .main{
			font-weight: 500;
			em{font-weight: 500;}
		}
    .btn{
      margin-top: var(--px32);
      width: 100%;
      text-align: center;
    }
  }
  .block07 li{
    min-height: min(13.89vw,200px) !important;
		padding: var(--px16) var(--px16) var(--px16);
    > a{
      display: flex;
      align-items: flex-end;
    }
    .pic{
      flex-shrink: 0;
      width: min(15.63vw,225px);
      height: 100%;
			border-radius: var(--px6);
			overflow: hidden;
      img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
      }
    }
    .txt{
      font-size: var(--px18);
			font-weight: 500;
      margin-left: var(--px24);
			margin-bottom: var(--px8);
    }
  }
}

	@media screen and (max-width:768px){

  .detailSection{
    padding-top: 10.67vw;
    padding-bottom: 10.67vw;
    .contInner{
      width: 100%;
      padding: 10.67vw 3.2vw 10.67vw;
    }
    .btnBottom{
      margin-top: 6.4vw;
      text-align: center;
      .btnNormal{
        text-align: left;
        width: 77.33vw;
      }
    }
    .infoBox{
      display: block;
      li{
        border-radius: 2.13vw;
        padding: 4.27vw;
        margin-top: 3.2vw;
				box-shadow: rgba(70,144,237,0.1) 0 0 1.33vw 0px;
      }
      li:first-child{
        margin-top: 0;
      }
      .main{
        font-size: 4.27vw;
        em{
          font-size: 5.33vw;
          text-underline-offset: 1vw;
          text-decoration-thickness: 0.8vw;
        }
      }
      .sub{
        margin-top: 1vw;
        font-size: 3.73vw;
      }
      .price{
        font-size: 3.7vw;
      }
    }
    .infoBox.col2 > li{
      width: 100%;
      min-height: 40vw;
    }
    .infoBox.col3 > li{
      width: 100%;
      min-height: 44.4vw;
    }
  }

  .detailSection{
    .block01 .txtList{
      margin-top: 8.53vw;
      .main{font-size: 3.73vw;}
      .sub{font-size: 3.73vw;margin-top: 3.2vw;}
      .ex{font-size: 3.2vw;}
    }
    .block04 .subTxt{
			font-size: 3.73vw;
      margin-top: 8.53vw;
    }
    .block01 .infoBox{margin-top: 6.4vw;}
    .block02 .infoBox{margin-top: 8.53vw;}
    .block03 .infoBox{margin-top: 8.53vw;}
    .block04 .infoBox{margin-top: 6.4vw;}
    .block05 .infoBox{margin-top: 8.53vw;}
    .block06 .infoBox{margin-top: 8.53vw;}
    .block07 .infoBox{margin-top: 8.53vw;}

    .block01 li{
      .img{
        width: 20.27vw;
        top: 5.33vw;
        right: 5.33vw;
      }
      .sub{
				margin-top: 6.4vw;
      }
    }
    .block02 li{
      .img{
        width: 20.27vw;
        top: 5.33vw;
        right: 5.33vw;
      }
      .main{
        margin-top: 16vw;
      }
      .sub{
				margin-top: 5.33vw;
      }
    }
    .block03 li{
      .pic{
        width: 100%;
        height: 62.4vw;
      }
      .main{
        margin-top: 2vw;
        height: auto;
				font-weight: 500;
      }
      .sub{
        margin-top: 0.5vw;
        font-size: 4.27vw;
        em{
          font-size: 4.27vw;
        }
      }
    }
    .block04 li{
      .pic{
        height: 62.4vw;
				border-radius: 1.07vw;
      }
      .main{
        margin-top: 3.2vw;
        height: auto;
      }
      .sub{
        font-size: 4.27vw;
        em{
          font-size: 4.27vw;
        }
      }
    }
    .block05 li{
      .pic{
        height: 62.4vw;
				border-radius: 1.07vw;
      }
      .sub{
        margin-top: 5.33vw;
        font-size: 4.27vw;
				padding: 0 1.07vw 1.07vw;
      }
    }
    .block06 li{
      height: auto;
      min-height: 76.53vw;
			padding: 5.33vw;
      .img{
        width: 17.6vw;
        top: 5.33vw;
        right: 5.33vw;
      }
      .main{
        margin-top: 25.33vw;
      }
      .sub{
        margin-top: 5.33vw;
      }
      .btn{
        margin-top: 4.27vw;
				.btnNormal{
					height: 10.93vw;
				}
      }
    }
    .block07 li{
      min-height: 0;
      > a{
        display: block;
      }
      .pic{
        width: 100%;
        height: 62.4vw;
				border-radius: 1.07vw;
      }
      .txt{
        margin-top: 5.33vw;
        margin-left: 0;
        margin-bottom: 0;
        font-size: 4.27vw;
				padding: 0 1.07vw 1.07vw;
      }
    }
  }

	}/* --- max-width:768px */

.detailSection:before{
  content: "";
  position: absolute;
  display: block;
  background: #fff;
  top: 0;
  left: 50%;
  margin-left: max(-69.44vw,-1000px);
  border-radius: 50%;
  filter: blur(min(34.72vw,500px));
  width: min(97.22vw,1400px);
  height: min(97.22vw,1400px);
  background-size: contain !important;
}

.detailSection:after{
  content: "";
  position: absolute;
  display: block;
  background: #fff;
  bottom: 0;
  left: 50%;
  border-radius: 50%;
  filter: blur(min(34.72vw,500px));
  width: min(97.22vw,1400px);
  height: min(97.22vw,1400px);
  background-size: contain !important;
}

	@media screen and (max-width:768px){

  .detailSection:before{
    margin-left: -100vw;
    filter: blur(50vw);
    width: 100vw;
    height: 100vw;
    background-size: contain !important;
  }

  .detailSection:after{
    filter: blur(50vw);
    width: 100vw;
    height: 100vw;
    background-size: contain !important;
  }

	}/* --- max-width:768px */

/* ------------------------------- faqSection */

.faqSection *{box-sizing: border-box;}

.faqSection{
  box-sizing: border-box;
  width: min(62.5vw,900px);
  margin: auto;
  padding: min(9.72vw,140px) 0 min(6.25vw,90px);
  .h2Box{
    margin: 0 auto var(--px48);
  }
}

.faqSection .faqBox{
  display: block;
  border: 1px solid #4690ED;
  border-radius: var(--px16);
  margin-top: var(--px32);
  padding: var(--px21) var(--px24);
  width: 100%;
	box-shadow: rgba(70, 144, 237, 0.1) 0 0 var(--px20) 0px;
  dt{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-bottom: var(--px25);
  }
  dd{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-top: var(--px16);
  }
  .q{
    font-family:"Roboto Condensed", "Noto Sans JP", sans-serif;
    font-style: italic;
    font-size: var(--px32);
    color: #4690ED;
    padding-right: var(--px24);
		line-height: 1;
  }
  .a{
    font-family:"Roboto Condensed", "Noto Sans JP", sans-serif;
    font-style: italic;
    font-size: var(--px32);
    padding-right: var(--px20);
		line-height: 1;
  }
  .main{
    text-align: left;
    font-size: var(--px24);
    font-weight: 500;
    color: #4690ED;
    text-decoration: underline;
    text-decoration-color: #FFAC52;
    text-underline-offset: var(--px10);
    text-decoration-thickness: var(--px4);
  }
  .txt{
    font-size: var(--px18);
    text-align: left;
  }
}

	@media screen and (max-width:768px){

  .faqSection{
    width: 100%;
    padding: 21.33vw 3.2vw 10.67vw;
    .h2Box{
      margin: 0 auto 8.53vw;
    }
  }

  .faqSection .faqBox{
    border-radius: 2.13vw;
    margin-top: 3.2vw;
    padding: 4.27vw 4vw;
    dt{
      padding-bottom: 3.2vw;
    }
    dd{
      padding-top: 3.2vw;
			align-items: flex-start;
    }
    .q{
      font-size: 4.27vw;
      padding-right: 2.67vw;
    }
    .a{
      font-size: 4.27vw;
      padding-right: 2.67vw;
      padding-top: 1vw;
    }
    .main{
      font-size: 4.27vw;
      text-underline-offset: 1.07vw;
      text-decoration-thickness: 0.53vw;
    }
    .txt{
      font-size: 3.73vw;
      text-align: left;
    }
  }

	}/* --- max-width:768px */


/* ------------------------------- bannerBlock */

.bannerBlock *{box-sizing: border-box;}

.bannerBlock{
  position: relative;
  background: #FFFB00;
  box-sizing: border-box;
	z-index: 1;
  .contInner{
    width: min(75vw,1080px);
    margin: auto;
    padding: var(--px30) 0 var(--px30);
  }
}

.bannerBlock .bannerBox{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bannerBlock .bannerBox .txtSide{
  text-align: left;
  .main{
    font-size: var(--px28);
    font-weight: 600;
    color: #344fff;
  }
  .sub{
    font-size: var(--px20);
    font-weight: 600;
    margin-top: var(--px35);
  }
  .btn{
    margin-top: var(--px35);
    .btnBan{
			line-height: 1.51;
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: min(19.17vw,276px);
      height: var(--px48);
      border-radius: 9999px;
      font-size: var(--px24);
      font-weight: 600;
      background: #fe8f00;
      border: 2px solid #000;
      text-align: center;
      padding-left: var(--px20);
      transition: background-color 0.6s cubic-bezier(0.19, 1, 0.22, 1);
      &:hover{
        background-color: #FED400;
        text-decoration: none;
      }
      &:before{
        content: "";
        position: absolute;
        display: block;
        background: url(../img/arw_white.svg) no-repeat center;
        top: 50%;
        transform: translateY(-50%);
        left: var(--px30);
        width: var(--px18);
        height: var(--px31);
        background-size: contain !important;
      }
    }
  }
}

.bannerBlock .bannerBox .imgSide{
  .img{
    width: min(32.5vw,468px);
  }
}

.bannerBlock .bannerBox .movSide{
  a{
		display: block;
		cursor: pointer;
		transition: scale 0.6s cubic-bezier(0.19, 1, 0.22, 1);
		overflow: visible;
	}
	a:hover{
		scale: 1.02;
		img{opacity: 1;}
	}
  .img{
    position: relative;
    width: min(15.76vw,227px);
  }
  .img .ring{
    position: absolute;
    left: max(-1.04vw,-15px);
    top: min(9.72vw,140px);
    animation: rotateCCW 8s linear infinite;
  }
}

@keyframes rotateCCW {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
}

	@media screen and (max-width:768px){

  .bannerBlock{
    .contInner{
      width: 100%;
      padding: 6.4vw 0 0;
    }
  }

  .bannerBlock .bannerBox{
    flex-wrap: wrap;
  }

  .bannerBlock .bannerBox .txtSide{
    order: 2;
    width: 100%;
    text-align: center;
    padding: 0 8vw 0;
    margin-top: 7.47vw;
    .main{
      font-size: 6.4vw;
      line-height: 1.3;
    }
    .sub{
      font-size: 4.27vw;
      margin-top: 4vw;
      line-height: 1.3;
    }
    .btn{
      margin-top: 6.67vw;
      .btnBan{
        width: 56.4vw;
        height: 11.2vw;
        font-size: 5.33vw;
        padding-left: 4vw;
        &:before{
          left: 5vw;
          width: 2.4vw;
          height: 4.13vw;
        }
      }
    }
  }

  .bannerBlock .bannerBox .imgSide{
    order: 1;
    width: 100%;
    padding: 0 12vw 0;
    .img{
      width: 100%;
    }
  }

  .bannerBlock .bannerBox .movSide{
    order: 3;
    width: 100%;
    margin-top: 8vw;
    .img{
      margin: 0 0 0 auto;
      width: 92vw;
    }
    .img .ring{
      width: 10.93vw;
      left: 51vw;
      top: -2.67vw;
    }
  }

	}/* --- max-width:768px */

/*
breadcrumb
*/
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  margin-inline: auto;
  max-width: 1080px;
  padding-block: 12.8vw 4.2666666667vw;
  width: calc(100% - 10.6666666667vw);
}
@media (1024px <= width) {
  .breadcrumb {
    padding-block: 64px 24px;
  }
}
.breadcrumb li {
  font-size: 3.2vw;
  font-weight: 600;
}
@media (1024px <= width) {
  .breadcrumb li {
    font-size: 14px;
  }
}
.breadcrumb li:last-child::after {
  content: "";
}
.breadcrumb li::after {
  content: "＞";
  margin-inline: 0.5em;
}
.breadcrumb a {
  color: var(--secondary);
  text-decoration: underline;
}
.breadcrumb a:focus-visible {
  color: var(--tertiary);
}
@media (any-hover: hover) {
  .breadcrumb a:hover {
    color: var(--tertiary);
  }
}
