@charset "UTF-8";

/* -----------------------------
  バナーメニュー
----------------------------- */

@media all and (min-width: 768px), print {
  .menu-list{
    display: flex;
    flex-direction: column;
    gap:calc(40 / var(--font-size) * 1rem);
  }
  .menu-box{
    background-color: var(--sub-color-03);
    border-radius:calc(20 / var(--font-size) * 1rem);
    overflow:hidden;
    position: relative;
  }
  .menu-box__link{
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:20;
  }
  .menu-box__inner{
    position: relative;
    z-index:10;
  }
  .menu-box__header{
    background: linear-gradient(90deg, #EFFCBB 0%, #C7F3C8 100%);
    padding:calc(26 / var(--font-size) * 1rem) calc(18 / var(--font-size) * 1rem);
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .menu-box__title{
    font-size:calc(26 / var(--font-size) * 1rem);
    font-weight: 700;
    color:var(--main-color);
    line-height: 1;
  }
  .menu-box__body{
    padding:calc(24 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
  }
  .menu-box__text-wrap{
    min-height:calc(53 / var(--font-size) * 1rem);
  }
  .menu-box__text{
    font-size:calc(17 / var(--font-size) * 1rem);
    font-weight: 700;
    text-align: center;
  }
  .menu-box__button__text{
    font-size:calc(14 / var(--font-size) * 1rem);
    font-weight: 700;
    color:var(--main-color);
    text-align: center;
    line-height: 1.6;
  }
  .menu-box__button{
    max-width:calc(388 / var(--font-size) * 1rem);
    width:100%;
    margin-top: calc(11 / var(--font-size) * 1rem);
    margin-left: auto;
    margin-right: auto;
  }
  .menu-box__button .c-btn{
    margin-top: calc(8 / var(--font-size) * 1rem);
  }
  .menu-box__button .c-btn__inner {
    min-height: calc(62 / var(--font-size) * 1rem);
  }

  .menu-box__bg{
    background-size:contain;
    background-position:top center;
    background-repeat:no-repeat;
    position: absolute;
  }

  .menu-box.--box-simulation:hover .c-btn__link,
  .menu-box.--box-tool:hover .c-btn__link{
    opacity:0.7;
  }
  
  /**************************************/
  .menu-box.--box-simulation{
    padding:calc(70 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
    background: linear-gradient(90deg, #E0FFD3 0%, #F7FFE9 100%);
  }
  .menu-box.--box-simulation .menu-box__header{
    padding: 0;
    background: transparent;
  }
  .menu-box.--box-simulation .menu-box__body{
    padding:0;
    margin-top: calc(20 / var(--font-size) * 1rem);
  }
  .menu-box.--box-simulation .menu-box__text{
    color:var(--main-color);
    font-size:calc(20 / var(--font-size) * 1rem);
    line-height: 1.3;
  }
  .menu-box.--box-simulation .menu-box__button{
    margin-top: calc(12 / var(--font-size) * 1rem);
  }
  .menu-box.--box-simulation .menu-box__bg.--bg-01{
    background-image: url(/assets/img/application-for-issuance/top/img01_pc.png);
    max-width:calc(410 / var(--font-size) * 1rem);
    width:100%;
    height:calc(283 / var(--font-size) * 1rem);
    top:0;
    left:0;
  }
  .menu-box.--box-simulation .menu-box__bg.--bg-02{
    background-image: url(/assets/img/application-for-issuance/top/img02_pc.png);
    max-width:calc(338 / var(--font-size) * 1rem);
    width:100%;
    height:calc(290 / var(--font-size) * 1rem);
    top:0;
    right:calc(29 / var(--font-size) * 1rem);
  }
  /**************************************/
  .menu-box.--box-tool{
    padding:calc(70 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
    background: linear-gradient(90deg, #D4F8E3 0%, #E9FFF2 100%);
  }
  .menu-box.--box-tool .menu-box__header{
    padding: 0;
    background: transparent;
  }
  .menu-box.--box-tool .menu-box__body{
    padding:0;
    margin-top: calc(20 / var(--font-size) * 1rem);
  }
  .menu-box.--box-tool .menu-box__text{
    color:var(--main-color);
    font-size:calc(20 / var(--font-size) * 1rem);
    line-height: 1.3;
  }
  .menu-box.--box-tool .menu-box__button{
    margin-top: calc(12 / var(--font-size) * 1rem);
  }
  .menu-box.--box-tool .menu-box__bg.--bg-01{
    background-image: url(/assets/img/application-for-issuance/top/img03_pc.png);
    max-width:calc(251 / var(--font-size) * 1rem);
    width:100%;
    height:calc(215 / var(--font-size) * 1rem);
    bottom:0;
    left:0;
  }
  .menu-box.--box-tool .menu-box__bg.--bg-02{
    background-image: url(/assets/img/application-for-issuance/top/img04_pc.png);
    max-width:calc(254 / var(--font-size) * 1rem);
    width:100%;
    height:calc(256 / var(--font-size) * 1rem);
    top:calc(20 / var(--font-size) * 1rem);
    right:calc(29 / var(--font-size) * 1rem);
  }
}

@media all and (max-width: 767px) {
  .menu-list{
    display: flex;
    flex-direction: column;
    gap:calc(40 / var(--font-size) * 1rem);
  }
  .menu-box{
    background-color: var(--sub-color-03);
    border-radius:calc(20 / var(--font-size) * 1rem);
    overflow:hidden;
    position: relative;
  }
  .menu-box__link{
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:20;
  }
  .menu-box__inner{
    position: relative;
    z-index:10;
  }
  .menu-box__header{
    background: linear-gradient(90deg, #EFFCBB 0%, #C7F3C8 100%);
    padding: calc(20 / var(--font-size) * 1rem) calc(18 / var(--font-size) * 1rem);
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .menu-box__title{
    font-size:calc(20 / var(--font-size) * 1rem);
    font-weight: 700;
    color:var(--main-color);
    line-height: 1;
  }
  .menu-box__body{
    padding:calc(24 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
  }
  .menu-box__text-wrap{
    min-height:calc(53 / var(--font-size) * 1rem);
  }
  .menu-box__text{
    font-size: calc(15 / var(--font-size) * 1rem);
    font-weight: 700;
    text-align: center;
  }
  .menu-box__button__text{
    font-size: calc(13 / var(--font-size) * 1rem);
    font-weight: 700;
    color:var(--main-color);
    text-align: center;
    line-height: 1.6;
  }
  .menu-box__button{
    max-width:calc(388 / var(--font-size) * 1rem);
    width:100%;
    margin-top: calc(11 / var(--font-size) * 1rem);
    margin-left: auto;
    margin-right: auto;
  }
  .menu-box__button .c-btn{
    margin-top: calc(8 / var(--font-size) * 1rem);
  }
  .menu-box__button .c-btn__inner {
    min-height: calc(58 / var(--font-size) * 1rem);
  }

  .menu-box__bg{
    background-size:contain;
    background-position:top center;
    background-repeat:no-repeat;
    position: absolute;
  }

  .menu-box.--box-simulation:hover .c-btn__link,
  .menu-box.--box-tool:hover .c-btn__link{
    opacity:0.7;
  }
  
  /**************************************/
  .menu-box.--box-simulation{
    padding: calc(63 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem) calc(26 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
    background: linear-gradient(90deg, #E0FFD3 0%, #F7FFE9 100%);
  }
  .menu-box.--box-simulation .menu-box__header{
    padding: 0;
    background: transparent;
  }
  .menu-box.--box-simulation .menu-box__body{
    padding:0;
    margin-top: calc(20 / var(--font-size) * 1rem);
  }
  .menu-box.--box-simulation .menu-box__text{
    color:var(--main-color);
    font-size: calc(15 / var(--font-size) * 1rem);
    line-height: 1.3;
  }
  .menu-box.--box-simulation .menu-box__button{
    margin-top: calc(12 / var(--font-size) * 1rem);
  }
  .menu-box.--box-simulation .menu-box__bg.--bg-01{
    background-image: url(/assets/img/application-for-issuance/top/img01_sp.png);
    max-width: calc(100% / var(--font-size) * 1rem);
    width:100%;
    height: 100%;
    top:0;
    left:0;
  }
  .menu-box.--box-simulation .menu-box__link:before,
  .menu-box.--box-simulation .menu-box__link:after{
    display: none;
  }
  /**************************************/
  .menu-box.--box-tool{
    padding: calc(63 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem) calc(26 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
    background: linear-gradient(90deg, #D4F8E3 0%, #E9FFF2 100%);
  }
  .menu-box.--box-tool .menu-box__header{
    padding: 0;
    background: transparent;
  }
  .menu-box.--box-tool .menu-box__body{
    padding:0;
    margin-top: calc(20 / var(--font-size) * 1rem);
  }
  .menu-box.--box-tool .menu-box__text{
    color:var(--main-color);
    font-size: calc(15 / var(--font-size) * 1rem);
    line-height: 1.3;
  }
  .menu-box.--box-tool .menu-box__button{
    margin-top: calc(12 / var(--font-size) * 1rem);
  }
  .menu-box.--box-tool .menu-box__bg.--bg-01{
    background-image: url(/assets/img/application-for-issuance/top/img03_sp.png);
    max-width: calc(100% / var(--font-size) * 1rem);
    width:100%;
    height: 100%;
    top:0;
    left:0;
  }
  .menu-box.--box-tool .menu-box__link:before,
  .menu-box.--box-tool .menu-box__link:after{
    display: none;
  }
}