@charset "UTF-8";
/*---------------------
import
---------------------*/
/* Media Query @include mediaquery(**){   } default sm
*/
/*------- reset  --------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

/* flexbox @include flexbox(); row wrap/nowrap flex-start/space-between
*/
/*------- animation ----------------*/
@keyframes fadein { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fadeout { 0% { opacity: 1; }
  100% { opacity: 0; } }
/*------- txt color ----------------*/
/*------- common ---------*/
body { font: 13px "Roboto","Noto Sans JP","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif; color: #000000; }

/*------- link color ----------------*/
a { text-decoration: none; color: #fd7e00; opacity: 1; }

/*------- bg color ----------------*/
/*------- v-align ----------------*/
.v-top { vertical-align: top; }

.v-middle { vertical-align: middle; }

.v-bottom { vertical-align: bottom; }

/*------- border style ----------------*/
.bo-none { border: none !important; }

.bo-t-none { border-top: none !important; }

.bo-r-none { border-right: none !important; }

.bo-b-none { border-bottom: none !important; }

.bo-l-none { border-left: none !important; }

/*------- float ----------------*/
.f-left { float: left !important; }

.f-right { float: right !important; }

.f-none { float: none !important; }

.clear { clear: both; }

/*------- position ----------------*/
.pos-relative { position: relative !important; }

.pos-absolute { position: absolute !important; }

.pos-inherit { position: inherit !important; }

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

.sp-hide { display: inherit; }

@media screen and (max-width: 599px) { .sp-show { display: inherit; }
  .sp-hide { display: none; } }
/* common */
img { max-width: 100%; vertical-align: bottom; }

.inner { width: 1000px; margin: 0 auto; position: relative; }
@media screen and (max-width: 576px) { .inner { width: 100%; } }

.container { padding-top: 81px; }

.contents { padding: 32px 0; width: 100%; }
.contents.bg-color { background: #F6F5F0; }
.contents-title { text-align: center; font-size: 28px; font-weight: bold; color: #fd7e00; margin-bottom: 24px; }
@media screen and (max-width: 576px) { .contents-title { font-size: 21px; margin-bottom: 16px; } }
.contents-titlebar { width: 100%; background: #696969; color: white; font-size: 21px; font-weight: bold; text-align: center; padding: 8px 0; margin-bottom: 24px; }

/* button */
.btn-type { display: block; width: 248px; background: white; border: 2px solid #fd7e00; font-size: 18px; font-weight: bold; color: #fd7e00; text-align: center; padding: 8px 0; box-sizing: border-box; transition: .4s; }
.btn-type:hover { background: #fd7e00; color: white; }

.btn-center { text-align: center; margin-top: 32px; }
.btn-center .btn-type { display: inline-block; }

/* header */
.header { width: 100%; background: white; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); position: fixed; z-index: 1000; }
.header-line { width: 100%; height: 6px; background: #696969; }
.header .inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; /* Safari */ -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; /* Safari */ -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; }
.header-logo { padding: 12px 0 8px; }
@media screen and (max-width: 576px) { .header-logo { padding: 8px 8px 0; }
  .header-logo img { width: 150px; height: 30px; } }
.header-body { text-align: right; padding: 8px 0 4px; }
@media screen and (max-width: 576px) { .header-body { width: 100%; box-sizing: border-box; text-align: center; padding: 0; } }
.header-link { font-size: 12px; }
.header-nav { margin-top: 16px; }
.header-nav ul { text-align: right; }
@media screen and (max-width: 576px) { .header-nav ul { text-align: center; } }
.header-nav ul li { display: inline-block; margin-left: 24px; }
@media screen and (max-width: 576px) { .header-nav ul li { margin-left: 12px; } }
.header-nav ul li a { color: #000; font-weight: bold; font-size: 16px; }
@media screen and (max-width: 576px) { .header-nav ul li a { font-size: 12px; } }
.header-nav ul li a span { opacity: .3; }

/* main-img */
.main-img { position: relative; width: 100%; padding: 40px 0; }
.main-img:before, .main-img:after { content: ""; width: 530px; height: 290px; position: absolute; background: url("../images/main_img_bg.png") 0 0 no-repeat; background-size: 100% auto; z-index: -1; }
@media screen and (max-width: 576px) { .main-img:before, .main-img:after { width: 100%; } }
.main-img:before { top: 0; right: 0; }
.main-img:after { bottom: 0; left: 0; transform: scale(-1); }
.main-img .inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; /* Safari */ -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; /* Safari */ -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.main-img__body { width: 50%; padding-left: 50px; box-sizing: border-box; }
@media screen and (max-width: 576px) { .main-img__body { width: 100%; padding-left: 16px; padding-right: 16px; } }
.main-img__title { font-size: 42px; font-weight: bold; color: #fd7e00; }
@media screen and (max-width: 576px) { .main-img__title { font-size: 28px; } }
.main-img__subtitle { font-size: 20px; font-weight: bold; }
@media screen and (max-width: 576px) { .main-img__subtitle { font-size: 16px; } }
.main-img__txt { font-size: 14px; margin-top: 24px; margin-bottom: 24px; }
@media screen and (max-width: 576px) { .main-img__txt { margin-top: 16px; margin-bottom: 16px; } }
.main-img__img { width: 48%; }
@media screen and (max-width: 576px) { .main-img__img { width: auto; margin-left: 16px; margin-right: 16px; }
  .main-img__img img { width: 100%; } }

/* overview */
.overview { width: 100%; position: relative; }
.overview:before { content: ""; width: 530px; height: 290px; position: absolute; top: 0; left: 0; background: url("../images/main_img_bg.png") 0 0 no-repeat; background-size: 100% auto; transform: scaleX(-1); }
@media screen and (max-width: 576px) { .overview:before { width: 100%; } }
.overview .inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; /* Safari */ -moz-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: flex-end; /* Safari */ -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; }
@media screen and (max-width: 576px) { .overview .inner { padding-left: 16px; padding-right: 16px; box-sizing: border-box; } }
.overview-box { width: 76.5%; background: #696969; color: white; padding: 32px; box-sizing: border-box; font-size: 16px; font-weight: 500; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
@media screen and (max-width: 576px) { .overview-box { width: 100%; padding: 16px; box-sizing: border-box; font-size: 12px; } }

/* sponsor */
.sponsor-list { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; /* Safari */ -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-around; /* Safari */ -moz-justify-content: space-around; -ms-justify-content: space-around; justify-content: space-around; }
@media screen and (max-width: 576px) { .sponsor-list { padding-left: 16px; padding-right: 16px; } }
.sponsor-list li { margin-bottom: 16px; }
@media screen and (max-width: 576px) { .sponsor-list li { width: 48%; } }

/* information */
.information { width: 88%; padding: 40px; box-sizing: border-box; margin: 0 auto; background: white; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
@media screen and (max-width: 576px) { .information { width: 90%; padding: 16px; } }

.dl-list {
    width: 100%; /* テーブルの横幅を500pxに指定 */
    border-top: 2px solid #ddd; /* テーブルの上の線 */
    border-left: 2px solid #ddd; /* テーブルの左の線 */
    display: flex; /* 子要素のdtとddを横並びにする */
    flex-wrap: wrap; /* 1つのdtとddで1行になるよう改行させる */
}
.dl-list dt,
.dl-list dd {
    border-bottom: 2px solid #ddd; /* 各セルの下の線。テーブルの下の線も補える。 */
    border-right: 2px solid #ddd; /* 各セルの右の線。テーブルの右の線も補える。 */
    box-sizing: border-box; /* widthの計算を楽にするため */
    padding: 15px 30px; /* 各セルに余白を取る */
}
.dl-list dt {
    font-size: 16px; /* フォントサイズを16pxに指定 */
    width: 25%; /* dt（見出し項目）の横幅を200pxに指定 */
}
.dl-list dd {
    font-size: 16px; /* フォントサイズを16pxに指定 */
    width: calc(100% - 25%); /* テーブル幅からdtを引いた分の横幅を指定。 */
}

/* time-schedule */
.time-schedule__block { background: #F6F5F0; padding: 16px 24px; box-sizing: border-box; width: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; /* Safari */ -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; /* Safari */ -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; margin-bottom: 16px; }
.time-schedule__date { font-size: 20px; font-weight: bold; text-align: center; margin-bottom: 8px; width: 100%; }
@media screen and (max-width: 576px) { .time-schedule__date { font-size: 16px; } }
.time-schedule__item { background: white; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); width: 24%; padding: 16px; box-sizing: border-box; display: block; color: #000; }
@media screen and (max-width: 576px) { .time-schedule__item { width: 100%; margin-bottom: 8px; } }
.time-schedule__item.wide-item { width: 100%; margin-top: 16px; }
.time-schedule__item--room { font-size: 16px; margin-bottom: 4px; }
@media screen and (max-width: 576px) { .time-schedule__item--room { font-size: 13px; } }
.time-schedule__item--title { font-size: 18px; font-weight: bold; color: #696969; line-height: 1.3; }
@media screen and (max-width: 576px) { .time-schedule__item--title { font-size: 16px; } }
.time-schedule__item--txt { margin-top: 4px; font-size: 16px; }
@media screen and (max-width: 576px) { .time-schedule__item--txt { font-size: 13px; } }

.label { background: #fd7e00; color: white; font-size: 14px; padding: 2px 4px; }

/* time-schedule-pickup */
.time-schedule-pickup__block { background: #F6F5F0; padding: 16px 24px; box-sizing: border-box; width: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; /* Safari */ -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; /* Safari */ -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; margin-bottom: 16px; }
.time-schedule-pickup__date { font-size: 20px; font-weight: bold; text-align: center; margin-bottom: 8px; width: 100%; }
@media screen and (max-width: 576px) { .time-schedule-pickup__date { font-size: 16px; } }
.time-schedule-pickup__item { background: white; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); width: 24%; padding: 16px; box-sizing: border-box; display: block; color: #000; border: solid;
    border-color: #fd7e00; border-width: 6px; }
@media screen and (max-width: 576px) { .time-schedule-pickup__item { width: 100%; margin-bottom: 8px; } }
.time-schedule-pickup__item.wide-item { width: 100%; margin-top: 16px; }
.time-schedule-pickup__item--room { font-size: 16px; margin-bottom: 4px; }
@media screen and (max-width: 576px) { .time-schedule-pickup__item--room { font-size: 13px; } }
.time-schedule-pickup__item--title { font-size: 18px; font-weight: bold; color: #fd7e00; line-height: 1.3; }
@media screen and (max-width: 576px) { .time-schedule-pickup__item--title { font-size: 16px; } }
.time-schedule-pickup__item--txt { margin-top: 4px; font-size: 16px; }
@media screen and (max-width: 576px) { .time-schedule-pickup__item--txt { font-size: 13px; } }

.label { background: #fd7e00; color: white; font-size: 14px; padding: 2px 4px; }


/* detail */
.detail-head { border-bottom: 2px solid #F6F5F0; padding-bottom: 16px; margin-bottom: 16px; }
.detail-room { font-size: 16px; font-weight: bold; margin-bottom: 8px; }
.detail-tag { margin-bottom: 8px; }
.detail-tag span { margin-right: 4px; }
.detail-title { font-size: 21px; font-weight: bold; color: #fd7e00; margin-bottom: 8px; }
.detail-copy { font-size: 16px; margin-bottom: 8px; }
.detail-name { font-size: 16px; }
.detail-body { border-bottom: 2px solid #F6F5F0; padding-bottom: 16px; margin-bottom: 16px; }
.detail-txt { font-size: 14px; }
.detail-btn { text-align: center; }
.detail-btn .btn-type { display: inline-block; }

/* form */
.form-control { font-size: 16px; border-radius: 8px; width: 100%; padding: 8px; border: 1px solid #ccc; box-sizing: border-box; }

.form-caution { background: #F6F5F0; font-size: 14px; width: 90%; margin: 16px auto; padding: 8px; box-sizing: border-box; text-align: center; }

/* footer */
.footer { padding: 8px 0; width: 100%; background: #696969; }
.footer-copyright { text-align: center; color: white; font-size: 12px; }

/* modal */
.modal { position: fixed; width: 100%; height: 100vh; top: 0; left: 0; display: none; z-index: 10000; }
.modal-window { position: absolute; z-index: 11; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; width: 800px; padding: 40px; box-sizing: border-box; }
@media screen and (max-width: 576px) { .modal-window { width: 90%; height: 80vh; overflow: auto; padding: 16px; } }

.overLay { position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.85); width: 100%; height: 100vh; z-index: 10; }

@keyframes modal { 0% { top: -100%; }
  100% { top: 50%; } }
@keyframes modalClose { 0% { top: 50%; }
  100% { top: 100%; } }

/*# sourceMappingURL=style.css.map */