@charset "UTF-8";

/* reset
===============================================================*/
abbr,
address,
article,
aside,
audio,
b,
blockquote,
body,
canvas,
caption,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
p,
pre,
q,
samp,
section,
small,
span,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
ul,
var,
video {
  margin        : 0;
  padding       : 0;
  border        : 0;
  outline       : 0;
  font-size     : 100%;
  vertical-align: baseline;
  background    : transparent
}

* {
  box-sizing: border-box
}

html {
  overflow-x                : hidden;
  -webkit-overflow-scrolling: touch;
}

body {
  line-height               : 1;
  overflow-x                : hidden;
  -webkit-overflow-scrolling: touch;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block
}

img {
  display  : block;
  width    : 100%;
  max-width: 100%;
}

ul,
ol {
  list-style: none;
}

a {
  margin        : 0;
  padding       : 0;
  font-size     : 100%;
  vertical-align: baseline;
  background    : transparent
}

#wrapper {
  width      : 100%;
  max-width  : 100%;
  font-family: 'Noto Sans Japanese', sans-serif;
  font-size  : 16px;
}

a {
  text-decoration: none;
}

.button a:hover {
  opacity: 0.7;
}

.sp_none {
  display: block;
}

.pc_none,
.slider_box02 {
  display: none;
}

.contents_bg {
  width: 100%;
}

#contents_mv {
  width   : 100%;
  margin  : 0 auto;
  position: relative;
}

.mv_button {
  position: absolute;
  width   : 12.5%;
  height  : 22.5%;
  bottom  : 0;
  right   : 6%;
}

.float-button__wrap {
  display : none;
  position: fixed;
  z-index : 9999;
  bottom  : 20px;
  right   : 20px;
}

.float-button__wrap img {
  max-width: 100%;
  height   : auto;
}

#contents_link {
  position: relative;
}

.button03,
.button04 {
  position : absolute;
  width    : 29%;
  height   : 5.5%;
  left     : 50%;
  transform: translateX(-50%);
}

.button03 {
  top: 11.7%;
}

.button04 {
  top: 53.5%;
}

.kiyaku {
  background-color: #804c2e;
  padding         : 2% 7%;
}

.kiyakuBox {
  background-color: #fff;
  border-radius   : 10px;
  height          : 500px;
  overflow        : hidden;
  margin          : 0 auto;
  padding         : 40px 30px;
  text-align      : left;
  line-height     : 1.5;
}

.kiyakuBoxInner {
  width     : 100%;
  height    : 100%;
  overflow  : scroll;
  overflow-x: hidden;
}

.kiyakuBox h5 {
  padding-top: 20px;
  font-weight: normal;
}

.kiyakuBox ul li,
.kiyakuBox ol li {
  padding-left: 1em;
  text-indent : -1em;
}

.kiyakuBox a {
  color          : #000;
  text-decoration: underline;
}

@media screen and (max-width: 768px) {
  .pc_none {
    display  : block;
    max-width: 100%;
  }

  .sp_none {
    display: none;
  }

  .mv_button {
    width : 19%;
    height: 15%;
    right : 2%;
  }

  .float-button__wrap {
    width : 19%;
    right : 10px;
    bottom: 10px;
  }

  .button03,
  .button04 {
    width    : 54%;
    height   : 3%;
  }

  .button03 {
    top: 7.5%;
  }

  .button04 {
    top: 49.1%;
  }

  .kiyaku {
    padding: 1.3% 3%;
  }

  .kiyakuBox {
    border-radius: 5px;
    height       : 250px;
    padding      : 15px;
    font-size    : 12px;
  }
}