@charset "utf-8";

@media screen and (max-width: 640px) {

.animate {}
.animate.animate__animated {}
/*============================
#header
============================*/
#header {}
#header .mark {}
#header .mark .vpoint {}
#header .mark .vpoint img {}
#header .mark .logo {}
#header .mark .logo a {}
#header .mark .logo a img {}
#header .rightArea {}
#header .rightArea .button {}
#header .rightArea .button a { min-width: auto; white-space: nowrap; padding: 10px 30px 8px; }
#header .rightArea .button a:hover {}

/*============================
#mainPanelArea
============================*/
#mainPanelArea { padding: 60px 0; }
#mainPanelArea img {}
#mainPanelArea .leftArea {}
#mainPanelArea .leftArea .mainTitle { font-size: 1.5em; }
#mainPanelArea .leftArea .subTitle { font-size: 1.125em; margin-top: 5px; }
#mainPanelArea .leftArea .copy { font-size: 0.875em; line-height: 1.5; margin-top: 10px; }
#mainPanelArea .rightArea { position: inherit; gap: 15px; margin-top: 20px; }
#mainPanelArea .rightArea .image { width: 70%; height: auto; }
#mainPanelArea .rightArea .image a {}
#mainPanelArea .rightArea .image a img {}

/*============================
#featureArea
============================*/
#featureArea { padding: 50px 0 40px; }
#featureArea .mainTitle { text-align: left; font-size: 1.5em; white-space: nowrap; }
#featureArea .subCopy { text-align: left; margin-top: 10px; }
#featureArea ul {}
#featureArea ul li { flex-direction: column; margin-top: 30px; height: auto; gap: 15px; border-radius: 10px; }
#featureArea ul li .image { overflow: hidden; width: 100%; height: 180px; }
#featureArea ul li .image img {}
#featureArea ul li .rightArea { padding: 0 10px 20px 10px; }
#featureArea ul li .rightArea .title { font-size: 1.25em; }
#featureArea ul li .rightArea .copy { margin-top: 5px; line-height: 1.5; font-size: 1em; }
#featureArea ul li .leftArea { order: 2; padding: 0 10px 20px 10px; }
#featureArea ul li:nth-child(2) .image { order: 1; }
#featureArea ul li .leftArea .title { font-size: 1.25em; }
#featureArea ul li .leftArea .copy { margin-top: 5px; line-height: 1.5; font-size: 1em; }

/*============================
#venueArea
============================*/
#venueArea { padding: 40px 0; }
#venueArea .title { font-size: 1.25em; }
#venueArea .copy { margin-top: 10px; }
#venueArea ul { gap: 2%; row-gap: 8px; flex-wrap: wrap; margin-top: 20px; margin-right: inherit; }
#venueArea ul li { width: 49%; height: auto; border-radius: 8px; }
#venueArea ul li a {}
#venueArea ul li a .image { width: 100%; height: auto; }
#venueArea ul li a .image img {}
#venueArea ul li a:hover .image img {}
#venueArea ul li a .bottomArea { padding: 10px; }
#venueArea ul li a .bottomArea .venueName { font-size: 1em; }
#venueArea ul li a .bottomArea .search { margin-top: 5px; }
#venueArea ul li a .bottomArea .search span {}
#venueArea ul li a .bottomArea .search span::after {}
#venueArea ul li a:hover .bottomArea .search span::after {}

/*============================
#campaignBannerArea
============================*/
#campaignBannerArea { padding: 40px 0; }
#campaignBannerArea .title { font-size: 1.25em; }
#campaignBannerArea ul { flex-direction: column; gap: 10px; margin-top: 20px; }
#campaignBannerArea ul li { width: 100%; height: auto; }
#campaignBannerArea ul li a {}
#campaignBannerArea ul li a img {}

/*============================
#searchListingArea
============================*/
#searchListingArea { padding: 40px 0; }
#searchListingArea .title { font-size: 1.25em; }
#searchListingArea .copy { margin-top: 10px; }
#searchListingArea .button { margin-top: 20px; }
#searchListingArea .button a {}
#searchListingArea .button a:hover {}

}