/* index.css 複製僅修正 連結後 再搬入 wordpress */

@charset "utf-8";
/* CSS Document */
.allbg{ background-image:url(../images/index/bg_line.png); background-color:#f5f5f5; position:relative; overflow:hidden; }

.bg{ background-image:url(assets/images/index/bg.jpg); background-position:center top; background-repeat:no-repeat; padding-bottom:36.4583%; width:100%; position:relative; z-index:10; top:0; left:0; }

.bannerbox{ position:absolute; z-index:20; top:150px; left:0; right:0; margin:auto; }
.bannerbox .banner{ width:100%; }
.bannerbox .banner .imgs{ width:88%; margin:auto; overflow:hidden; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; box-shadow: 0 0 15px rgba(0,0,0,0.2); font-size:0; }
.bannerbox .banner .imgs img{ width:100%; }
.bannerbox .mar{ max-width:1400px; margin:auto; padding:0 20px; display:flex; margin-top:20px; align-items: center; }
.bannerbox .mar .btnarrow{ opacity:1; width:34px;/* transition:opacity .6s;*/ }
.bannerbox .mar .btnarrow img{ width:100%; }
.bannerbox .mar .pointbox{ flex:1; text-align:center;   }
.bannerbox .mar .pointbox .ptxt{ color:#ccc; font-size:0.75rem; letter-spacing:2px; padding:5px 0 0 0; cursor:default; }
.bannerbox .mar .pointbox .pbox{ font-size:0; }
.bannerbox .mar .pointbox .point{ display:inline-block; vertical-align:middle; line-height:5px; width:10px; background:#ccc; height:5px; margin:0 5px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; cursor:pointer; transition:all .3s; }
.bannerbox .mar .pointbox .point.hold{ background:#ff7f00; width:50px; } 

.bannerbox .banner{ margin-bottom: -20px; }
.bannerbox .banner .slick-slide>div{ text-align:center; }
.bannerbox .banner .slick-slide>div .imgs{ width: 88% !important; margin: auto auto 15px; }

.block01{ /*background:#f5f5f5;*/ position:relative; z-index:5; padding:0 0 150px;/* padding:200px 0;*/ overflow:hidden; }
.block01 .mar{ max-width:1400px; margin:auto; padding:0 20px; position:relative; z-index:20; }
.block01 .mar .list{ margin:0 0 150px 0; position:relative; }
.block01 .mar .list:last-child{ margin:0; }
.block01 .mar .list .more{ position:absolute; top:80px; right:0; margin:auto; line-height:26px; background:#ff7f00; color:#fff; font-size:1rem; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; padding:0 10px; }
.maintitle{ padding:0 120px; text-align:center; margin-bottom:45px; }
.maintitle .line{ width:8px; height:32px; margin:auto; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px;
background: rgb(14,143,155);
background: -moz-linear-gradient(top,  rgba(14,143,155,1) 0%, rgba(5,44,89,1) 100%);
background: -webkit-linear-gradient(top,  rgba(14,143,155,1) 0%,rgba(5,44,89,1) 100%);
background: linear-gradient(to bottom,  rgba(14,143,155,1) 0%,rgba(5,44,89,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e8f9b', endColorstr='#052c59',GradientType=0 ); }
.maintitle .h2{ display: inline-block; font-size:2.188rem; font-weight:900; margin-bottom:10px; text-align:center; font-family: 'Noto Serif TC', serif;  color: transparent; background: rgb(5,44,89);
background: -moz-linear-gradient(left,  rgba(5,44,89,1) 0%, rgba(14,143,155,1) 100%);
background: -webkit-linear-gradient(left,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
background: linear-gradient(to right,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#052c59', endColorstr='#0e8f9b',GradientType=1 ); background-clip: text; -webkit-background-clip: text; }
.maintitle .h2 h1{ display: inline-block; font-size:2.188rem; font-weight:900; margin-bottom:10px; text-align:center; font-family: 'Noto Serif TC', serif;  color: transparent; background: rgb(5,44,89);
background: -moz-linear-gradient(left,  rgba(5,44,89,1) 0%, rgba(14,143,155,1) 100%);
background: -webkit-linear-gradient(left,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
background: linear-gradient(to right,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#052c59', endColorstr='#0e8f9b',GradientType=1 ); background-clip: text; -webkit-background-clip: text; }
.maintitle .txt, .maintitle .txt p{ text-align:center; color:#777; font-size:1rem; }
.block01 .mar .flexs{ margin-left:-20px; display:flex; }
.block01 .mar .flexs .fgrids{ padding:0 0 0 20px; width:100%; }
.block01 .mar .flexs .fgrids .fs{ display:block; width:100%; padding-bottom:71.7391%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; position:relative; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.block01 .mar .flexs .fgrids .fs .mask{ position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; z-index:2;
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(0,0,0,0.5) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(0,0,0,0.5) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(0,0,0,0.5) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#80000000',GradientType=0 ); }
.block01 .mar .flexs .fgrids .fs .title{ color:#fff; font-size:2.188rem; font-weight:500; position:absolute; bottom:30px; left:30px; z-index:2; font-family: 'Noto Serif TC', serif; }
.block01 .mar .flexs .fgrids .fs .arrow{ width:30px; height:15px; background-image:url(assets/images/index/arrow_right.svg); background-repeat:no-repeat; background-position:center; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; position:absolute; right:30px; bottom:30px; z-index:2; }

.block01 .mar .yflex{ display:flex; margin-left:-13px; flex-wrap:wrap; }
.block01 .mar .yflex .ygrids{ width:14.2857%; padding-left:13px; padding-bottom:13px; }
.block01 .mar .yflex .ygrids .yt{ display:block; width:100%; background:#fff; padding:20px; position:relative; overflow:hidden; transition: 1s all; -webkit-transition: 1s all; -moz-transition: 1s all; }
.block01 .mar .yflex .ygrids .yt:before{ content:""; display:block; position:absolute; top:10px; left:10px; bottom:10px; right:10px; margin:auto; z-index:2; border:1px solid #0581b5; }
.block01 .mar .yflex .ygrids .yt:after{ content:""; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; opacity:0; position:absolute; top:0; left:-35%; bottom:0; margin:auto; width:100%; height:100%; z-index:1; transform:skewX(-20deg); 
background: -moz-linear-gradient(45deg,  rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,0.3) 100%);
background: -webkit-linear-gradient(45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,0.3) 100%); 
background: linear-gradient(45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,0.3) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#4dffffff',GradientType=1 ); }
.block01 .mar .yflex .ygrids.i01 .yt:before{ border-color:#0581b5; }
.block01 .mar .yflex .ygrids.i02 .yt:before{ border-color:#ea9a5a; }
.block01 .mar .yflex .ygrids.i03 .yt:before{ border-color:#e8da66; }
.block01 .mar .yflex .ygrids.i04 .yt:before{ border-color:#83c9ee; }
.block01 .mar .yflex .ygrids.i05 .yt:before{ border-color:#6bc755; }
.block01 .mar .yflex .ygrids.i06 .yt:before{ border-color:#e64d4d; }
.block01 .mar .yflex .ygrids.i07 .yt:before{ border-color:#e4c086; }
.block01 .mar .yflex .ygrids.i08 .yt:before{ border-color:#db5454; }
.block01 .mar .yflex .ygrids.i09 .yt:before{ border-color:#c27241; }
.block01 .mar .yflex .ygrids.i10 .yt:before{ border-color:#7e888e; }
.block01 .mar .yflex .ygrids.i11 .yt:before{ border-color:#4c8fbd; }
.block01 .mar .yflex .ygrids.i12 .yt:before{ border-color:#c579e2; }
.block01 .mar .yflex .ygrids.i13 .yt:before{ border-color:#d6c45f; }
.block01 .mar .yflex .ygrids.i14 .yt:before{ border-color:#218ebb; }
.block01 .mar .yflex .ygrids .yt .imgs{ width:50px; height:50px; margin:40px auto; background-position:center; background-repeat:no-repeat; background-size:50px; position:relative; z-index:5; }
.block01 .mar .yflex .ygrids.i01 .yt .imgs{ background-image:url(assets/images/index/s_icon_01.png); }
.block01 .mar .yflex .ygrids.i02 .yt .imgs{ background-image:url(assets/images/index/s_icon_02.png); }
.block01 .mar .yflex .ygrids.i03 .yt .imgs{ background-image:url(assets/images/index/s_icon_03.png); }
.block01 .mar .yflex .ygrids.i04 .yt .imgs{ background-image:url(assets/images/index/s_icon_04.png); }
.block01 .mar .yflex .ygrids.i05 .yt .imgs{ background-image:url(assets/images/index/s_icon_05.png); }
.block01 .mar .yflex .ygrids.i06 .yt .imgs{ background-image:url(assets/images/index/s_icon_06.png); }
.block01 .mar .yflex .ygrids.i07 .yt .imgs{ background-image:url(assets/images/index/s_icon_07.png); }
.block01 .mar .yflex .ygrids.i08 .yt .imgs{ background-image:url(assets/images/index/s_icon_08.png); }
.block01 .mar .yflex .ygrids.i09 .yt .imgs{ background-image:url(assets/images/index/s_icon_09.png); }
.block01 .mar .yflex .ygrids.i10 .yt .imgs{ background-image:url(assets/images/index/s_icon_10.png); }
.block01 .mar .yflex .ygrids.i11 .yt .imgs{ background-image:url(assets/images/index/s_icon_11.png); }
.block01 .mar .yflex .ygrids.i12 .yt .imgs{ background-image:url(assets/images/index/s_icon_12.png); }
.block01 .mar .yflex .ygrids.i13 .yt .imgs{ background-image:url(assets/images/index/s_icon_13.png); }
.block01 .mar .yflex .ygrids.i14 .yt .imgs{ background-image:url(assets/images/index/s_icon_14.png); }
.block01 .mar .yflex .ygrids .yt .texts{ font-size:1rem; color:#333; text-align:center; position:relative; z-index:5; }

.light_block01{ background:rgba(0,0,0,0.8); position:fixed; z-index:200; top:0; left:0; bottom:0; right:0; margin:auto; display:flex; align-items: center; justify-content: center; }
.light_block01 .wbg{ max-width:895px; width:90%; max-height:80%; background:#fff; position:relative; }
.light_block01 .wbg .closebox{ position:absolute; bottom:-40px; text-align:center; left:0; right:0; margin:auto; }
.light_block01 .wbg .closebox .closebtn{ display:inline-block; color:#fff; font-size:1rem; }
.light_block01 .wbg .jbox .titlebox{ display:flex; padding:25px 40px; justify-content: space-between; align-items: center; }
.light_block01 .wbg .jbox .titlebox .j1{ display:flex; align-items: center; }
.light_block01 .wbg .jbox .titlebox .j1 .jicon{ width:50px; height:50px; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.light_block01 .wbg .jbox .titlebox .j1 .jtxt{ font-size:1.563rem; color:#333; font-weight:700; padding:0 0 0 10px; font-family: 'Noto Serif TC', serif; }
.light_block01 .wbg .jbox .titlebox .j2{ line-height:25px; height:25px; display:inline-block; color:#fff; background:#ff7f00; padding:0 10px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; font-size:1rem; }
.light_block01 .wbg .jbox .listbox{ background:#f5f5f5; padding:25px 40px; }
.light_block01 .wbg .jbox .listbox .lists{ display:flex; justify-content: space-between; padding:15px 0; border-bottom:1px solid #ccc; }
.light_block01 .wbg .jbox .listbox .lists:last-child{ border:none; }
.light_block01 .wbg .jbox .listbox .lists .x1{ font-size:1.125rem; color:#333; font-weight:700; padding-right:30px; }
.light_block01 .wbg .jbox .listbox .lists .x2{ display:flex; align-items: center; }
.light_block01 .wbg .jbox .listbox .lists .x2 .xlink{ display:block; padding:0 8px; font-size:1rem; color:#333; position:relative; white-space:nowrap; }
.light_block01 .wbg .jbox .listbox .lists .x2 .xlink:after{ content:""; display:block; width:2px; height:14px; background:#333; position:absolute; top:0; bottom:0; right:0; margin:auto; }
.light_block01 .wbg .jbox .listbox .lists .x2 .xlink:last-child{ padding-right:0; }
.light_block01 .wbg .jbox .listbox .lists .x2 .xlink:last-child:after{ display:none; }

.bg3dblock{ }
.grat{ background: rgb(134,198,204);
background: -moz-linear-gradient(top,  rgba(134,198,204,1) 0%, rgba(130,150,172,1) 100%);
background: -webkit-linear-gradient(top,  rgba(134,198,204,1) 0%,rgba(130,150,172,1) 100%);
background: linear-gradient(to bottom,  rgba(134,198,204,1) 0%,rgba(130,150,172,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#86c6cc', endColorstr='#8296ac',GradientType=0 ); }
.bg_radius01{ width:900px; height:900px; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:10%; right:-10%; }
.bg_radius02{ width:50px; height:50px; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:39%; right:2%; }
.bg_radius03{ width:83px; height:83px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:56%; right:-2%; }
.bg_radius04{ width:180px; height:180px; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:42%; right:30%; }
.bg_radius05{ width:540px; height:540px; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:33%; left:25%; }
.bg_radius06{ width:34px; height:34px; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:70%; left:30%; }
.bg_radius07{ width:230px; height:230px; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:55%; left:-5%; }
.bg_radius08{ width:326px; height:326px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:43%; left:-6%; }
.bg_radius09{ width:83px; height:83px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:54%; left:16%; }
.bg_radius10{ width:56px; height:56px; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:81%; left:14%; }
.bg_radius11{ width:30px; height:30px; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:10%; left:4%; }
.bg_radius12{ width:12px; height:12px; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:11%; left:8%; }

.bg_radius13{ width:1.77%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:25%; left:20%; }
.bg_radius14{ width:1.04%; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:26%; left:10%; }
.bg_radius15{ width:1.77%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:28%; right:5%; }
.bg_radius16{ width:3.75%; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:13%; left:23%; }
.bg_radius17{ width:1.04%; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:52%; right:17%; }
.bg_radius18{ width:11.45%; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:66%; right:-5%; }
.bg_radius19{ width:31.25%; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:85%; left:-10%; }
.bg_radius20{ width:6.25%; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:87%; right:10%; }
.bg_radius21{ width:2.08%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:92%; right:-1%; }
.bg_radius22{ width:10.41%; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:98%; right:-5%; }
.bg_radius23{ width:10.41%; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:92%; right:34%; }
.bg_radius24{ width:2.08%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:80%; right:34%; }
.bg_radius25{ width:1.56%; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:52%; left:8%; }
.bg_radius26{ width:11.45%; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:69%; left:2%; }
.bg_radius27{ width:8.6%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:18%; left:2%; }
.bg_radius28{ width:2.1%; background:#ffc68e; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:24%; right:18%; }
.bg_radius29{ width:7.4%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:97%; left:18%; }

.bg_radius01:after,.bg_radius02:after,.bg_radius03:after,.bg_radius04:after,.bg_radius05:after,.bg_radius06:after,.bg_radius07:after,.bg_radius08:after,.bg_radius09:after,.bg_radius10:after,.bg_radius11:after,.bg_radius12:after,.bg_radius13:after,.bg_radius14:after,.bg_radius15:after,.bg_radius16:after,.bg_radius17:after,.bg_radius18:after,.bg_radius19:after,.bg_radius20:after,.bg_radius21:after,.bg_radius22:after,.bg_radius23:after,.bg_radius24:after,.bg_radius25:after,.bg_radius26:after,.bg_radius27:after,.bg_radius28:after,.bg_radius29:after{ content:""; display:block; width:100%; padding-bottom:100%; }

.bg_icon01{ position:absolute; width:29.16%; right:8%; top:32%; background-image:url(assets/images/index/bg_icon01.svg); background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.bg_icon01:after{ content:""; display:block; width:100%; padding-bottom:129.89%; }
.bg_icon02{ position:absolute; width:36.35%; left:3%; top:62%; background-image:url(assets/images/index/bg_icon02.svg); background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.bg_icon02:after{ content:""; display:block; width:100%; padding-bottom:52.43%; }
.bg_icon03{ position:absolute; width:29.16%; right:-2%; top:74%; background-image:url(../images/index/bg_icon01.svg); background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.bg_icon03:after{ content:""; display:block; width:100%; padding-bottom:129.89%; }

.block02{ display:flex; padding:200px 0 150px; position:relative; z-index:5; }
.block02 .left02box{ width:40%; padding:50px; display:flex; }
.block02 .left02box .lbox{ background:#fff; width: 100%; box-shadow: 0 0 20px rgba(0,0,0,0.5); display:flex; flex-direction: column; position:relative; }
.block02 .left02box .lbox:before{ content:""; display:block; width:8px; height:32px; position:absolute; left:50px; top:-10px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px;
background: rgb(14,143,155);
background: -moz-linear-gradient(top,  rgba(14,143,155,1) 0%, rgba(5,44,89,1) 100%);
background: -webkit-linear-gradient(top,  rgba(14,143,155,1) 0%,rgba(5,44,89,1) 100%);
background: linear-gradient(to bottom,  rgba(14,143,155,1) 0%,rgba(5,44,89,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e8f9b', endColorstr='#052c59',GradientType=0 ); }
.block02 .left02box .lbpad{ padding:45px; flex:1; }
.block02 .left02box .lbox .titles{ width:100%; margin:0 0 20px 0; }
.block02 .left02box .lbox .titles .t1{ display:block; font-size:2.188rem; color:#333; font-weight:bold; font-family: 'Noto Serif TC', serif; }
.block02 .left02box .lbox .titles .t2{ display: inline-block; font-size:2.188rem; font-weight:bold; font-family: 'Noto Serif TC', serif;  color: transparent; background: rgb(5,44,89);
background: -moz-linear-gradient(left,  rgba(5,44,89,1) 0%, rgba(14,143,155,1) 100%);
background: -webkit-linear-gradient(left,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
background: linear-gradient(to right,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#052c59', endColorstr='#0e8f9b',GradientType=1 ); background-clip: text; -webkit-background-clip: text; }
.block02 .left02box .lbox .txts{ color:#777; font-size:0.875rem; line-height:2; margin-bottom:35px; font-weight:300; }
.block02 .left02box .lbox .linkbox{ display:flex; align-items: center; }
.block02 .left02box .lbox .linkbox .k1{ color:#777; font-size:0.875rem; }
.block02 .left02box .lbox .linkbox .k2{ display:inline-block; text-decoration:none; background:#ff7f00; color:#fff; font-size:0.875rem; padding:0 10px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; margin-left:5px; line-height:26px; }
.block02 .left02box .botmbox{ background:#ffe0e0; display:flex; align-items: center; padding:30px 45px; }
.block02 .left02box .botmbox .logos{ font-size:0; }
.block02 .left02box .botmbox .logos img{ max-width:100%; }
.block02 .left02box .botmbox .xicon{ width:20px; height:20px; position:relative; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); margin:0 15px;  }
.block02 .left02box .botmbox .xicon:before{ content:""; display:block; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; width:1px; height:20px; background:#777; }
.block02 .left02box .botmbox .xicon:after{ content:""; display:block; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; width:20px; height:1px; background:#777; }
.block02 .right02box{ width:60%; }
.block02 .right02box .ifs{ width:100%; height:100%; position: relative; }
.block02 .right02box iframe{ width:100%;  position: absolute; top:0; left:0; width:100%; height:100%; }

.block03{ position:relative; z-index:5; padding:100px 0; overflow:hidden; }
.block03 .mar{ max-width:1400px; margin:auto; padding:0 20px; position:relative; z-index:20; }
.block03 .mar .list{ position:relative; }
.block03 .mar .list .more{ z-index: 1; position:absolute; top:80px; right:0; margin:auto; line-height:26px; background:#ff7f00; color:#fff; font-size:1rem; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; padding:0 10px; }
.block03 .mar .flexs{ display:flex; margin-left:-55px; }
.block03 .mar .flexs .fgrids{ padding-left:55px; width:33.333334%; display:flex; }
.block03 .mar .flexs .fgrids .fs{ background:#fff; width:100%; display:block; padding:0 0 60px 0; position:relative; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.block03 .mar .flexs .fgrids .fs .fimg{ width:100%; padding-bottom:106.5116%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; position:relative; }
.block03 .mar .flexs .fgrids .fs .fimg:before{ content:""; display:block; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto;
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.5) 100%);
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.5) 100%);
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.5) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=0 );
}
.block03 .mar .flexs .fgrids .fs .textbox{ padding:25px; }
.block03 .mar .flexs .fgrids .fs .textbox .h1{ font-size:1.563rem; font-weight:500; color:#333; margin-bottom:20px; }
.block03 .mar .flexs .fgrids .fs .textbox .txt{ font-size:0.875rem; color:#777; font-weight:300; line-height:1.8; }
.block03 .mar .flexs .fgrids .fs .mores{ position:absolute; display:flex; bottom:40px; left:25px; align-items: baseline; }
.block03 .mar .flexs .fgrids .fs .mores .m1{ font-size:1rem; font-weight:500; color:#ff7f00; margin-right:5px; letter-spacing:1px; }
.block03 .mar .flexs .fgrids .fs .mores .m2{ width:30px; }
.block03 .mar .flexs .fgrids .fs .mores .m2 img{ max-width:100%; }

.block03 .mar .flexs.slick-slider{ display: block; margin-top: -30px; }
.block03 .mar .flexs.slick-slider .slick-track{ display: flex !important; }
.block03 .mar .flexs.slick-slider .slick-track .slick-slide{ height: inherit !important; }
.block03 .mar .flexs.slick-slider .slick-track .slick-slide>div{ height: 100%; }
.block03 .mar .flexs.slick-slider .slick-track .slick-slide .fgrids{ height: 100%; padding-top: 30px; }
.block03 .mar .flexs.slick-slider .slick-track .slick-slide .fgrids .fs{ display: block; height: 100%; }

/*.block03 .bg3dblock{ position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; z-index:3; }
.block03 .grat{ background: rgb(134,198,204);
background: -moz-linear-gradient(top,  rgba(134,198,204,1) 0%, rgba(130,150,172,1) 100%);
background: -webkit-linear-gradient(top,  rgba(134,198,204,1) 0%,rgba(130,150,172,1) 100%);
background: linear-gradient(to bottom,  rgba(134,198,204,1) 0%,rgba(130,150,172,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#86c6cc', endColorstr='#8296ac',GradientType=0 ); }
.block03 .bg_radius01{ width:800px; height:800px; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:-5%; right:-10%; }
.block03 .bg_radius02{ width:530px; height:530px; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:-15%; left:23%; }
.block03 .bg_radius03{ width:150px; height:150px; background:rgba(0,0,0,0.05); border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:-5%; left:-3%; }
.block03 .bg_radius04{ width:320px; height:320px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:-8%; left:2%; }
.block03 .bg_radius05{ width:78px; height:78px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:3%; left:16%; }
.block03 .bg_radius06{ width:52px; height:52px; background:#ffbf7f; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:9%; left:6%; }
.block03 .bg_radius07{ width:34px; height:34px; background:#ffbf7f; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:5%; left:38%; }
.block03 .bg_radius08{ width:82px; height:82px; background:#ffbf7f; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:8%; right:27%; }
.block03 .bg_radius09{ width:220px; height:220px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:10%; right:-3%; }
.block03 .bg_radius10{ width:46px; height:46px; background:#ffbf7f; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:24%; right:6%; }
.block03 .bg_radius11{ width:54px; height:54px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; bottom:34%; right:4%; }
.block03 .bg_radius12{ width:78px; height:78px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:27%; left:-1%; }
.block03 .bg_radius13{ width:28px; height:28px; background:#ffbf7f; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:45%; left:2%; }
.block03 .bg_radius14{ width:14px; height:14px; background:#ffbf7f; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:47%; left:5%; }
.block03 .bg_radius15{ width:84px; height:84px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; position:absolute; top:27%; left:-1%; }
.block03 .bg_icon01{ position:absolute; width:306px; height:235px; left:29%; bottom:0%; background-image:url(assets/images/index/bg_icon03.svg); background-position:center top; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.block03 .bg_icon02{ position:absolute; width:92px; height:184px; right:2%; bottom:3%; background-image:url(assets/images/index/bg_icon04.svg); background-position:center top; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.block03 .bg_icon03{ position:absolute; width:195px; height:608px; right:0; top:5%; background-image:url(assets/images/index/bg_icon05.svg); background-position:center top; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.block03 .bg_icon04{ position:absolute; width:1236px; height:380px; left:0; top:0; background-image:url(assets/images/index/bg_icon06.svg); background-position:center top; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.block03 .bg_icon06{ position:absolute; width:240px; height:390px; top:-0.5%; left:-1.5%; background-image:url(assets/images/index/bg_icon07.svg); background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }*/

.block04{ padding:0; position:relative; z-index:5; overflow: hidden; }
.block04 .mar{ max-width:1400px; margin:auto; padding:0 20px; position:relative; z-index:20; }
.block04 .mar .list{ position:relative; }
.block04 .mar .list .more{ z-index: 1; position:absolute; top:80px; right:0; margin:auto; line-height:26px; background:#ff7f00; color:#fff; font-size:1rem; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; padding:0 10px; }
/*.block04 .maintitle .line{ background:#fff; }
.block04 .maintitle .h2{ color:#fff; background:none; }
.block04 .maintitle .txt, .block04 .maintitle .txt p{ color:#fff; }*/
.block04 .flexs{ display:flex; min-height: 440px; }
.block04 .flexs .flex_75{ width:75%; display:flex; }
.block04 .flexs .flex_25{ width:25%; display:flex; }
.block04 .flexs .flexbox{ display:flex; width:100%; }
.block04 .flexs .grids{ padding:0 0 0 25px; display:flex; width:33.33334%;/* max-height:503px;*/ }
.block04 .flexs .grids .gs{ background:#fff; height: auto; width:100%; box-shadow: 0 0 10px rgba(0,0,0,0.5); display:flex; flex-direction: column; }
.block04 .flexs .grids .gs .imgs{ width:100%; padding-bottom:78.7878%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.block04 .flexs .grids .gs .textbox{ padding:20px; flex: 1; overflow: hidden; }
.block04 .flexs .grids .gs .textbox .h1{ color:#333; font-size:1rem; margin-bottom:10px; line-height:1.8; }
.block04 .flexs .grids .gs .textbox .sart{ display:flex; flex-wrap:wrap; margin-bottom:5px; }
.block04 .flexs .grids .gs .textbox .sart .ss{ display:block; border:1px solid #052c58; font-size:0.75rem; color:#052c58; padding:0 5px; line-height:22px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; margin:0 5px 5px 0; }
.block04 .flexs .grids .gs .textbox .date{ font-size:0.75rem; color:#777; font-weight:300; margin-bottom:10px; }
.block04 .flexs .grids .gs .textbox .txts{ font-size:0.75rem; color:#333; line-height:1.8; }
.block04 .flexs .grids .gs .mtitle{ background:#052c59; color:#fff; font-size:1.563rem; padding:15px 20px; }
.block04 .flexs .grids .gs .mht{ height:100%; }
.block04 .flexs .grids .gs .mtxt{ padding:15px 30px; flex:1; overflow:auto;  }
.block04 .flexs .grids .gs .mslist{ margin-bottom:15px; display:block; }
.block04 .flexs .grids .gs .mslist .m_1{ color:#777; font-size:0.875rem; margin-bottom:5px; }
.block04 .flexs .grids .gs .mslist .m_2{ color:#333; font-size:0.875rem; line-height:1.6; }
.block04 .flexs .flex_25 .grids{ width:100%; }
.block04 .pointmar{ max-width:1400px; margin:auto; padding:0 20px; display:flex; margin-top:20px; align-items: center; }
.block04 .pointmar .btnarrow{ width:34px; }
.block04 .pointmar .btnarrow img{ width:100%; }
.block04 .pointmar .pointbox{ flex:1; text-align:center;   }
.block04 .pointmar .pointbox .ptxt{ color:#ccc; font-size:0.75rem; letter-spacing:2px; padding:5px 0 0 0; }
.block04 .pointmar .pointbox .pbox{ font-size:0; }
.block04 .pointmar .pointbox .point{ display:inline-block; vertical-align:middle; line-height:5px; width:10px; background:#ccc; height:5px; margin:0 5px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; cursor:pointer; }
.block04 .pointmar .pointbox .point.hold{ background:#ff7f00; width:50px; } 

.pointFlex{ display: flex; flex-direction: column; flex: 1; flex-wrap: wrap; }
.pointFlex .pointbox{ width: 100%; }

.block04 .flexs .slick-track{ display: flex !important; }
.block04 .flexs .slick-track .slick-slide{ height: inherit !important; }
.block04 .flexs .slick-track .slick-slide>div{ height: 100%; }
.block04 .flexs .slick-track .slick-slide .grids{ height: 100%; padding: 0 10px 0 15px; }
.block04 .flexs .slick-track .slick-slide .grids .gs{ display: block; height: calc(100% - 10px) !important; }
.block04 .pointmar .pointbox li{ display: inline-block; vertical-align:middle; line-height:5px; width:10px; background:#ccc; height:5px; margin:0 5px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; cursor:pointer; }
.block04 .pointmar .pointbox li.slick-active{ background:#ff7f00; width:50px; }
.block04 .pointmar .pointbox li button{ font-size: 0; border: unset; }

.loading_contract{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden; border-radius: 50%; width: 52px; height: 52px; border-color: rgba( 0, 0, 0, 0.07 ); background-color: #ddd; }
.loading_contract .spinner{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 1; width: 32px; height: 32px; background-image: url(assets/images/index/download.gif); }

.block04 .radius01{ position:absolute; bottom:-10%; left:-5%; width:780px; height:780px; border:8px solid #fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%;
box-shadow: 0 0 1em .25em rgba(144, 102, 208,0.75), 0 0 4em 1em rgba(144, 102, 208,0.75), inset 0 0 2em 1em rgba(144, 102, 208,0.75); animation:radiu01 10s infinite ease-in-out; transform-origin:left top; }
.block04 .radius02{ position:absolute; top:20%; right:15%; width:300px; height:300px; border:8px solid #fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%;
box-shadow: 0 0 1em .25em rgba(144, 102, 208,0.75), 0 0 4em 1em rgba(144, 102, 208,0.75), inset 0 0 2em 1em rgba(144, 102, 208,0.75); animation:radiu02 5s infinite ease-in-out; transform-origin:center bottom; }
.block04 .radius03{ position:absolute; top:-5%; right:-19%; width:440px; height:440px; border:8px solid #fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%;
box-shadow: 0 0 1em .25em rgba(54, 202, 187,0.75), 0 0 4em 1em rgba(54, 202, 187,0.75), inset 0 0 2em 1em rgba(54, 202, 187,0.75); animation:radiu03 10s infinite ease-in-out; transform-origin:right center; }
.block04 .radius04{ position:absolute; top:44%; right:41%; width:170px; height:170px; border:8px solid #fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%;
box-shadow: 0 0 1em .25em rgba(54, 202, 187,0.75), 0 0 4em 1em rgba(54, 202, 187,0.75), inset 0 0 2em 1em rgba(54, 202, 187,0.75); animation:radiu04 5s infinite ease-in-out; transform-origin:center; }

@keyframes radiu01{
	0%{ transform:scale(1); opacity: 1; box-shadow: 0 0 1em .25em rgba(144, 102, 208,0.75), 0 0 4em 1em rgba(144, 102, 208,0.75), inset 0 0 2em 1em rgba(144, 102, 208,0.75); }
	50%{ transform:scale(0.98); opacity:0.9; box-shadow: 0 0 0.8em .15em rgba(144, 102, 208,0.75), 0 0 3em 0.8em rgba(144, 102, 208,0.75), inset 0 0 1.5em 0.8em rgba(144, 102, 208,0.75); }
	100%{ transform:scale(1); opacity: 1; box-shadow: 0 0 1em .25em rgba(144, 102, 208,0.75), 0 0 4em 1em rgba(144, 102, 208,0.75), inset 0 0 2em 1em rgba(144, 102, 208,0.75);}
}

@keyframes radiu02{
	0%{ transform:scale(1); opacity:0.9; box-shadow: 0 0 0.8em .15em rgba(144, 102, 208,0.75), 0 0 3em 0.8em rgba(144, 102, 208,0.75), inset 0 0 1.5em 0.8em rgba(144, 102, 208,0.75); }
	50%{ transform:scale(1.02); opacity:1; box-shadow: 0 0 1em .25em rgba(144, 102, 208,0.75), 0 0 4em 1em rgba(144, 102, 208,0.75), inset 0 0 2em 1em rgba(144, 102, 208,0.75); }
	100%{ transform:scale(1); opacity:0.9; box-shadow: 0 0 0.8em .15em rgba(144, 102, 208,0.75), 0 0 3em 0.8em rgba(144, 102, 208,0.75), inset 0 0 1.5em 0.8em rgba(144, 102, 208,0.75); }
}

@keyframes radiu03{
	0%{ transform:scale(1); opacity:1; box-shadow: 0 0 1em .25em rgba(54, 202, 187,0.75), 0 0 4em 1em rgba(54, 202, 187,0.75), inset 0 0 2em 1em rgba(54, 202, 187,0.75); }
	50%{ transform:scale(0.98); opacity:0.9; box-shadow: 0 0 0.8em .2em rgba(54, 202, 187,0.75), 0 0 3.5em 0.8em rgba(54, 202, 187,0.75), inset 0 0 1.8em 0.8em rgba(54, 202, 187,0.75); }
	100%{ transform:scale(1); opacity:1; box-shadow: 0 0 1em .25em rgba(54, 202, 187,0.75), 0 0 4em 1em rgba(54, 202, 187,0.75), inset 0 0 2em 1em rgba(54, 202, 187,0.75); }
}

@keyframes radiu04{
	0%{ transform:scale(1); opacity:0.9; }
	50%{ transform:scale(1.02); opacity:1; box-shadow: 0 0 1em .25em rgba(54, 202, 187,0.75), 0 0 4em 1em rgba(54, 202, 187,0.75), inset 0 0 2em 1em rgba(54, 202, 187,0.75); }
	100%{ transform:scale(1); opacity:0.9; }
}


.block05{ position: relative; z-index:5; padding: 100px 0; }
.block05 .mar{ max-width:1400px; margin:auto; padding:0 20px; position:relative; z-index:20; }
.block05 .flexs01{ display:flex; margin-bottom:100px; align-items: center; }
.block05 .flexs01 .imgs{ width:50%; font-size:0; }
.block05 .flexs01 .imgs img{ width:100%; }
.block05 .flexs01 .textbox{ width:50%; padding:40px 0 40px 50px; position:relative; }
.block05 .flexs01 .textbox:after{ content:""; display:block; width:8px; height:32px; position:absolute; right:0px; top:0px; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px;
background: rgb(14,143,155);
background: -moz-linear-gradient(top,  rgba(14,143,155,1) 0%, rgba(5,44,89,1) 100%);
background: -webkit-linear-gradient(top,  rgba(14,143,155,1) 0%,rgba(5,44,89,1) 100%);
background: linear-gradient(to bottom,  rgba(14,143,155,1) 0%,rgba(5,44,89,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e8f9b', endColorstr='#052c59',GradientType=0 ); }
.block05 .flexs01 .textbox .titles{ display: inline-block; font-size:2.188rem; font-weight:900; margin-bottom:10px; text-align:center; font-family: 'Noto Serif TC', serif;  color: transparent; background: rgb(5,44,89);
background: -moz-linear-gradient(left,  rgba(5,44,89,1) 0%, rgba(14,143,155,1) 100%);
background: -webkit-linear-gradient(left,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
background: linear-gradient(to right,  rgba(5,44,89,1) 0%,rgba(14,143,155,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#052c59', endColorstr='#0e8f9b',GradientType=1 ); background-clip: text; -webkit-background-clip: text; }
.block05 .flexs01 .textbox .txts{ color:#777; font-size:1rem; line-height:2; margin-bottom:30px; } 
.block05 .flexs01 .textbox .links{ display:inline-block; line-height: 26px; background: #ff7f00; color: #fff; font-size: 1rem; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; padding: 0 10px; }

.block05 .flexs02{ display:flex; margin-left:-10px; }
.block05 .flexs02 .grids{ padding-left:10px; width:20%; }
.block05 .flexs02 .grids .gs{ width:100%; }
.block05 .flexs02 .grids .gs .imgs{ width:100%; padding-bottom:96%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.block05 .flexs02 .grids .gs .texts{ padding:15px 0 0 0; text-align:center; font-size:1.25rem; color:#333; font-weight:300; }

.flexs02_wp{}
.flexs02_wp .aligncenter{ margin-bottom: unset; }
.flexs02_wp .aligncenter>a{ width: 100%; padding-bottom: 96%; background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-background-size: cover; }
.flexs02_wp .aligncenter img{ display: none; }
.flexs02_wp li{ padding-left: 10px; }
.entry-content .flexs02_wp li>a{ display: block; padding: 15px 0 0 0; text-align: center; font-size: 1.25rem !important; color: #333; font-weight: 300; }

.flexs02_wp.slick-slider{ margin-left: -10px; }
.flexs02_wp.slick-slider,
.flexs02_wp.slick-slider .slick-list{ width: 100%; }

.block05 .flexs02.slick-slider{ display: block; width: 100%; }

/*================================●●●●●●●●●●●●Hover●●●●●●●●●●●●================================*/
@media screen and (min-width:1024px){
.block01 .mar .yflex .ygrids:hover .yt{ transform:translateY(-10px); }
.block01 .mar .yflex .ygrids:hover .yt .texts{ color:#fff; }
.block01 .mar .yflex .ygrids.i01:hover .yt{ background:#0581b5; }
.block01 .mar .yflex .ygrids.i02:hover .yt{ background:#ea9a5a; }
.block01 .mar .yflex .ygrids.i03:hover .yt{ background:#e8da66; }
.block01 .mar .yflex .ygrids.i04:hover .yt{ background:#83c9ee; }
.block01 .mar .yflex .ygrids.i05:hover .yt{ background:#6bc755; }
.block01 .mar .yflex .ygrids.i06:hover .yt{ background:#e64d4d; }
.block01 .mar .yflex .ygrids.i07:hover .yt{ background:#e4c086; }
.block01 .mar .yflex .ygrids.i08:hover .yt{ background:#db5454; }
.block01 .mar .yflex .ygrids.i09:hover .yt{ background:#c27241; }
.block01 .mar .yflex .ygrids.i10:hover .yt{ background:#7e888e; }
.block01 .mar .yflex .ygrids.i11:hover .yt{ background:#4c8fbd; }
.block01 .mar .yflex .ygrids.i12:hover .yt{ background:#c579e2; }
.block01 .mar .yflex .ygrids.i13:hover .yt{ background:#d6c45f; }
.block01 .mar .yflex .ygrids.i14:hover .yt{ background:#218ebb; }
.block01 .mar .yflex .ygrids:hover .yt:before{ border-color:#fff; }
.block01 .mar .yflex .ygrids:hover .yt:after{ opacity:1; }
.block01 .mar .yflex .ygrids.i01:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_01s.png); }
.block01 .mar .yflex .ygrids.i02:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_02s.png); }
.block01 .mar .yflex .ygrids.i03:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_03s.png); }
.block01 .mar .yflex .ygrids.i04:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_04s.png); }
.block01 .mar .yflex .ygrids.i05:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_05s.png); }
.block01 .mar .yflex .ygrids.i06:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_06s.png); }
.block01 .mar .yflex .ygrids.i07:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_07s.png); }
.block01 .mar .yflex .ygrids.i08:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_08s.png); }
.block01 .mar .yflex .ygrids.i09:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_09s.png); }
.block01 .mar .yflex .ygrids.i10:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_10s.png); }
.block01 .mar .yflex .ygrids.i11:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_11s.png); }
.block01 .mar .yflex .ygrids.i12:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_12s.png); }
.block01 .mar .yflex .ygrids.i13:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_13s.png); }
.block01 .mar .yflex .ygrids.i14:hover .yt .imgs{ background-image:url(assets/images/index/s_icon_14s.png); }

.block01 .mar .flexs .fgrids .fs:hover{  box-shadow: 0 0 20px rgba(0,0,0,0.3); transform:translateY(-10px); -webkit-transform:translateY(-10px); -moz-transform:translateY(-10px); }


.block03 .mar .flexs .fgrids .fs:hover{ transform:translateY(-10px); -webkit-transform:translateY(-10px); -moz-transform:translateY(-10px); box-shadow: 0 0 20px rgba(0,0,0,0.2); }


}


/*================================●●●●●●●●●●●●電腦●●●●●●●●●●●●================================*/
@media screen and (max-width:1200px){
.block01{/* padding:200px 0 100px 0;*/ }
.block01 .mar .yflex .ygrids{ width:20%; }
.block01 .mar .list{ margin-bottom:60px; }

.block01 .bg_radius01{ width:600px; height:600px; }
.block01 .bg_radius03{ width:40px; height:40px; }
.block01 .bg_radius04{ width:100px; height:100px; }
.block01 .bg_radius05{ width:230px; height:230px; }
.block01 .bg_radius06{ left:auto; right:16%; top:54%; }
.block01 .bg_radius07{ width:100px; height:100px; top: 58%; }
.block01 .bg_radius08{ width:200px; height:200px; }
.block01 .bg_radius10{ left:3%; top:53%; }
.block01 .bg_icon01{ width:210px; height:273px; }
.block01 .bg_icon02{ width:381px; height:200px; top: 40%; }

.block02{ display:block; padding:200px 0 100px 0; }
.block02 .left02box{ width:100%; }
.block02 .right02box{ width:100%; }
.block02 .right02box .ifs{ height:auto; padding-bottom:56%; } 

.block03 .bg_radius01{ width:500px; height:500px; }
.block03 .bg_radius02{ width:260px; height:260px; }
.block03 .bg_radius03{ width:100px; height:100px; }
.block03 .bg_radius04{ width:240px; height:240px; }
.block03 .bg_radius05{ width:50px; height:50px; left:22%; }
.block03 .bg_radius06{ width:30px; height:30px; left:3%; }
.block03 .bg_icon04{ width:600px; height:184px; }
.block03 .bg_icon03{ width:120px; height:374px; }
.block03 .bg_icon06{ width:140px; height:228px; top: -4%; left: -2%; }

.block04 .radius01{ width:600px; height:600px;}
.block04 .radius02{ width:260px; height:260px; }
.block04 .radius03{ width:360px; height:360px; }
.block04 .radius04{ width:140px; height:140px; }

.block05 .flexs01{ align-items: flex-start; }
.block05 .flexs01 .textbox{ padding:0 0 0 40px; }
.block05 .flexs01 .textbox:after{ display:none; }
}


/*================================●●●●●●●●●●●●平板●●●●●●●●●●●●================================*/
@media screen and (min-width:768px) and (max-width:1023px){
	
.block01 .mar .yflex .ygrids{ width:25%; }

.block03{ padding:80px 0; }
.block03 .mar .flexs{ margin-left:-25px; }
.block03 .mar .flexs .fgrids{ padding-left:25px; }

.block04{ padding:80px 0; }
.block04 .flexs .flex_75{ width:66%; }
.block04 .flexs .flex_25{ width:34%; }

.block04 .radius01{ width:500px; height:500px; }
.block04 .radius02{ width:140px; height:140px; }
.block04 .radius03{ width:220px; height:220px; }
.block04 .radius04{ width:70px; height:70px; right:15%; top:auto; bottom:15%; }


.block05{ padding:80px 0; }
}


/*================================●●●●●●●●●●●●手機●●●●●●●●●●●●================================*/
@media screen and (max-width:767px){
.bannerbox{ top:80px; }
.bannerbox .banner .slick-slide>div .imgs{ width: 94% !important; }
.bannerbox .mar .pointbox .point.hold{ width:30px; }

.block01{/* padding:170px 0 50px 0;*/ }
.maintitle{ padding:0; margin-bottom:30px; }
.maintitle .h2{ font-size:1.5rem; }
.maintitle .h2 h1{ font-size:1.5rem; }
.maintitle .txt, .maintitle .txt p{ font-size:0.875rem; }
.maintitle .line{ width:4px; height:16px; }
.block01 .mar .list{ margin-bottom:40px; padding-bottom:30px; }
.block01 .mar .list .more{ top:auto; bottom:25px; left:0; right:0; margin:auto; max-width:100px; font-size:0.875rem; text-align:center; }
.block01 .mar .flexs{ flex-wrap:wrap; }
.block01 .mar .flexs .fgrids{ width:100%; margin-bottom:20px; }		
.block01 .mar .flexs .fgrids:last-child{ margin:0; }
.block01 .mar .flexs .fgrids .fs .title{ font-size:1.5rem; left:20px; bottom:20px; }
.block01 .mar .flexs .fgrids .fs .arrow{ width:20px; height:10px; background-size:20px; right:20px; }
	
.block01 .mar .yflex .ygrids{ width:50%; }
.block01 .mar .yflex .ygrids .yt{ padding:10px; }
.block01 .mar .yflex .ygrids .yt:before{ top:5px; bottom:5px; left:5px; right:5px; }
.block01 .mar .yflex .ygrids .yt .imgs{ margin:25px auto; }
.block01 .mar .yflex .ygrids .yt .texts{ font-size:0.938rem; padding:0 0 5px 0; }

.light_block01 .wbg .jbox .titlebox{ padding:20px 25px; display: block; }
.light_block01 .wbg .jbox .titlebox .j1 .jicon{ width:36px; height:36px; }
.light_block01 .wbg .jbox .titlebox .j2{ font-size: 0.875rem; margin: 10px 0 0 0; }
.light_block01 .wbg .jbox .listbox{ padding: 25px 20px; max-height: 60vh; overflow:auto; }
.light_block01 .wbg .jbox .listbox .lists{ display:block; }
.light_block01 .wbg .jbox .listbox .lists .x1{ padding:0 0 10px 0; }

.block01 .bg_radius01{ width:300px; height:300px; top: 8%; }
.block01 .bg_radius02{ top:25%; right: -1%; }
.block01 .bg_radius03{ width:36px; height:36px; }
.block01 .bg_radius04{ width:80px; height:80px; right: 10%; }
.block01 .bg_radius05{ width:180px; height:180px; top: 30%; left: 9%; }
.block01 .bg_radius06{ left:auto; right:16%; top:54%; }
.block01 .bg_radius07{ width:80px; height:80px; top: 58%; }
.block01 .bg_radius08{ width:140px; height:140px; left: -8%; top: 40%; }
.block01 .bg_radius10{ left:3%; top:53%; }
.block01 .bg_icon01{ width:160px; height:208px; top: 20%; }
.block01 .bg_icon02{ width:191px; height:100px; top: 34%; left: -6%; }

.bg_radius01{ width:76%; top:5%; }
.bg_radius04{ top:36%; right:40%; }
.bg_radius05{ width:50%; top:30%; left:9%; }
.bg_radius06{ left:auto; right:-2%; top:72%; width:7%; }
.bg_radius07{ width:30%; }
.bg_radius09{ top:50%; }
.bg_radius10{ top:78%; left:3%; }
.bg_radius11{ top:4.5%; width:5.5%; }
.bg_radius12{ top:5%; left:13%; width:2.2%; }
.bg_radius13{ width:5%; }
.bg_radius14{ width:3%; left:50%; }
.bg_radius16{ width:26.75%; top:14.5%; }
.bg_radius17{ width:6%; top:49%; }
.bg_radius18{ width:38%; }
.bg_radius19{ width:40%; }
.bg_radius21{ width:4%; top:90%; }
.bg_radius22{ width:26% }
.bg_radius23{ width:31%; right:54%; top:90%; }
.bg_radius24{ width:3%; }
.bg_radius25{ width:6%; left:-1%; }
.bg_radius26{ width:24%; }
.bg_radius28{ width:5.4%; top:63%; right:83%; }
.bg_radius29{ width:10%; top:99%; left:-3%; }
.bg_icon01{ top:34%; width:40.16%; right:-4% }
.bg_icon02{ top:61%; width: 65.35%; }
.bg_icon03{ top:78%; width:40.16%; }

.block02{ padding-top:0px; }
.block02 .left02box{ padding:170px 20px 20px 20px;/* padding:20px;*/ }
.block02 .left02box .lbpad{ padding:30px 20px; }
.block02 .left02box .lbox:before{ left:30px; width:4px; height:16px; top: -5px; }
.block02 .left02box .lbox .titles .t1{ font-size:1.25rem; }
.block02 .left02box .lbox .titles .t2{ font-size:1.25rem; }
.block02 .left02box .botmbox{ padding:20px; }

.block03{ padding:60px 0; }
.block03 .mar{ padding-bottom: 80px; }
.block03 .mar .list{ margin-bottom:40px; position:static; }
.block03 .mar .list .more{ top:auto; bottom:25px; left:0; right:0; margin:auto; max-width:100px; font-size:0.875rem; text-align:center; }
.block03 .mar .flexs{ display:block; margin:0; }
.block03 .mar .flexs .fgrids{ width:100%; padding:0; margin-bottom:25px; }
.block03 .mar .flexs .fgrids:last-child{ margin:0; }
.block03 .mar .flexs .fgrids .fs .textbox .h1{ font-size:1.25rem; }
.block03 .mar .flexs .fgrids .fs .mores .m1{ font-size:0.875rem; }
.block03 .mar .flexs .fgrids .fs .mores .m2{ width:20px; }

.block03 .bg_radius01{ width:240px; height:240px; right:auto; left: -30%; bottom: 4%; }
.block03 .bg_icon01{ width:130px; height:100px; }
.block03 .bg_icon02{ width:73px; height:145px; }
.block03 .bg_icon04{ width:391px; height:120px; }
.block03 .bg_icon06{ width:70px; height:114px; top: 0; }

.block04 .mar .list{ padding-bottom:80px; }
.block04 .mar .list .more{ width:110px; left:0; right:0; top:auto; margin:auto; bottom:50px; text-align:center; }

.block04 .flexs{ flex-wrap:wrap; }
.block04 .flexs .flex_75{ width:100%; order:2; }
.block04 .flexs .flex_25{ width:100%; order:1; padding:0 0 30px 0; }
.block04 .flexs .flex_25 .grids{ padding:0 10px; }
.block04 .flexs .grids{ padding: 0 10px; }
.block04 .flexs .grids .gs .mtitle{ font-size:1.25rem; padding:15px; }
.block04 .flexs .grids .gs .mtxt{ padding:15px; }
.block04 .flexs .grids .gs .mht{ height:auto; max-height:200px; }

.block04 .radius01{ width:300px; height:300px; left: -19%; }
.block04 .radius02{ width:100px; height:100px; }
.block04 .radius03{ width:140px; height:140px; }
.block04 .radius04{ width:40px; height:40px; right:15%; top:auto; bottom:15%; }

.block05{ padding:60px 0; }
.block05 .flexs01{ display:block; margin-bottom:60px; }
.block05 .flexs01 .imgs{ width:100%; }
.block05 .flexs01 .textbox{ padding:25px 0 0 0; width:100%; text-align:center; }
.block05 .flexs01 .textbox .titles{ font-size:1.5rem; }
.block05 .flexs01 .textbox .txts{ text-align:left; font-size:0.875rem; }
.block05 .flexs01 .textbox .links{ font-size:0.875rem; }

.block05 .flexs02 .grids .gs .texts{ font-size:1rem; }

.entry-content .flexs02_wp li>a{ font-size:1rem !important; }
}