@charset "utf-8";

@media only screen and (max-width: 640px) {
	
/*============================
#mainPanelArea
============================*/
#mainPanelArea { padding-top: 50px; }
#mainPanelArea .topImage { padding: 4px 0; height: inherit; }
#mainPanelArea .middleImage { margin-top: -6.5%; margin-bottom: -3.5%; }
#mainPanelArea .middleImage img { min-width: 320px; width: 95%; height: auto; }
#mainPanelArea .bottomImage { padding: 4px 0; height: inherit; }
#mainPanelArea .panel { width: 100%; position: inherit; top: inherit; left: inherit; margin-left: 0; }
#mainPanelArea .panel .swiper-slide { display: inline-block; width: 24%!important; height: inherit; margin-left: 1%; }
#mainPanelArea .panel .swiper-slide img { width: 100%; height: auto; }
#mainPanelArea .panel .swiper-slide:first-child { margin-left: 0; }
#mainPanelArea .panel.slider01 {}
#mainPanelArea .panel.slider02 { top: inherit; margin-top: 4px; }
#mainPanelArea .panel.slider02 .swiper-slide:first-child { width: 12%!important; }
#mainPanelArea .panel.slider02 .swiper-slide:last-child { width: 12%!important; }
#mainPanelArea .panel.slider03 {}
#mainPanelArea .panel.slider03 .swiper-slide:first-child { width: 12%!important; }
#mainPanelArea .panel.slider03 .swiper-slide:last-child { width: 12%!important; }
#mainPanelArea .panel.slider04 { top: inherit; margin-top: 4px; }
	
/*============================
#aboutArea
============================*/
#aboutArea { padding: 60px 0; margin-bottom: -60px; }
#aboutArea .bg { height: 1300px; background: url("../../imageFile/bg_circle.png") no-repeat center; background-size: 500px auto; }
#aboutArea .period {}
#aboutArea .period .limit { text-align: center; }
#aboutArea .period .limit span { padding: 7px 40px 6px; font-size: 0.875em; }
#aboutArea .period .limit span::after {}
#aboutArea .period .date { margin-top: 30px; }
#aboutArea .period .date .number { padding: 4px 8px; border-top: solid 3px #282828; border-bottom: solid 3px #282828; letter-spacing: 0.1em; }
#aboutArea .period .date .number span { font-size: 1.5em; }
#aboutArea .period .date .number em { font-size: 1em; }
#aboutArea .attention { margin-top: 20px; font-size: 1.125em; }
#aboutArea .banner { width: 90%; margin-top: 20px; padding: 35px 60px; border-radius: 10px; } 
#aboutArea .banner:before { width: 96%; height: 100%; background-size: contain; } 
#aboutArea .banner:after {  width: 96%; height: 100%; background-size: contain; } 
#aboutArea .banner .container { }
#aboutArea .banner .container:before { left: -54px;  border-right: 3px solid #e2b84d;  }
#aboutArea .banner .container:after { right: -54px; border-right: 3px solid #e2b84d; }
#aboutArea .banner .container .bannerButton { z-index: 1; }
#aboutArea .banner .container .bannerButton:hover {}
#aboutArea .banner .container .bannerButton:before { top: 2px; }
#aboutArea .banner .container .bannerButton:after { bottom: 2px; }
#aboutArea .banner .container .bannerButton a { padding: 10px 0; border-radius: 5px; letter-spacing: 0.1em; font-size: 1.125em; }
#aboutArea .banner .container .bannerButton a:after { content: ''; width: 8px; height: 8px; border-top: solid 2px #fff; border-right: solid 2px #fff; right: 20px; }

#aboutArea .data { background: url("../../imageFile/bg_about_cloud.png") no-repeat center 65px; padding: 20px 0 0; background-size: 800px auto; }
#aboutArea .data .title { font-size: 2em; }
#aboutArea .data .title img { width: 200px; height: auto; }
#aboutArea .data .lead { margin-top: 20px; }
#aboutArea .data .lead img { width: 200px; height: auto; }
#aboutArea .data .catch { margin-top: 40px; font-size: 1.75em; }
#aboutArea .data .catch em {}
#aboutArea .data .catch em span {}
#aboutArea .data .catch em span:nth-child(1) {}
#aboutArea .data .catch em span:nth-child(2) {}
#aboutArea .data .catch em span:nth-child(3) {}
#aboutArea .data .catch em span:nth-child(4) {}
#aboutArea .data .catch em span:nth-child(5) {}
#aboutArea .data .catch em span:nth-child(6) {}
#aboutArea .data .catch em span:nth-child(7) {}
#aboutArea .data .catch em span:nth-child(8) {}
#aboutArea .data .catch em span:nth-child(9) {}
#aboutArea .data .copy { margin-top: 30px; font-size: 1em; text-align: left; padding: 0 20px; }
#aboutArea .data .copy em {}
#aboutArea .data .button { margin-top: 30px; }

/*============================
#featuresArea
============================*/
#featuresArea { padding: 60px 0; }
#featuresArea .content { margin-top: 20px; border-radius: 20px; padding: 20px; }
#featuresArea .content .item {}
#featuresArea .content .item ul { height: 240px; position: relative; }
#featuresArea .content .item ul li { height: inherit; border-radius: 10px; padding: 20px; }
#featuresArea .content .item ul li img { width: 30px; height: auto; }
#featuresArea .content .item ul li:nth-child(1) { width: 46%; height: 130px; font-size: 1.125em; left: 0; top: 90px; padding-top: 35px; line-height: 1.5; }
#featuresArea .content .item ul li:nth-child(1)::after { right: 30px; top: -20px; }
#featuresArea .content .item ul li:nth-child(2) { width: 100%; height: 60px; font-size: 1.125em; left: 0; top: 0; padding: 20px; line-height: 1.5; }
#featuresArea .content .item ul li:nth-child(2)::after { top: -20px; }
#featuresArea .content .item ul li:nth-child(3) { width: 46%; height: 130px; font-size: 1.125em; left: inherit; right: 0; top: 90px; line-height: 1.5; }
#featuresArea .content .item ul li:nth-child(3)::after { left: 30px; top: -20px; }
#featuresArea .content .prize { margin-top: 20px; height: inherit; border-radius: 10px; padding: 57% 20px 20px; overflow: hidden; }
#featuresArea .content .prize::after { left: -80px; top: -27px; width: 180px; height: 74px; line-height: 116px; font-size: 1.25em; }
#featuresArea .content .prize .icon { position: absolute; right: 5px; top: 5px; }
#featuresArea .content .prize .icon img { width: 40px; height: auto; }
#featuresArea .content .prize .item img {}
#featuresArea .content .prize .item img.prize01 { position: absolute; left: 4%; top: 40px; width: 45%; height: auto; }
#featuresArea .content .prize .item img.prize02 { position: absolute; left: inherit; right: 4%; top: 45px; width: 43%; height: auto; }
#featuresArea .content .prize .copy { margin-top: 20px; font-size: 1em; line-height: 1.5; }
#featuresArea .content .prize .copy span {}
#featuresArea .link { position: absolute; width: 100%; left: 0; bottom: -120px; }
#featuresArea .link .button { text-align: center;}
#featuresArea .link .button a.md_btn_main { width: 240px; padding: 17px 0 15px; font-size: 1em; }
#featuresArea .link .archive { margin-top: 15px; }
#featuresArea .link .archive a {}
	
/*============================
#bottomContentArea
============================*/
#bottomContentArea { padding: 90px 0; margin-bottom: -60px; }
#bottomContentArea .schedule { float: inherit; width: inherit; }
#bottomContentArea .schedule .content { margin-top: 20px; border-radius: 20px; padding: 20px; }
#bottomContentArea .schedule .content ul {}
#bottomContentArea .schedule .content ul li { margin-top: 20px; border-radius: 5px; }
#bottomContentArea .schedule .content ul li:first-child { margin-top: 0; }
#bottomContentArea .schedule .content ul li .date { display: table-cell; width: 130px; padding-left: 0; padding-top: 0; }
#bottomContentArea .schedule .content ul li .date span { font-size: 1.5em; }
#bottomContentArea .schedule .content ul li .date em { font-size: 1em; }
#bottomContentArea .schedule .content ul li:nth-child(1) .date {}
#bottomContentArea .schedule .content ul li:nth-child(1) .date::after { right: -9px; top: 50%; margin-top: -9px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 10px solid #bbb; }
#bottomContentArea .schedule .content ul li:nth-child(2) .date {}
#bottomContentArea .schedule .content ul li:nth-child(2) .date::after {right: -9px; top: 50%; margin-top: -9px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 10px solid #999; }
#bottomContentArea .schedule .content ul li:nth-child(3) .date {}
#bottomContentArea .schedule .content ul li:nth-child(3) .date::after {right: -9px; top: 50%; margin-top: -9px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 10px solid #666; }
#bottomContentArea .schedule .content ul li:nth-child(4) .date {}
#bottomContentArea .schedule .content ul li:nth-child(4) .date::after {right: -9px; top: 50%; margin-top: -9px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 10px solid #333; }
#bottomContentArea .schedule .content ul li:nth-child(5) .date {}
#bottomContentArea .schedule .content ul li:nth-child(5) .date::after {right: -9px; top: 50%; margin-top: -9px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 10px solid #dc0032; }
#bottomContentArea .schedule .content ul li .text { font-size: 1em; padding: 15px; }
#bottomContentArea .twitter { float: inherit; width: inherit; margin-top: 40px; }
#bottomContentArea .twitter .content { margin-top: 20px; border-radius: 20px; padding: 20px; }
#bottomContentArea .twitter .content .twitter-timeline {}
#bottomContentArea .button { margin-top: 40px; }
#bottomContentArea .button ul { width: inherit; }
#bottomContentArea .button ul li { float: inherit; width: inherit; margin-top: 30px; }
#bottomContentArea .button ul li a {}

}