@charset "utf-8";
/* CSS Document */
html, body { position: relative; height: 100%; }
body { background: #000; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 14px; color: #000; margin: 0; padding: 0; overflow: hidden; }
.clearFix:after { clear: both; display: block; content: ''; }
.sBubble { color: #eee; padding: 4px 5px; font-size: 15px; font-weight: bold; text-shadow: 0px 0px 0px #000; font-family: Helvetica, Arial, sans-serif, "微軟正黑體"; }
.sBubble, .sBubbleArw { line-height: 30px; }
.sBubble.yellow { background: #FF0; border-color: #FF0; box-shadow: 0 0 8px rgba(0,0,0,.25); }
.sBubbleArw.top.yellow { border-top-color: #FF0; }
.sBubbleArw.bottom.yellow { border-bottom-color: #FF0; }
.sBubbleArw.left.yellow { border-left-color: #FF0; }
.sBubbleArw.right.yellow { border-right-color: #FF0; }
.abgne_tab, .tab_container, .tab_content { height: 100%; }
ul.tabs { position: absolute; z-index: 70; top: 50%; left: 50%; width: 900px; height: 220px; margin-left: -450px; margin-top: 220px; }
ul.tabs li { float: left; }
ul.tabs li a { display: block; width: 250px; height: 125px; text-indent: -9999px; margin-top: 95px; transition: margin-top .6s; background-position: center top; }
ul.tabs li:nth-child(1) a { background-image: url(../images/tabs_01.png); }
ul.tabs li:nth-child(2) a { background-image: url(../images/tabs_02.png); }
ul.tabs li:nth-child(3) a { background-image: url(../images/tabs_03.png); }
ul.tabs li.active a { width: 400px; height: 220px; margin-top: 0px; background-position-y: -125px; }
ul.custom { position: absolute; text-align: center; -webkit-transition: .3s; -moz-transition: .3s; -o-transition: .3s; transition: .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; right: 10px; top: 50%; -webkit-transform: translate3d(0, -50%, 0); -moz-transform: translate3d(0, -50%, 0); -o-transform: translate(0, -50%); -ms-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); }
.swiper-pagination { width: 140px; }
.swiper-container-vertical>.swiper-pagination-bullets { right: 40px; transform: translateY(-70%); background-repeat: no-repeat; background-position: 0 0; }
#tab1 .swiper-container-vertical>.swiper-pagination-bullets { background-image: url(../images/bg_tab1.png); }
#tab2 .swiper-container-vertical>.swiper-pagination-bullets { background-image: url(../images/bg_tab2.png); }
#tab3 .swiper-container-vertical>.swiper-pagination-bullets { background-image: url(../images/bg_tab3.png); }
a.gotop { background-image: url(../images/gotop.png); position: absolute; z-index: 10; right: 32px; top: 50%; width: 50px; height: 21px; background-repeat: no-repeat; text-indent: -9999px; opacity: .55; }
#tab1 a.gotop { margin-top: 60px; background-position: 0 0px; }
#tab2 a.gotop { margin-top: 40px; background-position: 0 -21px; }
#tab3 a.gotop { margin-top: 30px; background-position: 0 -42px; }
a.gotop:hover { opacity: .99; }
li.swiper-pagination-switch { cursor: pointer; display: inline-block; width: 75px; border: 1px solid #CCC; background: #E0DEDE }
li.swiper-pagination-switch.active { background-color: pink }
.swiper-container { width: 100%; height: 100%; margin-left: auto; margin-right: auto; }
.swiper-slide { text-align: center; font-size: 18px; background-color: transparent; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; background-position: center top; }
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 20px 0 20px 120px; }
.swiper-pagination-bullet { width: 18px; height: 18px; display: inline-block; border-radius: 100%; background-color: transparent; border: 2px solid #FFF; opacity: 1; box-shadow: 0px 0px 5px #888888; }
.swiper-pagination-bullet-active { background: #FFF; }
#tab2 .swiper-pagination-bullet { border-color: #d35c61; }
#tab2 .swiper-pagination-bullet-active { background: #d35c61; }
#tab3 .swiper-pagination-bullet { border-color: #84dda6; }
#tab3 .swiper-pagination-bullet-active { background: #84dda6; }
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 40px; }
.swiper-button-next, .swiper-button-prev { position: absolute; top: 50%; width: 85px; height: 140px; margin-top: -100px; -moz-background-size: auto; -webkit-background-size: auto; background-size: auto; background-image: url(../images/pagination.png); opacity: .65; }
.swiper-button-next:hover, .swiper-button-prev:hover { opacity: .99; }
.swiper-button-prev { left: 50%; right: auto; background-position: left top; margin-left: -690px; }
.swiper-button-next { right: 50%; left: auto; background-position: right top; margin-right: -690px; }
#page1 { background-image: url(../images/bg_page1_1.jpg); }
#page2 { background-image: url(../images/bg_page1_2.jpg); }
#page3 { background-image: url(../images/bg_page1_3.jpg); }
#page4 { background-image: url(../images/bg_page1_4.jpg); }
#page5 { background-image: url(../images/bg_page1_5.jpg); }
#page6 { background-image: url(../images/bg_page2_1.jpg); }
#slide1 { background-image: url(../images/bg_page2_2_1.jpg); }
#slide2 { background-image: url(../images/bg_page2_2_2.jpg); }
#slide3 { background-image: url(../images/bg_page2_2_3.jpg); }
#slide4 { background-image: url(../images/bg_page2_3_1.jpg); }
#slide5 { background-image: url(../images/bg_page2_3_2.jpg); }
#slide6 { background-image: url(../images/bg_page2_3_3.jpg); }
#page9 { background-image: url(../images/bg_page3_1.jpg); }
#page10 { background-image: url(../images/bg_page3_2.jpg); }
#topArea { z-index: 200; position: absolute; left: 0; top: 0px; width: 100%; min-width: 1280px; height: 100px; background: url(../images/bg_pattern_top.png) repeat-x; }
#topArea h1 { z-index: 100; position: relative; padding: 14px 0 0 10px; float: left; }
#topArea .slideArea { margin: 0 0 0 -438px; position: absolute; left: 50%; top: 0; width: 986px; height: 100px; }
#topArea .slideArea .mask { position: relative; left: 0; width: 100%; height: 100%; overflow: hidden; }
#topArea .evLink { z-index: 50; position: absolute; left: 0; top: 0; text-align: center; }
#topArea .evLink li { display: inline-block; zoom: 1; margin: 0 0px; }
#topArea .evLink li a { position: relative; display: block; width: 160px; height: 100px; opacity: .75; transition: all .3s ease; }
#topArea .evLink li a:hover { opacity: .99; }
#topArea .evLink li a img { height: 100%; }
#topArea .evLink li a .dim { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: 0.4; filter: alpha(opacity=40); }
#topArea .etcArea { z-index: 100; position: relative; padding: 5px 20px 0 0; float: right; width: 176px; }
#topArea .snsArea { /*padding-left: 5px;*/ }
#topArea .snsArea li { padding-left: 7px; float: right; }
#topArea .snsArea li a { display: block; height: 50px; background: url(../images/spr_snsBtn.png) no-repeat; text-indent: -9999px; }
#topArea .snsArea li .index { width: 50px; background-position: -120px 0; }
#topArea .snsArea li .register { width: 50px; background-position: -63px 0; }
#topArea .snsArea li .home { width: 50px; background-position: -6px 0; }
#topArea .etcArea .btnDownload { padding: 0px 0 0 13px; }
#topArea .etcArea .btnDownload a { display: block; width: 164px; height: 42px; background: url(../images/spr_snsBtn.png) no-repeat -6px -50px; text-indent: -9999px; }
.copyright { position: fixed; bottom: -2px; left: 0px; z-index: 200; }