/*活動用*/ body{ margin:0; padding: 0; } .full-width{width: 100%; } .fixed-width{ width: 1280px; margin: auto; } /*額外設定大小網*/ .only_pc{ display: inline; } .only_m{ display: none; } /*額外設定大小網*/ /*社群*/ #content_all .contentCon .community{ background-color: #e6e6e6; position: relative; margin:0 auto; width: 100%; overflow: auto; } #content_all .contentCon .community .itembox{ width: 464px; padding: 0; margin:0 auto; } #content_all .contentCon .community .itembox a{ display: block; width: 80px; height: 80px; margin:45px 18px; border-radius: 90px; background:url(../images/community.png)no-repeat center 0; float: left; transition: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; cursor: pointer; } #content_all .contentCon .community .itembox a:hover{ opacity: 1; } #content_all .contentCon .community .itembox a:nth-of-type(1){ background-position: 0 0; } #content_all .contentCon .community .itembox a:nth-of-type(2){ background-position: 0 -80px; } #content_all .contentCon .community .itembox a:nth-of-type(3){ background-position: 0 -160px; } #content_all .contentCon .community .itembox a:nth-of-type(4){ background-position: 0 -240px; } #content_all .contentCon .community .itembox a:nth-of-type(1):hover{ background-position: -80px 0; } #content_all .contentCon .community .itembox a:nth-of-type(2):hover{ background-position: -80px -80px; } #content_all .contentCon .community .itembox a:nth-of-type(3):hover{ background-position: -80px -160px; } #content_all .contentCon .community .itembox a:nth-of-type(4):hover{ background-position: -80px -240px; } .logoboxout { width: 100%; height: 138px; background: #f1f1f1; } .logoboxout .lgooin { width:1200px; margin: 0 auto; } .logoboxout .lgooin a { display: block;height: 138px; float: left; } .logoboxout .lgooin a:nth-of-type(1) { width: 308px; margin-right: 60px; background: url(../images/ftr_logo01.png)no-repeat center top; background-size: 100%; } .logoboxout .lgooin a:nth-of-type(2) { width: 409px; margin-right: 70px; background: url(../images/ftr_logo02.png)no-repeat center top; background-size: 100%; cursor: pointer; } .logoboxout .lgooin a:nth-of-type(3) { width: 217px; background: url(../images/ftr_logo03.png)no-repeat center top; background-size: 100%; } .logoboxout2 .lgooin2 { width:1200px; margin: 0 auto; } .logoboxout2 .lgooin2 a { display: block;height: 87px; float: left; margin-right: 45px; } .logoboxout2 .lgooin2 a:nth-of-type(1) { width: 184px; background: url(../images/ftr_logo04_1.png)no-repeat center top; background-size: 100%; } .logoboxout2 .lgooin2 a:nth-of-type(2) { width: 141px; background: url(../images/ftr_logo04_2.png)no-repeat center top; background-size: 100%; } .logoboxout2 .lgooin2 a:nth-of-type(3) { width: 151px; background: url(../images/ftr_logo04_3.png)no-repeat center top; background-size: 100%; } .logoboxout2 .lgooin2 a:nth-of-type(4) { width: 150px; background: url(../images/ftr_logo04_4.png)no-repeat center top; background-size: 100%; } /*社群*/ /*loading*/ .page-loader{ position: fixed; z-index: 9999; left: 0; top: 0; background: rgba(0,0,0, 1); width: 100vw; height: 100vh; } .spinner { background: transparent; -moz-animation: rotate 1.5s linear infinite; -webkit-animation: rotate 1.5s linear infinite; animation: rotate 1.5s linear infinite; } .spinner { border: 4px solid; border-radius: 50%; content: ""; display: inline-block; position: absolute; width: 70px; height: 70px; top: 50%; margin-top: -35px; left: 50%; margin-left: -35px; z-index: 2; } .spinner:after { border: 4px solid; border-radius: 50%; content: ""; display: inline-block; position: absolute; width: 62px; height: 62px; top: 50%; margin-top: -35px; left: 50%; margin-left: -35px; z-index: 0; } .spinner { border-color: #21357f rgba(0,0,0, 0.07) #21357f rgba(0,0,0, 0.07); } .spinner:after { border-color: transparent rgba(255,255,255,0.8) transparent rgba(255,255,255,0.8); -moz-animation: rotate 4s linear infinite; -webkit-animation: rotate 4s linear infinite; animation: rotate 4s linear infinite; } @-moz-keyframes rotate { 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); } 100% { -moz-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes rotate { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes rotate { 0% { -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /*loading /*小叮嚀*/ #pspoint{ position: absolute; top: -50px; } .note{ width: 100%; padding:20px 0 50px; margin: 0 auto; float: left; position: relative; z-index: 2; } #btn_note{ width: 1200px; font-size: 30px; font-weight: 400; letter-spacing: 4px; color: #FFFFFF; margin: 60px auto 50px; text-align: left; } #btn_note2{ width: 1200px; font-size: 30px; font-weight: 400; letter-spacing: 4px; color: #FFFFFF; margin: 70px auto 50px; text-align: left; } #btn_note3{ width: 1200px; font-size: 30px; font-weight: 400; letter-spacing: 4px; color: #FFFFFF; margin: 70px auto 50px; text-align: left; } #btn_note span { display: block; width: 100%; height:100%; color: #000000; float: left; padding-left: 25px; } .note_box{ display: block; width: 1200px; margin: 0px auto; padding: 0px 10px 0 26px; font-size:15px; font-weight:normal; font-family: 'Noto Sans TC', '微軟正黑體', 'Microsoft JhengHei', Arial, '蘋果儷中黑', 'Apple LiGothic Medium', '儷黑 Pro', 'LiHei Pro', sans-serif; list-style-position: outside; position: relative; overflow: hidden; transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; } .note_box ul{ margin: 0px;} .note_box ul li{ font-size: 22px; color:#FFFFFF; font-weight:normal; line-height:50px; list-style-position: outside; list-style-type: Square; text-align:justify; } .note_box ul a{ color:#ffffff; text-decoration: underline;} .note_box ul li ol li{ margin-left:20px; list-style-type: upper-roman; font-size: 22px; } .note_box ul li ol li ul li{ margin-left:20px; list-style-type:square; font-size: 22px; } .note_box ul li ol li ul li ol li{ margin-left:20px; list-style-type: upper-roman; font-size: 22px; } /*小叮嚀*/ /***PC版***/ /*** container ***/ #container { margin: 0 auto; background-color:#FFFFFF; position: relative; overflow: hidden; } #content_all { min-width: 1280px; color:#FFFFFF; position: relative; } #content_all a{text-decoration: none;} #content_all>h1,#content_all>h2,#content_all>p,#content_all>b,#content_all>i { position: absolute; left: 0; top:20px; font-size: 30px; } /*** container END ***/ /* HeaderCon PC */ #content_all .headerCon { width: 100%; height: 770px; position: relative; margin:0 auto; background: url(../images/pc/outdoorcinemas_kvbg.jpg) no-repeat center top; background-size: 1920px 770px; overflow: hidden; } #content_all .headerCon .light { width: 1540px; height: 560px; background: url(../images/pc/outdoorcinemas_lihgt.png)no-repeat center top; position: absolute; left: -700px; top: -200px; z-index: 10; opacity: 0.4; animation: yiscroll 2.5s linear 0s infinite alternate; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .headerCon .light2 { width: 1540px; height: 560px; background: url(../images/pc/outdoorcinemas_lihgt2.png)no-repeat center top; position: absolute; right: -700px; top: -200px; z-index: 10; opacity: 0.4; animation: yiscroll2 2.5s linear 0s infinite alternate; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .headerCon .kvbox { width: 1280px; height: 100%; margin: 0 auto 0; padding: 0; position: relative; overflow: hidden; } #content_all .headerCon .kvbox .icon { width: 180px; height: 140px; font-size: 0; background: url(../images/pc/outdoorcinemas_kvicon.png)no-repeat center top; background-size: 100%; position: fixed; right: 2%; top:2%; z-index: 99; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .headerCon .kvbox .icon a { display: block; width:100%; height: 100%; } #content_all .headerCon .kvbox .h1{ width: 100%; height: 400px; font-size: 0; background: url(../images/pc/outdoorcinemas_kvh1.png)no-repeat center top; background-size: 520px 400px; position: relative; margin-top: 153px; z-index: 1; } #content_all .headerCon .kvbox p { width: 100%; line-height: 30px; font-size: 24px; text-align: center; color: #FFFFFF; position: absolute; left: 0; top:140px; z-index: 1; } #content_all .headerCon .kvbox .lightpoint { width: 20px; height: 20px; background-color: rgba(255,255,255,1); border-radius: 20px; position: absolute; left: 350px; top: 133px; animation: yishadow 1.5s linear 0s infinite alternate; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .headerCon .kvbox .lightpoint:nth-last-of-type(2) { left: 941px; } #content_all .headerCon .kvbox .lightpoint:nth-last-of-type(3) { left: 498px; top: 586px; } /* HeaderCon PC End */ /* contentCon PC */ #content_all .contentCon { position: relative; margin: 0 auto; background-color: #050041; } #content_all .contentCon a{ color:#FFFFFF; text-decoration: none; } #content_all .contentCon .itembox{ width: 1280px; height: 100%; margin: 0 auto; padding: 20px 0; position: relative; } #content_all .contentCon .itembox .point { position: absolute; width: 100%; } #content_all .contentCon .item01{ position: relative; margin: 0 auto; padding:0; } #content_all .contentCon .item01 h2 { width: 100%; height: 110px; line-height: 110px; font-size: 0; font-weight: normal; text-align: center; background: url(../images/pc/outdoorcinemas_itemk2.png)no-repeat center top; background-size: 1200px 330px; background-color: #4198fa; } #content_all .contentCon .item01 .itembox { padding: 65px 40px; background: url(../images/pc/outdoorcinemas_item01icon.png)no-repeat 500px 8px; background-size: 720px 680px; } #content_all .contentCon .item01 .itembox .point{ font-size: 0; } #content_all .contentCon .item01 .itembox h3 { width: 100%; height: 90px; line-height: 90px; font-size: 0; font-weight: normal; text-align: center; margin: 0 auto 30px; background: url(../images/pc/outdoorcinemas_item01h3.png)no-repeat left top; background-size: 290px 360px; } #content_all .contentCon .item01 .itembox h3:nth-of-type(2) { background-position: left -90px; } #content_all .contentCon .item01 .itembox h3:nth-of-type(3) { background-position: left -180px; } #content_all .contentCon .item01 .itembox h3:nth-of-type(4) { background-position: left -270px; } #content_all .contentCon .item01 .itembox p { width:100%; line-height: 48px; font-size: 24px; font-weight: normal; text-align: left; color: #FFFFFF; margin-bottom: 30px; } #content_all .contentCon .item01 .itembox ul li { width:100%; line-height: 48px; font-size: 24px; font-weight: normal; text-align: justify; color: #FFFFFF; margin-bottom: 30px; } #content_all .contentCon .item02{ position: relative; margin: 0 auto; padding:0; background: url(../images/pc/outdoorcinemas_item02bg.jpg)repeat center 150px; background-size: 1920px 1165px; } #content_all .contentCon .item02 h2 { width: 100%; height: 110px; line-height: 110px; font-size: 0; font-weight: normal; text-align: center; background: url(../images/pc/outdoorcinemas_itemk2.png)no-repeat center -110px; background-size: 1200px 330px; background-color: #4198fa; } #content_all .contentCon .item02 .itembox { padding: 0; } #content_all .contentCon .item02 .itembox ul { position: relative; width: 880px; height: 1240px; padding: 75px 0 0 0; margin:0 auto; } #content_all .contentCon .item02 .itembox ul li{ width:260px; height: 475px; padding: 5px 40px; margin-right: 50px; background: url(../images/pc/outdoorcinemas_item02bg.png)no-repeat center left; background-size: 520px 475px; position: relative; overflow: visible; float: left; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(2),#content_all .contentCon .item02 .itembox ul li:nth-of-type(5){ margin-top:35px; margin-bottom: 40px;} #content_all .contentCon .item02 .itembox ul li:nth-of-type(3),#content_all .contentCon .item02 .itembox ul li:nth-of-type(6){ margin: 0; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(4),#content_all .contentCon .item02 .itembox ul li:nth-of-type(5),#content_all .contentCon .item02 .itembox ul li:nth-of-type(6) { background: url(../images/pc/outdoorcinemas_item02bg.png)no-repeat center right; } #content_all .contentCon .item02 .itembox ul li h3 { font-size: 24px; line-height: 40px; text-align: center; } #content_all .contentCon .item02 .itembox ul li hr { margin: 0; } #content_all .contentCon .item02 .itembox ul li img{ display: block; width: 264px; height: 370px; font-size: 0; border-radius: 10px; position: absolute; left: 0; top:90px; transform:scale(1,1); -webkit-transform:scale(1,1); -moz-transform:scale(1,1); -o-transform:scale(1,1); transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .contentCon .item02 .itembox ul li:hover img{ transform:scale(1.04,1.04); -webkit-transform:scale(1.04,1.04); -moz-transform:scale(1.04,1.04); -o-transform:scale(1.04,1.04); } #content_all .contentCon .item03{ position: relative; margin: 0 auto; padding: 0 0 40px 0; background-color: #121212; } #content_all .contentCon .item03 h2 { width: 100%; height: 110px; line-height: 110px; font-size: 0; font-weight: normal; text-align: center; background: url(../images/pc/outdoorcinemas_itemk2.png)no-repeat center -220px; background-size: 1200px 330px; background-color: #4198fa; } #content_all .contentCon .item03 h3 { width: 100%; height: 100px; line-height: 100px; font-size: 30px; font-weight: normal; text-align: center; } #content_all .contentCon .item03 h3:nth-of-type(1) { margin-top: 30px; } .postteam{ width: 1200px; height: 307px; margin: 0 auto 100px; } .postteam .slick-list{ width: 1200px; } .postteam li { width: 187px; margin-right: 16px; background: #000000; float: left; position: relative; } .postteam li a { display: block; width: 100%; height: 100%; } .postteam li a:nth-of-type(1){ display: block; } .postteam li a:nth-of-type(2){ display: none; } .postteam li a h6{ height: 22px; font-weight: 300; color: #FFFFFF; } .postteam li a h6 span { display: block; line-height: 22px; font-size: 16px; padding: 0 6px; } .postteam li a h6.tag-top{ position: absolute; left: 0; top:0; } .postteam li a h6.tag-top span{ background: #5d4a88; } .postteam li a h6.tag-top span.tag-note{ background: #b70b0b; } .postteam li a h6.tag-btm{ position: absolute; right: 0; bottom: 60px; } .postteam li a h6.tag-btm span.tag-film{ background: #1b62b4; position: absolute; right: 0; bottom: -30px; width: 44px; } .postteam li a h6.tag-btm span.tag-usetic { background: #313F9A; margin-top: 4px; } .postteam li a h6.tag-btm span.tag-free{ background: #C04983; position: absolute; right: 0; bottom: -30px; width: 44px; } .postteam li a .img-block{ width: 100%; height: 277px; } .postteam li a .img-block img{ display: block; width: 100%; height: 100%; } .postteam li a .info{ width: 100%; } .postteam li a .info h5{ width: 100%; height: 30px; line-height: 30px; font-size: 16px; font-weight: normal; text-align: left; padding: 0 5px; color: #FFFFFF; background: #1d1d1d; } .postteam .slick-track { left: -11px; } .postteam .slick-prev { width: 50px; height: 50px; background: url(../images/arw.png)no-repeat; background-position: left top; background-size: 100px 50px; left: -45px; opacity: 0.8; } .postteam .slick-next { width: 50px; height: 50px; background: url(../images/arw.png)no-repeat; background-position: right top; background-size: 100px 50px; right: -45px; opacity: 0.8; } .postteam .slick-prev:hover,.postteam .slick-prev:focus{ width: 50px; height: 50px; background: url(../images/arw.png)no-repeat; opacity: 1; background-position: left top; left: -45px; } .postteam .slick-next:hover,.postteam .slick-next:focus{ width: 50px; height: 50px; background: url(../images/arw.png)no-repeat; opacity: 1; background-position: right top; right: -45px; } .posthover { opacity: 1 !important; } @keyframes yiscroll { 0% { /*opacity: 0;*/ -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { /*opacity: 1;*/ -moz-transform: rotate(50deg); -ms-transform: rotate(50deg); -webkit-transform: rotate(50deg); transform: rotate(50deg); } } @keyframes yiscroll2 { 0% { /*opacity: 0;*/ -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { /*opacity: 1;*/ -moz-transform: rotate(-50deg); -ms-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); transform: rotate(-50deg); } } @keyframes yishadow { 0% { background-color: transparent; box-shadow: 0 0 0 rgba(0,0,0,0); opacity: 0; } 100% { background-color: #FFFFFF; box-shadow: 0px 0px 18px 10px rgba(255,255,255,0.5); opacity: 0.6; } } /***手機版***/ /***手機版***/ /***手機版***/ @media screen and (max-width: 1100px) { #header_m a.logo_img2 { display: block; width: 94px; height: 30px; font-size: 0; background: url(../images/logo_friday2.png) no-repeat center top; background-size: 93%; float: left; margin: 0 10px 0 0; } /*額外設定大小網*/ .only_pc{ display: none; } .only_m{ display: block; } /*額外設定大小網*/ /*小叮嚀*/ #pspoint{ position: absolute; top: -50px; } .note{ width: 100%; padding:40px 0 50px; margin: 0 auto; float: left; position: relative; z-index: 2; } #btn_note{ display: block; width: 640px; height: 70px; line-height: 70px; font-size: 36px; font-weight: 400; margin: 0px auto; padding: 0 20px; } #btn_note2{ display: block; width: 640px; height: 70px; line-height: 70px; font-size: 36px; font-weight: 400; margin: 40px auto 20px; padding: 0 20px; } #btn_note3{ display: block; width: 640px; height: 70px; line-height: 70px; font-size: 36px; font-weight: 400; margin: 40px auto 10px; padding: 0 20px; } #btn_note span { display: block; width: 100%; height:100%; margin-right: 18px; margin-left: 0px; float: left; } .note_box{ display: block; width: 640px; margin: 0px auto; padding:0; font-size:25px;font-weight:normal; font-family: 'Noto Sans TC', '微軟正黑體', 'Microsoft JhengHei', Arial, '蘋果儷中黑', 'Apple LiGothic Medium', '儷黑 Pro', 'LiHei Pro', sans-serif; list-style-position: outside;} .note_box ul { margin: 10px 0px; } .note_box ul li{ font-size: 22px;line-height: 40px; font-weight:normal; list-style-position: outside; list-style-type: Square; text-align:justify; margin: 0 25px 10px 50px; } .note_box ul li ol li{ margin-left:20px; list-style-type: upper-roman; font-size: 22px; margin-right: 0; } .note_box ul li ol li ul { margin: 0 auto; } .note_box ul li ol li ul li{ margin-left:20px; list-style-type:square; font-size: 22px; margin-bottom: 0; } .btn_click { width: 70px; height: 40px; color: #FFFFFF; background: #e54033; font-size: 22px; text-align: center; line-height: 40px; cursor: pointer; position: absolute; right: 27px; bottom:0; } .btn_click2 { display: none; width: 70px; height: 40px; color: #FFFFFF; background: #e54033; font-size: 22px; text-align: center; line-height: 40px; cursor: pointer; position: absolute; right: 27px; bottom:0; } /*小叮嚀*/ /*額外加合作廠商logo*/ .logoboxout { width: 100%; height: 370px; background: #f1f1f1; } .logoboxout .lgooin { width:640px; margin: 0 auto; } .logoboxout .lgooin a { display: block;height: 138px; margin: 0 auto; float: none; } .logoboxout .lgooin a:nth-of-type(1) { width: 308px; height: 130px; margin: 0 0 0 20px; background: url(../images/ftr_logo01.png)no-repeat center top; background-size: 100%; } .logoboxout .lgooin a:nth-of-type(2) { width: 409px; height: 115px; margin: 0 0 0 20px; background: url(../images/ftr_logo02.png)no-repeat center -15px; background-size: 100%; cursor: pointer; } .logoboxout .lgooin a:nth-of-type(3) { width: 258px; height: 110px; margin: 0 0 0 20px; background: url(../images/ftr_logo03_m.png)no-repeat center -15px; background-size: 100%; } .logoboxout2 .lgooin2 { width:640px; margin: 0 auto; padding: 0 20px; } .logoboxout2 .lgooin2 a { display: block;height: 87px; float: left; margin-right: 45px; } .logoboxout2 .lgooin2 a:nth-of-type(1) { width: 184px; background: url(../images/ftr_logo04_1.png)no-repeat center top; background-size: 100%; } .logoboxout2 .lgooin2 a:nth-of-type(2) { width: 141px; background: url(../images/ftr_logo04_2.png)no-repeat center top; background-size: 100%; } .logoboxout2 .lgooin2 a:nth-of-type(3) { width: 151px; background: url(../images/ftr_logo04_3.png)no-repeat center top; background-size: 100%; } .logoboxout2 .lgooin2 a:nth-of-type(4) { width: 150px; background: url(../images/ftr_logo04_4.png)no-repeat center top; background-size: 100%; margin-left: 26px; } /*額外加合作廠商logo*/ #container { } #content_all{ font-size:30px; font-weight: bold; text-align: center; position: relative; width: 100%; max-width: 1100px; min-width: 640px; height: 100%; } #container .kv_bg2{ width: 100%; height: 535px; position: absolute; top:53px; left:0; font-size: 0; background: url(../images/mo/goodmovie_kvbg_m.png) no-repeat center top; z-index: 5;} /* HeaderCon PC */ #content_all .headerCon { width: 100%; height: 550px; position: relative; margin:0 auto; background: url(../images/mo/outdoorcinemas_kvbg_m.jpg) no-repeat center top; background-size: 1100px 550px; overflow: hidden; } #content_all .headerCon .kvbox { width: 640px; height: 100%; margin: 0 auto 0; padding: 0; position: relative; overflow: hidden; } #content_all .headerCon .kvbox .icon { width: 160px; height: 124px; font-size: 0; background: url(../images/pc/outdoorcinemas_kvicon.png)no-repeat center top; background-size: 100%; position: fixed; right: 0%; top:0%; z-index: 99; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .headerCon .kvbox .icon a { display: block; width:100%; height: 100%; } #content_all .headerCon .kvbox .h1{ width: 100%; height: 400px; font-size: 0; background: url(../images/pc/outdoorcinemas_kvh1.png)no-repeat center top; background-size: 355px 273px; position: relative; margin-top: 100px; z-index: 1; } #content_all .headerCon .kvbox p { width: 100%; line-height: 30px; font-size: 24px; text-align: center; color: #FFFFFF; position: absolute; left: 0; top:140px; z-index: 1; } #content_all .headerCon .kvbox .lightpoint { width: 15px; height: 15px; background-color: rgba(255,255,255,1); border-radius: 20px; position: absolute; left: 119px; top: 86px; animation: yishadow 1.5s linear 0s infinite alternate; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .headerCon .kvbox .lightpoint:nth-last-of-type(2) { left: 472px; top: 76px; } #content_all .headerCon .kvbox .lightpoint:nth-last-of-type(3) { left: 421px; top: 394px; } /* HeaderCon PC End */ /* contentCon PC */ #content_all .contentCon { position: relative; margin: 0 auto; } #content_all .contentCon a{ color:#FFFFFF; text-decoration: none; } #content_all .contentCon .itembox{ width: 640px; height: 100%; margin: 0 auto; padding: 20px 0; position: relative; } .point1 { position: absolute; left: 0; bottom: 530px; } #content_all .contentCon .item01{ position: relative; margin: 0 auto; padding:0; } #content_all .contentCon .item01 h2 { width: 100%; height: 110px; line-height: 110px; font-size: 0; font-weight: normal; text-align: center; background: url(../images/pc/outdoorcinemas_itemk2.png)no-repeat center top; background-size: 1200px 330px; background-color: #4198fa; } #content_all .contentCon .item01 .itembox { padding: 580px 40px 65px; background: url(../images/mo/outdoorcinemas_item01icon.jpg)no-repeat center top; background-size: 1100px 583px; } #content_all .contentCon .item01 .itembox .point{ font-size: 0; } #content_all .contentCon .item01 .itembox h3 { width: 100%; height: 105.5px; line-height: 105.5px; font-size: 0; font-weight: normal; text-align: center; margin: 20px auto; background: url(../images/pc/outdoorcinemas_item01h3.png)no-repeat center top; background-size: 340px 422px; } #content_all .contentCon .item01 .itembox h3:nth-of-type(2) { background-position: center -105.5px; } #content_all .contentCon .item01 .itembox h3:nth-of-type(3) { background-position: center -211px; } #content_all .contentCon .item01 .itembox h3:nth-of-type(4) { background-position: center -316.5px; } #content_all .contentCon .item01 .itembox p { width:100%; line-height: 48px; font-size: 25px; font-weight: normal; text-align: center; color: #FFFFFF; margin-bottom: 30px; } #content_all .contentCon .item01 .itembox p:nth-of-type(2) { font-size: 30px; } #content_all .contentCon .item01 .itembox p:nth-of-type(3) { text-align:justify; margin-bottom: 0; } #content_all .contentCon .item01 .itembox ul li { width:100%; line-height: 48px; font-size: 25px; font-weight: normal; text-align: justify; color: #FFFFFF; margin-bottom: 30px; } #content_all .contentCon .item02{ position: relative; margin: 0 auto; padding:0; background: url(../images/pc/outdoorcinemas_item02bg.jpg)repeat center 150px; background-size: 1920px 1165px; } #content_all .contentCon .item02 h2 { width: 100%; height: 110px; line-height: 110px; font-size: 0; font-weight: normal; text-align: center; background: url(../images/mo/outdoorcinemas_itemk2.png)no-repeat center 0px; background-size: 865px 110px; background-color: #4198fa; } #content_all .contentCon .item02 .itembox { padding: 0; } #content_all .contentCon .item02 .itembox ul { position: relative; width: 880px; height: 1700px; padding: 75px 0 0 30px; margin:0 auto; } #content_all .contentCon .item02 .itembox ul li{ width:260px; height: 475px; padding: 5px 40px; margin-right: 40px; background: url(../images/pc/outdoorcinemas_item02bg.png)no-repeat center left; background-size: 520px 475px; position: relative; overflow: visible; float: left; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(2),#content_all .contentCon .item02 .itembox ul li:nth-of-type(5){ margin-top:35px; margin-bottom: 0px;} #content_all .contentCon .item02 .itembox ul li:nth-of-type(3),#content_all .contentCon .item02 .itembox ul li:nth-of-type(6){ margin: 0; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(4),#content_all .contentCon .item02 .itembox ul li:nth-of-type(5),#content_all .contentCon .item02 .itembox ul li:nth-of-type(6) { background: url(../images/pc/outdoorcinemas_item02bg.png)no-repeat center right; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(3) { margin-right: 40px; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(4) { margin-top: 35px; margin-bottom: 0px; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(5) { margin-top:0; } #content_all .contentCon .item02 .itembox ul li:nth-of-type(6) { margin-top: 35px; margin-bottom: 0px; } #content_all .contentCon .item02 .itembox ul li h3 { font-size: 24px; line-height: 40px; text-align: center; } #content_all .contentCon .item02 .itembox ul li hr { margin: 0; } #content_all .contentCon .item02 .itembox ul li img{ display: block; width: 264px; height: 370px; font-size: 0; border-radius: 10px; position: absolute; left: 0; top:90px; transform:scale(1,1); -webkit-transform:scale(1,1); -moz-transform:scale(1,1); -o-transform:scale(1,1); transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; } #content_all .contentCon .item02 .itembox ul li:hover img{ transform:scale(1.04,1.04); -webkit-transform:scale(1.04,1.04); -moz-transform:scale(1.04,1.04); -o-transform:scale(1.04,1.04); } margin-top: 35px; margin-bottom: 40px; #content_all .contentCon .item03{ position: relative; margin: 0 auto; padding: 0 0 40px 0; background-color: #121212; } #content_all .contentCon .item03 h2 { width: 100%; height: 110px; line-height: 110px; font-size: 0; font-weight: normal; text-align: center; background: url(../images/pc/outdoorcinemas_itemk2.png)no-repeat center -220px; background-size: 1200px 330px; background-color: #4198fa; } #content_all .contentCon .item03 h3 { width: 100%; height: 100px; line-height: 100px; font-size: 30px; font-weight: normal; text-align: center; } #content_all .contentCon .item03 h3:nth-of-type(1) { margin-top: 30px; } #content_all .contentCon .itembox .postteama_m{ overflow: hidden;} #content_all .contentCon .itembox .postteama_m .post { width: 200px; position: relative; } .slick-track { display: block; position: absolute; left: -190px; } .postteam_m{ width: 640px; height: 313px; margin: 0 auto 74px; overflow: hidden; } .postteam_m .slick-list{ width: 640px; } .postteam_m li { width: 187px; margin-right: 10px; float: left; position: relative; } .postteam_m li a { display: block; width: 100%; height: 100%; opacity: 1; } .postteam_m li a:hover { opacity: 1; } .postteam_m li a:nth-of-type(1){ display: block; } .postteam_m li a:nth-of-type(2){ display: none; } .postteam_m li a h6{ height: 26px; font-weight: 300; color: #FFFFFF; } .postteam_m li a h6 span { display: block; line-height: 26px; font-size: 20px; padding: 0 6px; } .postteam_m li a h6.tag-top{ position: absolute; left: 0; top:0; } .postteam_m li a h6.tag-top span{ background: #5d4a88; } .postteam_m li a h6.tag-btm{ position: absolute; right: 0; bottom: 70px; } .postteam_m li a h6.tag-btm span.tag-film{ background: #1b62b4; position: absolute; bottom: -34px; right: 0; width: 52px; } .postteam_m li a h6.tag-btm span.tag-usetic { background: #313F9A; margin-top: 4px; } .postteam_m li a h6.tag-btm span.tag-free{ background: #C04983; position: absolute; bottom: -34px; right: 0; width: 52px; } .postteam_m li a .img-block{ width: 100%; height: 277px; } .postteam_m li a .img-block img{ display: block; width: 100%; height: 100%; } .postteam_m li a .info{ width: 100%; } .postteam_m li a .info h5{ width: 100%; height: 36px; line-height: 36px; font-size: 22px; font-weight: normal; text-align: left; padding: 0 5px; color: #FFFFFF; background: #1d1d1d; } .postteam_m .slick-track { left: -187px; } .postteam_m .slick-prev, .postteam_m .slick-next { width: 0px; height: 0px; background: url(../images/arw.png)no-repeat; background-size: 100px 50px; } .postteam_m .slick-prev{ background-position: left top; left: -45px; } .postteam_m .slick-next{ background-position: right top; right: -45px; } .postteam_m .slick-list { overflow: visible; } }/*手機版end*/