@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, img, small, strong, b, dl, dt, dd, ol, ul, li,
form, label, legend, table, tbody, tfoot, thead, tr, th, td, footer, header, menu, nav, section, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: bottom;
  background: transparent;
}

html {
  touch-action: manipulation;
}

body {
  line-height: 1;
  -webkit-text-size-adjust: 100%;
}

ul li {
  list-style: none;
}

a {
  margin: 0;
  padding: 0;
  color: #4D4D4D;
  text-decoration: none;
  vertical-align: baseline;
}

a:hover {
  opacity: 0.8;
}

table {
  border-spacing: 0;
}

img {
  width: 100%;
}

/* ===================================================================================
  resetここまで
=================================================================================== */
.wrap {
  max-width: 750px;
  margin: 0 auto;
}
.wrap .bnr_area {
  width: 700px;
  margin: 0 auto;
  padding-bottom: 90px;
}
@media screen and (max-width: 750px) {
  .wrap .bnr_area {
    width: 93.3333333333vw;
    padding-bottom: 12vw;
  }
}
.wrap .bnr_area p {
  margin-top: 100px;
}
@media screen and (max-width: 750px) {
  .wrap .bnr_area p {
    margin-top: 13.3333333333vw;
  }
}
.wrap .bnr_area p:first-child {
  margin-top: 0;
}/*# sourceMappingURL=style.css.map */


/* ===================================================================================
 body
=================================================================================== */



body {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", "Yu Gothic Medium", "メイリオ", Meiryo, sans-serif;
  color: #4D4D4D;
  font-size: 28px;
}
@media screen and (max-width: 750px) {
  body {
    font-size: 3.7333333333vw;
  }
}

.inner {
  max-width: 750px;
  margin: 0 auto;
  box-sizing: border-box;
}

.float_area {
  display: flex;
  justify-content: center;
  gap: 15px;
  width: 100%;
  padding: 30px 0;
  background: rgba(255, 255, 255, 0.85);
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
}
@media screen and (max-width: 750px) {
  .float_area {
    gap: 2vw;
    padding: 4vw 0;
  }
}
.float_area p {
  color: #fff;
  line-height: 108px;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.04em;
  width: 346px;
  height: 110px;
  filter: drop-shadow(5px 5px 5px rgba(66, 66, 66, 0.4));
}
@media screen and (max-width: 750px) {
  .float_area p {
    line-height: 14.4vw;
    width: 46.1333333333vw;
    height: 14.6666666667vw;
    filter: drop-shadow(0.6666666667vw 0.6666666667vw 0.6666666667vw rgba(66, 66, 66, 0.4));
  }
}
.float_area p:hover {
  opacity: 0.8;
}
.float_area p a {
  display: block;
  color: #fff;
  line-height: 108px;
  padding-left: 10px;
}
@media screen and (max-width: 750px) {
  .float_area p a {
    line-height: 14.4vw;
    padding-left: 1.3333333333vw;
  }
}
.float_area p a:hover {
  opacity: 1;
}
.float_area .coupon {
  background: url(../img/float_btn_coupon.png) no-repeat top left/100%;
}
.float_area .shop {
  background: url(../img/float_btn_shop.png) no-repeat top left/100%;
}

.modal_open {
  cursor: pointer;
}
.modal_open:hover {
  opacity: 0.8;
}

.modal_container {
  overflow: auto;
  text-align: center;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  box-sizing: border-box;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
}

.modal_container:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

.modal_container.active {
  opacity: 1;
  visibility: visible;
}

.modal_body {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  max-width: 500px;
  width: 90%;
}

.modal_close {
  width: 70px;
  position: absolute;
  top: -30px;
  right: -10px;
  cursor: pointer;
}
@media screen and (max-width: 750px) {
  .modal_close {
    width: 9.3333333333vw;
    top: -4vw;
    right: -1.3333333333vw;
  }
}
.modal_close:hover {
  opacity: 0.8;
}

#fv {
  background: url("../img/fv_bg.jpg") no-repeat top center, #0168B7;
}
@media screen and (max-width: 750px) {
  #fv {
    background-size: 266.6666666667vw auto;
  }
}
#fv .inner {
  position: relative;
}
#fv .inner .kome {
  color: #898989;
  font-size: 18px;
  position: absolute;
  top: 600px;
  left: 127px;
}
@media screen and (max-width: 750px) {
  #fv .inner .kome {
    font-size: 2.4vw;
    top: 80vw;
    left: 16.9333333333vw;
  }
}
#fv .inner .text_area {
  color: #EA5505;
  text-align: center;
  position: absolute;
  top: 655px;
  left: 40px;
}
@media screen and (max-width: 750px) {
  #fv .inner .text_area {
    top: 87.3333333333vw;
    left: 5.3333333333vw;
  }
}
#fv .inner .text_area .top_text {
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 0.08em;
  margin-left: 15px;
  margin-bottom: 10px;
}
@media screen and (max-width: 750px) {
  #fv .inner .text_area .top_text {
    font-size: 3.4666666667vw;
    margin-left: 2vw;
    margin-bottom: 1.3333333333vw;
  }
}
#fv .inner .text_area .top_text span {
  font-size: 22px;
}
@media screen and (max-width: 750px) {
  #fv .inner .text_area .top_text span {
    font-size: 2.9333333333vw;
  }
}
#fv .inner .text_area .tit {
  font-size: 42px;
  font-weight: 700;
}
@media screen and (max-width: 750px) {
  #fv .inner .text_area .tit {
    font-size: 5.6vw;
  }
}
#fv .top_nav {
  display: flex;
  justify-content: center;
  padding: 27px 0;
}
@media screen and (max-width: 750px) {
  #fv .top_nav {
    padding: 3.6vw 0;
  }
}
#fv .top_nav li {
  border-left: 1px solid #fff;
}
#fv .top_nav li:last-child {
  border-right: 1px solid #fff;
}
#fv .top_nav li a {
  display: flex;
  align-items: center;
  color: #fff;
  line-height: 1.28;
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.06em;
  min-width: 198px;
  height: 145px;
  padding: 0 25px 40px 25px;
  box-sizing: border-box;
  position: relative;
}
@media screen and (max-width: 750px) {
  #fv .top_nav li a {
    min-width: 26.4vw;
    height: 19.3333333333vw;
    padding: 0 3.3333333333vw 5.3333333333vw 3.3333333333vw;
  }
}
#fv .top_nav li a::before {
  content: "";
  display: block;
  width: 26px;
  height: 28px;
  margin: 0 auto;
  background: url(../img/nav_arrow.png) no-repeat top left/100%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 15px;
}
@media screen and (max-width: 750px) {
  #fv .top_nav li a::before {
    width: 3.4666666667vw;
    height: 3.7333333333vw;
    bottom: 2vw;
  }
}

#novelty {
  background: url("../img/novelty_bg.jpg") no-repeat top center;
  height: 784px;
  padding-top: 100px;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  #novelty {
    background-size: 266.6666666667vw auto;
    height: 104.5333333333vw;
    padding-top: 13.3333333333vw;
  }
}
#novelty h2 {
  color: #0168B7;
  font-size: 55px;
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.02em;
  font-feature-settings: "palt";
  background: url(../img/novelty_tit_bg.png) no-repeat top left/100%;
}
@media screen and (max-width: 750px) {
  #novelty h2 {
    font-size: 7.3333333333vw;
  }
}
#novelty .top_text {
  color: #505050;
  line-height: 1.92;
  text-align: center;
  letter-spacing: 0.08em;
  margin: 25px 0 45px;
}
@media screen and (max-width: 750px) {
  #novelty .top_text {
    margin: 3.3333333333vw 0 6vw;
  }
}
#novelty .img {
  width: 650px;
  margin: 0 auto;
}
@media screen and (max-width: 750px) {
  #novelty .img {
    width: 86.6666666667vw;
  }
}
#novelty .kome {
  color: #898989;
  font-size: 18px;
  text-align: center;
  margin-top: 20px;
}
@media screen and (max-width: 750px) {
  #novelty .kome {
    font-size: 2.4vw;
    margin-top: 2.6666666667vw;
  }
}


/* ===================================================================================
  item
=================================================================================== */


#item {
  background: url("../img/item_bg.jpg") no-repeat top center, #FFE600;
  padding: 65px 0 180px;
}
@media screen and (max-width: 750px) {
  #item {
    background-size: 266.6666666667vw auto;
    padding: 8.6666666667vw 0 24vw;
  }
}
#item .inner .item_nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 23px;
  margin-bottom: 80px;
}
@media screen and (max-width: 750px) {
  #item .inner .item_nav {
    gap: 3.0666666667vw;
    margin-bottom: 10.6666666667vw;
  }
}
#item .inner .item_nav li a {
  display: block;
  color: #fff;
  line-height: 90px;
  text-align: center;
  letter-spacing: 0.06em;
  width: 313px;
  height: 92px;
  padding-right: 20px;
  background: url(../img/item_btn_bg.png) no-repeat top left/100%;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  #item .inner .item_nav li a {
    line-height: 12vw;
    width: 41.7333333333vw;
    height: 12.2666666667vw;
  }
}
#item .inner .item_box_area .item_box h3 {
  font-size: 32px;
  line-height: 1.31;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.1em;
  height: 218px;
  padding-top: 60px;
  margin-top: 70px;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box h3 {
    font-size: 4.2666666667vw;
    height: 29.0666666667vw;
    padding-top: 8vw;
    margin-top: 9.3333333333vw;
  }
}
#item .inner .item_box_area .item_box .item_list {
  width: 690px;
  margin: 30px auto 0;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list {
    width: 92vw;
    margin: 4vw auto 0;
  }
}
#item .inner .item_box_area .item_box .item_list li {
  padding-bottom: 10px;
}
#item .inner .item_box_area .item_box .item_list li a {
  display: block;
  width: 330px;
  height: 500px;
  padding-top: 10px;
  border-radius: 10px;
  background: #fff;
  box-sizing: border-box;
  filter: drop-shadow(5px 5px 5px rgba(112, 96, 28, 0.2));
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list li a {
    width: 44vw;
    height: 66.6666666667vw;
    padding-top: 1.3333333333vw;
    border-radius: 1.3333333333vw;
    filter: drop-shadow(0.6666666667vw 0.6666666667vw 0.6666666667vw rgba(112, 96, 28, 0.2));
  }
}
#item .inner .item_box_area .item_box .item_list li a .img {
  width: 264px;
  margin: 0 auto;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list li a .img {
    width: 35.2vw;
  }
}
#item .inner .item_box_area .item_box .item_list li a .name {
  color: #595757;
  font-size: 24px;
  line-height: 1.5;
  letter-spacing: 0.06em;
  width: 216px;
  height: 125px;
  margin: 0 auto;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list li a .name {
    font-size: 3.2vw;
    width: 28.8vw;
    height: 16.6666666667vw;
  }
}
#item .inner .item_box_area .item_box .item_list li a .price {
  color: #595757;
  font-size: 24px;
  text-align: center;
  letter-spacing: 0.06em;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list li a .price {
    font-size: 3.2vw;
  }
}
#item .inner .item_box_area .item_box .item_list li a .off {
  color: #EA5505;
  font-size: 40px;
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.06em;
  margin-top: 10px;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list li a .off {
    font-size: 5.3333333333vw;
    margin-top: 1.3333333333vw;
  }
}
#item .inner .item_box_area .item_box .item_list li a:hover {
  opacity: 0.9;
}
#item .inner .item_box_area .item_box .item_list .slide_arrow {
  width: 60px;
  height: 60px;
  transform: translateY(-50%);
  position: absolute;
  top: 50%;
  z-index: 99;
  cursor: pointer;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list .slide_arrow {
    width: 8vw;
    height: 8vw;
  }
}
#item .inner .item_box_area .item_box .item_list .slide_arrow:hover {
  opacity: 0.8;
}
#item .inner .item_box_area .item_box .item_list .slide_arrow.prev_arrow {
  left: -20px;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list .slide_arrow.prev_arrow {
    left: -2.6666666667vw;
  }
}
#item .inner .item_box_area .item_box .item_list .slide_arrow.next_arrow {
  right: -20px;
}
@media screen and (max-width: 750px) {
  #item .inner .item_box_area .item_box .item_list .slide_arrow.next_arrow {
    right: -2.6666666667vw;
  }
}
#item .inner .item_box_area .item_box:first-child h3 {
  margin-top: 0;
}
#item .inner .item_box_area .item_box:nth-child(odd) h3 {
  color: #0168B7;
  background: url(../img/item_tit_bg_b.png) no-repeat top left/100%;
}
#item .inner .item_box_area .item_box:nth-child(odd) .prev_arrow {
  background: url(../img/arrow_b_p.svg) no-repeat top left/100%;
}
#item .inner .item_box_area .item_box:nth-child(odd) .next_arrow {
  background: url(../img/arrow_b_n.svg) no-repeat top left/100%;
}
#item .inner .item_box_area .item_box:nth-child(even) h3 {
  color: #ED710E;
  background: url(../img/item_tit_bg_o.png) no-repeat top left/100%;
}
#item .inner .item_box_area .item_box:nth-child(even) .prev_arrow {
  background: url(../img/arrow_o_p.svg) no-repeat top left/100%;
}
#item .inner .item_box_area .item_box:nth-child(even) .next_arrow {
  background: url(../img/arrow_o_n.svg) no-repeat top left/100%;
}

/* ===================================================================================
  gankaここから
=================================================================================== */
#ganka{
  background-color: #ffe600;
  background: url("../img/ganka_bg.jpg") no-repeat top center;
  height: 1258px;

}



@media screen and (max-width: 750px) {
  #ganka {
   background-size: 266.6666666667vw auto;
    height: 167.73333333333335vw;

  }
}



#ganka > .inner h2 {
    padding-top: 91px;
  position: relative;
  color: #fff;
  font-size: 47px;
  line-height: 1.09;
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.06em;
}

@media screen and (max-width: 750px) {
  #ganka .inner h2 {
     padding-top: 9.1vw;
    font-size: 6vw;

  }
}


#ganka > div .text_area {
   padding-top: 100px;
   width: 557px;
   margin: 0 auto;

}

@media screen and (max-width: 750px) {
#ganka > div .text_area  {
   background-size: 266.6666666667vw auto;
   padding-top: 13.333333333333334vw;
   width: 74.26666666666667vw
 }
}

#ganka > div .text_area .text01 {
    font-size: 24px;
    color: #fff;
    line-height: 1.2;
    letter-spacing: 0.1em;
    font-feature-settings: "palt";
}

@media screen and (max-width: 750px) {
 #ganka > div .text_area .text01 {
    color: #fff;
    font-size: 3.5vw;

 }
}



/* ===================================================================================
  merit
=================================================================================== */



#merit {
  background: #E9F3F7;
}
#merit > div {
  box-sizing: border-box;
}
#merit > div h2 {
  color: #0168B7;
  font-size: 62px;
  line-height: 1.09;
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.06em;
}
@media screen and (max-width: 750px) {
  #merit > div h2 {
    font-size: 7vw;
  }
}
#merit > div .inner {
  padding-top: 335px;
  position: relative;
}
@media screen and (max-width: 750px) {
  #merit > div .inner {
    padding-top: 44.6666666667vw;
  }
}
#merit > div .inner .icon {
  width: 174px;
  position: absolute;
}
@media screen and (max-width: 750px) {
  #merit > div .inner .icon {
    width: 23.2vw;
  }
}
#merit > div .inner .text_area {
  color: #0168b7;
  width: 557px;
}
@media screen and (max-width: 750px) {
  #merit > div .inner .text_area {
    width: 74.2666666667vw;
  }
}
#merit > div .inner .text_area h3 {
  font-size: 44px;
  line-height: 1.31;
  font-weight: 700;
  letter-spacing: 0.06em;
  margin-bottom: 15px;
  color: #0168b7;
}
@media screen and (max-width: 750px) {
  #merit > div .inner .text_area h3 {
    font-size: 5.8666666667vw;
    margin-bottom: 2vw;
  }
}
#merit > div .inner .text_area .text {
  line-height: 1.92;
  letter-spacing: 0.08em;
  font-feature-settings: "palt";
}
#merit .merit01 {
  background: url("../img/merit_bg01.jpg") no-repeat top center;
  height: 1345px;
  padding-top: 160px;
}
@media screen and (max-width: 750px) {
  #merit .merit01 {
    background-size: 266.6666666667vw auto;
    height: 179.33333333333331vw;
    padding-top: 21.3333333333vw;
  }
}
#merit .merit01 .inner {
  padding-top: 488px;
  padding-left: 130px;
}
@media screen and (max-width: 750px) {
  #merit .merit01 .inner {
    padding-top: 65.06666666666666vw;
    padding-left: 17.3333333333vw;
  }
}
#merit .merit01 .inner .icon {
  top: 305px;
  right: 80px;
}
@media screen and (max-width: 750px) {
  #merit .merit01 .inner .icon {
    top: 40.6666666667vw;
    right: 10.6666666667vw;
  }
}
#merit .merit02 {
  background: url("../img/merit_bg02.jpg") no-repeat top center;
  height: 860px;
}
@media screen and (max-width: 750px) {
  #merit .merit02 {
    background-size: 266.6666666667vw auto;
    height: 114.66666666666667vw;
  }
}
#merit .merit02 .inner {
  padding-top: 345px;
  padding-left: 80px;
}
@media screen and (max-width: 750px) {
  #merit .merit02 .inner {
    padding-top: 46vw;
    padding-left: 10.6666666667vw;
  }
}
#merit .merit02 .inner .icon {
  top: 160px;
  left: 50px;
}
@media screen and (max-width: 750px) {
  #merit .merit02 .inner .icon {
    top: 21.3333333333vw;
    left: 6.6666666667vw;
  }
}
#merit .merit03 {
  background: url("../img/merit_bg03.jpg") no-repeat top center;
  height: 712px;
}
@media screen and (max-width: 750px) {
  #merit .merit03 {
    background-size: 266.6666666667vw auto;
    height: 94.93333333333334vw;
  }
}
#merit .merit03 .inner {
  padding-left: 130px;
}
@media screen and (max-width: 750px) {
  #merit .merit03 .inner {
    padding-left: 17.3333333333vw;
  }
}
#merit .merit03 .inner .icon {
  top: 213px;
  right: 80px;
}
@media screen and (max-width: 750px) {
  #merit .merit03 .inner .icon {
    top: 28.4vw;
    right: 10.6666666667vw;
  }
}
#merit .merit04 {
  background: url("../img/merit_bg04.jpg") no-repeat top center;
  height: 755px;
}
@media screen and (max-width: 750px) {
  #merit .merit04 {
    background-size: 266.6666666667vw auto;
    height: 100.66666666666666vw;
  }
}
#merit .merit04 .inner {
  padding-left: 80px;
}
@media screen and (max-width: 750px) {
  #merit .merit04 .inner {
    padding-left: 10.6666666667vw;
  }
}
#merit .merit04 .inner .icon {
  top: 160px;
  left: 50px;
}
@media screen and (max-width: 750px) {
  #merit .merit04 .inner .icon {
    top: 21.3333333333vw;
    left: 6.6666666667vw;
  }
}
#merit .merit05 {
  background: url("../img/merit_bg05.jpg") no-repeat top center;
  height: 937px;
}
@media screen and (max-width: 750px) {
  #merit .merit05 {
    background-size: 266.6666666667vw auto;
    height: 124.93333333333334vw;
  }
}
#merit .merit05 .inner {
  padding-left: 130px;
}
@media screen and (max-width: 750px) {
  #merit .merit05 .inner {
    padding-left: 17.3333333333vw;
  }
}
#merit .merit05 .inner .icon {
  top: 213px;
  right: 80px;
}
@media screen and (max-width: 750px) {
  #merit .merit05 .inner .icon {
    top: 28.4vw;
    right: 10.6666666667vw;
  }
}


/* ===================================================================================
  bnr
=================================================================================== */

#bnr_area {
  background: url("../img/dot_bg.jpg") repeat top left;
  padding: 75px 0 85px;
}
@media screen and (max-width: 750px) {
  #bnr_area {
    background-size: 2.9333333333vw 3.4666666667vw;
    padding: 10vw 0 11.3333333333vw;
  }
}
#bnr_area .bnr_btn a {
  display: block;
  width: 564px;
  margin: 0 auto;
  filter: drop-shadow(5px 5px 5px rgba(66, 66, 66, 0.4));
  position: relative;
}
@media screen and (max-width: 750px) {
  #bnr_area .bnr_btn a {
    width: 75.2vw;
    filter: drop-shadow(0.6666666667vw 0.6666666667vw 0.6666666667vw rgba(66, 66, 66, 0.4));
  }
}
#bnr_area .bnr_btn a .text01 {
  color: #fff;
  font-size: 32px;
  line-height: 48px;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.04em;
  padding-top: 37px;
}
@media screen and (max-width: 750px) {
  #bnr_area .bnr_btn a .text01 {
    font-size: 4.2666666667vw;
    line-height: 6.4vw;
    padding-top: 4.9333333333vw;
  }
}
#bnr_area .bnr_btn a .text01 span {
  color: #FFDE00;
  font-size: 38px;
}
@media screen and (max-width: 750px) {
  #bnr_area .bnr_btn a .text01 span {
    font-size: 5.0666666667vw;
  }
}
#bnr_area .bnr_btn a .text02 {
  font-size: 26px;
  text-align: center;
  font-weight: 500;
  letter-spacing: 0.04em;
  padding-right: 20px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
}
@media screen and (max-width: 750px) {
  #bnr_area .bnr_btn a .text02 {
    font-size: 3.4666666667vw;
    padding-right: 2.6666666667vw;
    bottom: 1.3333333333vw;
  }
}
#bnr_area .bnr_btn.more a {
  height: 197px;
  margin-bottom: 27px;
  background: url(../img/bnr_btn_more.png) no-repeat top left/100%;
}
@media screen and (max-width: 750px) {
  #bnr_area .bnr_btn.more a {
    height: 26.2666666667vw;
    margin-bottom: 3.6vw;
  }
}
#bnr_area .bnr_btn.more a .text02 {
  color: #1E96E0;
}
#bnr_area .bnr_btn.line a {
  height: 191px;
  background: url(../img/bnr_btn_line.png) no-repeat top left/100%;
}
@media screen and (max-width: 750px) {
  #bnr_area .bnr_btn.line a {
    height: 25.4666666667vw;
  }
}
#bnr_area .bnr_btn.line a .text02 {
  color: #22A83B;
}



/* ===================================================================================
 note
=================================================================================== */


#note .inner {
  padding: 100px 0 90px;
  border-radius: 20px;
  background: #0168B7;
}
@media screen and (max-width: 750px) {
  #note .inner {
    padding: 13.3333333333vw 0 12vw;
    border-radius: 2.6666666667vw;
  }
}
#note .inner h2 {
  color: #fff;
  font-size: 62px;
  letter-spacing: 0.06em;
  width: 384px;
  height: 136px;
  margin: 0 auto 60px;
  padding: 5px 0 0 100px;
  background: url(../img/note_tit_bg.png) no-repeat top left/100%;
  box-sizing: border-box;
}
@media screen and (max-width: 750px) {
  #note .inner h2 {
    font-size: 8.2666666667vw;
    width: 51.2vw;
    height: 18.1333333333vw;
    margin: 0 auto 8vw;
    padding: 0.6666666667vw 0 0 13.3333333333vw;
  }
}
#note .inner .note_list {
  width: 653px;
  margin: 0 auto;
}
@media screen and (max-width: 750px) {
  #note .inner .note_list {
    width: 87.0666666667vw;
  }
}
#note .inner .note_list li {
  display: flex;
  color: #fff;
  line-height: 1.92;
}

/* ===================================================================================
  map
=================================================================================== */

#map {
  text-align: center;
  hight: 712px;
   
}
@media screen and (max-width: 750px) {
  #map {
    hight: 94.93333333333334vw;
  }
}


/* ===================================================================================
 
=================================================================================== */



#introduction {
  background: url("../img/dot_bg.jpg") repeat top left;
  padding: 80px 0 65px;
}
@media screen and (max-width: 750px) {
  #introduction {
    background-size: 2.9333333333vw 3.4666666667vw;
    padding: 10.6666666667vw 0 8.6666666667vw;
  }
}
#introduction .bnr {
  width: 650px;
  margin: 0 auto;
}
@media screen and (max-width: 750px) {
  #introduction .bnr {
    width: 86.6666666667vw;
  }
}

.footer {
  margin-bottom: 200px;
}
@media screen and (max-width: 750px) {
  .footer {
    margin-bottom: 26.6666666667vw;
  }
}
.footer .foot_nav {
  display: flex;
  justify-content: center;
  margin: 55px 0 40px;
}
@media screen and (max-width: 750px) {
  .footer .foot_nav {
    margin: 7.3333333333vw 0 5.3333333333vw;
  }
}
.footer .foot_nav li {
  padding: 0 20px;
  position: relative;
}
@media screen and (max-width: 750px) {
  .footer .foot_nav li {
    padding: 0 2.6666666667vw;
  }
}
.footer .foot_nav li::before {
  content: "";
  display: block;
  width: 1px;
  height: 32px;
  background: #3E3A39;
  position: absolute;
  left: 0;
  top: 0;
}
@media screen and (max-width: 750px) {
  .footer .foot_nav li::before {
    height: 4.2666666667vw;
  }
}
.footer .foot_nav li:first-child::before {
  content: none;
}
.footer .foot_nav li a {
  color: #3E3A39;
  font-size: 26px;
  letter-spacing: 0.08em;
}
@media screen and (max-width: 750px) {
  .footer .foot_nav li a {
    font-size: 3.4666666667vw;
  }
}
.footer .copy {
  color: #3E3A39;
  font-size: 20px;
  text-align: center;
  letter-spacing: 0.08em;
  margin-bottom: 40px;
}
@media screen and (max-width: 750px) {
  .footer .copy {
    font-size: 2.6666666667vw;
    margin-bottom: 5.3333333333vw;
  }
}/*# sourceMappingURL=style.css.map */