@charset "UTF-8";
/* ==================================================================================================== ヘッダー
==================================================================================================== */
.header { position: relative; }
.header .header-in { position: absolute; width: 100%; justify-content: flex-end; }

/* ==================================================================================================== SPメニュー
==================================================================================================== */
.nav-menu { background: #fff url("../img/common/nav_bg002.png") no-repeat left top; background-size: cover; }
@media screen and (max-width: 750px) { .nav-menu { background: #fff url("../img/common/sp/spnav_bg001.png") no-repeat center top; background-size: contain; } }
.nav-menu .nav-menu-content-box { background-color: #fff; border-radius: 10px; }
@media screen and (max-width: 750px) { .nav-menu .nav-menu-content-box { background: none; } }

/* ==================================================================================================== フッター
==================================================================================================== */
.footer { background-color: #cde7fa; }
.footer .footer-logo { top: 300px; }
@media screen and (max-width: 750px) { .footer .footer-logo { top: 800px; } }
@media screen and (max-width: 500px) { .footer .footer-logo { top: 650px; } }

/* ==================================================================================================== Gナビ
==================================================================================================== */
.gnav { margin-top: -150px; margin-bottom: 0; padding-top: 178px; padding-bottom: 30px; background: url("../img/home/top_bg001.png") no-repeat left bottom; background-size: contain; }
@media screen and (max-width: 1130px) { .gnav { padding-bottom: 0; } }
@media screen and (max-width: 960px) { .gnav { display: block; } }
@media screen and (max-width: 750px) { .gnav { display: none; } }
.gnav .gnav-in { max-width: 1040px; margin: 0 auto; padding: 0 20px; border-bottom: none; }
@media screen and (max-width: 1130px) { .gnav .gnav-in { max-width: 1040px; } }
.gnav .gnav-box { display: flex; align-items: center; justify-content: space-between; }
.gnav dl { display: flex; align-items: center; max-width: 800px; margin-bottom: 10px; }
.gnav dl:last-child { align-items: flex-start; }
.gnav dl:last-child dd { padding-top: 5px; }
.gnav dl dt { width: 7em; margin-right: 2em; font-size: 0.8888888889rem; }
.gnav dl dd { flex: 1; }
.gnav dl dd ul li { font-size: 0.8888888889rem; }
.gnav dl dd ul li a { padding-right: 15px; background: url("../img/common/ico_arrow.svg") no-repeat right top 0.5em; background-size: 5px auto; }
.gnav dl dd ul li a.ico_link { padding-right: 20px; background: url("../img/common/ico_link.svg") no-repeat right top 0.4em; background-size: 11px auto; }
.gnav dl dd ul li.gnav-link { width: 100%; margin-right: 0; margin-top: 1em; font-size: 1rem; }
@media screen and (max-width: 960px) { .gnav dl dd ul li.gnav-link { margin-top: 0.2em; } }

/* ==================================================================================================== コンテンツ
==================================================================================================== */
.top-sec { position: relative; display: flex; align-items: flex-end; justify-content: space-between; }
@media screen and (max-width: 750px) { .top-sec { margin-bottom: 40%; } }
.top-sec .top-img { width: 100%; padding-left: 80px; }
@media screen and (max-width: 750px) { .top-sec .top-img { padding-left: 0; } }
.top-sec .top-movie { position: absolute; bottom: 70px; right: 50px; }
@media screen and (max-width: 1130px) { .top-sec .top-movie { right: 40px; bottom: 40px; } }
@media screen and (max-width: 960px) { .top-sec .top-movie { bottom: 20px; } }
@media screen and (max-width: 750px) { .top-sec .top-movie { width: 100%; right: 0; bottom: -20%; } }
.top-sec .top-movie .movie-iframe { position: relative; width: 400px; }
@media screen and (max-width: 960px) { .top-sec .top-movie .movie-iframe { width: 250px; } }
@media screen and (max-width: 750px) { .top-sec .top-movie .movie-iframe { width: 92%; margin: 0 auto; } }
.top-sec .top-movie .movie-iframe a { position: relative; display: block; }
.top-sec .top-movie .movie-iframe a::before { content: ''; position: absolute; top: 50%; left: 50%; z-index: 100; width: 62px; height: 44px; background: url("../img/common/ic_play.png") center center no-repeat; background-size: contain; transform: translate(-50%, -50%); }
.top-sec .top-movie .movie-iframe iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.bg01 { background: url("../img/home/home_bg001.png") no-repeat left top 150px; }
@media screen and (max-width: 750px) { .bg01 { background: url("../img/home/sp/home_bg001.png") no-repeat left top 180px; background-size: contain; } }

.bg02 { background: url("../img/home/home_bg002.png") no-repeat right top 1050px; background-size: contain; }
@media screen and (max-width: 750px) { .bg02 { background: url("../img/home/sp/home_bg002.png") no-repeat left bottom -80px; } }

.home-heading { margin-left: 100px; margin-bottom: 40px; font-size: 1.7777777778rem; font-weight: 500; }
@media screen and (max-width: 1130px) { .home-heading { margin-left: 0; } }
@media screen and (max-width: 750px) { .home-heading { margin-left: 0; margin-bottom: 5.7971014493%; font-size: 1.5555555556rem; text-align: center; } }

.home-subheading { margin-left: 100px; margin-bottom: 70px; }
@media screen and (max-width: 750px) { .home-subheading { width: 88.1355932203%; margin: 0 auto 27.5362318841%; } }

@media screen and (max-width: 750px) { .home-link { width: 92%; margin: 0 auto 20.2898550725%; box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.3); } }

.story-sec { margin-bottom: 220px; padding-top: 80px; background: url("../img/home/home_bg004.png") no-repeat right 135px top 130px; }
@media screen and (max-width: 1130px) { .story-sec { background-position: right 40px top 55px; } }
@media screen and (max-width: 750px) { .story-sec { position: relative; margin-bottom: 29.3333333333%; padding-top: 0; background: none; } }
.story-sec .story-in { max-width: 1000px; margin: 0 auto; }
.story-sec .story-heading { position: absolute; top: -45px; left: 40px; }
@media screen and (max-width: 750px) { .story-sec .story-heading { left: 20px; width: 49.2753623188%; } }
.story-sec .story-box { position: relative; padding: 115px 50px 80px; border: 1px solid #3d80d4; }
@media screen and (max-width: 960px) { .story-sec .story-box { padding: 150px 60px 120px; } }
@media screen and (max-width: 750px) { .story-sec .story-box { padding: 21.7391304348% 8.6956521739% 17.3913043478%; } }
.story-sec .story-box .box-txt { margin-bottom: 70px; }
.story-sec .story-box .story-fig { position: absolute; top: 110px; right: -100px; }
@media screen and (max-width: 1220px) { .story-sec .story-box .story-fig { right: -55px; width: 31.6666666667%; } }
@media screen and (max-width: 1130px) { .story-sec .story-box .story-fig { right: 50px; } }
@media screen and (max-width: 960px) { .story-sec .story-box .story-fig { position: static; width: 100%; margin: 0 auto 80px; } }
@media screen and (max-width: 750px) { .story-sec .story-box .story-fig { margin-bottom: 11.5942028986%; } }

.about-sec { position: relative; margin-bottom: 195px; }
@media screen and (max-width: 750px) { .about-sec { margin-bottom: 20%; } }
.about-sec .about-in { max-width: 1000px; margin: 0 auto; background: url("../img/home/home_bg005.png") no-repeat left bottom 50px; }
@media screen and (max-width: 960px) { .about-sec .about-in { background: none; } }
.about-sec .about-heading { position: absolute; top: -45px; left: 50%; margin-left: -182px; }
@media screen and (max-width: 960px) { .about-sec .about-heading { left: 40px; margin-left: 0; } }
@media screen and (max-width: 750px) { .about-sec .about-heading { left: 20px; width: 73.1884057971%; } }
.about-sec .about-box { position: relative; padding: 140px 45px 330px; border: 1px solid #3d80d4; }
@media screen and (max-width: 960px) { .about-sec .about-box { padding: 110px 50px 500px; } }
@media screen and (max-width: 750px) { .about-sec .about-box { padding: 15.9420289855% 7.2463768116% 72.4637681159%; } }
.about-sec .about-box .about-item { position: relative; }
.about-sec .about-box .about-item figure { position: absolute; }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item figure { position: static; } }
.about-sec .about-box .about-item .only-tab { display: block; }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item .only-tab { display: none; } }
.about-sec .about-box .about-item.about-item-01 { margin-bottom: 190px; }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-01 { margin-bottom: 90px; } }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-01 { margin-bottom: 13.0434782609%; } }
@media screen and (max-width: 1130px) { .about-sec .about-box .about-item.about-item-01 p { padding-right: 45.8333333333%; } }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-01 p { padding-right: 0; } }
.about-sec .about-box .about-item.about-item-01 .fig-pc { max-width: 480px; top: -70px; right: -285px; }
@media screen and (max-width: 1500px) { .about-sec .about-box .about-item.about-item-01 .fig-pc { right: -145px; } }
@media screen and (max-width: 1220px) { .about-sec .about-box .about-item.about-item-01 .fig-pc { right: -100px; width: 40%; } }
@media screen and (max-width: 1130px) { .about-sec .about-box .about-item.about-item-01 .fig-pc { right: 0; } }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-01 .fig-pc { display: none; } }
.about-sec .about-box .about-item.about-item-01 .fig-tab { display: none; }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-01 .fig-tab { display: block; margin-bottom: 100px; } }
@media screen and (max-width: 750px) { .about-sec .about-box .about-item.about-item-01 .fig-tab { margin-bottom: 14.4927536232%; } }
.about-sec .about-box .about-item.about-item-02 { display: flex; justify-content: flex-end; margin-bottom: 170px; }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-02 { justify-content: flex-start; margin-bottom: 90px; } }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-02 { margin-bottom: 13.0434782609%; } }
@media screen and (max-width: 1130px) { .about-sec .about-box .about-item.about-item-02 p { padding-left: 45.8333333333%; } }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-02 p { padding-left: 0; } }
.about-sec .about-box .about-item.about-item-02 figure { top: -40px; left: -145px; }
@media screen and (max-width: 1220px) { .about-sec .about-box .about-item.about-item-02 figure { left: -100px; width: 40%; } }
@media screen and (max-width: 1130px) { .about-sec .about-box .about-item.about-item-02 figure { left: 0; } }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-02 figure { display: none; } }
.about-sec .about-box .about-item.about-item-03 figure { top: -15px; right: -145px; }
@media screen and (max-width: 1220px) { .about-sec .about-box .about-item.about-item-03 figure { right: -100px; width: 40%; } }
@media screen and (max-width: 1130px) { .about-sec .about-box .about-item.about-item-03 figure { right: 0; } }
@media screen and (max-width: 960px) { .about-sec .about-box .about-item.about-item-03 figure { display: none; } }
.about-sec .about-fig { display: none; }
@media screen and (max-width: 960px) { .about-sec .about-fig { position: absolute; bottom: 100px; display: block; } }
.about-sec .about-fig ul { display: flex; justify-content: space-between; }
.about-sec .about-fig li { width: 50%; }

.spots-sec { padding-bottom: 350px; background: url("../img/home/home_bg003.png") no-repeat left top; }
@media screen and (max-width: 750px) { .spots-sec { padding: 14% 0 18.6666666667%; background: none; } }
.spots-sec .spots-heading { margin-right: 50px; margin-bottom: 20px; text-align: right; }
@media screen and (max-width: 750px) { .spots-sec .spots-heading { width: 49.7101449275%; margin: 0 auto 6.5217391304%; text-align: center; } }
.spots-sec .spots-subheading { margin-top: 45px; margin-bottom: 50px; font-size: 1.7777777778rem; text-align: center; font-weight: normal; }
@media screen and (max-width: 750px) { .spots-sec .spots-subheading { margin-bottom: 8.6956521739%; } }
@media screen and (max-width: 750px) { .spots-sec .spots-slider { display: flex; flex-wrap: wrap; margin-bottom: 12.3188405797%; }
  .spots-sec .spots-slider li { width: 25%; } }

.link-sec { position: absolute; top: -110px; width: 100%; }
@media screen and (max-width: 750px) { .link-sec { position: static; padding-top: 9.3333333333%; } }
.link-sec .link-in { max-width: 1000px; margin: 0 auto; padding-bottom: 80px; border-bottom: 1px solid #fff; }
@media screen and (max-width: 750px) { .link-sec .link-in { border-bottom: none; } }
.link-sec ul { display: flex; justify-content: space-between; }
@media screen and (max-width: 750px) { .link-sec ul { display: block; } }
.link-sec ul li { width: 48.3%; margin-right: 3.4%; background-color: #fff; box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.3); }
@media screen and (max-width: 750px) { .link-sec ul li { width: 100%; margin-right: 0; margin-bottom: 5.7971014493%; } }
.link-sec ul li:last-child { margin: 0; }
.link-sec ul li a { display: block; text-decoration: none; padding: 10px 15px 0; background: url("../img/common/arrow_i002.png") no-repeat right 15px bottom 40px; }
.link-sec ul li p { padding: 30px 0; font-size: 1.2777777778rem; line-height: 1; text-align: center; }

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