@charset "UTF-8";
main ol{
  width:100%;
}
main ol li{
  position:relative;
  width:100%;
  height:calc(512px + 256*var(--calcWidth));
  margin:0 auto;
}
main ol li:nth-child(odd){
  background-color:rgba(240,244,248,1);
}
main ol li:nth-child(3){
  height:calc(432px + 212*var(--calcWidth));
  overflow:visible;
}
main ol li:nth-child(4){
  height:calc(400px + 512*var(--calcWidth));
}
main ol li > span{

}
main ol li:first-child > span{
  position:absolute;
  margin:auto;
  left:0;
  bottom:calc(-80px - 20*var(--calcWidth));
  width:calc(370px + 1180*var(--calcWidth));
  height:calc(128px + 128*var(--calcWidth));
  -webkit-transform:rotate(-6.4deg);
  transform:rotate(-6.4deg);
  background-color:var(--whiteColor);
}
main ol li:nth-child(2) > span{
  position:absolute;
  margin:auto;
  right:0;
  bottom:calc(-80px - 20*var(--calcWidth));
  width:calc(370px + 1180*var(--calcWidth));
  height:calc(128px + 128*var(--calcWidth));
  -webkit-transform:rotate(6.4deg);
  transform:rotate(6.4deg);
  background-color:rgba(240,244,248,1);
}
main ol li fieldset{
  position:absolute;
  top:0;
  right:0;
  left:0;

  width:96%;
  height:calc(344px + 20*var(--calcWidth));
  padding:0 3.2vw;
  margin:auto;
}
main ol li:nth-child(odd) fieldset{
  border:6px solid var(--whiteColor);
}
main ol li:nth-child(even) fieldset{
  border:6px solid rgba(240,244,248,1);
}
main ol li:first-child fieldset{
  bottom:13vh;
}
main ol li:nth-child(2) fieldset{
  height:calc(328px + 240*var(--calcWidth));
  bottom:18vh;
}
main ol li:nth-child(3) fieldset{
  height:calc(360px + 120*var(--calcWidth));
  bottom:10vh;
}
main ol li:last-child fieldset{
  height:calc(300px + 360*var(--calcWidth));
  bottom:4vh;
}
main ol li fieldset legend{
  width:auto;
  height:calc(50px + 24*var(--calcWidth));
  position:relative;

  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;

  -ms-flex-wrap:nowrap;
  flex-wrap:nowrap;

  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;

  -webkit-box-pack:start;
  -ms-flex-pack:start;
  justify-content:flex-start;
}
main ol li fieldset > p{
  font-size:calc(12px + 12*var(--calcWidth));
  font-weight:700;
  letter-spacing:.1vw;
  line-height:2.5;
  width:100%;
  height:100%;
  padding:calc(26px + 4*var(--calcWidth)) 0;
}
main ol li:last-child fieldset > p{
  height:auto;
  padding:2.4vh 4vw 1vw 4vw;
}
main ol li:last-child fieldset > p:last-child{
  padding:0;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;

  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;

  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
}
main ol li:nth-child(2) fieldset > p,
main ol li:nth-child(3) fieldset > p{
  padding:3.2vw auto;
}
main ol li:nth-child(3) fieldset > p br:not(:last-child),
main ol li:first-child fieldset > p br:nth-child(odd){
  display:none;
}
span.design-wrap{
  width:100%;
  max-width:940px;
  margin:4vh auto 0 auto;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;

  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;

  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
}
.design-items::before{
  position:absolute;
  content:'';
  top:0;
  bottom:0;
  margin:auto;
  background-color:var(--mainColor);
  width:calc(50px + 180*var(--calcWidth));

  height:calc(50px + 180*var(--calcWidth));

  border-radius:50%;
  display:block;
  z-index:-1;
}
.design-items{
  font-size:calc(14px + 32*var(--calcWidth));
  font-weight:900;
  letter-spacing:0;
  line-height:1.2;
  font-feature-settings:'palt';
  text-align:center;
  overflow-wrap:normal;
  position:relative;
  width:calc(70px + 220*var(--calcWidth));

  height:calc(70px + 220*var(--calcWidth));

  margin:auto;
  border-radius:50%;
  display:block;
  z-index:0;

  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;

  -ms-flex-wrap:nowrap;
  flex-wrap:nowrap;

  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;

  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
}
.design-items:first-child::before{
  width:calc(30px + 140*var(--calcWidth));
  max-width:120px;
  height:calc(30px + 140*var(--calcWidth));
  max-height:120px;
}
.design-items:first-child{
  width:calc(50px + 180*var(--calcWidth));
  max-width:140px;
  height:calc(50px + 180*var(--calcWidth));
  max-height:140px;
}
.design-items > span{
  font-size:calc(8px + 16*var(--calcWidth));
  font-weight:500;
  white-space:nowrap;
  position:absolute;
  bottom:-.6vw;
}
.design-items > span span{
  color:rgba(202,202,202,1);
}
.sec-btn{
  max-width:216px;
  max-height:64px;
  position:absolute;
  right:16px;
  bottom:calc(-24px - 10*var(--calcWidth));
  border:4px solid rgba(0,0,0,1);
}
.sec-btn span:first-child{
  font-size:1.4rem;
}
.sv-illust{
  width:calc(176px + 176*var(--calcWidth));
  height:calc(176px + 1*var(--calcWidth));
  position:absolute;
  top:calc(-176px + 1*var(--calcWidth));
  right:8vw;
  z-index:5;
  display:block;
  background-image:url('../img/sv_illrust_graf.svg');
  background-position:center;
  background-repeat:no-repeat;
  background-size:contain;
}
.sv-illust img{
  width:100%;
  height:100%;
 display:block;
}
.sv-etc{
  width:3.6vw;
  font-size:calc(24px + 8*var(--calcWidth));
  font-weight:900;
  position:absolute;
}
main ol li:nth-child(2) fieldset .sv-etc{
  right:12vw;
  bottom:2.4vw;
}
main ol li:last-child fieldset .sv-etc{
  right:12vw;
  bottom:0;
}
.sv-line-height{
  width:100%;
  height:16px;
  margin:0 auto;
  padding:0;
  display:block;
}
main ol li fieldset legend img{
  height:100%;
  padding:0 0 0 16px;
  float:left;
  display:inline-block;
}
main ol li fieldset legend span{
  font-size:calc(18px + 6*var(--calcWidth));
  font-weight:700;
  white-space:nowrap;
  height:100%;
  padding:0 24px 0 16px;

  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;

  -ms-flex-wrap:nowrap;
  flex-wrap:nowrap;

  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;

  -webkit-box-pack:start;
  -ms-flex-pack:start;
  justify-content:flex-start;
}
.display-none{
  display:none!important;
}
.sv-omochi-man-top{
  position:absolute;
  top:calc(124px + 432*var(--calcWidth));
  left:calc(-16px - 64*var(--calcWidth));
  margin:0;
  width:calc(88px + 192*var(--calcWidth));
  height:calc(88px + 192*var(--calcWidth));
  border-radius:50%;
  background-color:var(--mainColor);
  z-index:1;
}
.sv-omochi-man-top img{
  position:absolute;
  right:-4%;
  bottom:10%;
  width:calc(64px + 108*var(--calcWidth));
}
.sv-omochi-man-bottom{
  position:absolute;
  bottom:calc(-40px - 64*var(--calcWidth));
  left:calc(24px + 24*var(--calcWidth));
  margin:0;
  width:calc(88px + 128*var(--calcWidth));
  height:calc(88px + 128*var(--calcWidth));
  border-radius:50%;
  background-color:var(--mainColor);
  z-index:1;
  transform:rotate(120deg);
}
.sv-omochi-man-bottom img{
  position:absolute;
  right:-4%;
  top:10%;
  width:calc(64px + 88*var(--calcWidth));
}
.ft-line{
  border:none;
}
@media screen and (min-width:600px){
  .sv-omochi-man-top{
    top:calc(160px + 100*var(--calcTabletWidth));
  }
  main ol li{
    height:calc(480px + 160*var(--calcTabletWidth));
  }
  main ol li:nth-child(3){
    height:calc(360px + 160*var(--calcTabletWidth));
  }
  main ol li:nth-child(4){
    height:calc(420px + 160*var(--calcTabletWidth));
  }
  main ol li fieldset{
    width:68%;
    height:calc(256px + 100*var(--calcTabletWidth));
    padding:0 2.4vw;
  }
  main ol li fieldset > p{
    font-size:calc(10.5px + 7.5*var(--calcTabletWidth));
    font-weight:500;
  }
  main ol li fieldset legend{
    width:auto;
  }
  main ol li:first-child fieldset{
    bottom:calc(72px + 72*var(--calcTabletWidth));
  }
  .sec-btn{
    bottom:calc(-26px - 10*var(--calcTabletWidth));
  }
  .sec-btn span:first-child{
    font-size:1rem;
  }
  main ol li:nth-child(2) fieldset{
    height:calc(300px + 128*var(--calcTabletWidth));
  }
  main ol li:nth-child(3) fieldset{
    height:calc(286px + 128*var(--calcTabletWidth));
  }
  main ol li:last-child fieldset{
    height:calc(298px + 128*var(--calcTabletWidth));
  }
  main ol li:nth-child(2) fieldset .sv-etc{
    right:8vw;
  }
  main ol li:last-child fieldset .sv-etc{
    right:8vw;
  }
  .design-items{
    font-size:calc(15.5px + 10*var(--calcTabletWidth));
    width:calc(88px + 40*var(--calcTabletWidth));
    height:calc(88px + 40*var(--calcTabletWidth));
  }
  .design-items::before{
    width:calc(72px + 40*var(--calcTabletWidth));
    height:calc(72px + 40*var(--calcTabletWidth));
  }
  .design-items:first-child{
    width:calc(56px + 40*var(--calcTabletWidth));
    height:calc(56px + 40*var(--calcTabletWidth));
  }
  .design-items:first-child::before{
    width:calc(40px + 40*var(--calcTabletWidth));
    height:calc(40px + 40*var(--calcTabletWidth));
  }
  .design-items > span{
    font-size:calc(10px + 4*var(--calcTabletWidth));
    bottom:-1vw;
  }
  .sv-illust{
    width:calc(256px + 160*var(--calcTabletWidth));
    height:calc(256px + 160*var(--calcTabletWidth));
    top:calc(-240px - 80*var(--calcTabletWidth));
    right:calc(36px + 48*var(--calcTabletWidth));
  }
}
@media screen and (min-width:1025px){
  main ol li{
    /*
    height:88vh;
    */
  }
  main ol li:first-child{
    height:calc(556px + 648*var(--calcPCWidth));
  }
  main ol li:nth-child(2){
    height:calc(390px + 496*var(--calcPCWidth));
  }
  main ol li:nth-child(3){
    height:calc(312px + 280*var(--calcPCWidth));
  }
  main ol li:last-child{
    height:calc(484px + 568*var(--calcPCWidth));
  }
  main ol li fieldset{
    width:54.8%;
  }
  main ol li:nth-child(odd) fieldset{
    border:6px solid var(--whiteColor);
  }
  main ol li:nth-child(even) fieldset{
    border:6px solid rgba(240,244,248,1);
  }
  main ol li:nth-child(3) fieldset > p br:not(:last-child),
  main ol li:first-child fieldset > p br:nth-child(odd){
    display:block;
  }
  main ol li:first-child fieldset{
    height:calc(272px + 300*var(--calcPCWidth));
    bottom:calc(90px + 128*var(--calcPCWidth));
  }
  main ol li:nth-child(2) fieldset{
    height:calc(272px + 276*var(--calcPCWidth));
    bottom:calc(234px + 256*var(--calcPCWidth));
  }
  main ol li:nth-child(3) fieldset{
    height:calc(272px + 336*var(--calcPCWidth));
    bottom:calc(174px + 64*var(--calcPCWidth));
  }
  main ol li:last-child fieldset{
    height:calc(320px + 396*var(--calcPCWidth));
    bottom:calc(32px + 1*var(--calcPCWidth));
  }
  main ol li fieldset legend{
    width:auto;
    height:calc(64px + 76*var(--calcPCWidth));
  }
  main ol li fieldset legend span{
    width:auto;
    font-size:calc(22px + 22*var(--calcPCWidth));
  }
  main ol li fieldset > p{
    font-size:calc(12px + 14*var(--calcPCWidth));
    font-weight:500;
    line-height:1.9;
    padding:3.4vw 3.2vw;
  }
  main ol li:nth-child(2) fieldset > p{
    padding:1.6vw 4vw;
  }
  main ol li:nth-child(3) fieldset > p{
    padding:2.4vw 3.2vw;
  }
  main ol li:last-child fieldset > p{
    padding:2.4vh 4vw 2vw 4vw;
  }
  main ol li:nth-child(2) fieldset .sv-etc{
    right:24%;
    bottom:16%;
  }
  main ol li:last-child fieldset .sv-etc{
    right:12%;
    bottom:8%;
  }
  .sv-illust{
    width:35vw;
    height:35vw;
    top:-32.5vw;
    right:2.4vw;
  }
  .sec-btn{
    right:calc(-32px - 24*(100vw + 1025px)/1225);
    bottom:calc(40px + 50*var(--calcPCWidth));
  }
  .sec-btn span:first-child{
    font-size:.88rem;
  }
  .design-items > span{
    font-size:calc(10.5px + 12*var(--calcPCWidth));
  }
  .design-items::before{
    width:calc(96px + 96*var(--calcPCWidth));
    height:calc(96px + 96*var(--calcPCWidth));
  }
  .design-items{
    font-size:calc(20px + 20*var(--calcPCWidth));
    width:calc(104px + 104*var(--calcPCWidth));
    height:calc(104px + 104*var(--calcPCWidth));
  }
  .design-items:first-child::before{
    width:calc(80px + 80*var(--calcPCWidth));
    height:calc(80px + 80*var(--calcPCWidth));
  }
  .design-items:first-child{
    width:calc(88px + 88*var(--calcPCWidth));
    height:calc(88px + 88*var(--calcPCWidth));
  }
  .sv-omochi-man-top{
    top:calc(216px + 248*var(--calcPCWidth));
    left:calc(-20px - 140*var(--calcPCWidth));
    width:calc(208px + 256*var(--calcPCWidth));
    height:calc(208px + 256*var(--calcPCWidth));
  }
  .sv-omochi-man-top img{
    width:calc(130px + 140*var(--calcPCWidth));
  }
  .sv-omochi-man-bottom{
    bottom:calc(-86px - 140*var(--calcPCWidth));
    left:calc(24px + 32*var(--calcPCWidth));
    width:calc(168px + 256*var(--calcPCWidth));
    height:calc(168px + 256*var(--calcPCWidth));
  }
  .sv-omochi-man-bottom img{
    width:calc(120px + 160*var(--calcPCWidth));
  }
  main ol li>span{
    bottom:calc(100px + 1*var(--calcPCWidth));
  }
}
