@charset "UTF-8";
/* =======================================

	Browser Reset CSS
	Last Up Date 09/09/28

========================================== */
@font-face {
  font-family: YuGothicM;
  src: local("Yu Gothic Medium");
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, p, blockquote {
  margin: 0;
  padding: 0;
  vertical-align: bottom;
}

body {
  background: #FFF;
  color: #000;
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  font-size: 16px;
}

* html body {
  font-size: small;
}

*:first-child + html body {
  font-size: small;
}

img {
  border: 0;
  vertical-align: bottom;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

ul, dl, ol {
  text-indent: 0;
}

ul li {
  list-style: none;
}

address, caption, cite, code, dfn, em, var {
  font-style: normal;
  font-weight: normal;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

* html input, * html textarea, * html select {
  font-size: 100%;
}

*:first-child + html + input, *:first-child html + textarea, *:first-child + html select {
  font-size: 100%;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: inherit;
}

th, td {
  text-align: left;
  vertical-align: top;
}

caption {
  text-align: left;
}

pre, code, kbd, samp, tt {
  font-family: monospace;
}

* html pre, * html code, * html kbd, * html samp, * html tt {
  font-size: 100%;
  line-height: 100%;
}

*:first-child + html pre, *:first-child html + code, *:first-child html + kbd, *:first-child + html + samp, *:first-child + html tt {
  font-size: 108%;
  line-height: 100%;
}

input, select, textarea {
  font-size: 100%;
  font-family: Verdana, Helvetica, sans-serif;
}

/* =====================
  common
===================== */
body {
  font-size: 16px;
}
@media only screen and (max-width:768px) {
  body {
    font-size: 13px;
  }
}

/*  sp-display
------------------------*/
.spDb {
  display: none;
}

@media only screen and (max-width:768px) {
  .spDb {
    display: block;
  }
  .spDn {
    display: none;
  }
}
/*  
------------------------*/
a {
  transition: 0.7s;
}
a:hover {
  opacity: 0.6;
}

/*  pagetop
------------------------*/
#pagetop {
  position: fixed;
  right: 20px;
  bottom: 40px;
  cursor: pointer;
  z-index: 100;
}

/* =====================
  header
===================== */
header {
  background-image: url(../img/bg_main_01.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  padding: 30px 0;
}
@media only screen and (max-width:768px) {
  header {
    background-image: url(../img/bg_main_01_sp.jpg);
    padding: 10px 10px;
  }
}
header .sec-head {
  width: 1000px;
  margin: 0 auto;
}
@media only screen and (max-width:768px) {
  header .sec-head {
    width: 100%;
  }
}
header .sec-head .box-head {
  width: 594px;
  background-color: rgba(255, 255, 255, 0.5);
  padding: 20px 30px;
  text-align: center;
}
@media only screen and (max-width:768px) {
  header .sec-head .box-head {
    width: 100%;
    box-sizing: border-box;
  }
}
header .sec-head .box-head .area-logo {
  margin: 0 0 15px;
}
header .sec-head .box-head .area-logo img {
  max-width: 100%;
}
@media only screen and (max-width:768px) {
  header .sec-head .box-head .area-logo {
    margin: 0 0 10px;
  }
  header .sec-head .box-head .area-logo img {
    max-width: 60%;
  }
}
header .sec-head .box-head h1 {
  margin: 0 0 20px;
}
header .sec-head .box-head h1 img {
  max-width: 100%;
}
@media only screen and (max-width:768px) {
  header .sec-head .box-head h1 {
    margin: 0 0 20px;
  }
}
header .sec-head .box-head .period {
  margin: 0 0 15px;
}
header .sec-head .box-head .period img {
  max-width: 100%;
}
@media only screen and (max-width:768px) {
  header .sec-head .box-head .period {
    margin: 0 0 10px;
  }
}
header .sec-head .box-head .area-btm img {
  max-width: 100%;
}
header .sec-head .box-head .comments {
  text-align: left;
}

/* =====================
  area-deadline
===================== */
.area-deadline {
  background: linear-gradient(to bottom, #fcf8db, #d4c5a0);
  text-align: center;
  padding: 40px 0;
}
@media only screen and (max-width:768px) {
  .area-deadline {
    padding: 20px 10px;
  }
}
.area-deadline .area-txt {
  font-size: 26px;
}
@media only screen and (max-width:768px) {
  .area-deadline .area-txt {
    font-size: 20px;
  }
}
.area-deadline .area-time {
  font-size: 44px;
  font-weight: bold;
}
@media only screen and (max-width:768px) {
  .area-deadline .area-time {
    font-size: 28px;
  }
}

/* =====================
  recommend
===================== */
.recommend {
  text-align: center;
  background-image: url(../img/bg_recommend_01.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  box-sizing: border-box;
}
@media only screen and (max-width:768px) {
  .recommend {
    padding-bottom: 30px;
  }
  .recommend h2 img {
    width: 100%;
  }
}
.recommend .area-rec {
  background-image: url(../img/bg_recommend_02.png);
  background-repeat: no-repeat;
  width: 1000px;
  margin: 0 auto;
  padding: 170px 0 160px;
  box-sizing: border-box;
}
.recommend .area-rec img {
  max-width: 100%;
}
.recommend .area-rec h2 {
  margin: 0 0 50px;
}

/* =====================
  point
===================== */
.point {
  box-sizing: border-box;
  padding: 50px 0 0;
}
@media only screen and (max-width:768px) {
  .point .area-com {
    padding: 0 10px;
  }
}
.point .area-com h2 {
  text-align: center;
}
.point .area-com h2 img {
  max-width: 100%;
}
.point .area-com .sec-com {
  width: 1000px;
  margin: 0 auto;
  padding: 50px 0;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com {
    padding: 30px 0;
    width: 100%;
  }
}
.point .area-com .sec-com .reverse {
  flex-flow: row-reverse;
}
.point .area-com .sec-com .area-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com .area-flex {
    display: block;
  }
}
.point .area-com .sec-com .area-flex .box-details {
  width: 47%;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com .area-flex .box-details {
    width: 100%;
  }
}
.point .area-com .sec-com .area-flex .box-details h3 {
  margin: 0 0 30px;
  text-align: center;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com .area-flex .box-details h3 {
    margin: 0 0 15px;
  }
}
.point .area-com .sec-com .area-flex .box-details h3 img {
  max-width: 100%;
}
.point .area-com .sec-com .area-flex .box-details p {
  line-height: 1.9em;
  color: #666;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com .area-flex .box-details p {
    margin: 0 0 20px 0;
  }
}
.point .area-com .sec-com .area-flex .box-img {
  width: 50%;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com .area-flex .box-img {
    width: 100%;
  }
}
.point .area-com .sec-com .area-flex .box-img img {
  width: 100%;
}
.point .area-com .sec-com .area-group {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 30px 0 0;
}
.point .area-com .sec-com .area-group .sec-group {
  width: 19%;
  position: relative;
}
.point .area-com .sec-com .area-group .sec-group img {
  width: 100%;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com .area-group .sec-group {
    width: 48%;
    margin: 0 0 30px;
  }
}
.point .area-com .sec-com .area-group .sec-group .box-img {
  margin: 0 0 10px;
}
@media only screen and (max-width:768px) {
  .point .area-com .sec-com .area-group .sec-group .box-img {
    margin: 0 0 10px;
  }
}
.point .area-com .sec-com .area-group .sec-group a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-indent: -999px;
}
.point .area-com .sec-com .area-group .sec-group a:hover {
  opacity: 0.6;
  background-color: #fff;
}

/* =====================
  area-iottery
===================== */
.area-iottery {
  background-image: url(../img/bg_iottery_01.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
  padding: 50px 0;
  box-sizing: border-box;
  border-top: solid 1px #c1ac75;
  border-bottom: solid 1px #c1ac75;
}
.area-iottery img {
  max-width: 100%;
}
@media only screen and (max-width:768px) {
  .area-iottery {
    padding: 30px 10px;
  }
}
.area-iottery .period {
  margin: 0 0 20px;
}
.area-iottery .area-btm {
  margin: 0 0 30px;
}

/* =====================
  area-gallery
===================== */
.area-gallery {
  background-image: url(../img/bg_gallery_01.jpg);
  padding: 50px 0;
  text-align: center;
  box-sizing: border-box;
}
@media only screen and (max-width:768px) {
  .area-gallery {
    padding: 30px 10px;
  }
}
.area-gallery h2 img {
  max-width: 100%;
}
.area-gallery .txt {
  color: #7a532d;
  margin: 20px 0 40px;
}
@media only screen and (max-width:768px) {
  .area-gallery .txt {
    margin: 20px 0 20px;
  }
}
.area-gallery .gallery {
  width: 1000px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media only screen and (max-width:768px) {
  .area-gallery .gallery {
    width: 100%;
  }
}
.area-gallery .gallery .img-box {
  margin: 0 0 7px;
}
@media only screen and (max-width:768px) {
  .area-gallery .gallery .img-box {
    width: 32%;
  }
}
.area-gallery .gallery .img-box a {
  display: block;
  overflow: hidden;
  border: 3px solid #fff;
}
.area-gallery .gallery .img-box a img {
  margin: -3px;
}
@media only screen and (max-width:768px) {
  .area-gallery .gallery .img-box a img {
    width: 100%;
  }
}

/* =====================
  area-plan
===================== */
.area-plan {
  background-color: #f9f9f9;
  text-align: center;
  box-sizing: border-box;
}
@media only screen and (max-width:768px) {
  .area-plan {
    padding: 10px;
  }
}
.area-plan h2 {
  margin: 0 0 40px 0;
  text-align: center;
}
@media only screen and (max-width:768px) {
  .area-plan h2 {
    margin: 0 0 30px 0;
  }
  .area-plan h2 img {
    max-width: 100%;
  }
}
.area-plan .txt {
  color: #666;
  margin: 20px 0 40px;
}
@media only screen and (max-width:768px) {
  .area-plan .txt {
    margin: 20px 0 20px;
  }
}
.area-plan .sec-plan {
  width: 1000px;
  margin: 0 auto;
  background-color: #fff;
  padding: 40px 100px;
  box-sizing: border-box;
}
@media only screen and (max-width:768px) {
  .area-plan .sec-plan {
    width: 100%;
    padding: 15px 15px 0;
  }
}
.area-plan .sec-plan h3 {
  background-color: #e9e9e9;
  color: #4f4f4f;
  font-size: 18px;
  font-weight: bold;
  padding: 10px;
}
.area-plan .sec-plan .box-plan {
  text-align: left;
}
@media only screen and (max-width:768px) {
  .area-plan .sec-plan .box-plan {
    padding: 10px;
  }
}
.area-plan .sec-plan .box-plan .txt-02 {
  text-align: center;
  margin-bottom: 40px;
}
@media only screen and (max-width:768px) {
  .area-plan .sec-plan .box-plan .txt-02 {
    margin-bottom: 3px;
  }
}
.area-plan .sec-plan .box-plan img {
  max-width: 100%;
}
.area-plan .sec-plan .box-plan ul {
  color: #666;
}
.area-plan .sec-plan .box-plan ul li {
  list-style: disc;
  margin: 5px 0 0 20px;
}
.area-plan .sec-plan .tbl-01 th {
  background-color: #e9e9e9;
  width: 30%;
  text-align: center;
  padding: 10px;
  vertical-align: middle;
  border: solid 1px #ccc;
}
.area-plan .sec-plan .tbl-01 td {
  width: 70%;
  padding: 10px;
  vertical-align: middle;
  border: solid 1px #ccc;
}

/* =====================
  area-contact
===================== */
.area-contact {
  background-image: url(../img/bg_contact_01.jpg);
  padding: 50px 0;
  color: #666;
  box-sizing: border-box;
}
@media only screen and (max-width:768px) {
  .area-contact {
    padding: 30px 10px;
  }
}
.area-contact h2 {
  text-align: center;
  margin: 0 0 50px;
}
.area-contact h2 img {
  max-width: 100%;
}
.area-contact .sec-contact {
  width: 800px;
  margin: 0 auto;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact {
    width: 100%;
  }
}
.area-contact .sec-contact dl {
  display: flex;
  justify-content: center;
  margin: 20px 0;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact dl {
    display: block;
  }
}
.area-contact .sec-contact dl dt {
  width: 30%;
  margin: 5px 20px 0 0;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact dl dt {
    width: 100%;
    margin: 0 0 10px;
  }
}
.area-contact .sec-contact dl dt span {
  color: #fff;
  background-color: #c1ac75;
  border-radius: 5px;
  font-size: 12px;
  padding: 3px 5px;
  margin: 0 0 0 1em;
}
.area-contact .sec-contact dl dd {
  width: 70%;
  align-items: center;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact dl dd {
    width: 100%;
  }
}
.area-contact .sec-contact dl dd .txt-box {
  width: 100%;
  border-radius: 5px;
  border: solid 1px #d8d8d8;
  padding: 5px 10px;
  box-sizing: border-box;
  font-size: 18px;
}
.area-contact .sec-contact dl dd select {
  border-radius: 5px;
  border: solid 1px #d8d8d8;
  padding: 4px 10px;
  box-sizing: border-box;
  font-size: 18px;
  background-color: #fff;
}
.area-contact .sec-contact dl dd .comment {
  font-size: 14px;
  margin-top: 5px;
  display: block;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact dl dd .comment {
    font-size: 12px;
  }
}
.area-contact .sec-contact dl dd .display_input {
  font-size: 14px;
  margin-top: 5px;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact dl dd .display_input {
    font-size: 12px;
  }
}
.area-contact .sec-contact dl dd .check li {
  padding: 5px 0;
}
.area-contact .sec-contact dl dd .radio02-input {
  display: none;
}
.area-contact .sec-contact dl dd .radio02-input + label {
  padding-left: 20px;
  position: relative;
  margin-right: 20px;
}
.area-contact .sec-contact dl dd .radio02-input + label::before {
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  left: 0;
  width: 12px;
  height: 12px;
  border: 1px solid #d8d8d8;
  border-radius: 50%;
  background-color: #fff;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact dl dd .radio02-input + label::before {
    top: 1px;
  }
}
.area-contact .sec-contact dl dd .radio02-input:checked + label::after {
  content: "";
  display: block;
  position: absolute;
  top: 6px;
  left: 3px;
  width: 8px;
  height: 8px;
  background: #ff9898;
  border-radius: 50%;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact dl dd .radio02-input:checked + label::after {
    top: 4px;
  }
}
.area-contact .sec-contact .area-privacy {
  box-sizing: border-box;
  background-color: #fff;
  border: solid 1px #d8d8d8;
  padding: 20px;
  overflow-y: scroll;
  height: 300px;
  margin: 0 0 1.5em;
}
.area-contact .sec-contact .area-privacy h4 {
  font-size: 20px;
  font-weight: bold;
  color: #c1ac75;
  text-align: center;
  margin: 0 0 20px;
}
.area-contact .sec-contact .area-privacy p {
  font-size: 14px;
  margin: 0 0 1.5em;
}
.area-contact .sec-contact .area-privacy h5 {
  font-weight: bold;
  color: #c1ac75;
}
.area-contact .sec-contact .area-privacy .tbl {
  box-sizing: border-box;
  font-size: 14px;
  width: 100%;
  margin: 0 0 1.5em;
}
.area-contact .sec-contact .area-privacy .tbl th {
  border: solid 1px #d8d8d8;
  font-weight: normal;
  background-color: #f9f4e5;
  padding: 10px;
}
.area-contact .sec-contact .area-privacy .tbl td {
  border: solid 1px #d8d8d8;
  padding: 10px;
}
.area-contact .sec-contact .area-privacy ol {
  margin: 0 0 1.5em 20px;
  font-size: 14px;
}
.area-contact .sec-contact .caution {
  font-size: 14px;
  margin: 0 0 1.5em;
}
.area-contact .sec-contact .area-btm {
  text-align: center;
}
.area-contact .sec-contact .area-btm .checkbox01-input {
  display: none;
}
.area-contact .sec-contact .area-btm .checkbox01-parts {
  padding-left: 20px;
  position: relative;
  margin-right: 20px;
  font-size: 14px;
}
.area-contact .sec-contact .area-btm .checkbox01-parts::before {
  content: "";
  display: block;
  position: absolute;
  top: 1px;
  left: 0;
  width: 13px;
  height: 13px;
  border: 1px solid #d8d8d8;
  border-radius: 4px;
  background-color: #fff;
}
.area-contact .sec-contact .area-btm .checkbox01-input:checked + .checkbox01-parts::after {
  content: "";
  display: block;
  position: absolute;
  top: -3px;
  left: 3px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #ff9898;
  border-right: 3px solid #ff9898;
}
.area-contact .sec-contact .area-btm .submit_btn {
  background: linear-gradient(to bottom, #f7eeb6, #ab9063);
  border: none;
  color: #fff;
  width: 40%;
  font-weight: bold;
  padding: 20px 0;
  border-radius: 5px;
  margin: 10px 0 0;
  transition: 0.7s;
  font-size: 20px;
  font-weight: bold;
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  -webkit-appearance: none;
}
.area-contact .sec-contact .area-btm .submit_btn:hover {
  opacity: 0.7;
}
@media only screen and (max-width:768px) {
  .area-contact .sec-contact .area-btm .submit_btn {
    width: 100%;
  }
}
.area-contact .thanks {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}
.area-contact .thanks span {
  font-size: 20px;
  font-weight: bold;
}

/* =====================
  footer
===================== */
footer .area-logo {
  padding: 50px 0;
  width: 1000px;
  margin: 0 auto;
  text-align: center;
  box-sizing: border-box;
}
@media only screen and (max-width:768px) {
  footer .area-logo {
    width: 100%;
    padding: 30px 10px;
  }
}
footer .area-logo .logo img {
  max-width: 100%;
}
footer .area-logo .flex-logo {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 30px 0 0;
}
footer .area-logo .flex-logo .box-logo {
  width: 20%;
}
@media only screen and (max-width:768px) {
  footer .area-logo .flex-logo .box-logo {
    width: 48%;
  }
  footer .area-logo .flex-logo .box-logo img {
    max-width: 100%;
  }
}
footer .area-copy {
  color: #bbb;
  background-color: #423d37;
  text-align: center;
  padding: 15px 0;
}

.txt-end {
  margin: 0 0 -50px 0;
  background-image: url(../img/bg_end_01.jpg);
  padding: 10px 0;
}
.txt-end img {
  max-width: 100%;
}
@media only screen and (max-width:768px) {
  .txt-end {
    margin: 0 -10px -30px;
    padding: 10px;
  }
}

.end {
  text-align: center;
  background-image: url(../img/bg_end_01.jpg);
  padding: 20px;
}
@media only screen and (max-width:768px) {
  .end {
    padding: 10px;
  }
}
.end img {
  max-width: 100%;
}