@charset "UTF-8";

/* base
------------------------------------------------------------------------------------------------- */

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}


body.nc_body{
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  box-sizing: border-box;
  font-family:
    "Zen Kaku Gothic New",
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    "Yu Gothic",
    Meiryo,
    sans-serif;
  font-size:1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #1A1A1A;
  height:auto !important;
  min-height:100vh;
  letter-spacing: 0.05rem;
  -webkit-overflow-scrolling: touch; /* iOSでのスクロールをスムーズに */
}

img, iframe {
  width: 100%;
  display: block;
}

.nc_container{
  width: 100%;
  padding-right: .75rem;
  padding-left: .75rem;
  margin-right: auto;
  margin-left: auto;
}

.nc_section_content{
  padding-top: 5rem;
}

@media (min-width:768px) {
.nc_section_content{
  padding-top: 6rem;
}

.container{
  padding-right: 1.5rem;
  padding-left: 1.5rem;
}
}
@media (min-width:1280px) {
.nc_section_content{
  padding-top: 7rem;
}
}

#loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#loader img {
  width: 70%;
  height: auto;
}

@media (min-width: 768px) {
  #loader img {
    width: auto;
    max-height: 200px;
  }
}

#main_content {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s;
}

#main_content.is-loaded {
  opacity: 1;
  visibility: visible;
}

.js-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1.6s cubic-bezier(.4,0,.2,1),
              transform 1.6s cubic-bezier(.4,0,.2,1);
}

.js-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}



/* header
-------------------------------------------------------------------------------------------------- */

#nc_header{
  height: 60px;
}

.nc_sp_Header{
  display: block;
  min-width: 320px;
}
header{
  position: relative;
}

header .nc_sp_Header_navbar{
  flex-wrap:nowrap;
  background-color:#fff;
  width: 100%;
  height: 60px;
  position: fixed;
  display: flex;
  justify-content: space-between;
  align-items: center;
  top: 0;
  left: 0;
  z-index: 50;
  /* box-shadow: 0 3px 3px rgba(124, 129, 128, 0.2); */
}
header .nc_sp_Header_logo img{
  width: 9rem;
  margin: 5px;
}

/* spボタン */
.nc_sp_Btn{
  display: flex;
    width: 10%;
    max-width: 6rem;
    margin: 0.5rem;
    align-items: center;
    justify-content: space-around;
    flex-wrap: nowrap;
    padding-top: 5px;
}

.nc_menuBtn p,.nc_closeBtn p{
  font-size: 0.7rem;
  font-weight: 600;
   text-align: center;
   color: #73cfe6;
}


.nc_menuBtn{
  width: 25px;
}

.nc_hamburger {
  width: 2rem;
  height: 21px;
  position: relative;
}

.nc_hamburger_bar {
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  background: #73cfe6;
}

.nc_hamburger_bar:nth-child(1) {
  top: 0;
}

.nc_hamburger_bar:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
}

.nc_hamburger_bar:nth-child(3) {
  top: 100%;
  transform: translateY(-100%);
}

.nc_close_btn {
  display: block;
  position: relative;
  width: 30px;
  height: 30px;
  margin: 0 auto;
}

.nc_close_btn::before, .nc_close_btn::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 27px;
  background: #73cfe6;
}

.nc_close_btn::before {
  transform: translate(-50%,-50%) rotate(45deg);
}

.nc_close_btn::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}


.nc_sp_Header_inner{

  background: #fff;
  position: fixed;
  z-index: 15;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  transition: all 0s;
  overflow: auto;
}

.nc_sp_Header_inner:active{
  display: block;
}


header .nc_sp_Header_inner .nc_closeBtn {
  width: 3.5rem;
  height: 3.5rem;
  position: fixed;
  top: 0;
  right: 0;
  margin: auto;
  z-index: 100;
padding-top: 5px;
}

.nc_sp_Header_nav{
  text-align: center;
  margin-top: 4rem;
  margin-bottom: 3rem;
  margin-left: auto;
  margin-right: auto;
  padding: 0 0.62rem;
  max-width: 700px;

}

.nc_sp_Header_nav li{
  transform: rotate(0.03deg);
}

.nc_sp_Header_nav li img{
  width: 50%;
  max-width: 11.25rem;
  margin: 0 auto;
}

.nc_sp_Header_item a{
  display: block;
  padding: 0.78rem;
}

.nc_sp_Header_item{
  font-size: 1rem;
  font-weight: 600;
}
.nc_sp_Header_item:first-child{
  margin-bottom: 2rem;
  text-align: center;
  border: none;
}
  .nc_sp_Header_inner_btn a{
    color: #ffffff;
    font-weight: 600;
    max-width: 80%;
    text-align: center;
    display: block;
    padding: 1rem .5rem;
    position: relative;
    top: 50%;
    left: 50%;
    border-radius: 50px;
    transform: translate(-50%, -50%);
    background: linear-gradient(135deg, #73CFE6, #9BD9B5);

  }

    .nc_sp_Header_inner_btn span::after {
        content: "";
        display: inline-block;
        width: 20px;
        height: 25px;
        margin-left: 4px;
        background-image: url("/front/town/niseko/nise-coin/img/logo/icon_tab.png");
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;

      }


.nc_pc_homeHeader_navWrap{
  display: none;
}



@media (min-width:992px) {
  .nc_sp_Header,.nc_f_btn_fixed{
    display: none;
  }

  /* pc_nav */
  .nc_pc_homeHeader_navWrap{
    display: block;
    height: 70px;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    background: #ffffff;
    box-shadow: 0 3px 3px rgba(187, 190, 190, 0.2);
  }

  .nc_pc_homeHeader_navInnerWrap{
    height: 100%;
    width: 100%;
    margin: 0 auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    position: relative;
  }

  .nc_pc_homeHeader_nav {
    position: relative;
    top: 0;
    right: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    height: 100%;
    width: 100%;
    font-weight: 500;
  }
  .pc_homeHeader_nav a{
    display: block;
    padding: 0 1.5rem;

  }

  .nc_pc_homeHeader_navItem,.pc_homeHeader_btn{
    text-align: center;
    vertical-align: middle;
    position: relative;
    height: 100%;
  }

  .nc_pc_homeHeader_navItem {
    position: relative;
    display: block;
    margin: 0 20px;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .nc_pc_homeHeader_logo{
    width: 220px;
    padding: 0.75rem;
  }

    .nc_pc_homeHeader_logo a{
      display: block;
    }

  .nc_pc_homeHeader_navItem a span{
    word-break: normal;
    position: relative;
  }

  .nc_pc_homeHeader_btn{
    display: block;
    text-align: center;
    height: 100%;
    position: relative;
    background: linear-gradient(135deg, #73CFE6, #9BD9B5);
  }

  .nc_pc_homeHeader_btn a{
    color: #ffffff;
    text-align: center;
    display: block;
    padding: 1.35rem 1.5rem;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

    .nc_pc_homeHeader_btn span::after {
        content: "";
        display: inline-block;
        width: 20px;
        height: 25px;
        margin-left: 4px;
        background-image: url("/front/town/niseko/nise-coin/img/logo/icon_tab.png");
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
      }


.nc_pc_homeHeader_navInnerWrap {
  position: relative;
  overflow: visible;
}


.nc_pc_submenu_list li a::after,
  .nc_pc_homeHeader_navItem a::after  {
    position: absolute;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background: #73CFE6;
    bottom: 10px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: transform 0.3s;
    }
    .nc_pc_homeHeader_navItem a:hover::after {
    transform: scale(1, 1);
    }

}

/*
 footer
----------------------------------------------------------------------------------------------------------------------*/
/* ==========================
   Footer 共通（SP）
========================== */

.nc_footer_box{
  margin-bottom: 70px;
}

.nc_footer_inner {
  display: block;
}

.nc_footer_inner_box01 {
  background: #fff;
  padding: 40px 20px;

  display: flex;
  justify-content: center;
  align-items: center;
}

.n_footer_logo img {
  display: block;
  width: 150px;
  height: auto;
}

.nc_footer_inner_box02 {
  background: #73cfe6;
  color: #fff;
  padding: 40px 20px;
}

/* メニュー */

.nc_footer_navItem {
  display: flex;
  flex-wrap: wrap;
  width: 70%;
  max-width: 500px;
  margin: 0 auto 2rem;
  gap: 5px;
  list-style: none;
  padding: 0;
}

.nc_footer_navItem li {
  flex: 0 0 calc((100% - 5px) / 2);
  padding: 5px;
  font-weight: 500;
}

.nc_footer_navItem a {
  display: block;
  text-decoration: none;
  color: inherit;
}

.nc_copy {
  text-align: center;
  font-size: 80%;
  transform: rotate(0.03deg);
  font-weight: 500;
}

.nc_copy p {
  margin: 0;
}

@media (min-width: 768px) {

  .nc_footer_inner {
    display: flex;
    align-items: stretch;
  }

  .nc_footer_inner_box01 {
    width: 30%;
    flex-shrink: 0;
  }

  .nc_footer_inner_box02 {
    flex: 1;
    padding: 3.75rem 3.75rem 0;
  }

  .nc_footer_navItem {
    width: 70%;
    max-width: 500px;
    margin: 0 auto 2rem;
  }
.nc_copy{
  width: 70%;
  max-width: 500px;
  margin: 0 auto;
  text-align: left;
}
}
@media (min-width: 992px){
  .nc_footer_box{
    margin-bottom: 0;
  }

  .n_footer_logo img {
    width: 220px;
  }
  .nc_footer_navItem{
    font-size: 1.285714286rem;
    margin-bottom: 7rem;
  }

}

/* 旅先納税をはじめるボタン
----------------------------------------------------------------------------------------------------------------------*/

.nc_f_btn_fixed{
  flex-wrap:nowrap;
  background: linear-gradient(135deg, #73CFE6, #9BD9B5);
  width: 100%;
  position: fixed;
  display: flex;
  justify-content: space-between;
  bottom: 0;
  left: 0;
  z-index: 10;
  display: block;
  text-align: center;
}
.nc_f_btn_box{
  position: relative;
}

.nc_f_btn_link {
    font-size: 1.5rem;
    color: #fff;
    font-weight: 600;
    display: flex;
    align-items: center;
    align-self: center;
    justify-content: center;
    padding: 15px;
    height: 90px;

    opacity: 0.9;
}

.nc_f_btn_link span::after {
    content: "";
    display: inline-block;
    width: 25px;
    height: 30px;
    margin-left: 4px;
    background-image: url("/front/town/niseko/nise-coin/img/logo/icon_tab.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
  }

@media (min-width:992px) {
    .nc_f_btn_fixed{
      display: none;
    }
  }

/*
 parts
----------------------------------------------------------------------------------------------------------------------*/
h2.nc_h2{color: #0C6E87; text-align:center; padding: 0 0 2rem; font-size: clamp(1.5625rem, 1.0572rem + 2.155vw, 3rem); font-weight: 700;}
h2.nc_h2 img{display: inline-block; width: 90%; max-width: 550px;}
h3.nc_h3{text-align:center; padding: 2rem; font-size: clamp(1.25rem, 0.8539rem + 1.6901vw, 2.375rem); font-weight: 500;}
h3.nc_h3 img{display: inline-block; margin: 0 auto; width: 80%; max-width: 150px;}
h4.nc_h4{text-align:center; padding: 2rem 0; font-size: clamp(18px, 1.622vw + 6.84px, 32px); font-weight: 500;}

@media (min-width:768px) {
h2.nc_h2{padding: 0 0 3rem;}
h3.nc_h3{padding:3rem 0;}
}

.text-size_01{font-size: clamp(15px, 0.523vw + 12.96px, 23px);}
.text-size_02{font-size: clamp(12px, 0.392vw + 10.47px, 18px);}
.text-size_03{font-size: clamp(14px, 0.392vw + 12.47px, 20px);}
.text-size_04{font-size: clamp(13px, calc(13px + 0.1307vw), 15px);}
.text-size_05{font-size: clamp(10px, 9.24px + 0.196vw, 13px)}
.text-size_06{font-size: clamp(13px, calc(13px + 0.1307vw), 15px);}


.text-center{
  text-align: center;
}


/* container */
.container_m {max-width: 1100px; margin:0 auto;}
.container_s {max-width: 1000px; margin:0 auto;}
.container_ss {max-width: 800px; margin:0 auto;}
.container_xl {max-width:1400px; margin:0 auto;}

/* img-hover */
a .img-hover{ -webkit-transition: all .3s; transition: all .3s;}
a:hover .img-hover{opacity: 0.7;}

.nc_pc_br{
  display: none;
}

.nc_sp_br{
  display: block;
}

.nc_sp_br02{
  display: block;
}


@media (min-width:768px) {
.nc_pc_br{
  display: block;
}

.nc_sp_br{
  display: none;
}

}